diff options
Diffstat (limited to 'theme/stylesheets')
-rwxr-xr-x | theme/stylesheets/website/exercise.less | 3 | ||||
-rwxr-xr-x | theme/stylesheets/website/markdown.less | 561 | ||||
-rw-r--r-- | theme/stylesheets/website/variables.less | 3 |
3 files changed, 334 insertions, 233 deletions
diff --git a/theme/stylesheets/website/exercise.less b/theme/stylesheets/website/exercise.less index a6f8a45..7eddb37 100755 --- a/theme/stylesheets/website/exercise.less +++ b/theme/stylesheets/website/exercise.less @@ -3,6 +3,9 @@ padding: 0px; margin: 20px 15px; border: 3px solid #2f8cde; + background: #fff; + color: @content-color; + font-family: sans-serif; .header { padding: 5px 15px; diff --git a/theme/stylesheets/website/markdown.less b/theme/stylesheets/website/markdown.less index 52927a8..2900cfb 100755 --- a/theme/stylesheets/website/markdown.less +++ b/theme/stylesheets/website/markdown.less @@ -1,312 +1,409 @@ -.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal { - color:@page-color-1; +.book .book-body .page-wrapper .page-inner section.normal { + -ms-text-size-adjust: 100%; + -webkit-text-size-adjust: 100%; + line-height: 1.4; + color: @content-color; + overflow: hidden; + line-height: @content-line-height; + word-wrap: break-word; - pre, code { - background: #fdf6e3; - color: #657b83; - border-color: darken(#fdf6e3, 15%); + a { + background: transparent; + } - @import "./highlight/sepia.less"; + a:active, + a:hover { + outline: 0; } -} -.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal { - color:@page-color-2; - pre, code { - background: black; - color: #eaeaea; - border-color: #000; + strong { + font-weight: bold; + } - @import "./highlight/night.less"; + h1 { + font-size: 2em; + margin: 0.67em 0; } -} -.book .book-body .page-wrapper .page-inner section.normal { - padding-bottom: 25px; - padding-top: 15px; - color:@page-color; - letter-spacing: 0.01rem; - & > *:first-child { - margin-top: 0 !important; } - & > *:last-child { - margin-bottom: 0 !important; } + img { + border: 0; + } - a { - color: #4183C4; } - a.absent { - color: #cc0000; } - a.anchor { - display: block; - padding-left: 30px; - margin-left: -30px; - cursor: pointer; - position: absolute; - top: 0; - left: 0; - bottom: 0; } + hr { + -moz-box-sizing: content-box; + box-sizing: content-box; + height: 0; + } + + pre { + overflow: auto; + } - h1, h2, h3, h4, h5, h6 { - line-height: 1.7; - margin: 20px 0 10px; + code, + pre { + font-family: monospace, monospace; + font-size: 1em; + } + + table { + border-collapse: collapse; + border-spacing: 0; + } + + td, + th { padding: 0; - font-weight: bold; - -webkit-font-smoothing: antialiased; - cursor: text; - position: relative; } + } - h1 tt, h1 code { - font-size: inherit; } + * { + -moz-box-sizing: border-box; + box-sizing: border-box; + } - h2 tt, h2 code { - font-size: inherit; } + a { + color: #4183c4; + text-decoration: none; + } - h3 tt, h3 code { - font-size: inherit; } + a:hover, + a:focus, + a:active { + text-decoration: underline; + } - h4 tt, h4 code { - font-size: inherit; } + hr { + height: 0; + margin: 15px 0; + overflow: hidden; + background: transparent; + border: 0; + border-bottom: 1px solid #ddd; + } - h5 tt, h5 code { - font-size: inherit; } + hr:before, + hr:after { + display: table; + content: " "; + } - h6 tt, h6 code { - font-size: inherit; } + hr:after { + clear: both; + } + + h1, + h2, + h3, + h4, + h5, + h6 { + margin-top: 15px; + margin-bottom: 15px; + line-height: 1.1; + } h1 { - font-size: 2.5em; + font-size: 30px; } h2 { - font-size: 2em; - border-bottom: 1px solid #eee; + font-size: 21px; } h3 { - font-size: 1.5em; } + font-size: 16px; + } h4 { - font-size: 1.2em; } + font-size: 14px; + } h5 { - font-size: 1em; } + font-size: 12px; + } h6 { - font-size: 1em; } + font-size: 11px; + } - p, blockquote, ul, ol, dl, table, pre { - margin: 15px 0; } + blockquote { + margin: 0; + } - hr { + ul, + ol { + padding: 0; + margin-top: 0; + margin-bottom: 0; + } + ol ol { + list-style-type: lower-roman; } - body > h2:first-child { - margin-top: 0; - padding-top: 0; } - body > h1:first-child { - margin-top: 0; - padding-top: 0; } - body > h1:first-child + h2 { - margin-top: 0; - padding-top: 0; } - body > h3:first-child, body > h4:first-child, body > h5:first-child, body > h6:first-child { - margin-top: 0; - padding-top: 0; } + dd { + margin-left: 0; + } + + code, + pre { + font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace; + font-size: 12px; + } - a:first-child h1, a:first-child h2, a:first-child h3, a:first-child h4, a:first-child h5, a:first-child h6 { + pre { margin-top: 0; - padding-top: 0; } + margin-bottom: 0; + } + + .markdown-body>*:first-child { + margin-top: 0 !important; + } + + .markdown-body>*:last-child { + margin-bottom: 0 !important; + } + + .anchor { + position: absolute; + top: 0; + bottom: 0; + left: 0; + display: block; + padding-right: 6px; + padding-left: 30px; + margin-left: -30px; + } + + .anchor:focus { + outline: none; + } + + h1, + h2, + h3, + h4, + h5, + h6 { + position: relative; + margin-top: 1em; + font-weight: bold; + line-height: 1.4; + } + + h1 { + padding-bottom: 0.3em; + margin-bottom: 16px; + font-size: 2.25em; + line-height: 1.2; + border-bottom: 1px solid #eee; + } - h1 p, h2 p, h3 p, h4 p, h5 p, h6 p { - margin-top: 0; } + h2 { + padding-bottom: 0.3em; + margin-bottom: 16px; + font-size: 1.75em; + line-height: 1.225; + border-bottom: 1px solid #eee; + } - li p.first { - display: inline-block; } + h3 { + margin-bottom: 0; + font-size: 1.5em; + line-height: 1.43; + } - ul, ol { - padding-left: 30px; } + h4 { + margin-bottom: 0.1em; + font-size: 1.25em; + } - ul :first-child, ol :first-child { - margin-top: 0; } + h5 { + margin-bottom: 0.2em; + font-size: 1em; + } - ul :last-child, ol :last-child { - margin-bottom: 0; } + h6 { + margin-bottom: 0.2em; + font-size: 1em; + color: #777; + } - ul p { - margin: 0px; + p, + blockquote, + ul, + ol, + dl, + table, + pre { + margin-top: 0; + margin-bottom: 16px; } - ul ul { - margin: 0px; + + hr { + height: 4px; + padding: 0; + margin: 16px 0; + background-color: #e7e7e7; + border: 0 none; + } + + ul, + ol { + padding-left: 2em; + } + + ol ol, + ol ul { + margin-top: 0; + margin-bottom: 0; } dl { - padding: 0; } - dl dt { - font-size: 14px; - font-weight: bold; - font-style: italic; - padding: 0; - margin: 15px 0 5px; } - dl dt:first-child { - padding: 0; } - dl dt > :first-child { - margin-top: 0; } - dl dt > :last-child { - margin-bottom: 0; } - dl dd { - margin: 0 0 15px; - padding: 0 15px; } - dl dd > :first-child { - margin-top: 0; } - dl dd > :last-child { - margin-bottom: 0; } + padding: 0; + } + + dl dt { + padding: 0; + margin-top: 16px; + font-size: 1em; + font-style: italic; + font-weight: bold; + } + + dl dd { + padding: 0 16px; + margin-bottom: 16px; + } blockquote { - border-left: 4px solid #dddddd; padding: 0 15px; - color: #777777; + color: #777; + border-left: 4px solid #ddd; + } - p { - font-size: inherit; - } + blockquote>:first-child { + margin-top: 0; + } + + blockquote>:last-child { + margin-bottom: 0; } - blockquote > :first-child { - margin-top: 0; - } - blockquote > :last-child { - margin-bottom: 0; } table { + display: block; width: 100%; - padding: 0; + overflow: auto; } - table tr { - border-top: 1px solid #cccccc; - background-color: white; - margin: 0; - padding: 0; } - table tr:nth-child(2n) { - background-color: #f8f8f8; } - table tr th { - font-weight: bold; - border: 1px solid #cccccc; - text-align: left; - margin: 0; - padding: 6px 13px; } - table tr td { - border: 1px solid #cccccc; - text-align: left; - margin: 0; - padding: 6px 13px; } - table tr th :first-child, table tr td :first-child { - margin-top: 0; } - table tr th :last-child, table tr td :last-child { - margin-bottom: 0; } - - img { - max-width: 100%; - display: block; - margin: 0px auto; + table th { + font-weight: bold; } - span.frame { - display: block; - overflow: hidden; } - span.frame > span { - border: 1px solid #dddddd; - display: block; - float: left; - overflow: hidden; - margin: 13px 0 0; - padding: 7px; - width: auto; } - span.frame span img { - display: block; - float: left; } - span.frame span span { - clear: both; - color: #333333; - display: block; - padding: 5px 0 0; } - span.align-center { - display: block; - overflow: hidden; - clear: both; } - span.align-center > span { - display: block; - overflow: hidden; - margin: 13px auto 0; - text-align: center; } - span.align-center span img { - margin: 0 auto; - text-align: center; } - span.align-right { - display: block; - overflow: hidden; - clear: both; } - span.align-right > span { - display: block; - overflow: hidden; - margin: 13px 0 0; - text-align: right; } - span.align-right span img { - margin: 0; - text-align: right; } - span.float-left { - display: block; - margin-right: 13px; - overflow: hidden; - float: left; + table th, + table td { + padding: 6px 13px; + border: 1px solid #ddd; + } - & span { - margin: 13px 0 0; - } + table tr { + background-color: #fff; + border-top: 1px solid #ccc; } - span.float-right { - display: block; - margin-left: 13px; - overflow: hidden; - float: right; + table tr:nth-child(2n) { + background-color: #f8f8f8; + } - & > span { - display: block; - overflow: hidden; - margin: 13px auto 0; - text-align: right; - } + img { + max-width: 100%; + -moz-box-sizing: border-box; + box-sizing: border-box; } - code, tt { - margin: 0 2px; - padding: 0 5px; - white-space: nowrap; - border: 1px solid #eaeaea; - background-color: #f8f8f8; + code { + padding: 0; + padding-top: 0.2em; + padding-bottom: 0.2em; + margin: 0; + font-size: 85%; + background-color: #f7f7f7; border-radius: 3px; } - pre code { - margin: 0; + code:before, + code:after { + letter-spacing: -0.2em; + content: "\00a0"; + } + + pre>code { padding: 0; + margin: 0; + font-size: 100%; white-space: pre; - border: none; background: transparent; - - @import "./highlight/white.less"; + border: 0; } + .highlight pre, pre { - font-size: inherit; - line-height: 1.5em; + padding: 16px; overflow: auto; - padding: 20px; + font-size: 85%; + line-height: 1.45; + background-color: #f7f7f7; + border: none; border-radius: 3px; + + @import "./highlight/white.less"; } - pre code, pre tt { + pre { + word-wrap: normal; + } + + pre code { + display: inline; + max-width: initial; + padding: 0; + margin: 0; + overflow: initial; + line-height: inherit; + word-wrap: normal; background-color: transparent; - border: none; + border: 0; + } + + pre code:before, + pre code:after { + content: normal; + } + + .highlight { + background: #ffffff; + } +} + +.book.color-theme-1 .book-body .page-wrapper .page-inner section.normal { + color:@page-color-1; + + pre, code { + background: #fdf6e3; + color: #657b83; + border-color: darken(#fdf6e3, 15%); + + @import "./highlight/sepia.less"; } -}
\ No newline at end of file +} + +.book.color-theme-2 .book-body .page-wrapper .page-inner section.normal { + color:@page-color-2; + + pre, code { + background: black; + color: #eaeaea; + border-color: #000; + + @import "./highlight/night.less"; + } +} diff --git a/theme/stylesheets/website/variables.less b/theme/stylesheets/website/variables.less index 01eb9ed..e03caea 100644 --- a/theme/stylesheets/website/variables.less +++ b/theme/stylesheets/website/variables.less @@ -50,7 +50,8 @@ @page-background: @body-background; // Content -@content-line-height: 1.6em; +@content-line-height: 1.6; +@content-color: #333333; // Basics of a navbar @navbar-height: 50px; |