| $base-margin: 1.5rem; |
| $base-padding: 1rem; |
| $base-font-size: 18px; |
| $base-line-height: 1.5; |
| $yellow: darken(yellow, 9%); |
| |
| h1.hn-docs-title { |
| font-size: 3rem; |
| margin-bottom: 1rem; |
| |
| & + .hn-docs-description { |
| font-size: 1.25rem; |
| text-align: right; |
| } |
| } |
| |
| article.hn-docs-content { |
| code { |
| color: $heron-blue-green; |
| background-color: lighten($light-gray, 25%); |
| font-size: inherit; |
| } |
| |
| h1 { |
| font-size: $base-font-size * 2; |
| margin-bottom: $base-margin * 1.3; |
| } |
| |
| h2 { |
| font-size: $base-font-size * 1.8; |
| margin-bottom: $base-margin * 1.2; |
| } |
| |
| h3 { |
| font-size: $base-font-size * 1.6; |
| margin-bottom: $base-margin * 1.1; |
| } |
| |
| h4 { |
| font-size: $base-font-size * 1.4; |
| margin-bottom: $base-margin; |
| } |
| |
| h5 { |
| font-size: $base-font-size * 1.2; |
| margin-bottom: $base-margin; |
| } |
| |
| img { |
| display: block; |
| max-width: 100%; |
| margin: $base-margin auto; |
| |
| &:hover { |
| width: 125%; |
| } |
| } |
| |
| p { |
| line-height: $base-line-height; |
| font-size: $base-font-size; |
| |
| & + p { |
| margin-top: $base-margin; |
| } |
| |
| & + { |
| h1, h2, h3, h4 { |
| margin-top: $base-margin * 1.5; |
| } |
| } |
| } |
| |
| blockquote { |
| margin: $base-margin 0; |
| padding: 20px; |
| border-left: .5rem solid $heron-blue-green; |
| background-color: lighten($light-gray, 22%); |
| |
| h2, h3, h4 { |
| margin: .25rem 0 1.25rem 0; |
| } |
| |
| h4 { |
| font-size: $base-font-size * 1.5; |
| |
| & + p { |
| margin-top: $base-margin; |
| } |
| } |
| |
| p { |
| font-size: $base-font-size * 1.1; |
| } |
| |
| ul { |
| margin-bottom: 0; |
| } |
| } |
| |
| table, td, th { |
| border-collapse: collapse; |
| } |
| |
| th, td { |
| padding: 10px 20px 10px 5px; |
| line-height: 1.4; |
| } |
| |
| table { |
| margin: $base-margin 0; |
| table-layout: initial; |
| |
| thead { |
| font-size: $base-font-size * 1.1; |
| border-bottom: 1px solid black; |
| } |
| |
| tbody { |
| tr { |
| border-bottom: 1px solid $light-gray; |
| |
| td { |
| code { |
| font-size: $base-font-size; |
| } |
| } |
| |
| &:hover { |
| background-color: lighten($light-gray, 27%); |
| } |
| } |
| } |
| } |
| |
| ol { |
| li { |
| font-size: $base-font-size * .9; |
| } |
| } |
| |
| ol, ul { |
| margin: $base-margin 0; |
| |
| li { |
| font-size: $base-font-size; |
| padding-bottom: 0; |
| |
| ul { |
| margin: .5rem auto; |
| } |
| |
| & + li { |
| margin-top: $base-margin * .15; |
| } |
| } |
| } |
| |
| ul { |
| li { |
| list-style-type: square; |
| } |
| } |
| |
| .highlight { |
| margin: $base-margin * .8 0; |
| max-width: 100%; |
| |
| pre { |
| color: $light-gray; |
| padding: $base-padding * 1.25; |
| |
| code { |
| font-size: $base-font-size; |
| color: $light-gray; |
| background-color: #263238; |
| white-space: pre; |
| |
| .hll { background-color: #49483e } |
| .c { color: #75715e; } /* Comment */ |
| .err { color: #960050; background-color: #1e0010 } /* Error */ |
| .k { color: #66d9ef } /* Keyword */ |
| .l { color: #ae81ff } /* Literal */ |
| .n { color: #f8f8f2 } /* Name */ |
| .o { color: #f92672 } /* Operator */ |
| .p { color: #f8f8f2 } /* Punctuation */ |
| .ch { color: #75715e } /* Comment.Hashbang */ |
| .cm { color: #75715e } /* Comment.Multiline */ |
| .cp { color: #75715e } /* Comment.Preproc */ |
| .cpf { color: #75715e } /* Comment.PreprocFile */ |
| .c1 { color: #75715e } /* Comment.Single */ |
| .cs { color: #75715e } /* Comment.Special */ |
| .gd { color: #f92672 } /* Generic.Deleted */ |
| .ge { font-style: italic } /* Generic.Emph */ |
| .gi { color: #a6e22e } /* Generic.Inserted */ |
| .gs { font-weight: bold } /* Generic.Strong */ |
| .gu { color: #75715e } /* Generic.Subheading */ |
| .kc { color: #66d9ef } /* Keyword.Constant */ |
| .kd { color: #66d9ef } /* Keyword.Declaration */ |
| .kn { color: #f92672 } /* Keyword.Namespace */ |
| .kp { color: #66d9ef } /* Keyword.Pseudo */ |
| .kr { color: #66d9ef } /* Keyword.Reserved */ |
| .kt { color: #66d9ef } /* Keyword.Type */ |
| .ld { color: $yellow; } /* Literal.Date */ |
| .m { color: #ae81ff } /* Literal.Number */ |
| .s { color: $yellow; } /* Literal.String */ |
| .na { color: #a6e22e } /* Name.Attribute */ |
| .nb { color: #f8f8f2 } /* Name.Builtin */ |
| .nc { color: #a6e22e } /* Name.Class */ |
| .no { color: #66d9ef } /* Name.Constant */ |
| .nd { color: #a6e22e } /* Name.Decorator */ |
| .ni { color: #f8f8f2 } /* Name.Entity */ |
| .ne { color: #a6e22e } /* Name.Exception */ |
| .nf { color: #a6e22e } /* Name.Function */ |
| .nl { color: #f8f8f2 } /* Name.Label */ |
| .nn { color: #f8f8f2 } /* Name.Namespace */ |
| .nx { color: #a6e22e } /* Name.Other */ |
| .py { color: #f8f8f2 } /* Name.Property */ |
| .nt { color: #f92672 } /* Name.Tag */ |
| .nv { color: #f8f8f2 } /* Name.Variable */ |
| .ow { color: #f92672 } /* Operator.Word */ |
| .w { color: #f8f8f2 } /* Text.Whitespace */ |
| .mb { color: #ae81ff } /* Literal.Number.Bin */ |
| .mf { color: #ae81ff } /* Literal.Number.Float */ |
| .mh { color: #ae81ff } /* Literal.Number.Hex */ |
| .mi { color: #ae81ff } /* Literal.Number.Integer */ |
| .mo { color: #ae81ff } /* Literal.Number.Oct */ |
| .sb { color: $yellow; } /* Literal.String.Backtick */ |
| .sc { color: $yellow; } /* Literal.String.Char */ |
| .sd { color: $yellow; } /* Literal.String.Doc */ |
| .s2 { color: $yellow; } /* Literal.String.Double */ |
| .se { color: #ae81ff } /* Literal.String.Escape */ |
| .sh { color: $yellow; } /* Literal.String.Heredoc */ |
| .si { color: $yellow; } /* Literal.String.Interpol */ |
| .sx { color: $yellow; } /* Literal.String.Other */ |
| .sr { color: $yellow; } /* Literal.String.Regex */ |
| .s1 { color: $yellow; } /* Literal.String.Single */ |
| .ss { color: $yellow; } /* Literal.String.Symbol */ |
| .bp { color: #f8f8f2 } /* Name.Builtin.Pseudo */ |
| .vc { color: #f8f8f2 } /* Name.Variable.Class */ |
| .vg { color: #f8f8f2 } /* Name.Variable.Global */ |
| .vi { color: #f8f8f2 } /* Name.Variable.Instance */ |
| .il { color: #ae81ff } /* Literal.Number.Integer.Long */ |
| .clp { color: #f92672 } /* Command-line dollar sign */ |
| |
| &.language-bash { |
| .nb, .k { color: $light-gray; } |
| .o { color: $heron-blue-green; } |
| } |
| } |
| } |
| |
| & + { |
| h1, h2, h3, h4 { |
| margin-top: $base-margin * 1.75; |
| } |
| } |
| } |
| } |
