From efb3dddd07fd19d1c3e85ec74fe6699c484c6043 Mon Sep 17 00:00:00 2001 From: etherware-novice <73374039+etherware-novice@users.noreply.github.com> Date: Thu, 1 Aug 2024 22:54:49 -0500 Subject: [PATCH] mobile css fixes! --- _layouts/default.html | 2 +- _sass/main.scss | 1 + _sass/mobile.scss | 38 ++++++++++++++++++++++++++++++++++++++ _sass/sidebar.scss | 1 + 4 files changed, 41 insertions(+), 1 deletion(-) create mode 100644 _sass/mobile.scss diff --git a/_layouts/default.html b/_layouts/default.html index 2e3c009..5cdf6fd 100644 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -26,7 +26,7 @@ navbar: topnav
{% include swatchclock.html %} - + {% include statuscafe.html %} diff --git a/_sass/main.scss b/_sass/main.scss index 1de48af..e5f6d5f 100644 --- a/_sass/main.scss +++ b/_sass/main.scss @@ -1,6 +1,7 @@ @import "sidebar"; @import "statuscafe"; @import "fonts"; +@import "mobile"; html { background-color: #2196F3; diff --git a/_sass/mobile.scss b/_sass/mobile.scss new file mode 100644 index 0000000..d552692 --- /dev/null +++ b/_sass/mobile.scss @@ -0,0 +1,38 @@ +/* mobile specific stuff +i dont know what im doing */ + +@media (max-width: 1150px){ + html, body { + font-size: 1.50em; + } + + .columns, .vcol{ + top: 50px; + flex-direction: column; + flex-wrap: wrap; + max-height: 90%; + } + + .left-sidebar, .right-sidebar { + width: 100%; + height: 4em; + max-height: 20vh; + font-size: 1.75em; + text-align: center; + } + + .main-content { + width: auto; + max-height: 50vh; + margin: 20px; + } + + #cbox { + display: none; + } + + img { + min-height: 1.1em; + flex-shrink: 0; + } +} diff --git a/_sass/sidebar.scss b/_sass/sidebar.scss index 879ec40..8185de2 100644 --- a/_sass/sidebar.scss +++ b/_sass/sidebar.scss @@ -1,4 +1,5 @@ .columns { + position: relative; max-width: 80%; max-height: 90vh; display: flex;