diff options
author | Thomas Lange <code@nerdmind.de> | 2021-06-17 22:00:39 +0200 |
---|---|---|
committer | Thomas Lange <code@nerdmind.de> | 2021-06-17 22:00:39 +0200 |
commit | 5555624546ea48d6327700f32b80848e0662dc90 (patch) | |
tree | 47d61fb756a6cb008aaf33586d292fcfe43da2a1 /theme/default/rsrc/css/import/_responsive.scss | |
parent | 91d8a28c664afa5378735bcd0efe068dd74d589f (diff) | |
parent | 0a2614cb69fc732c2115ef2f0c356f39f602d311 (diff) | |
download | blog-5555624546ea48d6327700f32b80848e0662dc90.tar.gz blog-5555624546ea48d6327700f32b80848e0662dc90.tar.xz blog-5555624546ea48d6327700f32b80848e0662dc90.zip |
Merge branch 'master' into 'optimization'optimization
Diffstat (limited to 'theme/default/rsrc/css/import/_responsive.scss')
-rw-r--r-- | theme/default/rsrc/css/import/_responsive.scss | 77 |
1 files changed, 77 insertions, 0 deletions
diff --git a/theme/default/rsrc/css/import/_responsive.scss b/theme/default/rsrc/css/import/_responsive.scss new file mode 100644 index 0000000..d248bf4 --- /dev/null +++ b/theme/default/rsrc/css/import/_responsive.scss @@ -0,0 +1,77 @@ +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Responsive Level #1 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@media only screen and (max-width: 50em) { + html { + font-size: 1.125rem; /*18px*/ + background-image: none !important; + } + + body { + line-height: 1.2rem; + } + + #container { + margin: 0; + border-right: none; + border-left: none; + } +} + +/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ +# Responsive Level #2 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/ +@media only screen and (max-width: 37.5em) { + main, #main-header > div { + padding: 1rem; + } + + #main-navi { + padding: 0.25rem 1rem; + } + + #main-navi a { + border: 0.05rem solid transparent; + } + + #main-navi a:hover, #main-navi a:focus { + border: 0.05rem solid #BBB; + } + + #main-navi > ul { + display: none; + float: none; + } + + #main-navi > ul > li a { + display: block; + text-align: left; + padding: 0 0.25rem; + } + + #main-navi { + overflow: hidden; + } + + #toogle-nav-label { + display: block; + } + + #toogle-nav:checked + ul { + display: block; + } + + #main-navi li:last-child { + float: none; + } + + .item > header { + text-align: center; + } + + .item > header > h2, + .item > header > .info { + float: none; + display: block; + } +} |