diff --git a/_site/about/index.html b/_site/about/index.html index b50e5399..75b24244 100644 --- a/_site/about/index.html +++ b/_site/about/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/archive/index.html b/_site/archive/index.html index 56c233df..e01198a0 100644 --- a/_site/archive/index.html +++ b/_site/archive/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/articles/anti-harry-potter-jk-rowling-masterlist/index.html b/_site/articles/anti-harry-potter-jk-rowling-masterlist/index.html index 06a19f14..e0114415 100644 --- a/_site/articles/anti-harry-potter-jk-rowling-masterlist/index.html +++ b/_site/articles/anti-harry-potter-jk-rowling-masterlist/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/articles/designated-lesbian-syndrome-fandom/index.html b/_site/articles/designated-lesbian-syndrome-fandom/index.html index 95aff740..4fdabd37 100644 --- a/_site/articles/designated-lesbian-syndrome-fandom/index.html +++ b/_site/articles/designated-lesbian-syndrome-fandom/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/articles/index.html b/_site/articles/index.html index 9c89b06b..166b1eba 100644 --- a/_site/articles/index.html +++ b/_site/articles/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/articles/kotor2-modder-interview-ars-technica/index.html b/_site/articles/kotor2-modder-interview-ars-technica/index.html index 752ac200..16f2a054 100644 --- a/_site/articles/kotor2-modder-interview-ars-technica/index.html +++ b/_site/articles/kotor2-modder-interview-ars-technica/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/articles/lgbtq-booklet-interview-misi-bawang/index.html b/_site/articles/lgbtq-booklet-interview-misi-bawang/index.html index a3b41920..50077649 100644 --- a/_site/articles/lgbtq-booklet-interview-misi-bawang/index.html +++ b/_site/articles/lgbtq-booklet-interview-misi-bawang/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/articles/my-dislike-of-shipping-culture/index.html b/_site/articles/my-dislike-of-shipping-culture/index.html index 656c1b4e..b4816e6e 100644 --- a/_site/articles/my-dislike-of-shipping-culture/index.html +++ b/_site/articles/my-dislike-of-shipping-culture/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/assets/css/components.css b/_site/assets/css/components.css new file mode 100644 index 00000000..774a939e --- /dev/null +++ b/_site/assets/css/components.css @@ -0,0 +1,93 @@ +/* SPECIAL COMPONENTS */ +.text-box { + background: var(--clr-quote-bg); + border: 0.1em solid var(--clr-main-heading); + padding: 0.8em; + margin: 0.5em 0; + display: grid; + gap: 1em; +} + +.mod-entry, +.mod-entry__downloads { + display: grid; + align-items: center; +} + +.mod-entry { + gap: 1em; + background: var(--clr-mod-entry-bg); + margin: 1em 0; + padding: 1em; +} + +.mod-entry__downloads { + gap: 0.5em; +} + +/* Tablet screen size */ +@media only screen and (min-width: 37.5rem) { + .mod-entry__downloads { + grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); + } +} + +/* Link button */ +.link-btn { + font-size: 1.3rem; + text-align: center; + display: inline-block; + border: 0.15em solid var(--clr-link-btn-bg); + border-radius: 0.6em; + padding: 0.5em 1em; + background: var(--clr-link-btn-bg); + color: var(--clr-link-btn-txt); + cursor: pointer; + font-weight: 700; + text-transform: uppercase; +} + +.link-btn, +.link-btn:hover, +.link-btn:visited { + text-decoration: none; +} + +.link-btn:hover { + cursor: pointer; + background: var(--clr-link-btn-hover); + transition: 0.5s; +} + +.link-btn:focus { + outline: 0.15em solid var(--clr-link-btn-txt); + outline-offset: -0.25em; +} + +/* Spoiler Accordion */ +* + .spoiler-accordion { + margin-top: var(--sz-paragraph-margin); +} + +.spoiler-accordion { + padding: 0.5em 0; +} + +.spoiler-accordion__hint { + font-weight: 700; +} + +.spoiler-accordion__spoiler { + padding: 0.5em 1em; +} + +.spoiler-accordion__spoiler p + p { + margin-top: 1em; +} + +/* Web button lists */ +.web-btn-wrapper { + display: flex; + flex-wrap: wrap; + gap: 0.5rem; +} diff --git a/_site/assets/css/content.css b/_site/assets/css/content.css new file mode 100644 index 00000000..df52f2a8 --- /dev/null +++ b/_site/assets/css/content.css @@ -0,0 +1,87 @@ +/* MAIN CONTENT */ +main, +.content__wrapper, +.content--divided { + display: grid; +} + +main, +.content__wrapper { + font-size: 1.2rem; +} + +main { + width: 100%; +} + +.content__wrapper, +.content--divided { + gap: 1rem; +} + +.content__wrapper { + justify-self: center; +} + +.article, +.content:not(.content--divided), +.content__section { + padding: 1.5rem var(--sz-main-padding); +} + +.main__header { + padding: 2.5rem var(--sz-main-padding); + text-align: center; + display: grid; +} + +.article, +.content:not(.content--divided), +.content__section { + background-color: var(--clr-content-bg); +} + +.article__info { + text-align: center; + display: grid; + gap: 0.2em; +} + +.content > * + .h2, +.content__section > * + .h2, +.article > * + .h2 { + margin-top: 2em; +} + +.content > * + :not([class]), +.content__section > * + :not([class]), +.article > * + :not([class]) { + margin-top: var(--sz-paragraph-margin); +} + +.sidebar--sticky { + position: sticky; + top: 4rem; +} + +/* Desktop main content layout */ +@media only screen and (min-width: 60rem) { + .content__wrapper { + padding: 0 var(--sz-main-padding); + grid-template-areas: 'leftbar article rightbar'; + grid-template-columns: minmax(0, 20%) minmax(0, 2.5fr) minmax(0, 20%); + } + + .article, + .content { + grid-area: article; + } + + .left-sidebar { + grid-area: leftbar; + } + + .right-sidebar { + grid-area: rightbar; + } +} diff --git a/_site/assets/css/general.css b/_site/assets/css/general.css new file mode 100644 index 00000000..2a6a17ec --- /dev/null +++ b/_site/assets/css/general.css @@ -0,0 +1,143 @@ +/* GENERAL STYLES */ +html { + scroll-behavior: smooth; +} + +body { + display: flex; + align-items: center; + flex-direction: column; + font-family: var(--ff-primary), Arial, Helvetica, sans-serif; + color: var(--clr-body-txt); + background-color: var(--clr-body-bg); +} + +h1 { + color: var(--clr-main-heading); + font-size: var(--sz-h1); + border-bottom: 0.18rem solid var(--clr-title-border); + padding-bottom: 0.3em; + 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(--sz-h2); +} + +h3, .h3 { + font-size: var(--sz-h3); +} + +h2:has(+ *[class]), .h2:has(+ *[class]), +h3:has(+ *[class]), .h3:has(+ *[class]) { + margin-bottom: 0.5em; +} + +hr { + border: 0.05rem solid var(--clr-title-border); +} + +strong { + color: var(--clr-bold-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:not([class]):focus { + outline: 0.15rem solid var(--clr-link); +} + +a:focus img { + outline: 0.2em solid var(--clr-body-txt); +} + +:not(.c-blockquote) > blockquote, +.c-blockquote { + padding: 1em 1.4em 1.4em; + border-inline-start: 0.1em solid var(--clr-main-heading); + background-color: var(--clr-quote-bg); + margin-bottom: 1em; +} + +blockquote > * + :not([class]), +* + blockquote, +* + .c-blockquote, +.c-blockquote__attribution { + margin-top: var(--sz-paragraph-margin); +} + +button:hover { + cursor: pointer; +} + +button:focus, +details:focus { + outline-offset: 0.2em; +} + +figure { + margin-bottom: var(--sz-paragraph-margin); + display: grid; + place-content: center; + justify-items: center; +} + +figcaption { + text-align: center; + font-size: 0.9em; + margin-top: 0.2em; +} + +:not(pre) > code { + color: var(--clr-bold-txt); + padding: 0 0.15em; +} + +pre { + border: 0.07em solid var(--clr-code-border); + background: var(--clr-code-bg); + max-width: 90vw; + overflow: auto; + padding: 1rem; +} + +pre > code { + white-space: pre; +} + +summary { + cursor: pointer; +} + +dl { + display: grid; + gap: 1em; + grid-template-columns: auto auto; +} + +dt { + font-weight: bold; +} + +dd { + grid-column-start: 2; +} diff --git a/_site/assets/css/global.css b/_site/assets/css/global.css new file mode 100644 index 00000000..bc202bfc --- /dev/null +++ b/_site/assets/css/global.css @@ -0,0 +1,120 @@ +/* ------------------- */ +/* Custom Properties */ +/* ------------------- */ +:root { + --clr-body-bg: #08031A; + --clr-body-txt: #fceaff; + --clr-content-bg: #3d2163; + + --clr-top-btn-bg: #FFD05A; + --clr-top-btn-txt: #08031A; + + --clr-main-heading: #ED64F5; + --clr-sub-heading: #e8b86f; + --clr-title-border: #d3aad5; + --clr-bold-txt: #ff9933; + --clr-link: #ED64F5; + --clr-link-hover: #c355c9; + --clr-quote-bg: #13092D; + --clr-quote-border: #999999; + + --clr-code-bg: #241445; + --clr-code-border: #82668f; + --clr-dates: rgb(121, 184, 255); + + --clr-link-btn-bg: #873eb5; + --clr-link-btn-txt: white; + --clr-link-btn-hover: #241445; + + --clr-hero-bg: black; + --clr-navbar-bg: #222; + --clr-navbar-link: white; + + --clr-main-footer-bg: #13092D; + + --clr-mod-entry-bg: #241445; + + --ff-primary: 'Noto Sans'; + + --sz-h1: clamp(2rem, 1rem + 5vw, 3rem); + --sz-h2: clamp(1.55rem, 1rem + 3vw, 2.15rem); + --sz-h3: clamp(1.55rem, 1rem + 3vw, 1.8rem); + --sz-paragraph-margin: 1.15em; + --sz-main-padding: clamp(1rem, 5%, 4rem); +} + +/* ------------------- */ +/* CSS Reset */ +/* ------------------- */ + +/* Box sizing rules */ +*, +*::before, +*::after { + box-sizing: border-box; +} + +/* Prevent font size inflation */ +html { + -moz-text-size-adjust: none; + -webkit-text-size-adjust: none; + text-size-adjust: none; +} + +/* Remove default margin in favour of better control in authored CSS */ +body, h1, h2, h3, h4, p, +figure, blockquote, dl, dd { + margin: 0; +} + +/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */ +ul[role='list'], +ol[role='list'] { + list-style: none; +} + +/* Set core body defaults */ +body { + min-height: 100vh; + line-height: 1.5; +} + +/* Set shorter line heights on headings and interactive elements */ +h1, h2, h3, h4, +button, input, label { + line-height: 1.1; +} + +/* Balance text wrapping on headings */ +h1, h2, +h3, h4 { + text-wrap: balance; +} + +/* A elements that don't have a class get default styles */ +a:not([class]) { + text-decoration-skip-ink: auto; +} + +/* Make images easier to work with */ +img, +picture { + max-width: 100%; + display: block; +} + +/* Inherit fonts for inputs and buttons */ +input, button, +textarea, select { + font: inherit; +} + +/* Make sure textareas without a rows attribute are not tiny */ +textarea:not([rows]) { + min-height: 10em; +} + +/* Anything that has been anchored to should have extra scroll margin */ +:target { + scroll-margin-block: 5ex; +} diff --git a/_site/assets/css/main.css b/_site/assets/css/main.css index a7ab3614..bc202bfc 100644 --- a/_site/assets/css/main.css +++ b/_site/assets/css/main.css @@ -118,450 +118,3 @@ textarea:not([rows]) { :target { scroll-margin-block: 5ex; } - -/* ------------------- */ -/* STYLING BEGINS */ -/* ------------------- */ - -/* General Styles */ -html { - scroll-behavior: smooth; -} - -body { - display: flex; - align-items: center; - flex-direction: column; - font-family: var(--ff-primary), Arial, Helvetica, sans-serif; - color: var(--clr-body-txt); - background-color: var(--clr-body-bg); -} - -h1 { - color: var(--clr-main-heading); - font-size: var(--sz-h1); - border-bottom: 0.18rem solid var(--clr-title-border); - padding-bottom: 0.3em; - 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(--sz-h2); -} - -h3, .h3 { - font-size: var(--sz-h3); -} - -h2:has(+ *[class]), .h2:has(+ *[class]), -h3:has(+ *[class]), .h3:has(+ *[class]) { - margin-bottom: 0.5em; -} - -hr { - border: 0.05rem solid var(--clr-title-border); -} - -strong { - color: var(--clr-bold-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:not([class]):focus { - outline: 0.15rem solid var(--clr-link); -} - -a:focus img { - outline: 0.2em solid var(--clr-body-txt); -} - -:not(.c-blockquote) > blockquote, -.c-blockquote { - padding: 1em 1.4em 1.4em; - border-inline-start: 0.1em solid var(--clr-main-heading); - background-color: var(--clr-quote-bg); - margin-bottom: 1em; -} - -blockquote > * + :not([class]), -* + blockquote, -* + .c-blockquote, -.c-blockquote__attribution { - margin-top: var(--sz-paragraph-margin); -} - -button:hover { - cursor: pointer; -} - -button:focus, -details:focus { - outline-offset: 0.2em; -} - -figure { - margin-bottom: var(--sz-paragraph-margin); - display: grid; - place-content: center; - justify-items: center; -} - -figcaption { - text-align: center; - font-size: 0.9em; - margin-top: 0.2em; -} - -:not(pre) > code { - color: var(--clr-bold-txt); - padding: 0 0.15em; -} - -pre { - border: 0.07em solid var(--clr-code-border); - background: var(--clr-code-bg); - max-width: 90vw; - overflow: auto; - padding: 1rem; -} - -pre > code { - white-space: pre; -} - -summary { - cursor: pointer; -} - -dl { - display: grid; - gap: 1em; - grid-template-columns: auto auto; -} - -dt { - font-weight: bold; -} - -dd { - grid-column-start: 2; -} - -/* MAIN CONTENT */ -main, -.content__wrapper, -.content--divided { - display: grid; -} - -main, -.content__wrapper { - font-size: 1.2rem; -} - -main { - width: 100%; -} - -.content__wrapper, -.content--divided { - gap: 1rem; -} - -.content__wrapper { - justify-self: center; -} - -.article, -.content:not(.content--divided), -.content__section { - padding: 1.5rem var(--sz-main-padding); -} - -.main__header { - padding: 2.5rem var(--sz-main-padding); - text-align: center; - display: grid; -} - -.article, -.content:not(.content--divided), -.content__section { - background-color: var(--clr-content-bg); -} - -.article__info { - text-align: center; - display: grid; - gap: 0.2em; -} - -.content > * + .h2, -.content__section > * + .h2, -.article > * + .h2 { - margin-top: 2em; -} - -.content > * + :not([class]), -.content__section > * + :not([class]), -.article > * + :not([class]) { - margin-top: var(--sz-paragraph-margin); -} - -.sidebar--sticky { - position: sticky; - top: 4rem; -} - -/* Desktop main content layout */ -@media only screen and (min-width: 60rem) { - .content__wrapper { - padding: 0 var(--sz-main-padding); - grid-template-areas: 'leftbar article rightbar'; - grid-template-columns: minmax(0, 20%) minmax(0, 2.5fr) minmax(0, 20%); - } - - .article, - .content { - grid-area: article; - } - - .left-sidebar { - grid-area: leftbar; - } - - .right-sidebar { - grid-area: rightbar; - } -} - -/* HEADING WRAPPER AND ANCHOR */ -.heading-wrapper { - display: flex; - gap: 0.3em; - margin-top: 1.5rem; - align-items: baseline; -} - -.heading-anchor { - line-height: 1; - opacity: 0.8; - order: -1; - text-decoration: none; -} - -.heading-anchor:hover { - text-decoration: underline; - text-underline-offset: 0.1em; - opacity: 1; -} - -.heading-anchor:focus { - outline: 2px solid currentColor; - outline-offset: 0.15em; -} - -.heading-anchor [hidden] { - display: block; -} - -:not(.heading-wrapper) + .heading-wrapper { - margin-top: 1.7em; -} - -/* BLOCKQUOTES With CITATIONS */ -.c-blockquote__attribution { - text-align: left; -} - -.c-blockquote__attribution::before { - content: "—"; - margin-right: 0.3em; -} - -/* FOOTNOTES */ -.footnote-ref { - margin-left: 0.2em; -} - -.footnotes { - margin-top: 3em; - border-top: 0.15em solid var(--clr-title-border); -} - -.footnotes__title, -.footnotes__title + .heading-anchor { - font-size: var(--sz-h3); -} - -.footnotes-list { - display: grid; - gap: 0.3em; -} - -.footnotes-list :target { - background-color: var(--clr-quote-bg); - outline: 0.1em dashed var(--clr-title-border); -} - -/* SPECIAL ELEMENTS */ -.text-box { - background: var(--clr-quote-bg); - border: 0.1em solid var(--clr-main-heading); - padding: 0.8em; - margin: 0.5em 0; - display: grid; - gap: 1em; -} - -.mod-entry, -.mod-entry__downloads { - display: grid; - align-items: center; -} - -.mod-entry { - gap: 1em; - background: var(--clr-mod-entry-bg); - margin: 1em 0; - padding: 1em; -} - -.mod-entry__downloads { - gap: 0.5em; -} - -/* Tablet screen size */ -@media only screen and (min-width: 37.5rem) { - .mod-entry__downloads { - grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); - } -} - -/* Link button */ -.link-btn { - font-size: 1.3rem; - text-align: center; - display: inline-block; - border: 0.15em solid var(--clr-link-btn-bg); - border-radius: 0.6em; - padding: 0.5em 1em; - background: var(--clr-link-btn-bg); - color: var(--clr-link-btn-txt); - cursor: pointer; - font-weight: 700; - text-transform: uppercase; -} - -.link-btn, -.link-btn:hover, -.link-btn:visited { - text-decoration: none; -} - -.link-btn:hover { - cursor: pointer; - background: var(--clr-link-btn-hover); - transition: 0.5s; -} - -.link-btn:focus { - outline: 0.15em solid var(--clr-link-btn-txt); - outline-offset: -0.25em; -} - -/* Spoiler Accordion */ -* + .spoiler-accordion { - margin-top: var(--sz-paragraph-margin); -} - -.spoiler-accordion { - padding: 0.5em 0; -} - -.spoiler-accordion__hint { - font-weight: 700; -} - -.spoiler-accordion__spoiler { - padding: 0.5em 1em; -} - -.spoiler-accordion__spoiler p + p { - margin-top: 1em; -} - -/* Web button lists */ -.web-btn-wrapper { - display: flex; - flex-wrap: wrap; - gap: 0.5rem; -} - -/* UTILITY CLASSES */ -.bold-text { - font-weight: 700; -} - -.center-el { - display: grid; - place-content: center; -} - -.center-text { - text-align: center; -} - -.indent-text { - padding: 1em 0 1em 2em; - display: grid; - gap: 1em; -} - -.date-style { - font-weight: 700; - color: var(--clr-dates); -} - -.hidden { - display: none; -} - -.item-list { - display: grid; - gap: 0.7em; -} - -.visually-hidden { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - clip: rect(0,0,0,0); - white-space: nowrap; - border: 0; - outline: 0; - outline-offset: 0; -} diff --git a/_site/assets/css/plugins.css b/_site/assets/css/plugins.css new file mode 100644 index 00000000..50a9a661 --- /dev/null +++ b/_site/assets/css/plugins.css @@ -0,0 +1,68 @@ +/* HEADING WRAPPER AND ANCHOR */ +.heading-wrapper { + display: flex; + gap: 0.3em; + margin-top: 1.5rem; + align-items: baseline; +} + +.heading-anchor { + line-height: 1; + opacity: 0.8; + order: -1; + text-decoration: none; +} + +.heading-anchor:hover { + text-decoration: underline; + text-underline-offset: 0.1em; + opacity: 1; +} + +.heading-anchor:focus { + outline: 2px solid currentColor; + outline-offset: 0.15em; +} + +.heading-anchor [hidden] { + display: block; +} + +:not(.heading-wrapper) + .heading-wrapper { + margin-top: 1.7em; +} + +/* BLOCKQUOTES With CITATIONS */ +.c-blockquote__attribution { + text-align: left; +} + +.c-blockquote__attribution::before { + content: "—"; + margin-right: 0.3em; +} + +/* FOOTNOTES */ +.footnote-ref { + margin-left: 0.2em; +} + +.footnotes { + margin-top: 3em; + border-top: 0.15em solid var(--clr-title-border); +} + +.footnotes__title, +.footnotes__title + .heading-anchor { + font-size: var(--sz-h3); +} + +.footnotes-list { + display: grid; + gap: 0.3em; +} + +.footnotes-list :target { + background-color: var(--clr-quote-bg); + outline: 0.1em dashed var(--clr-title-border); +} diff --git a/_site/assets/css/root.css b/_site/assets/css/root.css new file mode 100644 index 00000000..bc202bfc --- /dev/null +++ b/_site/assets/css/root.css @@ -0,0 +1,120 @@ +/* ------------------- */ +/* Custom Properties */ +/* ------------------- */ +:root { + --clr-body-bg: #08031A; + --clr-body-txt: #fceaff; + --clr-content-bg: #3d2163; + + --clr-top-btn-bg: #FFD05A; + --clr-top-btn-txt: #08031A; + + --clr-main-heading: #ED64F5; + --clr-sub-heading: #e8b86f; + --clr-title-border: #d3aad5; + --clr-bold-txt: #ff9933; + --clr-link: #ED64F5; + --clr-link-hover: #c355c9; + --clr-quote-bg: #13092D; + --clr-quote-border: #999999; + + --clr-code-bg: #241445; + --clr-code-border: #82668f; + --clr-dates: rgb(121, 184, 255); + + --clr-link-btn-bg: #873eb5; + --clr-link-btn-txt: white; + --clr-link-btn-hover: #241445; + + --clr-hero-bg: black; + --clr-navbar-bg: #222; + --clr-navbar-link: white; + + --clr-main-footer-bg: #13092D; + + --clr-mod-entry-bg: #241445; + + --ff-primary: 'Noto Sans'; + + --sz-h1: clamp(2rem, 1rem + 5vw, 3rem); + --sz-h2: clamp(1.55rem, 1rem + 3vw, 2.15rem); + --sz-h3: clamp(1.55rem, 1rem + 3vw, 1.8rem); + --sz-paragraph-margin: 1.15em; + --sz-main-padding: clamp(1rem, 5%, 4rem); +} + +/* ------------------- */ +/* CSS Reset */ +/* ------------------- */ + +/* Box sizing rules */ +*, +*::before, +*::after { + box-sizing: border-box; +} + +/* Prevent font size inflation */ +html { + -moz-text-size-adjust: none; + -webkit-text-size-adjust: none; + text-size-adjust: none; +} + +/* Remove default margin in favour of better control in authored CSS */ +body, h1, h2, h3, h4, p, +figure, blockquote, dl, dd { + margin: 0; +} + +/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */ +ul[role='list'], +ol[role='list'] { + list-style: none; +} + +/* Set core body defaults */ +body { + min-height: 100vh; + line-height: 1.5; +} + +/* Set shorter line heights on headings and interactive elements */ +h1, h2, h3, h4, +button, input, label { + line-height: 1.1; +} + +/* Balance text wrapping on headings */ +h1, h2, +h3, h4 { + text-wrap: balance; +} + +/* A elements that don't have a class get default styles */ +a:not([class]) { + text-decoration-skip-ink: auto; +} + +/* Make images easier to work with */ +img, +picture { + max-width: 100%; + display: block; +} + +/* Inherit fonts for inputs and buttons */ +input, button, +textarea, select { + font: inherit; +} + +/* Make sure textareas without a rows attribute are not tiny */ +textarea:not([rows]) { + min-height: 10em; +} + +/* Anything that has been anchored to should have extra scroll margin */ +:target { + scroll-margin-block: 5ex; +} diff --git a/_site/assets/css/utility.css b/_site/assets/css/utility.css new file mode 100644 index 00000000..44cca363 --- /dev/null +++ b/_site/assets/css/utility.css @@ -0,0 +1,47 @@ +/* UTILITY CLASSES */ +.bold-text { + font-weight: 700; +} + +.center-el { + display: grid; + place-content: center; +} + +.center-text { + text-align: center; +} + +.indent-text { + padding: 1em 0 1em 2em; + display: grid; + gap: 1em; +} + +.date-style { + font-weight: 700; + color: var(--clr-dates); +} + +.hidden { + display: none; +} + +.item-list { + display: grid; + gap: 0.7em; +} + +.visually-hidden { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0,0,0,0); + white-space: nowrap; + border: 0; + outline: 0; + outline-offset: 0; +} diff --git a/_site/blog/index.html b/_site/blog/index.html index 49aa0414..6da252d1 100644 --- a/_site/blog/index.html +++ b/_site/blog/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/page/2/index.html b/_site/blog/page/2/index.html index 9c7fda44..6e4b16b5 100644 --- a/_site/blog/page/2/index.html +++ b/_site/blog/page/2/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/page/3/index.html b/_site/blog/page/3/index.html index c40aee80..71d41e8b 100644 --- a/_site/blog/page/3/index.html +++ b/_site/blog/page/3/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-01-26-new-year-leilukins-hub-redesign/index.html b/_site/blog/posts/2023-01-26-new-year-leilukins-hub-redesign/index.html index c1dc81ab..a23b39de 100644 --- a/_site/blog/posts/2023-01-26-new-year-leilukins-hub-redesign/index.html +++ b/_site/blog/posts/2023-01-26-new-year-leilukins-hub-redesign/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-01-28-leilukins-hub-now-has-a-blog/index.html b/_site/blog/posts/2023-01-28-leilukins-hub-now-has-a-blog/index.html index 30e3e899..892966d1 100644 --- a/_site/blog/posts/2023-01-28-leilukins-hub-now-has-a-blog/index.html +++ b/_site/blog/posts/2023-01-28-leilukins-hub-now-has-a-blog/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-05-09-onboard-the-dracula-daily-hype-train/index.html b/_site/blog/posts/2023-05-09-onboard-the-dracula-daily-hype-train/index.html index d9ff5e24..46942038 100644 --- a/_site/blog/posts/2023-05-09-onboard-the-dracula-daily-hype-train/index.html +++ b/_site/blog/posts/2023-05-09-onboard-the-dracula-daily-hype-train/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-06-23-june-2023-leilukins-hub-layout-rewrite/index.html b/_site/blog/posts/2023-06-23-june-2023-leilukins-hub-layout-rewrite/index.html index 9f6b3fdb..746d3379 100644 --- a/_site/blog/posts/2023-06-23-june-2023-leilukins-hub-layout-rewrite/index.html +++ b/_site/blog/posts/2023-06-23-june-2023-leilukins-hub-layout-rewrite/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-07-28-my-first-birthday-after-the-launch-of-leilukins-hub/index.html b/_site/blog/posts/2023-07-28-my-first-birthday-after-the-launch-of-leilukins-hub/index.html index e07278eb..58bdab69 100644 --- a/_site/blog/posts/2023-07-28-my-first-birthday-after-the-launch-of-leilukins-hub/index.html +++ b/_site/blog/posts/2023-07-28-my-first-birthday-after-the-launch-of-leilukins-hub/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-09-11-happy-1st-anniversary-to-leilukins-hub/index.html b/_site/blog/posts/2023-09-11-happy-1st-anniversary-to-leilukins-hub/index.html index d7c23a34..0e41dece 100644 --- a/_site/blog/posts/2023-09-11-happy-1st-anniversary-to-leilukins-hub/index.html +++ b/_site/blog/posts/2023-09-11-happy-1st-anniversary-to-leilukins-hub/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-10-13-my-cassette-beasts-pombomb-plushie-arrived/index.html b/_site/blog/posts/2023-10-13-my-cassette-beasts-pombomb-plushie-arrived/index.html index 3f1b0b49..c2f9a2f1 100644 --- a/_site/blog/posts/2023-10-13-my-cassette-beasts-pombomb-plushie-arrived/index.html +++ b/_site/blog/posts/2023-10-13-my-cassette-beasts-pombomb-plushie-arrived/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-10-30-support-for-my-steam-review-of-a-summers-end/index.html b/_site/blog/posts/2023-10-30-support-for-my-steam-review-of-a-summers-end/index.html index da7a5aa2..69df2215 100644 --- a/_site/blog/posts/2023-10-30-support-for-my-steam-review-of-a-summers-end/index.html +++ b/_site/blog/posts/2023-10-30-support-for-my-steam-review-of-a-summers-end/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-11-19-i-can-finally-game-on-a-solid-state-drive/index.html b/_site/blog/posts/2023-11-19-i-can-finally-game-on-a-solid-state-drive/index.html index 8c287d86..2cdc3d1b 100644 --- a/_site/blog/posts/2023-11-19-i-can-finally-game-on-a-solid-state-drive/index.html +++ b/_site/blog/posts/2023-11-19-i-can-finally-game-on-a-solid-state-drive/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2023-11-20-finally-beat-a-bugs-life-video-game-24-years-later/index.html b/_site/blog/posts/2023-11-20-finally-beat-a-bugs-life-video-game-24-years-later/index.html index 22591ce8..0bff12b9 100644 --- a/_site/blog/posts/2023-11-20-finally-beat-a-bugs-life-video-game-24-years-later/index.html +++ b/_site/blog/posts/2023-11-20-finally-beat-a-bugs-life-video-game-24-years-later/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2024-03-06-i-received-a-lifetime-premium-membership-on-nexus-mods-for-free/index.html b/_site/blog/posts/2024-03-06-i-received-a-lifetime-premium-membership-on-nexus-mods-for-free/index.html index 84a92b34..a7d88562 100644 --- a/_site/blog/posts/2024-03-06-i-received-a-lifetime-premium-membership-on-nexus-mods-for-free/index.html +++ b/_site/blog/posts/2024-03-06-i-received-a-lifetime-premium-membership-on-nexus-mods-for-free/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2024-04-21-april-2024-leilukins-hub-overhaul-with-eleventy/index.html b/_site/blog/posts/2024-04-21-april-2024-leilukins-hub-overhaul-with-eleventy/index.html index a0f605e1..78573d47 100644 --- a/_site/blog/posts/2024-04-21-april-2024-leilukins-hub-overhaul-with-eleventy/index.html +++ b/_site/blog/posts/2024-04-21-april-2024-leilukins-hub-overhaul-with-eleventy/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2024-04-27-lesbian-visibility-day1-year-anniversary-of-cassette-beasts/index.html b/_site/blog/posts/2024-04-27-lesbian-visibility-day1-year-anniversary-of-cassette-beasts/index.html index 6b292da3..c6fa97d7 100644 --- a/_site/blog/posts/2024-04-27-lesbian-visibility-day1-year-anniversary-of-cassette-beasts/index.html +++ b/_site/blog/posts/2024-04-27-lesbian-visibility-day1-year-anniversary-of-cassette-beasts/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/2024-05-14-james-somerton-my-vide-game-footage/index.html b/_site/blog/posts/2024-05-14-james-somerton-my-vide-game-footage/index.html index 6d175d33..a3cb1538 100644 --- a/_site/blog/posts/2024-05-14-james-somerton-my-vide-game-footage/index.html +++ b/_site/blog/posts/2024-05-14-james-somerton-my-vide-game-footage/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/blog/posts/index.html b/_site/blog/posts/index.html index 3ae9c177..889a455a 100644 --- a/_site/blog/posts/index.html +++ b/_site/blog/posts/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/a-summers-end/index.html b/_site/categories/a-summers-end/index.html index 25d88a2b..75c77290 100644 --- a/_site/categories/a-summers-end/index.html +++ b/_site/categories/a-summers-end/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/anti-harry-potter/index.html b/_site/categories/anti-harry-potter/index.html index 901ab3cd..920179eb 100644 --- a/_site/categories/anti-harry-potter/index.html +++ b/_site/categories/anti-harry-potter/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/anti-jk-rowling/index.html b/_site/categories/anti-jk-rowling/index.html index 087c1cb1..648800e4 100644 --- a/_site/categories/anti-jk-rowling/index.html +++ b/_site/categories/anti-jk-rowling/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/cassette-beasts/index.html b/_site/categories/cassette-beasts/index.html index ecb792d1..b1882cbf 100644 --- a/_site/categories/cassette-beasts/index.html +++ b/_site/categories/cassette-beasts/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/dracula-daily/index.html b/_site/categories/dracula-daily/index.html index 49bff6d9..f63d487e 100644 --- a/_site/categories/dracula-daily/index.html +++ b/_site/categories/dracula-daily/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/fandom-culture/index.html b/_site/categories/fandom-culture/index.html index 07278a35..7fe4cf80 100644 --- a/_site/categories/fandom-culture/index.html +++ b/_site/categories/fandom-culture/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/index.html b/_site/categories/index.html index 834f4869..208f225d 100644 --- a/_site/categories/index.html +++ b/_site/categories/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/lesbian/index.html b/_site/categories/lesbian/index.html index 1db69495..97e4edc2 100644 --- a/_site/categories/lesbian/index.html +++ b/_site/categories/lesbian/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/life-updates/index.html b/_site/categories/life-updates/index.html index 5f836d5e..22a6a6b4 100644 --- a/_site/categories/life-updates/index.html +++ b/_site/categories/life-updates/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/modding/index.html b/_site/categories/modding/index.html index 1c50222e..b35c726f 100644 --- a/_site/categories/modding/index.html +++ b/_site/categories/modding/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/my-birthday/index.html b/_site/categories/my-birthday/index.html index 03b16b5e..c4559f08 100644 --- a/_site/categories/my-birthday/index.html +++ b/_site/categories/my-birthday/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/my-interviews/index.html b/_site/categories/my-interviews/index.html index b70ed805..4b9c5915 100644 --- a/_site/categories/my-interviews/index.html +++ b/_site/categories/my-interviews/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/site-anniversary/index.html b/_site/categories/site-anniversary/index.html index eb964dda..a3d86463 100644 --- a/_site/categories/site-anniversary/index.html +++ b/_site/categories/site-anniversary/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/site-updates/index.html b/_site/categories/site-updates/index.html index 52c63add..aa3d85fb 100644 --- a/_site/categories/site-updates/index.html +++ b/_site/categories/site-updates/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/star-wars-kotor-2/index.html b/_site/categories/star-wars-kotor-2/index.html index 5d0d4172..b8effaad 100644 --- a/_site/categories/star-wars-kotor-2/index.html +++ b/_site/categories/star-wars-kotor-2/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/star-wars-kotor/index.html b/_site/categories/star-wars-kotor/index.html index 1456ed1e..8b29b24f 100644 --- a/_site/categories/star-wars-kotor/index.html +++ b/_site/categories/star-wars-kotor/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/categories/youtube/index.html b/_site/categories/youtube/index.html index 68920276..3f1a635f 100644 --- a/_site/categories/youtube/index.html +++ b/_site/categories/youtube/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/changelogs/2022/index.html b/_site/changelogs/2022/index.html index e39f7da6..69f93203 100644 --- a/_site/changelogs/2022/index.html +++ b/_site/changelogs/2022/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/changelogs/2023/index.html b/_site/changelogs/2023/index.html index b3113e56..9a04f8fe 100644 --- a/_site/changelogs/2023/index.html +++ b/_site/changelogs/2023/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/changelogs/2024/index.html b/_site/changelogs/2024/index.html index 7d4eb1c1..43c889d8 100644 --- a/_site/changelogs/2024/index.html +++ b/_site/changelogs/2024/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/changelogs/index.html b/_site/changelogs/index.html index 2a2387e5..3578167e 100644 --- a/_site/changelogs/index.html +++ b/_site/changelogs/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/changelogs/layouts/index.html b/_site/changelogs/layouts/index.html index b3fea976..2b233465 100644 --- a/_site/changelogs/layouts/index.html +++ b/_site/changelogs/layouts/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/changelogs/page/2/index.html b/_site/changelogs/page/2/index.html index 945874e0..96ff1740 100644 --- a/_site/changelogs/page/2/index.html +++ b/_site/changelogs/page/2/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/changelogs/page/3/index.html b/_site/changelogs/page/3/index.html index e900b7cf..d1d59d14 100644 --- a/_site/changelogs/page/3/index.html +++ b/_site/changelogs/page/3/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/changelogs/page/4/index.html b/_site/changelogs/page/4/index.html index 73c70b5b..72efb5c2 100644 --- a/_site/changelogs/page/4/index.html +++ b/_site/changelogs/page/4/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/changelogs/page/5/index.html b/_site/changelogs/page/5/index.html index 5cf1504e..1fe1d559 100644 --- a/_site/changelogs/page/5/index.html +++ b/_site/changelogs/page/5/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/feed.xml b/_site/feed.xml index 2aa346ca..c8262f59 100644 --- a/_site/feed.xml +++ b/_site/feed.xml @@ -4,7 +4,7 @@ Leilukin's personal website. - 2024-05-17T18:34:44Z + 2024-05-17T18:47:25Z https://leilukin.neocities.org Leilukin diff --git a/_site/guestbook/index.html b/_site/guestbook/index.html index 5e2e6cc7..74253df3 100644 --- a/_site/guestbook/index.html +++ b/_site/guestbook/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/index.html b/_site/index.html index 47a7b8d0..ba2a2a15 100644 --- a/_site/index.html +++ b/_site/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/links/index.html b/_site/links/index.html index 9bcae87e..9b2c8df9 100644 --- a/_site/links/index.html +++ b/_site/links/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/now/index.html b/_site/now/index.html index 1e1bb404..76a27463 100644 --- a/_site/now/index.html +++ b/_site/now/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/projects/index.html b/_site/projects/index.html index 67b67c11..c7b3c080 100644 --- a/_site/projects/index.html +++ b/_site/projects/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/projects/kotor1mods/index.html b/_site/projects/kotor1mods/index.html index 4d8d6ee1..d415b258 100644 --- a/_site/projects/kotor1mods/index.html +++ b/_site/projects/kotor1mods/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/projects/kotor2mods/index.html b/_site/projects/kotor2mods/index.html index 6e7db5b2..313d9dcd 100644 --- a/_site/projects/kotor2mods/index.html +++ b/_site/projects/kotor2mods/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/projects/playlists/index.html b/_site/projects/playlists/index.html index b5ae2583..9220d74a 100644 --- a/_site/projects/playlists/index.html +++ b/_site/projects/playlists/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/shrines/asummersend/gallery/index.html b/_site/shrines/asummersend/gallery/index.html index ec50ebc2..d5688274 100644 --- a/_site/shrines/asummersend/gallery/index.html +++ b/_site/shrines/asummersend/gallery/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/asummersend/index.html b/_site/shrines/asummersend/index.html index 2637082e..bd15c472 100644 --- a/_site/shrines/asummersend/index.html +++ b/_site/shrines/asummersend/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/asummersend/playlists/index.html b/_site/shrines/asummersend/playlists/index.html index b60e4548..c546d50e 100644 --- a/_site/shrines/asummersend/playlists/index.html +++ b/_site/shrines/asummersend/playlists/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/asummersend/trivia/index.html b/_site/shrines/asummersend/trivia/index.html index c28fcc48..09ecef0d 100644 --- a/_site/shrines/asummersend/trivia/index.html +++ b/_site/shrines/asummersend/trivia/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/cassettebeasts/articles/cassette-beasts-more-than-a-pokemon-clone/index.html b/_site/shrines/cassettebeasts/articles/cassette-beasts-more-than-a-pokemon-clone/index.html index 2beb301c..b43fb0ea 100644 --- a/_site/shrines/cassettebeasts/articles/cassette-beasts-more-than-a-pokemon-clone/index.html +++ b/_site/shrines/cassettebeasts/articles/cassette-beasts-more-than-a-pokemon-clone/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/cassettebeasts/articles/index.html b/_site/shrines/cassettebeasts/articles/index.html index d601442d..10434721 100644 --- a/_site/shrines/cassettebeasts/articles/index.html +++ b/_site/shrines/cassettebeasts/articles/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/cassettebeasts/facts/index.html b/_site/shrines/cassettebeasts/facts/index.html index a76ec8bc..e0798db0 100644 --- a/_site/shrines/cassettebeasts/facts/index.html +++ b/_site/shrines/cassettebeasts/facts/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/cassettebeasts/featured/index.html b/_site/shrines/cassettebeasts/featured/index.html index 7c9308bd..46e85f14 100644 --- a/_site/shrines/cassettebeasts/featured/index.html +++ b/_site/shrines/cassettebeasts/featured/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/cassettebeasts/gamelog/index.html b/_site/shrines/cassettebeasts/gamelog/index.html index cffaf956..285f98fd 100644 --- a/_site/shrines/cassettebeasts/gamelog/index.html +++ b/_site/shrines/cassettebeasts/gamelog/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/cassettebeasts/index.html b/_site/shrines/cassettebeasts/index.html index 5b942b6d..4af2a850 100644 --- a/_site/shrines/cassettebeasts/index.html +++ b/_site/shrines/cassettebeasts/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/cassettebeasts/resources/index.html b/_site/shrines/cassettebeasts/resources/index.html index f6b6463e..42ecccda 100644 --- a/_site/shrines/cassettebeasts/resources/index.html +++ b/_site/shrines/cassettebeasts/resources/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/index.html b/_site/shrines/index.html index e7cd6cfa..8e011375 100644 --- a/_site/shrines/index.html +++ b/_site/shrines/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/_site/shrines/starwarskotor/articles/arren-kae-kreia-theory/index.html b/_site/shrines/starwarskotor/articles/arren-kae-kreia-theory/index.html index 6156dcee..0000f781 100644 --- a/_site/shrines/starwarskotor/articles/arren-kae-kreia-theory/index.html +++ b/_site/shrines/starwarskotor/articles/arren-kae-kreia-theory/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/articles/faq-same-gender-romance-mods/index.html b/_site/shrines/starwarskotor/articles/faq-same-gender-romance-mods/index.html index e6285fd5..a98756cc 100644 --- a/_site/shrines/starwarskotor/articles/faq-same-gender-romance-mods/index.html +++ b/_site/shrines/starwarskotor/articles/faq-same-gender-romance-mods/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/articles/handmaiden-sisters-mother/index.html b/_site/shrines/starwarskotor/articles/handmaiden-sisters-mother/index.html index d96da9a9..ff88f421 100644 --- a/_site/shrines/starwarskotor/articles/handmaiden-sisters-mother/index.html +++ b/_site/shrines/starwarskotor/articles/handmaiden-sisters-mother/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/articles/index.html b/_site/shrines/starwarskotor/articles/index.html index 65d47162..25d47aae 100644 --- a/_site/shrines/starwarskotor/articles/index.html +++ b/_site/shrines/starwarskotor/articles/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/articles/juhani-hostility-towards-canderous/index.html b/_site/shrines/starwarskotor/articles/juhani-hostility-towards-canderous/index.html index 5ab06b17..a1af9b31 100644 --- a/_site/shrines/starwarskotor/articles/juhani-hostility-towards-canderous/index.html +++ b/_site/shrines/starwarskotor/articles/juhani-hostility-towards-canderous/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/articles/juhani-lesbian-evidence/index.html b/_site/shrines/starwarskotor/articles/juhani-lesbian-evidence/index.html index 6aa0102b..c851b10a 100644 --- a/_site/shrines/starwarskotor/articles/juhani-lesbian-evidence/index.html +++ b/_site/shrines/starwarskotor/articles/juhani-lesbian-evidence/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/articles/keep-juhani-a-lesbian/index.html b/_site/shrines/starwarskotor/articles/keep-juhani-a-lesbian/index.html index b91b8d53..bd7fef95 100644 --- a/_site/shrines/starwarskotor/articles/keep-juhani-a-lesbian/index.html +++ b/_site/shrines/starwarskotor/articles/keep-juhani-a-lesbian/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/articles/partyswap-management-takeover/index.html b/_site/shrines/starwarskotor/articles/partyswap-management-takeover/index.html index f3daa43c..aab152ac 100644 --- a/_site/shrines/starwarskotor/articles/partyswap-management-takeover/index.html +++ b/_site/shrines/starwarskotor/articles/partyswap-management-takeover/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/articles/tslrcm-first-kotor2-playthrough/index.html b/_site/shrines/starwarskotor/articles/tslrcm-first-kotor2-playthrough/index.html index c0ad265f..bd07db50 100644 --- a/_site/shrines/starwarskotor/articles/tslrcm-first-kotor2-playthrough/index.html +++ b/_site/shrines/starwarskotor/articles/tslrcm-first-kotor2-playthrough/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/guides/index.html b/_site/shrines/starwarskotor/guides/index.html index c5691f96..6e4f3a61 100644 --- a/_site/shrines/starwarskotor/guides/index.html +++ b/_site/shrines/starwarskotor/guides/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/guides/kotor-juhani-romance-guide/index.html b/_site/shrines/starwarskotor/guides/kotor-juhani-romance-guide/index.html index 138004cd..332723a3 100644 --- a/_site/shrines/starwarskotor/guides/kotor-juhani-romance-guide/index.html +++ b/_site/shrines/starwarskotor/guides/kotor-juhani-romance-guide/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/guides/kotor-redeeming-bastila-guide/index.html b/_site/shrines/starwarskotor/guides/kotor-redeeming-bastila-guide/index.html index 5183ee98..e4ac7260 100644 --- a/_site/shrines/starwarskotor/guides/kotor-redeeming-bastila-guide/index.html +++ b/_site/shrines/starwarskotor/guides/kotor-redeeming-bastila-guide/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/guides/kotor-sandral-matale-feud-guide/index.html b/_site/shrines/starwarskotor/guides/kotor-sandral-matale-feud-guide/index.html index ade7741b..9742da51 100644 --- a/_site/shrines/starwarskotor/guides/kotor-sandral-matale-feud-guide/index.html +++ b/_site/shrines/starwarskotor/guides/kotor-sandral-matale-feud-guide/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/index.html b/_site/shrines/starwarskotor/index.html index 1e51128f..743c8f00 100644 --- a/_site/shrines/starwarskotor/index.html +++ b/_site/shrines/starwarskotor/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/resources/index.html b/_site/shrines/starwarskotor/resources/index.html index f18eacfd..848af720 100644 --- a/_site/shrines/starwarskotor/resources/index.html +++ b/_site/shrines/starwarskotor/resources/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/resources/kotor-same-gender-romance-mods/index.html b/_site/shrines/starwarskotor/resources/kotor-same-gender-romance-mods/index.html index 12432f53..8f6353c9 100644 --- a/_site/shrines/starwarskotor/resources/kotor-same-gender-romance-mods/index.html +++ b/_site/shrines/starwarskotor/resources/kotor-same-gender-romance-mods/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/resources/kotor2-female-exile-recruit-handmaiden-mods/index.html b/_site/shrines/starwarskotor/resources/kotor2-female-exile-recruit-handmaiden-mods/index.html index 62f2a587..fe6b4142 100644 --- a/_site/shrines/starwarskotor/resources/kotor2-female-exile-recruit-handmaiden-mods/index.html +++ b/_site/shrines/starwarskotor/resources/kotor2-female-exile-recruit-handmaiden-mods/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/resources/tslrcm-m478ep-modules-music/index.html b/_site/shrines/starwarskotor/resources/tslrcm-m478ep-modules-music/index.html index 1c52f7f8..8f436e33 100644 --- a/_site/shrines/starwarskotor/resources/tslrcm-m478ep-modules-music/index.html +++ b/_site/shrines/starwarskotor/resources/tslrcm-m478ep-modules-music/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/shrines/starwarskotor/universes/index.html b/_site/shrines/starwarskotor/universes/index.html index 69f47e8c..98e08354 100644 --- a/_site/shrines/starwarskotor/universes/index.html +++ b/_site/shrines/starwarskotor/universes/index.html @@ -26,11 +26,7 @@ - - - - - + diff --git a/_site/sitemap/index.html b/_site/sitemap/index.html index c61e63b7..014f6fdd 100644 --- a/_site/sitemap/index.html +++ b/_site/sitemap/index.html @@ -26,15 +26,9 @@ + - - - - - - - diff --git a/src/_includes/global/css-bundle.njk b/src/_includes/global/css-bundle.njk index c7b9d8e5..bd793b6d 100644 --- a/src/_includes/global/css-bundle.njk +++ b/src/_includes/global/css-bundle.njk @@ -1,5 +1,13 @@ -{% set cssFiles = ["main"]%} +{% set cssFiles = [ + "global", + "general", + "content", + "plugins", + "components", + "pridesymbols", + "utility" +] %} -{% for file in cssFiles %} +{%- for file in cssFiles -%} -{% endfor %} \ No newline at end of file +{%- endfor -%} \ No newline at end of file diff --git a/src/_includes/main/base.njk b/src/_includes/main/base.njk index 3da74dae..0a6100f9 100644 --- a/src/_includes/main/base.njk +++ b/src/_includes/main/base.njk @@ -1,9 +1,5 @@ {% extends "global/baselayout.njk" %} -{% block customCSS %} - -{% endblock %} - {% block hero %}{% include "main/hero.njk" %}{% endblock %} {% block navbar %}{% include "main/navbar.njk" %}{% endblock %} {% block footer %}{% include "main/footer.njk" %}{% endblock %} \ No newline at end of file diff --git a/src/assets/css/components.css b/src/assets/css/components.css new file mode 100644 index 00000000..774a939e --- /dev/null +++ b/src/assets/css/components.css @@ -0,0 +1,93 @@ +/* SPECIAL COMPONENTS */ +.text-box { + background: var(--clr-quote-bg); + border: 0.1em solid var(--clr-main-heading); + padding: 0.8em; + margin: 0.5em 0; + display: grid; + gap: 1em; +} + +.mod-entry, +.mod-entry__downloads { + display: grid; + align-items: center; +} + +.mod-entry { + gap: 1em; + background: var(--clr-mod-entry-bg); + margin: 1em 0; + padding: 1em; +} + +.mod-entry__downloads { + gap: 0.5em; +} + +/* Tablet screen size */ +@media only screen and (min-width: 37.5rem) { + .mod-entry__downloads { + grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); + } +} + +/* Link button */ +.link-btn { + font-size: 1.3rem; + text-align: center; + display: inline-block; + border: 0.15em solid var(--clr-link-btn-bg); + border-radius: 0.6em; + padding: 0.5em 1em; + background: var(--clr-link-btn-bg); + color: var(--clr-link-btn-txt); + cursor: pointer; + font-weight: 700; + text-transform: uppercase; +} + +.link-btn, +.link-btn:hover, +.link-btn:visited { + text-decoration: none; +} + +.link-btn:hover { + cursor: pointer; + background: var(--clr-link-btn-hover); + transition: 0.5s; +} + +.link-btn:focus { + outline: 0.15em solid var(--clr-link-btn-txt); + outline-offset: -0.25em; +} + +/* Spoiler Accordion */ +* + .spoiler-accordion { + margin-top: var(--sz-paragraph-margin); +} + +.spoiler-accordion { + padding: 0.5em 0; +} + +.spoiler-accordion__hint { + font-weight: 700; +} + +.spoiler-accordion__spoiler { + padding: 0.5em 1em; +} + +.spoiler-accordion__spoiler p + p { + margin-top: 1em; +} + +/* Web button lists */ +.web-btn-wrapper { + display: flex; + flex-wrap: wrap; + gap: 0.5rem; +} diff --git a/src/assets/css/content.css b/src/assets/css/content.css new file mode 100644 index 00000000..df52f2a8 --- /dev/null +++ b/src/assets/css/content.css @@ -0,0 +1,87 @@ +/* MAIN CONTENT */ +main, +.content__wrapper, +.content--divided { + display: grid; +} + +main, +.content__wrapper { + font-size: 1.2rem; +} + +main { + width: 100%; +} + +.content__wrapper, +.content--divided { + gap: 1rem; +} + +.content__wrapper { + justify-self: center; +} + +.article, +.content:not(.content--divided), +.content__section { + padding: 1.5rem var(--sz-main-padding); +} + +.main__header { + padding: 2.5rem var(--sz-main-padding); + text-align: center; + display: grid; +} + +.article, +.content:not(.content--divided), +.content__section { + background-color: var(--clr-content-bg); +} + +.article__info { + text-align: center; + display: grid; + gap: 0.2em; +} + +.content > * + .h2, +.content__section > * + .h2, +.article > * + .h2 { + margin-top: 2em; +} + +.content > * + :not([class]), +.content__section > * + :not([class]), +.article > * + :not([class]) { + margin-top: var(--sz-paragraph-margin); +} + +.sidebar--sticky { + position: sticky; + top: 4rem; +} + +/* Desktop main content layout */ +@media only screen and (min-width: 60rem) { + .content__wrapper { + padding: 0 var(--sz-main-padding); + grid-template-areas: 'leftbar article rightbar'; + grid-template-columns: minmax(0, 20%) minmax(0, 2.5fr) minmax(0, 20%); + } + + .article, + .content { + grid-area: article; + } + + .left-sidebar { + grid-area: leftbar; + } + + .right-sidebar { + grid-area: rightbar; + } +} diff --git a/src/assets/css/general.css b/src/assets/css/general.css new file mode 100644 index 00000000..2a6a17ec --- /dev/null +++ b/src/assets/css/general.css @@ -0,0 +1,143 @@ +/* GENERAL STYLES */ +html { + scroll-behavior: smooth; +} + +body { + display: flex; + align-items: center; + flex-direction: column; + font-family: var(--ff-primary), Arial, Helvetica, sans-serif; + color: var(--clr-body-txt); + background-color: var(--clr-body-bg); +} + +h1 { + color: var(--clr-main-heading); + font-size: var(--sz-h1); + border-bottom: 0.18rem solid var(--clr-title-border); + padding-bottom: 0.3em; + 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(--sz-h2); +} + +h3, .h3 { + font-size: var(--sz-h3); +} + +h2:has(+ *[class]), .h2:has(+ *[class]), +h3:has(+ *[class]), .h3:has(+ *[class]) { + margin-bottom: 0.5em; +} + +hr { + border: 0.05rem solid var(--clr-title-border); +} + +strong { + color: var(--clr-bold-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:not([class]):focus { + outline: 0.15rem solid var(--clr-link); +} + +a:focus img { + outline: 0.2em solid var(--clr-body-txt); +} + +:not(.c-blockquote) > blockquote, +.c-blockquote { + padding: 1em 1.4em 1.4em; + border-inline-start: 0.1em solid var(--clr-main-heading); + background-color: var(--clr-quote-bg); + margin-bottom: 1em; +} + +blockquote > * + :not([class]), +* + blockquote, +* + .c-blockquote, +.c-blockquote__attribution { + margin-top: var(--sz-paragraph-margin); +} + +button:hover { + cursor: pointer; +} + +button:focus, +details:focus { + outline-offset: 0.2em; +} + +figure { + margin-bottom: var(--sz-paragraph-margin); + display: grid; + place-content: center; + justify-items: center; +} + +figcaption { + text-align: center; + font-size: 0.9em; + margin-top: 0.2em; +} + +:not(pre) > code { + color: var(--clr-bold-txt); + padding: 0 0.15em; +} + +pre { + border: 0.07em solid var(--clr-code-border); + background: var(--clr-code-bg); + max-width: 90vw; + overflow: auto; + padding: 1rem; +} + +pre > code { + white-space: pre; +} + +summary { + cursor: pointer; +} + +dl { + display: grid; + gap: 1em; + grid-template-columns: auto auto; +} + +dt { + font-weight: bold; +} + +dd { + grid-column-start: 2; +} diff --git a/src/assets/css/global.css b/src/assets/css/global.css new file mode 100644 index 00000000..bc202bfc --- /dev/null +++ b/src/assets/css/global.css @@ -0,0 +1,120 @@ +/* ------------------- */ +/* Custom Properties */ +/* ------------------- */ +:root { + --clr-body-bg: #08031A; + --clr-body-txt: #fceaff; + --clr-content-bg: #3d2163; + + --clr-top-btn-bg: #FFD05A; + --clr-top-btn-txt: #08031A; + + --clr-main-heading: #ED64F5; + --clr-sub-heading: #e8b86f; + --clr-title-border: #d3aad5; + --clr-bold-txt: #ff9933; + --clr-link: #ED64F5; + --clr-link-hover: #c355c9; + --clr-quote-bg: #13092D; + --clr-quote-border: #999999; + + --clr-code-bg: #241445; + --clr-code-border: #82668f; + --clr-dates: rgb(121, 184, 255); + + --clr-link-btn-bg: #873eb5; + --clr-link-btn-txt: white; + --clr-link-btn-hover: #241445; + + --clr-hero-bg: black; + --clr-navbar-bg: #222; + --clr-navbar-link: white; + + --clr-main-footer-bg: #13092D; + + --clr-mod-entry-bg: #241445; + + --ff-primary: 'Noto Sans'; + + --sz-h1: clamp(2rem, 1rem + 5vw, 3rem); + --sz-h2: clamp(1.55rem, 1rem + 3vw, 2.15rem); + --sz-h3: clamp(1.55rem, 1rem + 3vw, 1.8rem); + --sz-paragraph-margin: 1.15em; + --sz-main-padding: clamp(1rem, 5%, 4rem); +} + +/* ------------------- */ +/* CSS Reset */ +/* ------------------- */ + +/* Box sizing rules */ +*, +*::before, +*::after { + box-sizing: border-box; +} + +/* Prevent font size inflation */ +html { + -moz-text-size-adjust: none; + -webkit-text-size-adjust: none; + text-size-adjust: none; +} + +/* Remove default margin in favour of better control in authored CSS */ +body, h1, h2, h3, h4, p, +figure, blockquote, dl, dd { + margin: 0; +} + +/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */ +ul[role='list'], +ol[role='list'] { + list-style: none; +} + +/* Set core body defaults */ +body { + min-height: 100vh; + line-height: 1.5; +} + +/* Set shorter line heights on headings and interactive elements */ +h1, h2, h3, h4, +button, input, label { + line-height: 1.1; +} + +/* Balance text wrapping on headings */ +h1, h2, +h3, h4 { + text-wrap: balance; +} + +/* A elements that don't have a class get default styles */ +a:not([class]) { + text-decoration-skip-ink: auto; +} + +/* Make images easier to work with */ +img, +picture { + max-width: 100%; + display: block; +} + +/* Inherit fonts for inputs and buttons */ +input, button, +textarea, select { + font: inherit; +} + +/* Make sure textareas without a rows attribute are not tiny */ +textarea:not([rows]) { + min-height: 10em; +} + +/* Anything that has been anchored to should have extra scroll margin */ +:target { + scroll-margin-block: 5ex; +} diff --git a/src/assets/css/main.css b/src/assets/css/main.css deleted file mode 100644 index a7ab3614..00000000 --- a/src/assets/css/main.css +++ /dev/null @@ -1,567 +0,0 @@ -/* ------------------- */ -/* Custom Properties */ -/* ------------------- */ -:root { - --clr-body-bg: #08031A; - --clr-body-txt: #fceaff; - --clr-content-bg: #3d2163; - - --clr-top-btn-bg: #FFD05A; - --clr-top-btn-txt: #08031A; - - --clr-main-heading: #ED64F5; - --clr-sub-heading: #e8b86f; - --clr-title-border: #d3aad5; - --clr-bold-txt: #ff9933; - --clr-link: #ED64F5; - --clr-link-hover: #c355c9; - --clr-quote-bg: #13092D; - --clr-quote-border: #999999; - - --clr-code-bg: #241445; - --clr-code-border: #82668f; - --clr-dates: rgb(121, 184, 255); - - --clr-link-btn-bg: #873eb5; - --clr-link-btn-txt: white; - --clr-link-btn-hover: #241445; - - --clr-hero-bg: black; - --clr-navbar-bg: #222; - --clr-navbar-link: white; - - --clr-main-footer-bg: #13092D; - - --clr-mod-entry-bg: #241445; - - --ff-primary: 'Noto Sans'; - - --sz-h1: clamp(2rem, 1rem + 5vw, 3rem); - --sz-h2: clamp(1.55rem, 1rem + 3vw, 2.15rem); - --sz-h3: clamp(1.55rem, 1rem + 3vw, 1.8rem); - --sz-paragraph-margin: 1.15em; - --sz-main-padding: clamp(1rem, 5%, 4rem); -} - -/* ------------------- */ -/* CSS Reset */ -/* ------------------- */ - -/* Box sizing rules */ -*, -*::before, -*::after { - box-sizing: border-box; -} - -/* Prevent font size inflation */ -html { - -moz-text-size-adjust: none; - -webkit-text-size-adjust: none; - text-size-adjust: none; -} - -/* Remove default margin in favour of better control in authored CSS */ -body, h1, h2, h3, h4, p, -figure, blockquote, dl, dd { - margin: 0; -} - -/* Remove list styles on ul, ol elements with a list role, which suggests default styling will be removed */ -ul[role='list'], -ol[role='list'] { - list-style: none; -} - -/* Set core body defaults */ -body { - min-height: 100vh; - line-height: 1.5; -} - -/* Set shorter line heights on headings and interactive elements */ -h1, h2, h3, h4, -button, input, label { - line-height: 1.1; -} - -/* Balance text wrapping on headings */ -h1, h2, -h3, h4 { - text-wrap: balance; -} - -/* A elements that don't have a class get default styles */ -a:not([class]) { - text-decoration-skip-ink: auto; -} - -/* Make images easier to work with */ -img, -picture { - max-width: 100%; - display: block; -} - -/* Inherit fonts for inputs and buttons */ -input, button, -textarea, select { - font: inherit; -} - -/* Make sure textareas without a rows attribute are not tiny */ -textarea:not([rows]) { - min-height: 10em; -} - -/* Anything that has been anchored to should have extra scroll margin */ -:target { - scroll-margin-block: 5ex; -} - -/* ------------------- */ -/* STYLING BEGINS */ -/* ------------------- */ - -/* General Styles */ -html { - scroll-behavior: smooth; -} - -body { - display: flex; - align-items: center; - flex-direction: column; - font-family: var(--ff-primary), Arial, Helvetica, sans-serif; - color: var(--clr-body-txt); - background-color: var(--clr-body-bg); -} - -h1 { - color: var(--clr-main-heading); - font-size: var(--sz-h1); - border-bottom: 0.18rem solid var(--clr-title-border); - padding-bottom: 0.3em; - 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(--sz-h2); -} - -h3, .h3 { - font-size: var(--sz-h3); -} - -h2:has(+ *[class]), .h2:has(+ *[class]), -h3:has(+ *[class]), .h3:has(+ *[class]) { - margin-bottom: 0.5em; -} - -hr { - border: 0.05rem solid var(--clr-title-border); -} - -strong { - color: var(--clr-bold-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:not([class]):focus { - outline: 0.15rem solid var(--clr-link); -} - -a:focus img { - outline: 0.2em solid var(--clr-body-txt); -} - -:not(.c-blockquote) > blockquote, -.c-blockquote { - padding: 1em 1.4em 1.4em; - border-inline-start: 0.1em solid var(--clr-main-heading); - background-color: var(--clr-quote-bg); - margin-bottom: 1em; -} - -blockquote > * + :not([class]), -* + blockquote, -* + .c-blockquote, -.c-blockquote__attribution { - margin-top: var(--sz-paragraph-margin); -} - -button:hover { - cursor: pointer; -} - -button:focus, -details:focus { - outline-offset: 0.2em; -} - -figure { - margin-bottom: var(--sz-paragraph-margin); - display: grid; - place-content: center; - justify-items: center; -} - -figcaption { - text-align: center; - font-size: 0.9em; - margin-top: 0.2em; -} - -:not(pre) > code { - color: var(--clr-bold-txt); - padding: 0 0.15em; -} - -pre { - border: 0.07em solid var(--clr-code-border); - background: var(--clr-code-bg); - max-width: 90vw; - overflow: auto; - padding: 1rem; -} - -pre > code { - white-space: pre; -} - -summary { - cursor: pointer; -} - -dl { - display: grid; - gap: 1em; - grid-template-columns: auto auto; -} - -dt { - font-weight: bold; -} - -dd { - grid-column-start: 2; -} - -/* MAIN CONTENT */ -main, -.content__wrapper, -.content--divided { - display: grid; -} - -main, -.content__wrapper { - font-size: 1.2rem; -} - -main { - width: 100%; -} - -.content__wrapper, -.content--divided { - gap: 1rem; -} - -.content__wrapper { - justify-self: center; -} - -.article, -.content:not(.content--divided), -.content__section { - padding: 1.5rem var(--sz-main-padding); -} - -.main__header { - padding: 2.5rem var(--sz-main-padding); - text-align: center; - display: grid; -} - -.article, -.content:not(.content--divided), -.content__section { - background-color: var(--clr-content-bg); -} - -.article__info { - text-align: center; - display: grid; - gap: 0.2em; -} - -.content > * + .h2, -.content__section > * + .h2, -.article > * + .h2 { - margin-top: 2em; -} - -.content > * + :not([class]), -.content__section > * + :not([class]), -.article > * + :not([class]) { - margin-top: var(--sz-paragraph-margin); -} - -.sidebar--sticky { - position: sticky; - top: 4rem; -} - -/* Desktop main content layout */ -@media only screen and (min-width: 60rem) { - .content__wrapper { - padding: 0 var(--sz-main-padding); - grid-template-areas: 'leftbar article rightbar'; - grid-template-columns: minmax(0, 20%) minmax(0, 2.5fr) minmax(0, 20%); - } - - .article, - .content { - grid-area: article; - } - - .left-sidebar { - grid-area: leftbar; - } - - .right-sidebar { - grid-area: rightbar; - } -} - -/* HEADING WRAPPER AND ANCHOR */ -.heading-wrapper { - display: flex; - gap: 0.3em; - margin-top: 1.5rem; - align-items: baseline; -} - -.heading-anchor { - line-height: 1; - opacity: 0.8; - order: -1; - text-decoration: none; -} - -.heading-anchor:hover { - text-decoration: underline; - text-underline-offset: 0.1em; - opacity: 1; -} - -.heading-anchor:focus { - outline: 2px solid currentColor; - outline-offset: 0.15em; -} - -.heading-anchor [hidden] { - display: block; -} - -:not(.heading-wrapper) + .heading-wrapper { - margin-top: 1.7em; -} - -/* BLOCKQUOTES With CITATIONS */ -.c-blockquote__attribution { - text-align: left; -} - -.c-blockquote__attribution::before { - content: "—"; - margin-right: 0.3em; -} - -/* FOOTNOTES */ -.footnote-ref { - margin-left: 0.2em; -} - -.footnotes { - margin-top: 3em; - border-top: 0.15em solid var(--clr-title-border); -} - -.footnotes__title, -.footnotes__title + .heading-anchor { - font-size: var(--sz-h3); -} - -.footnotes-list { - display: grid; - gap: 0.3em; -} - -.footnotes-list :target { - background-color: var(--clr-quote-bg); - outline: 0.1em dashed var(--clr-title-border); -} - -/* SPECIAL ELEMENTS */ -.text-box { - background: var(--clr-quote-bg); - border: 0.1em solid var(--clr-main-heading); - padding: 0.8em; - margin: 0.5em 0; - display: grid; - gap: 1em; -} - -.mod-entry, -.mod-entry__downloads { - display: grid; - align-items: center; -} - -.mod-entry { - gap: 1em; - background: var(--clr-mod-entry-bg); - margin: 1em 0; - padding: 1em; -} - -.mod-entry__downloads { - gap: 0.5em; -} - -/* Tablet screen size */ -@media only screen and (min-width: 37.5rem) { - .mod-entry__downloads { - grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); - } -} - -/* Link button */ -.link-btn { - font-size: 1.3rem; - text-align: center; - display: inline-block; - border: 0.15em solid var(--clr-link-btn-bg); - border-radius: 0.6em; - padding: 0.5em 1em; - background: var(--clr-link-btn-bg); - color: var(--clr-link-btn-txt); - cursor: pointer; - font-weight: 700; - text-transform: uppercase; -} - -.link-btn, -.link-btn:hover, -.link-btn:visited { - text-decoration: none; -} - -.link-btn:hover { - cursor: pointer; - background: var(--clr-link-btn-hover); - transition: 0.5s; -} - -.link-btn:focus { - outline: 0.15em solid var(--clr-link-btn-txt); - outline-offset: -0.25em; -} - -/* Spoiler Accordion */ -* + .spoiler-accordion { - margin-top: var(--sz-paragraph-margin); -} - -.spoiler-accordion { - padding: 0.5em 0; -} - -.spoiler-accordion__hint { - font-weight: 700; -} - -.spoiler-accordion__spoiler { - padding: 0.5em 1em; -} - -.spoiler-accordion__spoiler p + p { - margin-top: 1em; -} - -/* Web button lists */ -.web-btn-wrapper { - display: flex; - flex-wrap: wrap; - gap: 0.5rem; -} - -/* UTILITY CLASSES */ -.bold-text { - font-weight: 700; -} - -.center-el { - display: grid; - place-content: center; -} - -.center-text { - text-align: center; -} - -.indent-text { - padding: 1em 0 1em 2em; - display: grid; - gap: 1em; -} - -.date-style { - font-weight: 700; - color: var(--clr-dates); -} - -.hidden { - display: none; -} - -.item-list { - display: grid; - gap: 0.7em; -} - -.visually-hidden { - position: absolute; - width: 1px; - height: 1px; - padding: 0; - margin: -1px; - overflow: hidden; - clip: rect(0,0,0,0); - white-space: nowrap; - border: 0; - outline: 0; - outline-offset: 0; -} diff --git a/src/assets/css/plugins.css b/src/assets/css/plugins.css new file mode 100644 index 00000000..50a9a661 --- /dev/null +++ b/src/assets/css/plugins.css @@ -0,0 +1,68 @@ +/* HEADING WRAPPER AND ANCHOR */ +.heading-wrapper { + display: flex; + gap: 0.3em; + margin-top: 1.5rem; + align-items: baseline; +} + +.heading-anchor { + line-height: 1; + opacity: 0.8; + order: -1; + text-decoration: none; +} + +.heading-anchor:hover { + text-decoration: underline; + text-underline-offset: 0.1em; + opacity: 1; +} + +.heading-anchor:focus { + outline: 2px solid currentColor; + outline-offset: 0.15em; +} + +.heading-anchor [hidden] { + display: block; +} + +:not(.heading-wrapper) + .heading-wrapper { + margin-top: 1.7em; +} + +/* BLOCKQUOTES With CITATIONS */ +.c-blockquote__attribution { + text-align: left; +} + +.c-blockquote__attribution::before { + content: "—"; + margin-right: 0.3em; +} + +/* FOOTNOTES */ +.footnote-ref { + margin-left: 0.2em; +} + +.footnotes { + margin-top: 3em; + border-top: 0.15em solid var(--clr-title-border); +} + +.footnotes__title, +.footnotes__title + .heading-anchor { + font-size: var(--sz-h3); +} + +.footnotes-list { + display: grid; + gap: 0.3em; +} + +.footnotes-list :target { + background-color: var(--clr-quote-bg); + outline: 0.1em dashed var(--clr-title-border); +} diff --git a/src/assets/css/utility.css b/src/assets/css/utility.css new file mode 100644 index 00000000..44cca363 --- /dev/null +++ b/src/assets/css/utility.css @@ -0,0 +1,47 @@ +/* UTILITY CLASSES */ +.bold-text { + font-weight: 700; +} + +.center-el { + display: grid; + place-content: center; +} + +.center-text { + text-align: center; +} + +.indent-text { + padding: 1em 0 1em 2em; + display: grid; + gap: 1em; +} + +.date-style { + font-weight: 700; + color: var(--clr-dates); +} + +.hidden { + display: none; +} + +.item-list { + display: grid; + gap: 0.7em; +} + +.visually-hidden { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0,0,0,0); + white-space: nowrap; + border: 0; + outline: 0; + outline-offset: 0; +}