xevion/v2.xevion.dev
1
0
Fork 0
mirror of https://github.com/Xevion/v2.xevion.dev.git synced 2025-12-06 13:16:56 -06:00
Code Issues Packages Projects Releases Wiki Activity

Enable mobile friendly CSS with font scaling, re-add margin & grid center

Browse Source
This commit is contained in:
Xevion
2022-09-20 23:49:19 -05:00
parent 43104a3d0e
commit 2c599536f3
2 changed files with 24 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
_includes/header.html
View File

@@ -1,4 +1,4 @@
<header> <header id="header">
<div class="stack" style="--stacks: 3;"> <div class="stack" style="--stacks: 3;">
<span style="--index: 0;">ryan walters</span> <span style="--index: 0;">ryan walters</span>
<span style="--index: 1;">ryan walters</span> <span style="--index: 1;">ryan walters</span>

26
_sass/main.scss
View File

@@ -25,9 +25,26 @@ body {
} }
html { html {
padding: 0;
margin: 0;
overflow-y: scroll; overflow-y: scroll;
font-size: 16pt;
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
@include for-size(phone-only) {
font-size: 10pt;
}
@include for-size(tablet-portrait-up) {
font-size: 12pt;
}
@include for-size(tablet-landscape-up) {
font-size: 14pt;
}
@include for-size(desktop-up) {
font-size: 16pt;
}
@include for-size(big-desktop-up) {
font-size: 18pt;
}
} }
body { body {
@@ -36,11 +53,15 @@ body {
line-height: 1.5; line-height: 1.5;
background: #0e0e0e; background: #0e0e0e;
color: white; color: white;
display: grid;
justify-items: center;
align-items: center;
} }
.body-container { .body-container {
max-width: 46em; max-width: 46em;
margin: 0 auto; margin: 0 1em;
} }
p, p,
@@ -255,7 +276,6 @@ nav {
html, html,
body { body {
visibility: visible !important; visibility: visible !important;
margin: 0 auto;
} }
small { small {