chore: cleanup

This commit is contained in:
Cory Dransfeldt 2024-10-03 16:08:39 -07:00
parent 9e73dbe4c1
commit 28fe4b21f2
No known key found for this signature in database
19 changed files with 134 additions and 187 deletions

10
package-lock.json generated
View file

@ -1,12 +1,12 @@
{
"name": "coryd.dev",
"version": "1.0.5",
"version": "1.0.6",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "coryd.dev",
"version": "1.0.5",
"version": "1.0.6",
"license": "MIT",
"dependencies": {
"@cdransf/api-text": "^1.5.0",
@ -1760,9 +1760,9 @@
"license": "MIT"
},
"node_modules/electron-to-chromium": {
"version": "1.5.31",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.31.tgz",
"integrity": "sha512-QcDoBbQeYt0+3CWcK/rEbuHvwpbT/8SV9T3OSgs6cX1FlcUAkgrkqbg9zLnDrMM/rLamzQwal4LYFCiWk861Tg==",
"version": "1.5.32",
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.32.tgz",
"integrity": "sha512-M+7ph0VGBQqqpTT2YrabjNKSQ2fEl9PVx6AK3N558gDH9NO8O6XN9SXXFWRo9u9PbEg/bWq+tjXQr+eXmxubCw==",
"dev": true,
"license": "ISC"
},

View file

@ -1,6 +1,6 @@
{
"name": "coryd.dev",
"version": "1.0.5",
"version": "1.0.6",
"description": "The source for my personal site. Built using 11ty (and other tools).",
"type": "module",
"scripts": {

View file

@ -5,11 +5,6 @@ body {
font-family: var(--font-mono);
}
html {
font-size: 100%;
-webkit-text-size-adjust: none;
}
body {
font-size: var(--font-size-base);
line-height: var(--line-height-base);
@ -17,19 +12,13 @@ body {
word-spacing: -.05rem;
}
::-moz-selection {
color: var(--text-color-inverted);
background: var(--accent-color);
}
::selection {
color: var(--text-color-inverted);
color: var(--color-lightest);
background: var(--accent-color);
}
p {
margin: var(--margin-vertical-base-horizontal-zero);
overflow: visible;
}
:is(p, ul, ol) a {
@ -162,9 +151,7 @@ a:active,
:is(.main-title, footer nav.sub-pages) a:focus,
:is(.main-title, footer nav.sub-pages) a:active {
color: var(--accent-color-hover);
transition-property: color;
transition-timing-function: var(--transition-ease-in-out);
transition-duration: var(--transition-duration-default);
transition: color var(--transition-duration-default) var(--transition-ease-in-out);
}
:is(
@ -233,11 +220,6 @@ table {
overscroll-behavior: none;
}
table,
tr {
width: 100%;
}
table,
th,
td {
@ -261,10 +243,11 @@ td {
&:first-child {
position: sticky;
left: 0;
border-inline-end: none;
max-width: 200px;
text-overflow: ellipsis;
border-inline-end: none;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
&::after {
content: '';
@ -284,15 +267,6 @@ th {
text-align: left;
}
:is(th, td):first-child {
position: sticky;
left: 0;
white-space: nowrap;
max-width: 200px;
overflow: hidden;
text-overflow: ellipsis;
}
td {
min-width: calc(var(--spacing-3xl) * 2);
white-space: nowrap;

View file

@ -22,7 +22,7 @@ button,
color: var(--text-color-inverted);
background-color: var(--accent-color);
appearance: none;
transition-property: border;
transition: color var(--transition-duration-default) var(--transition-ease-in-out);
}
&:not(.theme-toggle, .active):hover,
@ -31,7 +31,5 @@ button,
&:not(.theme-toggle, .active):focus-within {
background-color: var(--accent-color-hover);
border-color: var(--accent-color-hover);
transition-timing-function: var(--transition-ease-in-out);
transition-duration: var(--transition-duration-default);
}
}

View file

@ -17,12 +17,12 @@ textarea {
width: 100%;
}
form:has(+ *),
label:has(input):has(+ *) input,
input[type="text"]:has(+ *),
input[type="email"]:has(+ *),
input[type="search"]:has(+ *),
textarea:has(+ *),
form:has(+ *) {
textarea:has(+ *) {
margin-bottom: var(--spacing-base);
}

View file

@ -71,7 +71,7 @@
& a:hover .item::after,
& a:active .item::after {
border-color: var(--accent-color-hover)
border-color: var(--accent-color-hover);
}
& .meta-text {

View file

@ -3,17 +3,28 @@ menu {
flex-direction: row;
align-items: center;
& .menu-primary {
display: flex;
flex-direction: row;
.menu-primary {
position: absolute;
list-style: none;
margin: 0;
padding: 0;
gap: var(--spacing-md);
top: 0;
left: 0;
gap: 0;
margin-top: calc(var(--spacing-3xl) * 2.25);
flex-direction: column;
width: 100%;
z-index: 3;
& > li {
margin: 0;
display: flex;
align-items: center;
justify-content: center;
overflow: hidden;
margin: 0;
padding: var(--spacing-sm) 0;
width: 100%;
color: var(--text-color);
background: var(--background-color);
& a {
text-decoration: none;
@ -21,96 +32,46 @@ menu {
& .icon > svg,
& .active > svg {
display: block;
display: none;
}
& .icon > span,
& .active > span {
display: none;
display: inline;
}
}
}
& .menu-button-container {
display: none;
margin-left: var(--spacing-md);
& svg {
cursor: pointer;
}
&:hover svg,
&:focus svg,
&:focus-within svg,
&:active svg {
stroke: var(--accent-color-hover);
}
}
& #menu-toggle {
#menu-toggle {
display: none;
&:checked + .menu-button-container {
& .menu-closed {
.menu-closed {
display: none;
}
& .menu-open {
.menu-open {
display: block;
}
}
&:not(:checked) + .menu-button-container {
& .menu-closed {
.menu-closed {
display: block;
}
& .menu-open {
.menu-open {
display: none;
}
}
}
@media (max-width: 768px) {
.menu-primary {
position: absolute;
top: 0;
left: 0;
gap: 0;
margin-top: calc(var(--spacing-3xl) * 2.25);
flex-direction: column;
width: 100%;
z-index: 3;
& > li {
overflow: hidden;
align-items: center;
justify-content: center;
margin: 0;
padding: var(--spacing-sm) 0;
width: 100%;
color: var(--text-color);
background: var(--background-color);
& .icon > svg,
& .active > svg {
display: none;
}
& .icon > span,
& .active > span {
display: inline;
}
}
}
#menu-toggle ~ .menu-primary li {
& ~ .menu-primary li {
height: 0;
border: 0;
padding: 0;
}
#menu-toggle:checked ~ .menu-primary li {
&:checked ~ .menu-primary li {
border-bottom: var(--border-gray);
height: calc(var(--sizing-3xl) * 1.5);
@ -123,11 +84,64 @@ menu {
font-size: var(--font-size-lg);
}
}
}
.menu-button-container {
display: unset;
width: var(--sizing-svg-base);
height: var(--sizing-svg-base);
& svg {
cursor: pointer;
}
}
@media (min-width: 768px) {
.menu-primary {
display: flex;
flex-direction: row;
margin: 0;
gap: var(--spacing-md);
position: relative;
top: unset;
left: unset;
width: auto;
}
.menu-primary > li {
width: auto;
height: auto;
padding: 0;
background: none;
& .icon > svg,
& .active > svg {
display: block;
}
& .icon > span,
& .active > span {
display: none;
}
}
#menu-toggle ~ .menu-primary li {
height: unset;
border: none;
padding: 0;
}
#menu-toggle:checked ~ .menu-primary li {
height: unset;
border: none;
&:first-child {
border: none;
}
}
.menu-button-container {
display: unset;
width: var(--sizing-svg-base);
height: var(--sizing-svg-base);
display: none;
}
}
}

View file

@ -48,11 +48,9 @@
.modal-toggle,
.modal-close {
cursor: pointer;
display: inline-flex;
vertical-align: middle;
& svg {
cursor: pointer;
stroke: var(--accent-color);
&:hover,

View file

@ -65,19 +65,11 @@
}
}
& .meta {
justify-content: start;
gap: var(--spacing-md);
@media screen and (min-width: 768px) {
width: calc(80% - var(--sizing-lg));
}
}
& .meta {
display: flex;
flex-direction: row;
align-items: center;
gap: var(--spacing-md);
@media screen and (min-width: 768px) {
width: calc(75% - var(--sizing-lg));

View file

@ -1,27 +1,25 @@
.pagination {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
& button {
background: none;
padding-left: 0;
padding-right: 0;
}
.pagination button {
background: none;
padding: 0;
}
& a {
display: flex;
}
.pagination a {
display: flex;
}
& p {
text-align: center;
margin: 0;
}
.pagination p {
text-align: center;
margin: 0;
}
& span.disabled svg[data-tablericon-name^="arrow-"] {
cursor: not-allowed;
stroke: var(--gray-medium);
stroke-width: var(--stroke-width-default);
}
.pagination span.disabled svg[data-tablericon-name^="arrow-"] {
cursor: not-allowed;
stroke: var(--gray-medium);
stroke-width: var(--stroke-width-default);
}

View file

@ -20,8 +20,8 @@
--white: #fff;
--black: #000;
--gray-light: var(--gray-300);
--gray-lighter: var(--gray-200);
--gray-light: var(--gray-300);
--gray-medium: var(--gray-400);
--gray-dark: var(--gray-800);
@ -126,7 +126,7 @@
--line-height-md: 1.5;
--line-height-base: 2;
/* spacing */
/* sizing */
--sizing-xs: .25rem;
--sizing-sm: .5rem;
--sizing-md: .75rem;
@ -139,6 +139,7 @@
--sizing-svg-sm: 18px;
--sizing-svg-base: 24px;
/* spacing */
--spacing-xs: var(--sizing-xs);
--spacing-sm: var(--sizing-sm);
--spacing-md: var(--sizing-md);
@ -174,9 +175,9 @@
--text-shadow-default: rgba(0, 0, 0, 0.7) 0px 0px 10px;
/* modals */
--modal-overlay-background-light: #ffffffbf;
--modal-overlay-background: #ffffffbf;
--modal-overlay-background-dark: #000000bf;
--modal-overlay-background: var(--modal-overlay-background-light);
--modal-overlay-background: var(--modal-overlay-background);
/* input accent color */
accent-color: var(--accent-color);
@ -193,7 +194,7 @@
--gray-light: var(--gray-300);
--gray-lighter: var(--gray-200);
--gray-dark: var(--gray-800);
--modal-overlay-background: var(--modal-overlay-background-light);
--modal-overlay-background: var(--modal-overlay-background);
--brand-github: var(--brand-github-light);
--article: var(--article-light);
--about: var(--about-light);

View file

@ -8,7 +8,6 @@
.avatar-wrapper {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
margin-bottom: var(--spacing-sm);

View file

@ -1,4 +1,3 @@
.blog-roll-icons {
display: flex;
flex-direction: row;
}

View file

@ -27,19 +27,14 @@
max-width: calc(var(--sizing-3xl) * 4);
height: auto;
aspect-ratio: var(--aspect-ratio-vertical);
transition-property: border-color;
transition-timing-function: var(--transition-ease-in-out);
transition-duration: var(--transition-duration-default);
transition: border-color var(--transition-duration-default) var(--transition-ease-in-out);
}
& a:focus img,
& a:focus-within img {
border: 0
}
& a:focus-within img,
& a:hover img,
& a:active img {
border-color: var(--accent-color-hover)
border-color: var(--accent-color-hover);
}
& .book-meta {
@ -97,8 +92,7 @@
}
}
& p.title,
& p.sub-meta {
& p {
margin: 0;
}
}

View file

@ -40,7 +40,7 @@
align-items: center;
min-height: 60vh;
h2 {
& h2 {
margin: 0;
}
}

View file

@ -20,8 +20,8 @@
& img {
border: var(--border-default);
border-radius: var(--border-radius-slight);
height: auto;
width: 100%;
height: auto;
display: block;
margin-top: var(--sizing-base);
}

View file

@ -7,7 +7,7 @@ img + .associated-media,
.banner + .associated-media,
youtube-video + .associated-media {
margin-top: var(--spacing-base);
border-top: var(--border-gray)
border-top: var(--border-gray);
}
.footnotes {

View file

@ -40,7 +40,7 @@ a:active > .watching.hero::after {
& .subheader {
font-size: var(--font-size-sm);
display: inline-flex;
gap: var(--spacing-xs)
gap: var(--spacing-xs);
}
& .header,
@ -61,9 +61,7 @@ a:active > .watching.hero::after {
height: 100%;
border: var(--border-default);
border-radius: var(--border-radius-slight);
transition-property: border-color;
transition-timing-function: var(--transition-ease-in-out);
transition-duration: var(--transition-duration-default);
transition: border-color var(--transition-duration-default) var(--transition-ease-in-out);
}
}
@ -84,7 +82,7 @@ a:active > .watching.hero::after {
& a:hover .item::after,
& a:active .item::after {
border-color: var(--accent-color-hover)
border-color: var(--accent-color-hover);
}
& div {
@ -113,14 +111,14 @@ a:active > .watching.hero::after {
font-weight: var(--font-weight-bold);
}
.subheader {
& .subheader {
display: flex;
align-items: center;
gap: var(--spacing-xs);
}
& .rating {
font-size: calc(var(--font-size-sm) * .75);
font-size: calc(var(--font-size-sm) * 0.75);
}
}
}
@ -143,9 +141,7 @@ a:active > .watching.hero::after {
height: 100%;
border: var(--border-default);
border-radius: var(--border-radius-slight);
transition-property: border-color;
transition-timing-function: var(--transition-ease-in-out);
transition-duration: var(--transition-duration-default);
transition: border-color var(--transition-duration-default) var(--transition-ease-in-out);
}
}
}

View file

@ -1,34 +1,18 @@
/* use a more-intuitive box-sizing model */
*, *::before, *::after {
box-sizing: border-box;
}
/* remove default margin */
* {
margin: 0;
}
/*
typographic tweaks
- add accessible line-height
- improve text rendering
*/
body {
line-height: var(--line-height-md);
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: none;
}
/* remove built-in form typography styles */
input, button, textarea, select {
font: inherit;
}
/* avoid text overflows */
p, h1, h2, h3, h4, h5, h6 {
overflow-wrap: break-word;
}
/* create a root stacking context */
#root, #__next {
isolation: isolate;
}