cdransf/coryd.dev-eleventy
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

chore: tokenize spacing

Browse source
This commit is contained in:
Cory Dransfeldt 2024-03-02 13:08:41 -08:00
parent 21cc117690
commit 72c20d6b1c
No known key found for this signature in database
19 changed files with 86 additions and 81 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
package-lock.json generated
View file

@ -1,12 +1,12 @@
{ {
"name": "coryd.dev", "name": "coryd.dev",
"version": "7.1.2", "version": "7.2.0",
"lockfileVersion": 3, "lockfileVersion": 3,
"requires": true, "requires": true,
"packages": { "packages": {
"": { "": {
"name": "coryd.dev", "name": "coryd.dev",
"version": "7.1.2", "version": "7.2.0",
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@cdransf/api-text": "^1.2.2", "@cdransf/api-text": "^1.2.2",
@ -7280,9 +7280,9 @@
} }
}, },
"node_modules/uc.micro": { "node_modules/uc.micro": {
"version": "2.0.0", "version": "2.1.0",
"resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.0.0.tgz", "resolved": "https://registry.npmjs.org/uc.micro/-/uc.micro-2.1.0.tgz",
"integrity": "sha512-DffL94LsNOccVn4hyfRe5rdKa273swqeA5DJpMOeFmEn1wCDc7nAbbB0gXlgBCL7TNzeTv6G7XVWzan7iJtfig==", "integrity": "sha512-ARDJmphmdvUk6Glw7y9DQ2bFkKBHwQHLi2lsaH6PPmz/Ka9sFOBsBluozhDltWmnv9u/cF6Rt87znRTPV+yp/A==",
"dev": true "dev": true
}, },
"node_modules/uglify-js": { "node_modules/uglify-js": {

2
package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "coryd.dev", "name": "coryd.dev",
"version": "7.1.5", "version": "7.2.0",
"description": "The source for my personal site. Built using 11ty.", "description": "The source for my personal site. Built using 11ty.",
"type": "module", "type": "module",
"scripts": { "scripts": {

4
src/assets/styles/components/banners.css
View file

@ -1,6 +1,6 @@
.banner { .banner {
margin: var(--spacing-base) 0; margin: var(--sizing-base) 0;
padding: .75rem; padding: var(--sizing-md);
border: 1px solid; border: 1px solid;
border-radius: var(--rounded-lg); border-radius: var(--rounded-lg);
} }

8
src/assets/styles/components/forms.css
View file

@ -12,14 +12,14 @@ textarea {
color: var(--text-color) !important; color: var(--text-color) !important;
background-color: var(--background-color) !important; background-color: var(--background-color) !important;
border: 1px solid var(--accent-color) !important; border: 1px solid var(--accent-color) !important;
padding: .5rem !important; padding: var(--sizing-sm) !important;
font-size: var(--font-size-base) !important; font-size: var(--font-size-base) !important;
width: 100% !important; width: 100% !important;
border-radius: var(--rounded-md) !important; border-radius: var(--rounded-md) !important;
/* necessary for pagefind overrides */ /* necessary for pagefind overrides */
outline: none; outline: none;
margin-bottom: var(--spacing-base); margin-bottom: var(--sizing-base);
font-weight: 400 !important; font-weight: 400 !important;
line-height: var(--line-height-base); line-height: var(--line-height-base);
transition-property: border-color; transition-property: border-color;
@ -36,8 +36,8 @@ textarea:focus {
button:not(.theme__toggle, .share, .pagefind-ui__search-clear) { button:not(.theme__toggle, .share, .pagefind-ui__search-clear) {
border-radius: var(--rounded-full); border-radius: var(--rounded-full);
padding: .5rem 1rem; padding: var(--sizing-sm) var(--sizing-lg);
margin: 0 .25rem .75rem 0; margin: 0 var(--sizing-xs) var(--sizing-md) 0;
cursor: pointer; cursor: pointer;
display: inline-flex; display: inline-flex;
flex-direction: row; flex-direction: row;

8
src/assets/styles/components/mastodon-post.css
View file

@ -1,7 +1,7 @@
.mastodon-post-wrapper { .mastodon-post-wrapper {
border-bottom: 1px solid var(--gray-light); border-bottom: 1px solid var(--gray-light);
margin-bottom: var(--spacing-base); margin-bottom: var(--sizing-base);
padding-bottom: .25rem; padding-bottom: var(--sizing-xs);
} }
dl { dl {
@ -10,9 +10,9 @@ dl {
} }
dd { dd {
margin-left: .25rem; margin-left: var(--sizing-xs);
} }
dd:not(:last-child) { dd:not(:last-child) {
margin-right: 1rem; margin-right: var(--sizing-lg);
} }

4
src/assets/styles/components/media-grid.css
View file

@ -5,12 +5,12 @@
} }
.now__section--header { .now__section--header {
margin: 2rem 0 1rem; margin: var(--sizing-3xl) 0 var(--sizing-lg);
} }
.media__grid { .media__grid {
display: grid; display: grid;
gap: .5rem; gap: var(--sizing-sm);
} }
.media__grid.square { .media__grid.square {

8
src/assets/styles/components/pagefind.css
View file

@ -1,5 +1,5 @@
.pagefind-ui { .pagefind-ui {
margin-bottom: var(--spacing-base); margin-bottom: var(--sizing-base);
--pagefind-ui-primary: var(--accent-color); --pagefind-ui-primary: var(--accent-color);
--pagefind-ui-text: var(--text-color); --pagefind-ui-text: var(--text-color);
--pagefind-ui-background: var(--color-lightest); --pagefind-ui-background: var(--color-lightest);
@ -67,7 +67,7 @@
} }
.pagefind-ui__result-title { .pagefind-ui__result-title {
margin-bottom: .25rem !important; margin-bottom: var(--sizing-xs) !important;
} }
.pagefind-ui__result-link { .pagefind-ui__result-link {
@ -86,8 +86,8 @@
color: var(--color-lightest) !important; color: var(--color-lightest) !important;
line-height: var(--line-height-base); line-height: var(--line-height-base);
border-radius: var(--rounded-full) !important; border-radius: var(--rounded-full) !important;
padding: .5rem 1rem !important; padding: var(--sizing-sm) var(--sizing-lg) !important;
margin: 0 .25rem .75rem 0; margin: 0 var(--sizing-xs) var(--sizing-md) 0;
cursor: pointer !important; cursor: pointer !important;
height: unset !important; height: unset !important;
text-decoration: none; text-decoration: none;

2
src/assets/styles/components/popular-posts.css
View file

@ -1,3 +1,3 @@
.popular-posts h2 { .popular-posts h2 {
margin: var(--spacing-base) 0; margin: var(--sizing-base) 0;
} }

6
src/assets/styles/components/post-graph.css
View file

@ -1,12 +1,12 @@
.post-graph { .post-graph {
margin-top: var(--spacing-base); margin-top: var(--sizing-base);
margin-bottom: var(--spacing-base); margin-bottom: var(--sizing-base);
} }
.post-graph__wrapper { .post-graph__wrapper {
display: flex; display: flex;
align-items: center; align-items: center;
height: 2rem; height: var(--sizing-3xl);
margin-bottom: .375rem; margin-bottom: .375rem;
} }

4
src/assets/styles/components/progress-bar.css
View file

@ -3,9 +3,9 @@
background-color: rgba(217, 222, 228, .6); background-color: rgba(217, 222, 228, .6);
border-radius: var(--rounded-lg); border-radius: var(--rounded-lg);
overflow: hidden; overflow: hidden;
height: 1rem; height: var(--sizing-lg);
width: 100%; width: 100%;
margin-bottom: .25rem; margin-bottom: var(--sizing-xs);
} }
.progress-bar { .progress-bar {

60
src/assets/styles/index.css
View file

@ -21,14 +21,14 @@ html {
p, p,
blockquote { blockquote {
line-height: var(--line-height-lg); line-height: var(--line-height-lg);
margin: var(--spacing-base) 0; margin: var(--sizing-base) 0;
} }
blockquote { blockquote {
font-size: var(--font-size-lg); font-size: var(--font-size-lg);
padding-left: .875rem; padding-left: .875rem;
color: var(--gray-dark); color: var(--gray-dark);
border-left: .25rem solid var(--gray-dark); border-left: var(--sizing-xs) solid var(--gray-dark);
word-break: break-word; word-break: break-word;
} }
@ -37,7 +37,7 @@ blockquote {
} }
:is(h1, h2, h3, h4, h5, h6) > svg { :is(h1, h2, h3, h4, h5, h6) > svg {
margin-right: .25rem; margin-right: var(--sizing-xs);
stroke-width: var(--stroke-width-bold) !important; stroke-width: var(--stroke-width-bold) !important;
} }
@ -111,7 +111,7 @@ hr {
} }
hr.large__spacing { hr.large__spacing {
margin: 1.25rem 0; margin: var(--sizing-base) 0;
} }
/* tables */ /* tables */
@ -161,7 +161,7 @@ th {
/* header */ /* header */
.main__title { .main__title {
width: 100%; width: 100%;
padding-top: 2rem; padding-top: var(--sizing-3xl);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
@ -236,7 +236,7 @@ nav ul li .active svg:hover {
/* layout */ /* layout */
.default__wrapper { .default__wrapper {
padding-top: 2rem; padding-top: var(--sizing-3xl);
} }
.main__wrapper { .main__wrapper {
@ -256,7 +256,7 @@ main {
.now__topper, .now__topper,
article { article {
border-bottom: 1px solid var(--gray-light); border-bottom: 1px solid var(--gray-light);
margin-bottom: 1.25rem; margin-bottom: var(--sizing-base);
} }
.now__topper p:first-child { .now__topper p:first-child {
@ -265,8 +265,8 @@ article {
footer nav:first-child { footer nav:first-child {
gap: .6rem; gap: .6rem;
margin-top: 2rem; margin-top: var(--sizing-3xl);
padding: 2rem 0 1rem; padding: var(--sizing-3xl) 0 var(--sizing-lg);
width: 100%; width: 100%;
} }
@ -275,19 +275,19 @@ footer nav:first-child svg {
} }
footer nav:first-child a { footer nav:first-child a {
width: 1.5rem; width: var(--sizing-xl);
height: 1.5rem; height: var(--sizing-xl);
} }
footer nav:last-child { footer nav:last-child {
font-size: var(--font-size-sm); font-size: var(--font-size-sm);
line-height: var(--line-height-sm); line-height: var(--line-height-sm);
padding-bottom: 2rem; padding-bottom: var(--sizing-3xl);
} }
footer nav:last-child span:not(.active) { footer nav:last-child span:not(.active) {
margin-left: .25rem; margin-left: var(--sizing-xs);
margin-right: .25rem; margin-right: var(--sizing-xs);
} }
:is(.main__title, footer nav:last-child) a { :is(.main__title, footer nav:last-child) a {
@ -298,11 +298,11 @@ footer nav:last-child span:not(.active) {
.highlight-text { .highlight-text {
color: var(--color-lightest); color: var(--color-lightest);
background-color: var(--accent-color); background-color: var(--accent-color);
padding: .25rem; padding: var(--sizing-xs);
} }
code { code {
padding: .25rem; padding: var(--sizing-xs);
color: var(--text-color-inverted); color: var(--text-color-inverted);
background-color: var(--background-color-inverted); background-color: var(--background-color-inverted);
} }
@ -328,11 +328,11 @@ article time {
color: var(--gray-dark); color: var(--gray-dark);
font-size: var(--font-size-sm); font-size: var(--font-size-sm);
line-height: var(--line-height-sm); line-height: var(--line-height-sm);
margin-right: .25rem; margin-right: var(--sizing-xs);
} }
article [rel="author"] { article [rel="author"] {
margin-bottom: .25rem; margin-bottom: var(--sizing-xs);
} }
article p:first-of-type { article p:first-of-type {
@ -357,8 +357,8 @@ svg {
} }
.icon--small > svg { .icon--small > svg {
width: 1rem; width: var(--sizing-lg);
height: 1rem; height: var(--sizing-lg);
} }
.icon--center__vertical > svg { .icon--center__vertical > svg {
@ -369,13 +369,13 @@ svg {
/* lists */ /* lists */
ul, ol { ul, ol {
list-style-position: inside; list-style-position: inside;
margin: var(--spacing-base) 0; margin: var(--sizing-base) 0;
padding-left: var(--spacing-base); padding-left: var(--sizing-base);
} }
li { li {
margin-top: 1rem; margin-top: var(--sizing-lg);
margin-bottom: 1rem; margin-bottom: var(--sizing-lg);
} }
.link__list li { .link__list li {
@ -457,7 +457,7 @@ li {
} }
nav ul li:not(:last-child) { nav ul li:not(:last-child) {
margin-right: .75rem; margin-right: var(--sizing-md);
} }
main { main {
@ -471,19 +471,19 @@ li {
} }
article h2 { article h2 {
margin: 0 0 .25rem; margin: 0 0 var(--sizing-xs);
} }
article p:first-of-type { article p:first-of-type {
margin-top: .75rem; margin-top: var(--sizing-md);
} }
.tag:not(:last-child) { .tag:not(:last-child) {
margin-right: .5rem; margin-right: var(--sizing-sm);
margin-bottom: .5rem; margin-bottom: var(--sizing-sm);
} }
footer nav:first-child { footer nav:first-child {
gap: .75rem; gap: var(--sizing-md);
} }
} }

2
src/assets/styles/pages/404.css
View file

@ -1,4 +1,4 @@
.four-oh-four__wrapper .image__banner, .four-oh-four__wrapper .image__banner,
.four-oh-four__wrapper a { .four-oh-four__wrapper a {
margin-bottom: var(--spacing-base); margin-bottom: var(--sizing-base);
} }

4
src/assets/styles/pages/about.css
View file

@ -3,7 +3,7 @@
} }
.avatar__wrapper { .avatar__wrapper {
margin-bottom: 1.5rem; margin-bottom: var(--sizing-xl);
width: 100%; width: 100%;
} }
@ -13,7 +13,7 @@
border: 1px solid var(--accent-color); border: 1px solid var(--accent-color);
border-radius: var(--rounded-full); border-radius: var(--rounded-full);
display: flex; display: flex;
padding: 1rem; padding: var(--sizing-lg);
background-color: var(--color-lightest); background-color: var(--color-lightest);
} }

7
src/assets/styles/pages/blogroll.css
View file

@ -1,16 +1,15 @@
:root { :root {
--grid: repeat(1,minmax(0,1fr)); --grid: repeat(1,minmax(0,1fr));
--blog-roll-spacing: .75rem;
} }
.blog__banner--grid { .blog__banner--grid {
display: grid; display: grid;
gap: .5rem; gap: var(--sizing-sm);
grid-template-columns: var(--grid); grid-template-columns: var(--grid);
} }
.blog__banner { .blog__banner {
padding: var(--blog-roll-spacing); padding: var(--sizing-md);
border: 1px solid var(--gray-light); border: 1px solid var(--gray-light);
border-radius: var(--rounded-lg); border-radius: var(--rounded-lg);
display: flex; display: flex;
@ -21,7 +20,7 @@
.blog__banner > p, .blog__banner > p,
.blog__banner .meta { .blog__banner .meta {
margin-top: 0; margin-top: 0;
margin-bottom: var(--blog-roll-spacing); margin-bottom: var(--sizing-md);
} }
.blog__banner > strong { .blog__banner > strong {

4
src/assets/styles/pages/contact.css
View file

@ -9,7 +9,7 @@
} }
.contact__wrapper .column.contact__description { .contact__wrapper .column.contact__description {
margin-bottom: 1.5rem; margin-bottom: var(--sizing-xl);
} }
.contact__wrapper .column.contact__description p:first-child { .contact__wrapper .column.contact__description p:first-child {
@ -26,7 +26,7 @@
} }
.contact__wrapper .column.contact__description { .contact__wrapper .column.contact__description {
padding-right: 1.5rem; padding-right: var(--sizing-xl);
margin-bottom: 0; margin-bottom: 0;
} }
} }

2
src/assets/styles/pages/links.css
View file

@ -1,5 +1,5 @@
.link__list { .link__list {
padding-left: 0; padding-left: 0;
margin-top: 0; margin-top: 0;
margin-bottom: 2rem; margin-bottom: var(--sizing-3xl);
} }

15
src/assets/styles/pages/now.css
View file

@ -1,22 +1,21 @@
/* now */ /* now */
.now__section--text { .now__section--text {
padding-left: 1rem; padding-left: var(--sizing-base);
} }
.now__section--text p { .now__section--text p {
margin-top: .25rem; margin: var(--sizing-xs) 0;
margin-bottom: .25rem;
} }
.now__section--text p > svg { .now__section--text p > svg {
display: inline; display: inline;
vertical-align: middle; vertical-align: middle;
height: var(--spacing-base); height: var(--sizing-base);
width: var(--spacing-base); width: var(--sizing-base);
} }
.now__section--header { .now__section--header {
margin: 2rem 0 1rem; margin: var(--sizing-3xl) 0 var(--sizing-lg);
} }
.now__section--header:first-of-type { .now__section--header:first-of-type {
@ -26,11 +25,11 @@
.now__explainer { .now__explainer {
font-size: var(--font-size-xs); font-size: var(--font-size-xs);
line-height: var(--line-height-xs); line-height: var(--line-height-xs);
padding-top: 1rem; padding-top: var(--sizing-lg);
} }
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
.now__section--text { .now__section--text {
padding-left: 2rem; padding-left: var(--sizing-3xl);
} }
} }

6
src/assets/styles/pages/post.css
View file

@ -1,11 +1,11 @@
/* embeds */ /* embeds */
.eleventy-plugin-youtube-embed { .eleventy-plugin-youtube-embed {
margin-bottom: 1rem; margin-bottom: var(--sizing-lg);
} }
/* footnotes */ /* footnotes */
hr.footnotes-sep { hr.footnotes-sep {
margin: var(--spacing-base) 0; margin: var(--sizing-base) 0;
} }
.footnotes-list { .footnotes-list {
@ -18,7 +18,7 @@ hr.footnotes-sep {
} }
.footnotes { .footnotes {
padding-bottom: 1.25rem; padding-bottom: var(--sizing-base);
} }
.footnote-item > p { .footnote-item > p {

9
src/assets/styles/partials/vars.css
View file

@ -82,7 +82,14 @@
--line-height-3xl: 2.25rem; --line-height-3xl: 2.25rem;
/* spacing */ /* spacing */
--spacing-base: 1.25rem; --sizing-xs: .25rem;
--sizing-sm: .5rem;
--sizing-md: .75rem;
--sizing-lg: 1rem;
--sizing-base: 1.25rem;
--sizing-xl: 1.5rem;
--sizing-2xl: 1.75rem;
--sizing-3xl: 2rem;
/* radii */ /* radii */
--rounded-none: 0; --rounded-none: 0;