diff --git a/src/assets/css/cassettebeasts.css b/src/assets/css/cassettebeasts.css index c32c998f..308fd3dc 100644 --- a/src/assets/css/cassettebeasts.css +++ b/src/assets/css/cassettebeasts.css @@ -33,10 +33,6 @@ .hero__top-bar, .footer, -.footer a { - color: var(--clr-navbar-link); -} +.footer a { color: var(--clr-navbar-link); } -.footer a:focus { - outline-color: var(--clr-navbar-link); -} \ No newline at end of file +.footer a:focus { outline-color: var(--clr-navbar-link); } \ No newline at end of file diff --git a/src/assets/css/comments.css b/src/assets/css/comments.css index 0560042c..6e5a44a8 100644 --- a/src/assets/css/comments.css +++ b/src/assets/css/comments.css @@ -6,9 +6,7 @@ * File Description: Styles for the guestbook control * CSS variables come from https://groundedwren.neocities.org/styles/gwBoilerPlatePersonalization.css */ -:root { - --icon-color: var(--clr-body-txt); -} +:root { --icon-color: var(--clr-body-txt); } .comment-form { display: grid; @@ -18,9 +16,7 @@ } .comment-form, -.input-horizontal-wrapper { - gap: 1em; -} +.input-horizontal-wrapper { gap: 1em; } .comment-form-title { text-align: center; @@ -45,13 +41,9 @@ } .input-vertical input:focus, -.comment-box-container textarea:focus { - outline: 0.15em solid var(--clr-link); -} +.comment-box-container textarea:focus { outline: 0.15em solid var(--clr-link); } -.comment-box-container textarea { - resize: vertical; -} +.comment-box-container textarea { resize: vertical; } .inline-banner { padding: 0.5em; @@ -63,13 +55,9 @@ background-color: var(--clr-quote-bg); } -.inline-banner.warning { - background-color: #9e0f00; -} +.inline-banner.warning { background-color: #9e0f00; } -.inline-banner.warning a { - color: unset; -} +.inline-banner.warning a { color: unset; } .form-footer, .comment-footer { @@ -77,9 +65,7 @@ gap: 0.5em; } -.form-footer { - justify-content: flex-end; -} +.form-footer { justify-content: flex-end; } .form-footer input, .comment-footer button, @@ -93,23 +79,12 @@ } .comment-footer button, -.show-comment { - font-size: initial; -} +.show-comment { font-size: initial; } -gw-comment-card:not(.collapsed) .show-comment { - display: none; -} -gw-comment-card.collapsed .comment-article > *:not(.comment-header) { - display: none !important; -} -gw-comment-card.collapsed .show-comment { - display: block; -} - -gw-comment-card.collapsed .comment-header-right time { - display: none; -} +gw-comment-card:not(.collapsed) .show-comment { display: none; } +gw-comment-card.collapsed .comment-article > *:not(.comment-header) { display: none !important; } +gw-comment-card.collapsed .show-comment { display: block; } +gw-comment-card.collapsed .comment-header-right time { display: none; } .comments-container { display: flex; @@ -131,9 +106,7 @@ gw-comment-card.collapsed .comment-header-right time { margin: 0.5em 0; } -.comment-article > button { - max-width: fit-content; -} +.comment-article > button { max-width: fit-content; } .comment-header { display: grid; diff --git a/src/assets/css/components.css b/src/assets/css/components.css index 65ea6c03..03e93b83 100644 --- a/src/assets/css/components.css +++ b/src/assets/css/components.css @@ -74,9 +74,7 @@ .link-btn, .link-btn:hover, -.link-btn:visited { - text-decoration: none; -} +.link-btn:visited { text-decoration: none; } .link-btn:hover { background: var(--clr-link-btn-hover); @@ -89,30 +87,14 @@ } /* Content Accordion */ -* + .content-accordion { - margin-top: var(--sz-paragraph-margin); -} - -.content-accordion { - padding: 0.5em 0; -} - -.content-accordion__summary { - font-weight: 700; -} - -.content-accordion__content { - padding: 0.5em 1em; -} - -.content-accordion__content p + p { - margin-top: 1em; -} +* + .content-accordion { margin-top: var(--sz-paragraph-margin); } +.content-accordion { padding: 0.5em 0; } +.content-accordion__summary { font-weight: 700; } +.content-accordion__content { padding: 0.5em 1em; } +.content-accordion__content p + p { margin-top: 1em; } /* Content warning accordion */ -* + .contnet-warning { - margin-top: var(--sz-paragraph-margin); -} +* + .contnet-warning { margin-top: var(--sz-paragraph-margin); } .contnet-warning { border: 0.1em solid var(--clr-title-border); @@ -132,13 +114,9 @@ } .contnet-warning__warning:hover, -.contnet-warning__warning:focus { - --stripe-color: var(--clr-cw-hover); -} +.contnet-warning__warning:focus { --stripe-color: var(--clr-cw-hover); } -.contnet-warning__content { - padding: 1em; -} +.contnet-warning__content { padding: 1em; } /* Adoptables wrapper */ .adoptables { diff --git a/src/assets/css/content.css b/src/assets/css/content.css index 5bfe0b0a..3db56466 100644 --- a/src/assets/css/content.css +++ b/src/assets/css/content.css @@ -1,18 +1,12 @@ /* MAIN CONTENT */ content-wrapper, -.content--divided { - display: grid; -} +.content--divided { display: grid; } content-wrapper, -.content--divided { - gap: 1rem; -} +.content--divided { gap: 1rem; } .content:not(.content--divided), -.content__section { - padding: 1.5rem var(--sz-main-padding); -} +.content__section { padding: 1.5rem var(--sz-main-padding); } .main__header { padding: 2.5rem var(--sz-main-padding); @@ -21,9 +15,7 @@ content-wrapper, } .content:not(.content--divided), -.content__section { - background-color: var(--clr-content-bg); -} +.content__section { background-color: var(--clr-content-bg); } .article__info { text-align: center; @@ -32,14 +24,10 @@ content-wrapper, } .content > * + .h2, -.content__section > * + .h2 { - margin-top: 2em; -} +.content__section > * + .h2 { margin-top: 2em; } .content > * + :not([class]), -.content__section > * + :not([class]) { - margin-top: var(--sz-paragraph-margin); -} +.content__section > * + :not([class]) { margin-top: var(--sz-paragraph-margin); } .content ul:not([class]), .content ol:not([class]) { display: grid; @@ -47,9 +35,7 @@ content-wrapper, } .content ul ul, .content ol ol, -.content ul ol, .content ol ul { - margin-top: 0.7em; -} +.content ul ol, .content ol ul { margin-top: 0.7em; } .sidebar--sticky { position: sticky; @@ -64,15 +50,7 @@ content-wrapper, grid-template-columns: minmax(0, 18vw) minmax(min(60ch, 40vw), 2.5fr) minmax(0, 18vw); } - .content { - grid-area: content; - } - - .left-sidebar { - grid-area: leftbar; - } - - .right-sidebar { - grid-area: rightbar; - } + .content { grid-area: content; } + .left-sidebar { grid-area: leftbar; } + .right-sidebar { grid-area: rightbar; } } diff --git a/src/assets/css/general.css b/src/assets/css/general.css index 1c167fd8..ff5d198a 100644 --- a/src/assets/css/general.css +++ b/src/assets/css/general.css @@ -28,55 +28,30 @@ h1 { margin-bottom: 0.5em; } -h2, h3, h4, h5, h6 { - color: var(--clr-sub-heading); -} - -h1, h2, h3 { - line-height: 1.2; -} - -h2, .h2 { - font-size: var(--fs-h2); -} - -h3, .h3 { - font-size: var(--fs-h3); -} +h2, h3, h4, h5, h6 { color: var(--clr-sub-heading); } +h1, h2, h3 { line-height: 1.2; } +h2, .h2 { font-size: var(--fs-h2); } +h3, .h3 { font-size: var(--fs-h3); } h2:has(+ *[class]:not(.heading-anchor)), .h2:has(+ *[class]), -h3:has(+ *[class]:not(.heading-anchor)), .h3:has(+ *[class]) { - margin-bottom: 0.5em; -} +h3:has(+ *[class]:not(.heading-anchor)), .h3:has(+ *[class]) { margin-bottom: 0.5em; } -h4, .h4 { - font-size: var(--fs-h4); -} +h4, .h4 { font-size: var(--fs-h4); } -strong { - color: var(--clr-bold-txt); -} +strong { color: var(--clr-bold-txt); } -:focus { - outline: 0.15em solid var(--clr-body-txt); -} +:focus { outline: 0.15em solid var(--clr-body-txt); } a { font-weight: 700; color: var(--clr-link); } -a:hover { - color: var(--clr-link-hover); -} +a:hover { color: var(--clr-link-hover); } -a:not([class]):focus { - outline: 0.15rem solid var(--clr-link); -} +a:not([class]):focus { outline: 0.15rem solid var(--clr-link); } -a:focus img { - outline: 0.2em solid var(--clr-body-txt); -} +a:focus img { outline: 0.2em solid var(--clr-body-txt); } :not(.c-blockquote) > blockquote, .c-blockquote { @@ -89,18 +64,12 @@ a:focus img { blockquote > * + :not([class]), * + blockquote, * + .c-blockquote, -.c-blockquote__attribution { - margin-top: var(--sz-paragraph-margin); -} +.c-blockquote__attribution { margin-top: var(--sz-paragraph-margin); } -button:hover { - cursor: pointer; -} +button:hover { cursor: pointer; } button:focus, -details:focus { - outline-offset: 0.2em; -} +details:focus { outline-offset: 0.2em; } figure { margin-bottom: var(--sz-paragraph-margin); @@ -115,18 +84,12 @@ figcaption { margin-top: 0.2em; } -code { - font-family: var(--ff-monospace), ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; -} +code { font-family: var(--ff-monospace), ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace; } -:not(pre) > code { - padding: 0.125em 0.25em; -} +:not(pre) > code { padding: 0.125em 0.25em; } :not(pre) > code, -pre { - background-color: var(--clr-code-bg); -} +pre { background-color: var(--clr-code-bg); } pre { border: 0.1em solid var(--clr-code-border); @@ -135,13 +98,9 @@ pre { padding: 1rem; } -pre > code { - white-space: pre; -} +pre > code { white-space: pre; } -summary { - cursor: pointer; -} +summary { cursor: pointer; } dl { display: grid; @@ -149,10 +108,5 @@ dl { grid-template-columns: auto auto; } -dt { - font-weight: 700; -} - -dd { - grid-column-start: 2; -} +dt { font-weight: 700; } +dd {grid-column-start: 2; } \ No newline at end of file diff --git a/src/assets/css/misc.css b/src/assets/css/misc.css index e081d30e..9e4b21fe 100644 --- a/src/assets/css/misc.css +++ b/src/assets/css/misc.css @@ -107,17 +107,14 @@ body { text-align: center; } -body, -main { +body, main { display: flex; align-items: center; justify-content: center; flex-direction: column; } -main { - max-width: 90%; -} +main { max-width: 90%; } h1 { font-size: var(--fs-h1); @@ -128,9 +125,7 @@ h1 { line-height: 1; } -p { - font-size: var(--fs-p); -} +p { font-size: var(--fs-p); } .index__btn-wrapper { display: flex; diff --git a/src/assets/css/plugins.css b/src/assets/css/plugins.css index df232cf7..6c80b835 100644 --- a/src/assets/css/plugins.css +++ b/src/assets/css/plugins.css @@ -5,9 +5,7 @@ align-items: baseline; } -* + .heading-wrapper { - margin-top: 1.8em; -} +* + .heading-wrapper { margin-top: 1.8em; } .heading-anchor { order: -1; @@ -19,14 +17,10 @@ outline-offset: 0.05em; } -.heading-anchor [hidden] { - display: block; -} +.heading-anchor [hidden] { display: block; } /* BLOCKQUOTES With CITATIONS */ -.c-blockquote__attribution { - text-align: left; -} +.c-blockquote__attribution { text-align: left; } .c-blockquote__attribution::before { content: "—"; @@ -34,13 +28,8 @@ } /* FOOTNOTES */ -.footnote-ref { - margin-left: 0.2em; -} - -.footnote-ref a:target { - scroll-margin-block: calc(var(--sz-navbar-ht) + 5ex); -} +.footnote-ref { margin-left: 0.2em; } +.footnote-ref a:target { scroll-margin-block: calc(var(--sz-navbar-ht) + 5ex); } .footnotes { margin-top: 3em; diff --git a/src/assets/css/utility.css b/src/assets/css/utility.css index 8db40ec7..7581de96 100644 --- a/src/assets/css/utility.css +++ b/src/assets/css/utility.css @@ -1,17 +1,12 @@ /* UTILITY CLASSES */ -.bold-text { - font-weight: 700; -} +.bold-text { font-weight: 700; } +.center-text { text-align: center; } .center-el { display: grid; place-content: center; } -.center-text { - text-align: center; -} - .indent-text { padding: 1em 0 1em 2em; display: grid; @@ -23,9 +18,7 @@ color: var(--clr-dates); } -.hidden { - display: none; -} +.hidden { display: none; } .visually-hidden { position: absolute; @@ -39,4 +32,4 @@ border: 0; outline: 0; outline-offset: 0; -} +} \ No newline at end of file