diff --git a/public/css/blog.css b/public/css/blog.css index 4cdbbfa..b960dbe 100644 --- a/public/css/blog.css +++ b/public/css/blog.css @@ -83,7 +83,7 @@ } .blog-return { - width: 120px; + width: fit-content; border-right: 1px solid black; } diff --git a/public/css/style.css b/public/css/style.css index 4236ed5..81c707a 100755 --- a/public/css/style.css +++ b/public/css/style.css @@ -392,4 +392,95 @@ img[src*="#center"] { /* IE and Edge */ scrollbar-width: none; /* Firefox */ +} + + +/* ===== Mobile Styles ===== */ +@media (max-width: 768px) { + body { + width: 100%; + margin: 10px auto; + padding: 0 10px; + } + + #kafu-home { + display: none; + } + + .website-grid { + padding-top: 16px; + display: block; + } + + .website-grid #content, + .website-grid #sidebar { + width: 100%; + } + + .website-grid #sidebar { + margin-top: 16px; + } + + .website-grid.website-blog { + display: block; + } + + .window-header { + height: 100px; + } + + .window-header #domain { + font-size: 2rem; + } + + .window-header #char { + height: 100px; + } + + .window-button a { + font-size: 16px; + padding: 6px 12px; + } + + .window-content h2 { + font-size: 24px; + } + + .window-content p, + .window-content a { + font-size: 14px; + } + + .window-content.post-latest a:first-child { + font-size: 15px; + } + + .window-content.post-latest a { + font-size: 15px; + } + + .window-content.blog div h2 { + font-size: 18px; + } + + #sidebar .window { + max-width: 100%; + } + + .grid { + grid-template-columns: 1fr; + justify-items: center; + } + + .grid .window { + height: auto; + } + + .grid-justify { + flex-direction: column; + } + + .caption { + font-size: 16px; + } } \ No newline at end of file diff --git a/templates/route/home.md b/templates/route/home.md index 091b76f..6aff48b 100644 --- a/templates/route/home.md +++ b/templates/route/home.md @@ -14,7 +14,7 @@ feel free to look around, there might some cool stuff you might like!
-