aboutsummaryrefslogtreecommitdiffstats
path: root/theme/default/rsrc/css/import/_responsive.scss
diff options
context:
space:
mode:
authorThomas Lange <code@nerdmind.de>2021-06-17 22:00:39 +0200
committerThomas Lange <code@nerdmind.de>2021-06-17 22:00:39 +0200
commit5555624546ea48d6327700f32b80848e0662dc90 (patch)
tree47d61fb756a6cb008aaf33586d292fcfe43da2a1 /theme/default/rsrc/css/import/_responsive.scss
parent91d8a28c664afa5378735bcd0efe068dd74d589f (diff)
parent0a2614cb69fc732c2115ef2f0c356f39f602d311 (diff)
downloadblog-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.scss77
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;
+ }
+}