diff --git a/src/css/global.css b/src/css/global.css index 9745749..e241e84 100644 --- a/src/css/global.css +++ b/src/css/global.css @@ -104,7 +104,7 @@ article { font-size: 1rem; word-wrap: break-word; line-height: 1.5; - padding: 0 1em; + padding: 0 1.5em; } main.page, article.page { diff --git a/src/css/landing.css b/src/css/landing.css index 7fea540..feb68f3 100644 --- a/src/css/landing.css +++ b/src/css/landing.css @@ -116,38 +116,100 @@ main article { background: rgb(28, 27, 26); border-top: solid rgb(40, 39, 38); border-bottom: solid rgb(40, 39, 38); - padding: 1em; font-size: 1rem; -} -main article:first-child { - margin-top: 0; + word-wrap: break-word; + line-height: 1.5; + padding: 0 1.5em; } @media screen and (min-width: 768px) { main article { border: solid rgb(40, 39, 38); max-height: 600px; overflow: scroll; - padding: 2em; - padding-bottom: 1em; } } -main article h1 { - font-size: 2em; +main article p, +main article blockquote, +main article ul, +main article ol, +main article dl, +main article table, +main article pre { + margin: 1em 0; } -main article h1 a { - font-size: 0.5em; +main article ul, +main article ol { + all: revert; + padding-left: 30px; +} +main article h1 { + font-size: 2.5em; } main article h2 { - font-weight: bold; + font-size: 2em; } -main article *:not(li) + *:not(li) { - margin-top: 1em; +main article h3 { + font-size: 1.5em; } -main article ol, -main article ul { - all: revert; - margin: 10px 0; - padding-left: 1em; +main article h4 { + font-size: 1.2em; +} +main article h5 { + font-size: 1em; +} +main article h6 { + font-size: 1em; +} +main article h1, +main article h2, +main article h3, +main article h4, +main article h5, +main article h6 { + margin: 0.5em 0 0.25em 0; + text-align: center; +} +@media screen and (min-width: 768px) { + main article h1, + main article h2, + main article h3, + main article h4, + main article h5, + main article h6 { + text-align: left; + } +} +main article h1 + p, +main article h2 + p, +main article h3 + p { + margin-top: 0.5em; +} +main article img { + max-width: 100%; +} +main article code, +main article pre { + background-color: #f8f8f8; + border-radius: 3px; + border: 1px solid #ddd; + font-family: monospace; + font-size: 12px; + margin: 0 2px; + padding: 0 5px; + white-space: pre; +} +main article pre code { + border: none; + margin: 0; + padding: 0; + white-space: pre; +} +main article a { + color: #9ec611; + text-decoration: underline #9ec611 2px; +} +main article a:hover { + color: #beec1f; } main a { color: #9ec611; diff --git a/src/css/landing.css.map b/src/css/landing.css.map index 0203d0d..2d12a6f 100644 --- a/src/css/landing.css.map +++ b/src/css/landing.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["../scss/_colors.scss","../scss/_fonts.scss","../scss/landing.scss","../scss/_mixins.scss"],"names":[],"mappings":"AACA;;AAAA;AAAA;;AAAA;AAOA;AAAA;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACRA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAaA;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;ACnDF;;AAAA;AAAA;;AAAA;AAWA;EAEI;EACA;EAEF;;;AAGF;EACE;EACA;EACA;EACA,KAjBO;EAkBP;;ACbA;EDQF;IAQI;IACA;IACA;;;;AAIJ;EACE;EACA,KA7BO;EA8BP;EACA;EACA;;AC3BA;EDsBF;IAQI,WAlCQ;;;AAqCV;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;ACzCJ;EDiCA;IAYI;IACA,YAjDO;IAkDP;IACA;IACA;;;AAGF;EACE;;AACA;EACE;;AAIJ;EACE;;AAGF;EACE;;AAGF;AAAA;EAEE;EACA;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;EACA;;ACxFA;EDqFF;IAMI,QA9FS;IA+FT;IACA;;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;;ACxHF;EDuGF;IAqBI","file":"landing.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["../scss/_colors.scss","../scss/_fonts.scss","../scss/landing.scss","../scss/_mixins.scss"],"names":[],"mappings":"AACA;;AAAA;AAAA;;AAAA;AAOA;AAAA;AAAA;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAAA;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACRA;;AAAA;AAAA;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAaA;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;ACnDF;;AAAA;AAAA;;AAAA;AAWA;EAEI;EACA;EAEF;;;AAGF;EACE;EACA;EACA;EACA,KAjBO;EAkBP;;ACbA;EDQF;IAQI;IACA;IACA;;;;AAIJ;EACE;EACA,KA7BO;EA8BP;EACA;EACA;;AC3BA;EDsBF;IAQI,WAlCQ;;;AAqCV;EACE;EACA;EACA;EACA;EC/BH;EACA;EACA;;AARC;EDiCA;IAOI;IACA,YA5CO;IA6CP;;;AChCJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOE;;AAGF;AAAA;EAEE;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;EACA;;AAzDF;EAkDA;AAAA;AAAA;AAAA;AAAA;AAAA;IASI;;;AAIJ;AAAA;AAAA;EAGE;;AAGF;EACE;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAEA;EACE;;ADjDJ;EACE;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;EACA;;AC7DA;ED0DF;IAMI,QAnES;IAoET;IACA;;;AAGF;EACE;EACA;EACA;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;;AC7FF;ED4EF;IAqBI","file":"landing.css"} \ No newline at end of file diff --git a/src/main.md b/src/main.md index 9c01f26..9acaf25 100644 --- a/src/main.md +++ b/src/main.md @@ -5,7 +5,6 @@ eleventyNavigation: --- Me, a brown-haired, brown-eyed man with round glasses, smiling. The picture is filtered to mimic the Game Boy Camera and create a retro vibe. -Test # Home diff --git a/src/scss/_mixins.scss b/src/scss/_mixins.scss index c94c717..4aa4ca5 100644 --- a/src/scss/_mixins.scss +++ b/src/scss/_mixins.scss @@ -22,7 +22,7 @@ $breakpoints: ( @mixin markup { word-wrap: break-word; line-height: 1.5; - padding: 0 1em; + padding: 0 1.5em; p, blockquote, diff --git a/src/scss/landing.scss b/src/scss/landing.scss index 765eba4..122756b 100644 --- a/src/scss/landing.scss +++ b/src/scss/landing.scss @@ -51,42 +51,15 @@ main { background: #{colors.$base-950}; border-top: solid #{colors.$base-900}; border-bottom: solid #{colors.$base-900}; - padding: 1em; font-size: 1rem; - &:first-child { - margin-top: 0; - } - @include breakpoint("md") { border: solid #{colors.$base-900}; max-height: $max-height; overflow: scroll; - padding: 2em; - padding-bottom: 1em; } - h1 { - font-size: 2em; - a { - font-size: 0.5em; - } - } - - h2 { - font-weight: bold; - } - - *:not(li) + *:not(li) { - margin-top: 1em; - } - - ol, - ul { - all: revert; - margin: #{$gutter} 0; - padding-left: 1em; - } + @include markup; } a {