diff options
Diffstat (limited to 'common/custom/style/default.css')
-rw-r--r-- | common/custom/style/default.css | 136 |
1 files changed, 83 insertions, 53 deletions
diff --git a/common/custom/style/default.css b/common/custom/style/default.css index de813ac..12268ef 100644 --- a/common/custom/style/default.css +++ b/common/custom/style/default.css @@ -1,128 +1,158 @@ -html{ +@viewport { + width: device-width; + initial-scale: 1.0; +} + +html { font-family: "Lucida Grande", "Segoe UI", sans-serif; color: #111; background: #EEE; font-size: 62.5%; } -body{ +body { margin: 0; padding: 0; font-size: 1.3em; line-height: 1.5em; } -a{ +a { color: #669; } -a:visited{ +a:visited { color: #444; } -a:hover{ +a:hover { color: #000; } -a img{ +a img { border: none; } -pre, code{ +pre, code { max-height: 100%; width: 100%; font-size: 1.2em; overflow: auto; } -h1, h2{ +h1, h2 { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } -h2{ +h2 { margin: 0; } #page { - width: 890px; - margin: 0 auto; + margin: 0 5em; } /* Header *******************************************************************************/ + #top { color: #FFF; padding: 10px 30px; } - h1 a, - h1 a:visited { - color: #665; - text-decoration: none; - } - h1 a:hover { - color: #444; - } + +h1 a, h1 a:visited { + color: #665; + text-decoration: none; +} + +h1 a:hover { + color: #444; +} /* Content *******************************************************************************/ + #content { - width: 590px; + width: 75%; float: left; } +#content img { + max-width: 100%; + height: auto; +} + /* Sidebar *******************************************************************************/ + #sidebar { - width: 300px; + width: 18%; float: left; } - #sidebar div { - padding: 1em 30px; - } - #sidebar h2 { - color: #665; - } - #sidebar ul { - list-style: none; - padding: 0; - margin: 1em 0; - } - + +#sidebar div { + padding: 1em 30px; +} + +#sidebar h2 { + color: #665; +} + +#sidebar ul { + list-style: none; + padding: 0; + margin: 1em 0; +} + /* Article *******************************************************************************/ -.article{ + +.article { margin-bottom: 2em; padding: 30px; background: #FFF; border: 1px solid #DDD; + overflow: hidden; } - .article-title, - .article-title a{ - color: #111; - text-decoration: none; - } +.article-title, .article-title a { + color: #111; + text-decoration: none; +} - .article-info{ - margin: 0 0 1em 0; - color: #999; - } - - .article-content { - font-family: Georgia, serif; - } +.article-info { + margin: 0 0 1em 0; + color: #999; +} - .article img{ - max-width: 440px; - } +.article-content { + font-family: Georgia, serif; +} - .article .collapsed{ - display: none; - } +.article img { + max-width: 440px; +} + +.article .collapsed { + display: none; +} /* Footer *******************************************************************************/ + #footer { clear: both; padding: 0 30px; +} + +@media screen and (max-width: 1023px) { + #page { + margin: 0px; + display: flex; + flex-direction: column; + } + #content, #sidebar { + float: none; + width: 100%; + } }
\ No newline at end of file |