diff --git a/assets/css/archive.css b/assets/css/archive.css index 51d6282..b4ae14c 100644 --- a/assets/css/archive.css +++ b/assets/css/archive.css @@ -42,13 +42,3 @@ color: var(--secondary); font-size: 14px } - -@media (max-width:800px) { - .archive-month { - flex-direction: column - } - - .archive-year { - margin-top: 20px - } -} diff --git a/assets/css/footer.css b/assets/css/footer.css index 15467eb..2ccb160 100644 --- a/assets/css/footer.css +++ b/assets/css/footer.css @@ -48,9 +48,3 @@ .top-link:focus { outline: 0 } - -@media screen and (max-width:800px) { - .list .top-link { - transform: translateY(-5rem) - } -} diff --git a/assets/css/post-entry.css b/assets/css/post-entry.css index a9d0851..e91cb53 100644 --- a/assets/css/post-entry.css +++ b/assets/css/post-entry.css @@ -7,12 +7,6 @@ margin: var(--gap) 0 calc(var(--gap) * 2) 0 } -@media screen and (max-width:600px) { - .first-entry { - min-height: 260px - } -} - .first-entry .entry-header { overflow: hidden; display: -webkit-box; @@ -53,12 +47,6 @@ transform: scale(.96) } -@media (prefers-reduced-motion) { - .post-entry:active { - transform: none - } -} - .tag-entry .entry-cover { display: none } diff --git a/assets/css/post-single.css b/assets/css/post-single.css index 0f388e8..ce7b1d1 100644 --- a/assets/css/post-single.css +++ b/assets/css/post-single.css @@ -335,12 +335,6 @@ transform: scale(.96) } -@media (prefers-reduced-motion) { - .share-buttons svg:active { - transform: none - } -} - h1:hover .anchor, h2:hover .anchor, h3:hover .anchor, diff --git a/assets/css/profile-mode.css b/assets/css/profile-mode.css index 5250237..64b7b92 100644 --- a/assets/css/profile-mode.css +++ b/assets/css/profile-mode.css @@ -28,12 +28,6 @@ pointer-events: none } -@media screen and (max-width:600px) { - .profile img { - transform: scale(.85) - } -} - .buttons { flex-wrap: wrap; max-width: 400px; @@ -56,8 +50,3 @@ transform: scale(.96) } -@media (prefers-reduced-motion) { - .button:active { - transform: none - } -} diff --git a/assets/css/reset.css b/assets/css/reset.css index e00a762..5813e68 100644 --- a/assets/css/reset.css +++ b/assets/css/reset.css @@ -129,10 +129,3 @@ img { ::-webkit-scrollbar-thumb:hover { background: var(--secondary) } - -@media screen and (min-width:768px) { - ::-webkit-scrollbar { - width: 10px; - height: 6px - } -} diff --git a/assets/css/search.css b/assets/css/search.css index df3275c..5deb71e 100644 --- a/assets/css/search.css +++ b/assets/css/search.css @@ -43,9 +43,3 @@ transform: scale(.98); border: 2px solid var(--tertiary) } - -@media (prefers-reduced-motion) { - #searchResults .active { - transform: none - } -} diff --git a/assets/css/terms.css b/assets/css/terms.css index c20357f..7a68cc3 100644 --- a/assets/css/terms.css +++ b/assets/css/terms.css @@ -16,9 +16,3 @@ background: var(--tertiary); transform: scale(.96) } - -@media (prefers-reduced-motion) { - .terms-tags a:active { - transform: none - } -} diff --git a/assets/css/theme-vars.css b/assets/css/theme-vars.css index 347502f..733f9d4 100644 --- a/assets/css/theme-vars.css +++ b/assets/css/theme-vars.css @@ -17,12 +17,6 @@ --border: #eee; } -@media screen and (max-width:600px) { - :root { - --gap: 14px - } -} - .dark { --theme: #1d1e20; --entry: #2e2e33; diff --git a/assets/css/zmedia.css b/assets/css/zmedia.css new file mode 100644 index 0000000..f460b4d --- /dev/null +++ b/assets/css/zmedia.css @@ -0,0 +1,72 @@ +@media screen and (max-width: 768px) { + /* theme-vars */ + :root { + --gap: 14px; + } + + /* profile-mode */ + .profile img { + transform: scale(0.85); + } + + /* post-entry */ + .first-entry { + min-height: 260px; + } + + /* archive */ + .archive-month { + flex-direction: column; + } + + .archive-year { + margin-top: 20px; + } +} + +@media screen and (min-width: 768px) { + /* reset */ + ::-webkit-scrollbar { + width: 10px; + height: 6px; + } +} + +/* footer */ +@media screen and (max-width: 900px) { + .list .top-link { + transform: translateY(-5rem); + } +} + +@media (prefers-reduced-motion) { + /* terms */ + .terms-tags a:active { + transform: none; + } + + /* profile-mode */ + .button:active { + transform: none; + } + + /* post-single */ + .share-buttons svg:active { + transform: none; + } + + /* post-entry */ + .post-entry:active { + transform: none; + } + + /* footer */ + .top-link { + transition: none; + } + + /* search */ + #searchResults .active { + transform: none; + } +}