diff --git a/assets/built/app.css b/assets/built/app.css index 8d95ce40..4801fadd 100644 --- a/assets/built/app.css +++ b/assets/built/app.css @@ -1,2 +1,2272 @@ -:root{--tablet:768px;--laptop:992px;--desktop:1200px;--widescreen:1400px;--gap:1rem;--gutter:max(20px,3vw);--width:992px;--post-width:768px;--content-width:700px;--radius:0.5em;--radius-small:3px;--heading-typeface:"Archivo",sans-serif;--mono-typeface:"JetBrains Mono","Cascadia Code","Fira Code","Menlo",monospace;--letter-spacing:0.2px;--h1:2.488rem;--h2:2.074rem;--h3:1.728rem;--h4:1.44rem;--h5:1.2rem;--h6:1rem;--small:0.833rem;--x-small:0.694rem;--xx-small:0.579rem;--button-padding:0.5em 0.75em;--transition:0.3s}:root[data-color-pref=light]{--primary:hsl(var(--primary-h) var(--saturation) var(--lightness));--primary-light:hsl(var(--primary-h) var(--saturation) calc(var(--lightness)*1.5));--primary-dark:hsl(var(--primary-h) var(--saturation) calc(var(--lightness)*0.5));--secondary:hsl(var(--complementary-color) var(--saturation) var(--lightness));--secondary-light:hsl(var(--complementary-color) var(--saturation) calc(var(--lightness)*1.5));--secondary-dark:hsl(var(--complementary-color) var(--saturation) calc(var(--lightness)*0.5));--surface:hsl(var(--primary-h) 10% 96%);--surface-85:hsla(var(--primary-h) 10% 96%/0.85);--surface-light:hsl(var(--primary-h) 10% 100%);--surface-dark:hsl(var(--primary-h) 10% 89%);--surface-darker:hsl(var(--primary-h) 10% 82%);--element:hsl(var(--primary-h) 10% 5%);--element-light:hsl(var(--primary-h) 10% 35%);--element-dark:hsl(var(--primary-h) 10% 1%);--border-color:hsla(var(--primary-h) 10% 82%/0.5);--border-color-accent:hsla(var(--primary-h) 10% 72%/0.5);--button-text:hsl(var(--primary-h) 10% 100%);--box-shadow:0 0.7px 2.2px hsla(var(--primary-h) var(--saturation) 9%/0.02),0 1.6px 5.3px hsla(var(--primary-h) var(--saturation) 9%/0.028),0 3px 10px hsla(var(--primary-h) var(--saturation) 9%/0.035),0 5.4px 17.9px hsla(var(--primary-h) var(--saturation) 9%/0.042),0 10px 33.4px hsla(var(--primary-h) var(--saturation) 9%/0.05),0 24px 80px hsla(var(--primary-h) var(--saturation) 9%/0.07)}:root[data-color-pref=dark]{--primary:hsl(var(--primary-h) var(--saturation) calc(var(--lightness)*1.5));--primary-light:hsl(var(--primary-h) var(--saturation) calc(var(--lightness)*1.75));--primary-dark:hsl(var(--primary-h) var(--saturation) calc(var(--lightness)*1.15));--secondary:hsl(var(--complementary-color) var(--saturation) calc(var(--lightness)*1.5));--secondary-light:hsl(var(--complementary-color) var(--saturation) calc(var(--lightness)*1.75));--secondary-dark:hsl(var(--complementary-color) var(--saturation) calc(var(--lightness)*1.15));--element:hsl(var(--primary-h) 10% 96%);--element-light:hsl(var(--primary-h) 10% 100%);--element-dark:hsl(var(--primary-h) 10% 89%);--element-darker:hsl(var(--primary-h) 10% 82%);--surface:hsl(var(--primary-h) 10% 12%);--surface-85:hsla(var(--primary-h) 10% 15%/0.85);--surface-light:hsl(var(--primary-h) 10% 18%);--surface-dark:hsl(var(--primary-h) 10% 8%);--surface-darker:hsl(var(--primary-h) 10% 3%);--border-color:hsla(var(--primary-h) 10% 35%/0.5);--border-color-accent:hsla(var(--primary-h) 10% 25%/0.5);--button-text:hsl(var(--primary-h) 10% 3%);--box-shadow:0 0.7px 2.2px hsla(var(--primary-h) var(--saturation) 1%/0.02),0 1.6px 5.3px hsla(var(--primary-h) var(--saturation) 1%/0.048),0 3px 10px hsla(var(--primary-h) var(--saturation) 1%/0.055),0 5.4px 17.9px hsla(var(--primary-h) var(--saturation) 1%/0.062),0 10px 33.4px hsla(var(--primary-h) var(--saturation) 1%/0.07),0 24px 80px hsla(var(--primary-h) var(--saturation) 1%/0.09)}*,:after,:before{box-sizing:border-box;margin:0;padding:0}button{background:none;border:none;cursor:pointer}:link,:visited,a{color:inherit;text-decoration:none}ol,ul{-webkit-padding-start:2em;padding-inline-start:2em}button,input,textarea{border:none;color:inherit;font-family:inherit;font-size:inherit;line-height:inherit}html{background-color:var(--surface);color:var(--element);font-family:Work Sans,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif,BlinkMacSystemFont,Oxygen,Open Sans,Helvetica Neue;font-size:clamp(1rem,.9285714285714286rem + .35714285714285715vw,1.25rem);font-size:1rem;font-size:clamp(1rem,.95rem + .25vw,1.25rem);line-height:1.5;scroll-behavior:smooth;scroll-padding-block-start:3.5rem}body,html{height:100%}body{display:flex;flex-direction:column}:target:before{-webkit-margin-end:.25em;color:var(--primary);content:"➠";margin-inline-end:.25em}::-moz-selection{background-color:var(--primary-light);color:#000}::selection{background-color:var(--primary-light);color:#000}.sm-grid>.sm-zap{grid-column:content}.sm-zap{color:var(--border-color);position:relative;text-align:center}.sm-zap:after,.sm-zap:before{content:"";height:1px;position:absolute;top:50%;width:48%}.sm-zap:before{background-image:linear-gradient(90deg,var(--border-color),transparent);left:0}.sm-zap:after{background-image:linear-gradient(-90deg,var(--border-color),transparent);right:0}@font-face{font-display:swap;font-family:Work Sans;font-style:normal;font-weight:400;src:local(""),url(/assets/fonts/work-sans-v17-latin-regular.woff2) format("woff2"),url(/assets/fonts/work-sans-v17-latin-regular.woff) format("woff")}@font-face{font-display:swap;font-family:Work Sans;font-style:normal;font-weight:700;src:local(""),url(/assets/fonts/work-sans-v17-latin-700.woff2) format("woff2"),url(/assets/fonts/work-sans-v17-latin-700.woff) format("woff")}@font-face{font-display:swap;font-family:Work Sans;font-style:italic;font-weight:400;src:local(""),url(/assets/fonts/work-sans-v17-latin-italic.woff2) format("woff2"),url(/assets/fonts/work-sans-v17-latin-italic.woff) format("woff")}@font-face{font-display:swap;font-family:Work Sans;font-style:italic;font-weight:700;src:local(""),url(/assets/fonts/work-sans-v17-latin-700italic.woff2) format("woff2"),url(/assets/fonts/work-sans-v17-latin-700italic.woff) format("woff")}@font-face{font-display:swap;font-family:Archivo;font-style:normal;font-weight:700;src:local(""),url(/assets/fonts/archivo-v18-latin-700.woff2) format("woff2"),url(/assets/fonts/archivo-v18-latin-700.woff) format("woff")}@font-face{font-display:swap;font-family:Archivo;font-style:italic;font-weight:700;src:local(""),url(/assets/fonts/archivo-v18-latin-700italic.woff2) format("woff2"),url(/assets/fonts/archivo-v18-latin-700italic.woff) format("woff")}@font-face{font-display:swap;font-family:Archivo;font-weight:900;src:local(""),url(/assets/fonts/archivo-v18-latin-900.woff2) format("woff2"),url(/assets/fonts/archivo-v18-latin-900.woff) format("woff")}h1,h2,h3,h4,h5,h6{font-family:Archivo,sans-serif;font-weight:700;line-height:1.3;margin:3rem 0 1.38rem}h1{font-size:var(--h1);margin-top:0}h2{font-size:var(--h2)}h3{font-size:var(--h3)}h4{font-size:var(--h4)}h5{font-size:var(--h5)}h6{font-size:var(--h6)}[class*=grid]{display:grid}.sm-grid{grid-template-columns:[start] var(--gutter) [content-start] 1fr [content-end] var(--gutter) [end]}.sm-header-grid{grid-template-columns:[start] var(--gutter) 1fr 1fr [content-start] minmax(min(300px,100%),var(--post-width)) [content-end] 1fr 1fr var(--gutter) [end];margin-block:6rem 3rem;row-gap:2rem}.sm-content-grid{grid-template-columns:[start] var(--gutter) [full-start] 1fr [wide-start] 1fr [content-start] minmax(min(300px,100%),var(--content-width)) [content-end] 1fr [wide-end] 1fr [full-end] var(--gutter) [end]}.sm-basic-grid{gap:var(--gap);grid-template-columns:1fr;padding-block:3rem 6rem}.sm-grid>.sm-basic-grid{grid-column:content}@media (min-width:500px){.sm-basic-grid{grid-template-columns:1fr 1fr}}@media (min-width:768px){.sm-grid{grid-template-columns:[start] var(--gutter) 1fr [content-start] minmax(min(100%,600px),var(--width)) [content-end] 1fr var(--gutter) [end]}.sm-basic-grid{grid-template-columns:1fr 1fr 1fr}}.sm-navbar-container{background-color:var(--surface);left:0;position:relative;position:fixed;top:0;width:100%;z-index:10}.sm-navbar{align-items:center;display:flex;grid-column:content;justify-content:space-between;padding:.75rem 0}.sm-navbar button,.sm-search-button{box-sizing:content-box;font-size:var(--small);line-height:1}.sm-navbar button:not(.sm-overflow-button) svg,.sm-search-button svg{fill:var(--element);height:max(1rem,20px);width:max(1rem,20px)}.sm-navbar-left{align-items:baseline;display:flex;gap:1rem}.sm-site-title{font-family:var(--heading-typeface);font-size:1rem;font-weight:800;line-height:1.1;margin:0;overflow:hidden;white-space:nowrap}@media (min-width:768px){.sm-site-title{font-size:1.15rem}}.sm-navigation-container{align-items:flex-end;display:none;gap:.25rem}.sm-navbar .sm-navbar-menu-button{align-self:flex-end;line-height:0}@media (min-width:768px){.sm-navigation-container{display:flex}.sm-navbar-menu-button{display:none}}.sm-navigation{-webkit-padding-start:0;display:flex;gap:1rem;list-style-type:none;padding-inline-start:0}.sm-navigation-item{font-size:var(--small);letter-spacing:var(--letter-spacing);position:relative;text-transform:uppercase}.sm-navigation-item a:before{background-color:var(--primary);border-radius:var(--radius);bottom:0;-webkit-clip-path:inset(0 100% 0 0);clip-path:inset(0 100% 0 0);content:"";height:2px;left:0;position:absolute;transition:-webkit-clip-path .3s;transition:clip-path .3s;transition:clip-path .3s,-webkit-clip-path .3s;width:100%;z-index:-1}.sm-navigation-item a:hover:before{-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0)}.sm-navbar-right{align-items:center;display:flex;gap:1rem}.sm-footer-container{-webkit-margin-before:auto;background-color:var(--surface-dark);margin-block-start:auto}.sm-footer{color:var(--element-dark);font-size:var(--small);grid-column:content;padding-block:2rem}.sm-footer>:not(:last-child){-webkit-margin-after:1em;margin-block-end:1em}@media (min-width:500px){.sm-footer{grid-gap:1rem var(--gap);-webkit-margin-after:0;display:grid;gap:1rem var(--gap);grid-template-columns:repeat(3,minmax(0,1fr));margin-block-end:0}.sm-footer>div:not(:last-child){-webkit-padding-end:1em;-webkit-margin-after:0;margin-block-end:0;padding-inline-end:1em}}.sm-footer-title{font-family:var(--heading-typeface);font-weight:700}.sm-footer-secondary-navigation ul{list-style:none;padding:0}.sm-footer input{background-color:transparent;border-bottom:1px solid var(--border-color);color:var(--primary);display:block;margin-block:.25em .75em;transition:border-color .3s;width:100%}.sm-footer input::-moz-placeholder{color:var(--element-light);font-size:var(--x-small);opacity:.5}.sm-footer input::placeholder{color:var(--element-light);font-size:var(--x-small);opacity:.5}.sm-footer .sm-button-simple{font-size:var(--x-small);font-weight:400}.sm-footer input.focus-visible{border-color:var(--element-light);outline:0}.sm-footer input:focus-visible{border-color:var(--element-light);outline:0}.sm-footer-meta{border-top:1px solid var(--border-color);color:var(--element-light);font-size:var(--x-small);grid-column:content;padding-block:2rem;text-align:center}.sm-footer-meta a{white-space:nowrap}.sm-home-accent{background-color:var(--surface-dark)}.sm-home-accent .sm-card,.sm-home-accent .sm-cta-card{border-color:var(--border-color-accent)}.sm-home-accent .sm-card .sm-tag{background-color:var(--surface-darker)}.home-template .sm-pagination{margin-block:var(--gap) 3rem}.sm-grid-home{grid-gap:var(--gap);display:grid;gap:var(--gap);grid-column:content;grid-template-columns:repeat(auto-fit,minmax(min(21.875rem,100%),1fr));padding:6rem 0}.sm-card-10.sm-card-vertical,.sm-card-11.sm-card-horizontal,.sm-card-12.sm-card-vertical,.sm-card-13.sm-card-vertical,.sm-card-14.sm-card-vertical,.sm-card-15.sm-card-vertical,.sm-card-2.sm-card-horizontal,.sm-card-3.sm-card-vertical,.sm-card-4.sm-card-vertical,.sm-card-5.sm-card-vertical,.sm-card-6.sm-card-vertical,.sm-card-7.sm-card-vertical,.sm-card-8.sm-card-vertical,.sm-card-9.sm-card-vertical{display:none}.sm-card-1.sm-card-horizontal .sm-card-link{flex-direction:column}.sm-card-1.sm-card-horizontal .sm-card-link>img{max-width:100%;width:100%}@media (min-width:768px){.sm-card-1.sm-card-horizontal .sm-card-link{flex-direction:row}.sm-card-1.sm-card-horizontal .sm-card-link>img{width:50%}.sm-grid-feature{grid-template-areas:"card-1 card-1 card-1 card-1" "card-2 card-2 card-3 card-3" "card-4 card-4 card-5 card-5";grid-template-columns:repeat(4,minmax(0,1fr))}.sm-grid-feature-left,.sm-grid-feature-right{grid-template-columns:repeat(3,minmax(0,1fr))}.sm-card-1{grid-area:card-1}.sm-card-2{grid-area:card-2}.sm-card-3{grid-area:card-3}.sm-card-4{grid-area:card-4}.sm-card-5{grid-area:card-5}.sm-grid-feature-left{grid-template-areas:"feature card-6 card-6" "feature card-7 card-7" "card-8 card-9 card-10"}.sm-grid-feature-right{grid-template-areas:"card-11 card-11 feature" "card-12 card-12 feature" "card-13 card-14 card-15"}.sm-card-10.sm-card-horizontal,.sm-card-11.sm-card-vertical,.sm-card-12.sm-card-vertical,.sm-card-13.sm-card-horizontal,.sm-card-14.sm-card-horizontal,.sm-card-15.sm-card-horizontal,.sm-card-2.sm-card-horizontal,.sm-card-3.sm-card-horizontal,.sm-card-4.sm-card-horizontal,.sm-card-5.sm-card-horizontal,.sm-card-6.sm-card-vertical,.sm-card-7.sm-card-vertical,.sm-card-8.sm-card-horizontal,.sm-card-9.sm-card-horizontal{display:none}.sm-card-10.sm-card-vertical,.sm-card-11.sm-card-horizontal,.sm-card-12.sm-card-horizontal,.sm-card-13.sm-card-vertical,.sm-card-14.sm-card-vertical,.sm-card-15.sm-card-vertical,.sm-card-2.sm-card-vertical,.sm-card-3.sm-card-vertical,.sm-card-4.sm-card-vertical,.sm-card-5.sm-card-vertical,.sm-card-6.sm-card-horizontal,.sm-card-7.sm-card-horizontal,.sm-card-8.sm-card-vertical,.sm-card-9.sm-card-vertical{display:inline;display:initial}.sm-feature-card{grid-area:feature}.sm-card-6{grid-area:card-6}.sm-card-7{grid-area:card-7}.sm-card-8{grid-area:card-8}.sm-card-9{grid-area:card-9}.sm-card-10{grid-area:card-10}.sm-card-11{grid-area:card-11}.sm-card-12{grid-area:card-12}.sm-card-13{grid-area:card-13}.sm-card-14{grid-area:card-14}.sm-card-15{grid-area:card-15}}.sm-post-title{-webkit-margin-after:1rem;margin-block-end:1rem}.sm-post-excerpt{color:var(--element-light);margin-inline:auto;max-width:66ch;opacity:.75}.sm-post-author-block{align-items:center;display:flex;gap:.5rem;justify-content:center;text-align:left}.sm-post-author-block p{text-align:left}.sm-post-author-profile-image{line-height:1}.sm-post-author-profile-image:empty{display:none}.sm-post-author-profile-image:empty+div{text-align:center}.sm-post-author-profile-image img{border:1px solid var(--border-color);border-radius:50%;height:3rem;-o-object-fit:cover;object-fit:cover;position:relative;width:3rem;z-index:5}.sm-post-author-profile-image img+img{-webkit-margin-end:-1rem;margin-inline-end:-1rem;transform:translateX(-1rem);z-index:4}.sm-post-author-profile-image img:nth-of-type(3){z-index:3}.sm-post-author-profile-image img:nth-of-type(4){z-index:2}.sm-post-author-profile-image img:nth-of-type(5){z-index:1}.sm-post-meta{color:var(--element-light);display:flex;flex-wrap:wrap;font-size:var(--x-small);gap:0 .5em;letter-spacing:var(--letter-spacing);opacity:.8;text-transform:uppercase}.sm-post-meta>:not(:last-child):after{-webkit-margin-start:.5em;content:"\002301";margin-inline-start:.5em}.sm-post-meta>a:hover:after{color:var(--element-light)}.sm-post-save-button{align-items:center;display:flex;text-transform:uppercase;transition:color .3s}.sm-post-save-button.sm-love-button{transform:none}.sm-post-meta a:hover,.sm-post-save-button:hover{color:var(--primary)}.sm-post-save-button span{align-items:center;display:flex;gap:3px}.sm-post-save-button.sm-love-button.sm-love-toggle .sm-heart-fill-icon{display:flex}.sm-post-save-button svg{fill:currentcolor;height:1em;width:1em}.sm-related-posts{grid-column:content;margin-block:1rem 6rem}.sm-related-posts h2{-webkit-margin-before:1rem;margin-block-start:1rem}.sm-related-posts-grid-container{gap:var(--gap);grid-template-columns:1fr}@media (min-width:500px){.sm-related-posts-grid-container{grid-template-columns:1fr 1fr}.sm-related-posts-grid-container>article:last-child{display:none}}@media (min-width:768px){.sm-related-posts-grid-container{grid-template-columns:repeat(3,1fr)}.sm-related-posts-grid-container>article:last-child{display:inline;display:initial}}.sm-related-posts .sm-card{grid-area:auto}#ghost-comments-root{grid-column:content}.sm-post-content{-webkit-margin-after:3rem;margin-block-end:3rem}.sm-post-content>*{-webkit-margin-after:1rem;grid-column:content;margin-block-end:1rem}.sm-post-content a{text-decoration:underline;text-decoration-thickness:2px;transition:text-decoration-color .1s}.sm-post-content a:hover{text-decoration-color:var(--primary)}.sm-post-content hr{background-color:var(--border-color);border:none;height:1px}.sm-table-wrapper{border:1px solid var(--border-color);border-radius:var(--radius)}.sm-post-content table{border-collapse:collapse;width:100%}.sm-post-content tbody tr{border-top:1px solid var(--border-color);transition:background-color .3s}.sm-post-content tbody tr:hover{background-color:var(--surface-dark)}.sm-post-content thead th{font-family:var(--heading-typeface);padding:var(--radius);text-align:left}.sm-post-content tbody td{font-size:var(--small);padding:var(--radius)}.sm-post-content code:not([class*=language]){background-color:var(--border-color);border-radius:4px;color:var(--element-light);font-family:var(--mono-typeface);font-size:var(--small);padding:.15em .25em}.sm-post-content li{line-height:inherit}.sm-post-content li:not(:last-child){-webkit-margin-after:.5em;margin-block-end:.5em}.sm-search{-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background-color:var(--surface-85);display:none;height:100%;left:0;overflow:auto;position:fixed;top:0;width:100%;z-index:35}.sm-search-form{-webkit-margin-before:1.5rem;grid-auto-rows:min-content;margin-block-start:1.5rem}.sm-show-search{display:inline;display:initial}.sm-search-form-container{grid-column:content;margin-block:2rem}.sm-search-input-container{position:relative}.sm-clear-search-button{box-sizing:content-box;display:none;height:1em;line-height:1;position:absolute;right:.75em;top:50%;transform:translateY(-50%);width:1em}.sm-clear-search-button.sm-show-clear-button{display:inline;display:initial}.sm-clear-search-button svg{fill:var(--element-light);height:1em;transition:fill .3s;width:1em}.sm-clear-search-button:hover svg{fill:var(--secondary)}.sm-search-form input{background-color:var(--surface-dark);border:1px solid transparent;border-radius:var(--radius);caret-color:var(--secondary);color:var(--element);padding:var(--button-padding);width:100%}.sm-search-form input::-moz-placeholder{color:var(--element-dark)}.sm-search-form input::placeholder{color:var(--element-dark)}.sm-search-form input.focus-visible{border-color:var(--primary);outline:0}.sm-search-form input:focus-visible{border-color:var(--primary);outline:0}.sm-search-results-container{-webkit-padding-after:3rem;grid-column:content;padding-block-end:3rem}.sm-search-result{font-family:var(--heading-typeface);font-size:var(--h3);font-weight:700;line-height:1.1}.sm-search-result-link{-webkit-margin-after:1rem;display:block;margin-block-end:1rem;transition:color .3s;width:-moz-fit-content;width:fit-content}.sm-search-result-link:focus,.sm-search-result-link:hover{color:var(--secondary);outline:0}.sm-matching-terms{color:var(--surface);display:flex;font-size:var(--small);gap:.5em}.sm-matching-terms span{background-color:var(--primary);border-radius:var(--radius);opacity:.75;padding:0 .25em}.sm-author-profile-image{border:1px solid var(--border-color);border-radius:50%;box-shadow:var(--box-shadow);height:6.5rem;width:6.5rem}.sm-author-location{-webkit-margin-after:1rem;align-items:center;display:flex;gap:.35em;justify-content:center;margin-block-end:1rem}.sm-author-location svg{fill:var(--element-light);height:1em;width:1em}.sm-author-socials{-webkit-margin-before:2rem;display:flex;gap:1rem;justify-content:center;margin-block-start:2rem}.sm-author-posts-container>h2 span{display:none;vertical-align:middle}.paged .sm-author-posts-container>h2 span{display:inline;display:initial}.sm-author-posts-container>*{grid-column:content}.sm-author-posts-container>h2{margin:3rem 0 0}.sm-author-posts-container .sm-basic-grid:last-child{-webkit-padding-after:3rem;padding-block-end:3rem}.sm-404{grid-column:content}.sm-404 a{text-decoration:underline}.page-template .sm-grid>*{grid-column:content}.sm-card{position:relative;transition:background 3s}.sm-card,.sm-card:before{border-radius:var(--radius)}.sm-card:before{box-shadow:var(--box-shadow);content:"";height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .3s;width:100%}.sm-card:focus,.sm-card:hover{outline:none}.sm-card:focus:before,.sm-card:hover:before{opacity:1}.sm-card-link{border-radius:var(--radius);display:flex;flex-direction:column;height:100%;justify-content:space-between;overflow:hidden;position:relative}.sm-card-link,.sm-cta-card,.sm-tags-card{background-color:var(--surface-light)}.sm-card img{aspect-ratio:16/9;border-top-left-radius:var(--radius-small);border-top-right-radius:var(--radius-small);height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.sm-card h2{font-size:2rem;line-height:1.1;margin:0}.sm-card h2:not(.large){font-size:1.35rem}.sm-card-body{display:flex;flex-direction:column;height:inherit;justify-content:space-between;padding:1rem}.sm-card .sm-excerpt{-webkit-margin-before:.75rem;font-size:.875rem;margin-block-start:.75rem}.sm-card-footer{-webkit-margin-before:2rem;display:flex;gap:1rem;justify-content:space-between;margin-block-start:2rem}.sm-card .sm-tag{background-color:var(--border-color);border-radius:var(--radius);display:inline-block;letter-spacing:var(--letter-spacing);max-width:70%;overflow:hidden;padding:0 .75em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.sm-card .sm-reading-time,.sm-card .sm-tag{color:var(--element-light);font-size:var(--x-small)}@media (min-width:768px){.sm-card-horizontal .sm-card-link{flex-direction:row}.sm-grid-feature .sm-card-horizontal picture{max-width:50%}.sm-grid-feature .sm-card-horizontal img{max-width:none}.sm-card-horizontal img{border-bottom-right-radius:0;border-top-right-radius:0;max-width:12.5rem}}.sm-card-horizontal .sm-card-body{display:flex;flex:1;flex-direction:column;justify-content:space-between}.sm-card-1 .sm-card-horizontal .sm-card-link img{flex:1;width:50%}.sm-feature-card{border-radius:var(--radius)}.sm-feature-card h2{margin-top:0}.sm-cta-card{position:relative}.sm-cta-card picture+form{-webkit-margin-before:2rem;height:auto;margin-block-start:2rem}.sm-cta-card img{display:block;height:4rem;left:50%;margin-inline:auto;position:absolute;top:0;transform:translate(-50%,-50%);width:4rem}.sm-cta-card form{align-items:center;height:100%;justify-content:space-between;padding:1.5rem 1rem;text-align:center}.sm-cta-card form,.sm-cta-copy{display:flex;flex-direction:column}.sm-cta-card h2{-webkit-text-fill-color:transparent;background:linear-gradient(45deg,var(--primary),var(--secondary));-webkit-background-clip:text;background-clip:text;line-height:1.1;margin:0 0 .5rem}.sm-cta-card p{font-size:1.2rem}.sm-cta-card input{-webkit-margin-before:2rem;background-color:transparent;border-bottom:3px solid var(--border-color);color:var(--element);margin-block-start:2rem;padding:.25em;text-align:center;transition:border-color .3s;width:100%}.sm-cta-card input.focus-visible{border-color:var(--element);outline:none}.sm-cta-card input:focus-visible{border-color:var(--element);outline:none}.sm-cta-card input::-moz-placeholder{color:var(--element-light);opacity:.5;text-align:center}.sm-cta-card input::placeholder{color:var(--element-light);opacity:.5;text-align:center}.sm-cta-card button{-webkit-margin-before:2rem;margin-block-start:2rem}.sm-tags-card{display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}.sm-tags-card>*{flex:1}.sm-tags-card h2{margin:1rem}.sm-tags-card>h2>a{transition:color var(--transition)}.sm-tags-card>h2>a:hover{color:var(--primary)}.sm-tags-card>a{border-bottom:1px solid var(--border-color);color:var(--element-light);font-weight:700;letter-spacing:var(--letter-spacing);padding:1rem;text-transform:uppercase;transition:background-color .1s,color .1s}.sm-tags-card>a:first-of-type{border-top:1px solid var(--border-color)}.sm-tags-card>a:last-child{border-bottom:none}.sm-tags-card span{font-feature-settings:"tnum";float:right;font-variant-numeric:tabular-nums}.sm-tags-card>a:hover{background-color:var(--secondary);color:var(--surface)}.sm-tags-card>a:nth-of-type(2):hover{background-color:hsla(var(--complementary-color) var(--saturation) var(--lightness)/.75)}.sm-tags-card>a:nth-of-type(3):hover{background-color:hsla(var(--complementary-color) var(--saturation) var(--lightness)/.5);color:var(--element)}.sm-tags-card>a:nth-of-type(4):hover{background-color:hsla(var(--complementary-color) var(--saturation) var(--lightness)/.25);color:var(--element)}.sm-tags-card>a:nth-of-type(5):hover{background-color:hsla(var(--complementary-color) var(--saturation) var(--lightness)/.05);color:var(--element)}:root[data-color-pref=dark] .sm-tags-card>a:nth-of-type(2):hover{background-color:hsla(var(--complementary-color) var(--saturation) calc(var(--lightness)*1.5)/.75);color:var(--element)}:root[data-color-pref=dark] .sm-tags-card>a:nth-of-type(3):hover{background-color:hsla(var(--complementary-color) var(--saturation) calc(var(--lightness)*1.5)/.5);color:var(--element)}:root[data-color-pref=dark] .sm-tags-card>a:nth-of-type(4):hover{background-color:hsla(var(--complementary-color) var(--saturation) calc(var(--lightness)*1.5)/.25);color:var(--element)}:root[data-color-pref=dark] .sm-tags-card>a:nth-of-type(5):hover{background-color:hsla(var(--complementary-color) var(--saturation) calc(var(--lightness)*1.5)/.05);color:var(--element)}.sm-card .sm-love-button{bottom:1rem;position:absolute;right:1rem}.sm-card .sm-love-button svg{fill:var(--primary);height:1rem;width:1rem}.sm-button,.sm-button-simple,.sm-form-button,.sm-icon-button{border-radius:var(--radius);font-size:var(--small);font-weight:700;letter-spacing:var(--letter-spacing);line-height:1;padding:var(--button-padding);text-transform:uppercase}.sm-button,.sm-form-button{background-color:var(--primary);color:var(--button-text)}.sm-icon-button{align-items:center;background-color:hsla(var(--primary-h) var(--saturation) var(--lightness)/.15);color:var(--element);display:flex;gap:1em;text-align:center;transition:background-color .3s;white-space:nowrap}.sm-icon-button:hover{background-color:hsla(var(--primary-h) var(--saturation) var(--lightness)/.25)}.sm-icon-button svg{fill:var(--element);height:1em;width:1em}.sm-circle-icon-button{border-radius:50%;box-sizing:content-box;height:1em;line-height:1;padding:.25em;transition:background-color .3s;width:1em}.sm-circle-icon-button svg{fill:var(--element-light);height:1em;width:1em}.sm-circle-icon-button:not([disabled]):hover{background-color:var(--border-color)}.sm-circle-icon-button[disabled]{opacity:.5}.sm-button-simple{align-items:center;border:1px solid var(--border-color);display:flex;gap:1em;transition:background-color .3s}.sm-button-simple svg{fill:var(--element-light);height:1em;width:1em}.sm-button-simple.focus-visible,.sm-button-simple:hover{background-color:var(--border-color);outline:none}.sm-button-simple:focus-visible,.sm-button-simple:hover{background-color:var(--border-color);outline:none}.sm-circle-close-button{border-radius:50%;box-sizing:content-box;height:max(1rem,30px);line-height:1;padding:.25rem;position:absolute;right:1rem;top:1rem;transition:background-color .3s;width:max(1rem,30px)}.sm-circle-close-button:hover{background-color:var(--border-color)}.sm-circle-close-button svg{fill:var(--element);height:max(1rem,30px);width:max(1rem,30px)}.sm-overflow-container{line-height:1;position:relative}.sm-overflow-button{align-items:center;border-radius:50%;box-sizing:content-box;display:flex;height:1rem;justify-content:center;line-height:0;padding:.25rem;transform:translateY(.15em);transition:background-color var(--transition);width:1rem}.sm-overflow-button svg{fill:var(--element);display:inline-block;height:1em;line-height:0;width:1em}.sm-overflow-menu{background-color:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius);box-shadow:var(--box-shadow);display:none;left:50%;max-width:75vw;position:absolute;top:2rem;transform:translate(-50%);z-index:20}.sm-overflow-menu>div{flex-direction:column;gap:1rem;justify-content:center;padding:1rem}.sm-overflow-buttons{display:flex}.sm-overflow-button:hover{background-color:var(--border-color)}.sm-overflow-menu:before{border-color:transparent transparent var(--border-color) transparent;border-style:solid;border-width:.5rem;content:"";left:50%;pointer-events:none;position:absolute;top:0;transform:translate(-50%,-100%)}.sm-overflow-follow,.sm-overflow-saves,.sm-overflow-share,[data-color-pref=dark] .sm-dark-mode,[data-color-pref=light] .sm-light-mode{display:none}.sm-overflow-back{align-items:center;background-color:var(--surface-light);border-radius:50%;box-shadow:var(--box-shadow);box-sizing:content-box;display:flex;height:1rem;justify-content:center;left:-.5em;line-height:0;padding:.25em;position:absolute;top:.5em;transform:translate(-100%,50%);width:1rem}.sm-overflow-back svg{display:inline-block;height:inherit;width:inherit}.sm-show{display:flex}.sm-hide{display:none}.sm-pagination{align-items:center;border:1px solid var(--border-color);border-radius:var(--radius);display:flex;font-size:var(--small);gap:var(--gap);grid-column:content;justify-content:center;padding:var(--button-padding)}.sm-pagination,.sm-pagination-holder{margin-block:6rem 3rem}.sm-current,.sm-pagination-item:hover{color:var(--primary)}.sm-prev{-webkit-margin-end:auto;margin-inline-end:auto}.sm-next{-webkit-margin-start:auto;margin-inline-start:auto}.sm-nav-disabled{opacity:.3}.sm-circle-icon-button.sm-nav-disabled:hover{background-color:transparent}.sm-error,.sm-footer-error,.sm-footer-loading,.sm-footer-success,.sm-loading,.sm-success,[data-members-form].error .sm-default,[data-members-form].error .sm-footer-default,[data-members-form].loading .sm-default:not(.sm-cta-copy),[data-members-form].loading .sm-footer-default:not(.sm-footer-default-text),[data-members-form].success .sm-default,[data-members-form].success .sm-footer-default{display:none}[data-members-form].error .sm-error,[data-members-form].error .sm-footer-error,[data-members-form].loading .sm-footer-loading,[data-members-form].loading .sm-loading,[data-members-form].success .sm-footer-success,[data-members-form].success .sm-success{display:flex}.sm-footer-loading svg,.sm-loading svg{animation:sm-spin 1s linear infinite}@keyframes sm-spin{to{transform:rotate(1turn)}}.sm-nav-menu-container{background-color:var(--surface);display:none;height:100%;height:100vh;justify-content:center;left:0;overflow-y:auto;padding:3rem var(--gap);position:fixed;text-align:center;top:0;width:100%;z-index:35}.sm-nav-menu-container.sm-show-menu{display:flex}.sm-nav-menu-navigation-container{display:flex;flex-direction:column;gap:1rem;height:100vh;margin-bottom:3rem}.sm-nav-menu-navigation-container .sm-navigation{align-items:center;flex-direction:column}.sm-nav-menu-header{color:var(--element-light);font-size:var(--small);letter-spacing:var(--letter-spacing);margin-block:2rem 1rem;opacity:.8;text-transform:uppercase}.sm-nav-menu-navigation-container .sm-navigation a{font-size:1.25rem;font-weight:700}.sm-nav-menu-section{display:flex;flex-direction:column;flex-wrap:wrap;gap:var(--gap);justify-content:center}.sm-nav-menu-section :where(button,a){justify-content:center}.sm-nav-menu-navigation-container>.sm-icon-button{-webkit-margin-before:2rem;margin-block-start:2rem}.sm-nav-menu-grid-container{gap:var(--gap);grid-template-columns:1fr 1fr;justify-content:space-between;width:100%}.sm-nav-menu-navigation-container :where(.sm-dark-mode,.sm-light-mode){-webkit-margin-after:3rem;justify-content:center;margin-block-end:3rem}.sm-header-grid>*{grid-column:content;text-align:center}.sm-header-title{font-weight:900;margin:0}.sm-header-excerpt{color:var(--element-light);margin-inline:auto;max-width:66ch;opacity:.85}.sm-header-image{aspect-ratio:16/9;width:100%}.sm-header-image figcaption{-webkit-margin-before:3px;font-size:var(--small);margin-block-start:3px;opacity:.8}.sm-header-image img{border-radius:var(--radius);display:block;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.sm-tag-count{-webkit-margin-start:1em;background-color:var(--border-color);border-radius:var(--radius);color:var(--element-light);display:inline-block;font-family:Work Sans,sans-serif;font-size:var(--x-small);font-weight:400;letter-spacing:var(--letter-spacing);line-height:1;margin-inline-start:1em;padding:var(--button-padding);text-transform:uppercase;translate:0 -.5em}.sm-love-button{display:inline-block;transform:translateY(.25em)}.sm-love-button .sm-heart-fill-icon,.sm-love-button.sm-love-toggle .sm-heart-outline-icon{display:none}.sm-love-button.sm-love-toggle .sm-heart-fill-icon{display:inline-block}.sm-overflow-articles{grid-gap:var(--gap);display:grid;gap:var(--gap);max-width:100%;min-width:18rem}.sm-saves{border-radius:var(--radius);padding:.5em 1em}.sm-saves progress::-webkit-progress-bar{background-color:var(--primary-light);border-radius:var(--radius);opacity:.5}.sm-saves progress::-webkit-progress-value{background-color:var(--primary);border-radius:var(--radius);overflow:hidden}.sm-saves-meta{align-items:center;display:flex;gap:var(--gap);justify-content:space-between}.sm-saves-meta button{font-size:1rem;transform:none}.sm-saves-title{font-family:var(--heading-typeface);font-weight:700;text-align:left;transition:color .3s}.sm-saves-title:hover{color:var(--primary)}.sm-saves-date{font-size:var(--x-small);margin-block:.5rem 0;text-align:left}.sm-saves button span{line-height:0}.sm-hero{-webkit-padding-after:3rem;min-height:60vmin;padding-block-end:3rem;position:relative}.sm-hero+.sm-grid .sm-grid-home{-webkit-padding-before:3rem;padding-block-start:3rem}.sm-hero-inner{-webkit-padding-before:6rem;grid-column:content;height:100%;padding-block-start:6rem}@media (min-width:768px){.sm-hero-inner{grid-gap:var(--gap);align-items:center;display:grid;gap:var(--gap);grid-template-columns:repeat(2,minmax(0,1fr))}}.sm-hero-left{-webkit-padding-end:1rem;display:flex;flex-direction:column;height:100%;justify-content:center;padding-inline-end:1rem;position:relative;text-align:center;z-index:1}.sm-hero-subtitle{-webkit-margin-after:1rem;-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(45deg,var(--primary),var(--secondary));font-family:var(--heading-typeface);font-size:var(--h1);font-weight:900;line-height:1.2;margin-block-end:1rem}@supports (color:color(display-p3 1 0.5 0)){.sm-hero-subtitle{background-image:linear-gradient(45deg,color(display-p3 var(--r) var(--g) var(--b)),color(display-p3 var(--cr) var(--cg) var(--cb)))}:root[data-color-pref=dark] .sm-hero-subtitle{filter:brightness(1.5)}}.sm-hero-description{color:var(--element-dark);font-size:1.15rem}.sm-hero-bg{height:100%;mix-blend-mode:multiply;opacity:.25;position:absolute}.sm-hero-bg,.sm-hero-img img{display:block;-o-object-fit:cover;object-fit:cover;width:100%}.sm-hero-img img{border-radius:var(--radius);height:auto;margin:0 auto}.sm-hero-right{display:none}.sm-hero-button-container:not(:empty){-webkit-margin-before:2rem;display:flex;gap:1rem;justify-content:center;margin-block-start:2rem}.sm-hero-cta-2{background-color:transparent;color:var(--element);position:relative}.sm-hero-cta-2 svg{height:100%;left:0;position:absolute;top:40%;width:100%;z-index:-1}@media (min-width:768px){.sm-hero-bg{display:none}.sm-hero-img{max-height:50vmin}.sm-hero-left{text-align:start}.sm-hero-right{display:inline;display:initial}.sm-hero-button-container:not(:empty){justify-content:flex-start}}.sm-form{border:1px solid var(--border-color);border-radius:var(--radius);display:flex;flex-direction:column;margin:2rem auto;max-width:var(--content-width);padding:var(--gap);width:100%}.sm-form input,.sm-form textarea{-webkit-margin-after:1rem;background-color:var(--surface);border:1px solid var(--border-color);border-radius:var(--radius);color:var(--element);margin-block-end:1rem;padding:var(--button-padding)}.sm-form textarea{height:10rem;resize:none}.sm-form input.focus-visible,.sm-form textarea.focus-visible{border-color:var(--secondary);outline:none}.sm-form input:focus-visible,.sm-form textarea:focus-visible{border-color:var(--secondary);outline:none}.sm-form button.focus-visible,.sm-form button:hover{background-color:var(--secondary);outline:none}.sm-form button:focus-visible,.sm-form button:hover{background-color:var(--secondary);outline:none}.sm-gradient-divider{background-image:linear-gradient(0deg,var(--surface),var(--surface-dark));height:5rem}.sm-gradient-divider-reverse{background-image:linear-gradient(180deg,var(--surface),var(--surface-dark));height:5rem}.sm-post-toc{bottom:28px;isolation:isolate;left:28px;pointer-events:none;position:fixed;transition:opacity .5s;z-index:2}.sm-post-toc-btn{--conic-gradient:var(--surface-light) 0deg 0%,var(--surface-light) 0deg 100%;background:var(--surface-light);border-radius:50%;box-shadow:0 4px 1rem hsl(var(--primary-h) var(--saturation) 9%/.1);box-sizing:content-box;height:30px;padding:.75rem;pointer-events:all;position:relative;transition:color var(--transition);width:30px}.sm-post-toc-btn:before{background-image:conic-gradient(var(--conic-gradient));border-radius:50%;content:"";inset:-3px;opacity:.5;position:absolute;transition:background-image var(--transition);z-index:-1}.sm-post-toc-btn.focus-visible,.sm-post-toc-btn:hover{color:var(--primary)}.sm-post-toc-btn:focus-visible,.sm-post-toc-btn:hover{color:var(--primary)}.sm-post-toc-btn svg{fill:currentcolor;height:100%;width:100%}.sm-post-toc-contents{-webkit-margin-after:1rem;align-items:flex-start;background:var(--surface-light);border-radius:0 var(--radius) var(--radius) var(--radius);display:flex;filter:drop-shadow(0 4px 1rem hsl(var(--primary-h) var(--saturation) 9%/.1));flex-direction:column;gap:.5rem;margin-block-end:1rem;max-width:min(500px,calc(100vw - 56px));opacity:0;padding:.75rem;pointer-events:none;position:relative;scale:0;transform-origin:bottom left;transition:scale .2s ease-out,opacity .2s ease-out .1s,translate .2s ease-out .1s;translate:15px 10%}.sm-post-toc-contents-title{background:var(--primary-dark);border-radius:var(--radius) var(--radius) 0 0;color:var(--surface-dark);font-size:var(--x-small);left:0;letter-spacing:var(--letter-spacing);padding:.15rem .75rem;position:absolute;text-transform:uppercase;top:0;translate:0 -100%}.toc-show{opacity:1;pointer-events:all;scale:1;transition:scale .2s ease-in,opacity .2s ease-in,translate .2s ease-in;translate:0 0}.sm-toc-h3{-webkit-padding-start:.5rem;padding-inline-start:.5rem}.sm-toc-h4{-webkit-padding-start:1rem;padding-inline-start:1rem}.sm-toc-h5{-webkit-padding-start:1.5rem;padding-inline-start:1.5rem}.sm-toc-h6{-webkit-padding-start:2rem;padding-inline-start:2rem}.sm-toc-link{transition:color var(--transition)}.sm-toc-active,.sm-toc-link:focus,.sm-toc-link:hover{color:var(--primary)}.toc-hide{opacity:0}.sm-toc-icon-close{display:none}.toc-show~.sm-post-toc-btn .sm-toc-icon-close{display:inline;display:initial}.toc-show~.sm-post-toc-btn .sm-toc-icon{display:none}blockquote:not(.kg-blockquote-alt){-webkit-padding-start:2rem;border-left:3px solid var(--border-color);padding-inline-start:2rem}.kg-blockquote-alt{font-family:var(--heading-typeface);line-height:1.2}.kg-blockquote-alt:after,.kg-blockquote-alt:before{color:var(--secondary)}.kg-blockquote-alt:before{-webkit-padding-end:.1em;content:"\002301";padding-inline-end:.1em}.kg-blockquote-alt:after{content:"\002301"}.kg-card{margin-inline:auto;width:100%}.kg-blockquote-alt,.kg-card{margin-block:1rem 2rem}.kg-image,.sm-post-content img{display:block;height:auto;margin-inline:auto;max-width:100%}.sm-post-content figcaption{font-size:var(--small);padding:.25rem;text-align:center}.kg-embed-card,.kg-gallery-card,.kg-width-wide{grid-column:content}.kg-embed-card .twitter-tweet{margin-inline:auto}@media (min-width:768px){.kg-gallery-card,.kg-width-wide{grid-column:wide}}.kg-width-full{grid-column:start/end}.kg-embed-card [src*=vimeo],.kg-embed-card [src*=youtube]{aspect-ratio:16/9;height:auto;width:100%}.kg-embed-card iframe{margin-inline:auto!important}.medium-zoom-overlay{z-index:10}.medium-zoom-image{z-index:11} +/* Abstracts */ +:root { + /* Space */ + --tablet: 768px; + --laptop: 992px; + --desktop: 1200px; + --widescreen: 1400px; + --gap: 1rem; + --gutter: max(20px, 3vw); + --width: 992px; + --post-width: 768px; + --content-width: 700px; + --radius: 0.5em; + --radius-small: 3px; + + /* Type */ + --heading-typeface: 'Archivo', sans-serif; + --mono-typeface: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', 'Menlo', + monospace; + --letter-spacing: 0.2px; + --h1: 2.488rem; + --h2: 2.074rem; + --h3: 1.728rem; + --h4: 1.44rem; + --h5: 1.2rem; + --h6: 1rem; + --small: 0.833rem; + --x-small: 0.694rem; + --xx-small: 0.579rem; + --button-padding: 0.5em 0.75em; + + --transition: 0.3s; +} +/* Color scheme */ +:root[data-color-pref='light'] { + --primary: hsl(var(--primary-h) var(--saturation) var(--lightness)); + --primary-light: hsl( + var(--primary-h) var(--saturation) calc(var(--lightness) * 1.5) + ); + --primary-dark: hsl( + var(--primary-h) var(--saturation) calc(var(--lightness) * 0.5) + ); + --secondary: hsl( + var(--complementary-color) var(--saturation) var(--lightness) + ); + --secondary-light: hsl( + var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) + ); + --secondary-dark: hsl( + var(--complementary-color) var(--saturation) calc(var(--lightness) * 0.5) + ); + + --surface: hsl(var(--primary-h) 10% 96%); + --surface-85: hsla(var(--primary-h) 10% 96% / 0.85); + --surface-light: hsl(var(--primary-h) 10% 100%); + --surface-dark: hsl(var(--primary-h) 10% 89%); + --surface-darker: hsl(var(--primary-h) 10% 82%); + + --element: hsl(var(--primary-h) 10% 5%); + --element-light: hsl(var(--primary-h) 10% 35%); + --element-dark: hsl(var(--primary-h) 10% 1%); + + --border-color: hsla(var(--primary-h) 10% 82% / 0.5); + --border-color-accent: hsla(var(--primary-h) 10% 72% / 0.5); + --button-text: hsl(var(--primary-h) 10% 100%); + + --box-shadow: 0 0.7px 2.2px hsla(var(--primary-h) var(--saturation) 9% / 0.02), + 0 1.6px 5.3px hsla(var(--primary-h) var(--saturation) 9% / 0.028), + 0 3px 10px hsla(var(--primary-h) var(--saturation) 9% / 0.035), + 0 5.4px 17.9px hsla(var(--primary-h) var(--saturation) 9% / 0.042), + 0 10px 33.4px hsla(var(--primary-h) var(--saturation) 9% / 0.05), + 0 24px 80px hsla(var(--primary-h) var(--saturation) 9% / 0.07); +} +:root[data-color-pref='dark'] { + /* Color */ + --primary: hsl( + var(--primary-h) var(--saturation) calc(var(--lightness) * 1.5) + ); + --primary-light: hsl( + var(--primary-h) var(--saturation) calc(var(--lightness) * 1.75) + ); + --primary-dark: hsl( + var(--primary-h) var(--saturation) calc(var(--lightness) * 1.15) + ); + + --secondary: hsl( + var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) + ); + --secondary-light: hsl( + var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.75) + ); + --secondary-dark: hsl( + var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.15) + ); + + --element: hsl(var(--primary-h) 10% 96%); + --element-light: hsl(var(--primary-h) 10% 100%); + --element-dark: hsl(var(--primary-h) 10% 89%); + --element-darker: hsl(var(--primary-h) 10% 82%); + + --surface: hsl(var(--primary-h) 10% 12%); + --surface-85: hsla(var(--primary-h) 10% 15% / 0.85); + --surface-light: hsl(var(--primary-h) 10% 18%); + --surface-dark: hsl(var(--primary-h) 10% 8%); + --surface-darker: hsl(var(--primary-h) 10% 3%); + + --border-color: hsla(var(--primary-h) 10% 35% / 0.5); + --border-color-accent: hsla(var(--primary-h) 10% 25% / 0.5); + --button-text: hsl(var(--primary-h) 10% 3%); + + --box-shadow: 0 0.7px 2.2px hsla(var(--primary-h) var(--saturation) 1% / 0.02), + 0 1.6px 5.3px hsla(var(--primary-h) var(--saturation) 1% / 0.048), + 0 3px 10px hsla(var(--primary-h) var(--saturation) 1% / 0.055), + 0 5.4px 17.9px hsla(var(--primary-h) var(--saturation) 1% / 0.062), + 0 10px 33.4px hsla(var(--primary-h) var(--saturation) 1% / 0.07), + 0 24px 80px hsla(var(--primary-h) var(--saturation) 1% / 0.09); +} +/* Base */ +*, +*:before, +*:after { + box-sizing: border-box; + padding: 0; + margin: 0; +} +button { + cursor: pointer; + background: none; + border: none; +} +a, +:link, +:visited { + color: inherit; + text-decoration: none; +} +ul, +ol { + -webkit-padding-start: 2em; + padding-inline-start: 2em; +} +input, +textarea, +button { + font-family: inherit; + font-size: inherit; + line-height: inherit; + color: inherit; + border: none; +} +html { + height: 100%; + font-family: 'Work Sans', system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, + 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', + sans-serif; + + font-size: 1rem; + font-size: clamp( + 1rem, + 0.9285714285714286rem + 0.35714285714285715vw, + 1.25rem + ); + font-size: 1rem; + font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem); + line-height: 1.5; + color: var(--element); + background-color: var(--surface); + scroll-behavior: smooth; + scroll-padding-block-start: 3.5rem; +} +body { + display: flex; + flex-direction: column; + height: 100%; +} +:target::before { + -webkit-margin-end: 0.25em; + margin-inline-end: 0.25em; + color: var(--primary); + content: '➠'; +} +::-moz-selection { + color: #000; + background-color: var(--primary-light); +} +::selection { + color: #000; + background-color: var(--primary-light); +} +.sm-grid > .sm-zap { + grid-column: content; +} +.sm-zap { + position: relative; + color: var(--border-color); + text-align: center; +} +.sm-zap::before, +.sm-zap::after { + position: absolute; + top: 50%; + width: 48%; + height: 1px; + content: ''; +} +.sm-zap::before { + left: 0; + background-image: linear-gradient(90deg, var(--border-color), transparent); +} +.sm-zap::after { + right: 0; + background-image: linear-gradient(-90deg, var(--border-color), transparent); +} +/* work-sans-regular - latin */ +@font-face { + font-family: 'Work Sans'; + font-style: normal; + font-weight: 400; + font-display: swap; + src: local(''), + url('/assets/fonts/work-sans-v17-latin-regular.woff2') format('woff2'), + /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('/assets/fonts/work-sans-v17-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} +/* work-sans-700 - latin */ +@font-face { + font-family: 'Work Sans'; + font-style: normal; + font-weight: 700; + font-display: swap; + src: local(''), + url('/assets/fonts/work-sans-v17-latin-700.woff2') format('woff2'), + /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('/assets/fonts/work-sans-v17-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} +/* work-sans-italic - latin */ +@font-face { + font-family: 'Work Sans'; + font-style: italic; + font-weight: 400; + font-display: swap; + src: local(''), + url('/assets/fonts/work-sans-v17-latin-italic.woff2') format('woff2'), + /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('/assets/fonts/work-sans-v17-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} +/* work-sans-700italic - latin */ +@font-face { + font-family: 'Work Sans'; + font-style: italic; + font-weight: 700; + font-display: swap; + src: local(''), + url('/assets/fonts/work-sans-v17-latin-700italic.woff2') format('woff2'), + /* Chrome 26+, Opera 23+, Firefox 39+ */ + url('/assets/fonts/work-sans-v17-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */ +} +@font-face { + font-family: Archivo; + font-style: normal; + font-weight: 700; + font-display: swap; + src: local(''), + url('/assets/fonts/archivo-v18-latin-700.woff2') format('woff2'), + url('/assets/fonts/archivo-v18-latin-700.woff') format('woff'); +} +@font-face { + font-family: Archivo; + font-style: italic; + font-weight: 700; + font-display: swap; + src: local(''), + url('/assets/fonts/archivo-v18-latin-700italic.woff2') format('woff2'), + url('/assets/fonts/archivo-v18-latin-700italic.woff') format('woff'); +} +@font-face { + font-family: Archivo; + font-weight: 900; + font-display: swap; + src: local(''), + url('/assets/fonts/archivo-v18-latin-900.woff2') format('woff2'), + url('/assets/fonts/archivo-v18-latin-900.woff') format('woff'); +} +h1, +h2, +h3, +h4, +h5, +h6 { + margin: 3rem 0 1.38rem; + font-family: Archivo, sans-serif; + font-weight: 700; + line-height: 1.3; +} +h1 { + margin-top: 0; + font-size: var(--h1); +} +h2 { + font-size: var(--h2); +} +h3 { + font-size: var(--h3); +} +h4 { + font-size: var(--h4); +} +h5 { + font-size: var(--h5); +} +h6 { + font-size: var(--h6); +} +/* Layout */ +[class*='grid'] { + display: grid; +} +.sm-grid { + grid-template-columns: + [start] var(--gutter) [content-start] 1fr [content-end] var(--gutter) + [end]; +} +.sm-header-grid { + grid-template-columns: + [start] var(--gutter) 1fr 1fr [content-start] minmax( + min(300px, 100%), + var(--post-width) + ) + [content-end] + 1fr 1fr var(--gutter) [end]; + margin-block: 6rem 3rem; + row-gap: 2rem; +} +.sm-content-grid { + grid-template-columns: + [start] var(--gutter) + [full-start] 1fr [wide-start] 1fr [content-start] minmax( + min(300px, 100%), + var(--content-width) + ) + [content-end] + 1fr [wide-end] 1fr [full-end] var(--gutter) [end]; +} +.sm-basic-grid { + grid-template-columns: 1fr; + gap: var(--gap); + padding-block: 3rem 6rem; +} +.sm-grid > .sm-basic-grid { + grid-column: content; +} +@media (min-width: 500px) { + .sm-basic-grid { + grid-template-columns: 1fr 1fr; + } +} +@media (min-width: 768px) { + .sm-grid { + grid-template-columns: + [start] var(--gutter) 1fr [content-start] minmax( + min(100%, 600px), + var(--width) + ) + [content-end] 1fr var(--gutter) + [end]; + } + + .sm-basic-grid { + grid-template-columns: 1fr 1fr 1fr; + } +} +.sm-navbar-container { + position: relative; + position: fixed; + top: 0; + left: 0; + z-index: 10; + width: 100%; + background-color: var(--surface); + /* box-shadow: 0 1px 1em rgb(0 0 0 / 0.15); */ +} +.sm-navbar { + display: flex; + align-items: center; + justify-content: space-between; + padding: 0.75rem 0; + grid-column: content; +} +.sm-navbar button, +.sm-search-button { + box-sizing: content-box; + font-size: var(--small); + line-height: 1; +} +.sm-navbar button:not(.sm-overflow-button) svg, +.sm-search-button svg { + width: max(1rem, 20px); + height: max(1rem, 20px); + fill: var(--element); +} +.sm-navbar-left { + display: flex; + gap: 1rem; + align-items: baseline; +} +.sm-site-title { + margin: 0; + overflow: hidden; + font-family: var(--heading-typeface); + font-size: 1rem; + font-weight: 800; + line-height: 1.1; + white-space: nowrap; +} +@media (min-width: 768px) { + .sm-site-title { + font-size: 1.15rem; + } +} +.sm-navigation-container { + display: none; + gap: 0.25rem; + align-items: flex-end; +} +.sm-navbar .sm-navbar-menu-button { + align-self: flex-end; + line-height: 0; +} +@media (min-width: 768px) { + .sm-navigation-container { + display: flex; + } + + .sm-navbar-menu-button { + display: none; + } +} +.sm-navigation { + display: flex; + -webkit-padding-start: 0; + padding-inline-start: 0; + list-style-type: none; + gap: 1rem; +} +.sm-navigation-item { + position: relative; + font-size: var(--small); + text-transform: uppercase; + letter-spacing: var(--letter-spacing); +} +.sm-navigation-item a::before { + position: absolute; + bottom: 0; + left: 0; + z-index: -1; + width: 100%; + height: 2px; + content: ''; + background-color: var(--primary); + border-radius: var(--radius); + transition: -webkit-clip-path 0.3s; + transition: clip-path 0.3s; + transition: clip-path 0.3s, -webkit-clip-path 0.3s; + -webkit-clip-path: inset(0 100% 0 0); + clip-path: inset(0 100% 0 0); +} +.sm-navigation-item a:hover::before { + -webkit-clip-path: inset(0 0 0 0); + clip-path: inset(0 0 0 0); +} +.sm-navbar-right { + display: flex; + gap: 1rem; + align-items: center; +} +.sm-footer-container { + -webkit-margin-before: auto; + margin-block-start: auto; + background-color: var(--surface-dark); + /* gap: 1rem var(--gap); */ +} +.sm-footer { + padding-block: 2rem; + font-size: var(--small); + color: var(--element-dark); + grid-column: content; +} +.sm-footer > *:not(:last-child) { + -webkit-margin-after: 1em; + margin-block-end: 1em; +} +@media (min-width: 500px) { + .sm-footer { + display: grid; + grid-template-columns: repeat(3, minmax(0, 1fr)); + grid-gap: 1rem var(--gap); + gap: 1rem var(--gap); + -webkit-margin-after: 0; + margin-block-end: 0; + } + + .sm-footer > div:not(:last-child) { + -webkit-padding-end: 1em; + padding-inline-end: 1em; + -webkit-margin-after: 0; + margin-block-end: 0; + } +} +.sm-footer-title { + font-family: var(--heading-typeface); + font-weight: 700; +} +.sm-footer-secondary-navigation ul { + padding: 0; + list-style: none; +} +.sm-footer input { + display: block; + width: 100%; + margin-block: 0.25em 0.75em; + color: var(--primary); + background-color: transparent; + border-bottom: 1px solid var(--border-color); + transition: border-color 0.3s; +} +.sm-footer input::-moz-placeholder { + font-size: var(--x-small); + color: var(--element-light); + opacity: 0.5; +} +.sm-footer input::placeholder { + font-size: var(--x-small); + color: var(--element-light); + opacity: 0.5; +} +.sm-footer .sm-button-simple { + font-size: var(--x-small); + font-weight: 400; +} +.sm-footer input.focus-visible { + border-color: var(--element-light); + outline: 0; +} +.sm-footer input:focus-visible { + border-color: var(--element-light); + outline: 0; +} +.sm-footer-meta { + padding-block: 2rem; + font-size: var(--x-small); + color: var(--element-light); + text-align: center; + border-top: 1px solid var(--border-color); + grid-column: content; +} +.sm-footer-meta a { + white-space: nowrap; +} +/* Pages */ +.sm-home-accent { + background-color: var(--surface-dark); +} +.sm-home-accent .sm-card, +.sm-home-accent .sm-cta-card { + border-color: var(--border-color-accent); +} +.sm-home-accent .sm-card .sm-tag { + background-color: var(--surface-darker); +} +.home-template .sm-pagination { + margin-block: var(--gap) 3rem; +} +/* Grid */ +.sm-grid-home { + display: grid; + grid-gap: var(--gap); + gap: var(--gap); + grid-column: content; + padding: 6rem 0; + grid-template-columns: repeat(auto-fit, minmax(min(21.875rem, 100%), 1fr)); +} +.sm-card-2.sm-card-horizontal, +.sm-card-3.sm-card-vertical, +.sm-card-4.sm-card-vertical, +.sm-card-5.sm-card-vertical, +.sm-card-6.sm-card-vertical, +.sm-card-7.sm-card-vertical, +.sm-card-8.sm-card-vertical, +.sm-card-9.sm-card-vertical, +.sm-card-10.sm-card-vertical, +.sm-card-11.sm-card-horizontal, +.sm-card-12.sm-card-vertical, +.sm-card-13.sm-card-vertical, +.sm-card-14.sm-card-vertical, +.sm-card-15.sm-card-vertical { + display: none; +} +.sm-card-1.sm-card-horizontal .sm-card-link { + flex-direction: column; +} +.sm-card-1.sm-card-horizontal .sm-card-link > img { + width: 100%; + max-width: 100%; +} +@media (min-width: 768px) { + .sm-card-1.sm-card-horizontal .sm-card-link { + flex-direction: row; + } + .sm-card-1.sm-card-horizontal .sm-card-link > img { + width: 50%; + } +} +@media (min-width: 768px) { + .sm-grid-feature { + grid-template-columns: repeat(4, minmax(0, 1fr)); + grid-template-areas: + 'card-1 card-1 card-1 card-1' + 'card-2 card-2 card-3 card-3' + 'card-4 card-4 card-5 card-5'; + } + + .sm-grid-feature-left, + .sm-grid-feature-right { + grid-template-columns: repeat(3, minmax(0, 1fr)); + } + + .sm-card-1 { + grid-area: card-1; + } + + .sm-card-2 { + grid-area: card-2; + } + + .sm-card-3 { + grid-area: card-3; + } + + .sm-card-4 { + grid-area: card-4; + } + .sm-card-5 { + grid-area: card-5; + } + + .sm-grid-feature-left { + grid-template-areas: + 'feature card-6 card-6' + 'feature card-7 card-7' + 'card-8 card-9 card-10'; + } + + .sm-grid-feature-right { + grid-template-areas: + 'card-11 card-11 feature' + 'card-12 card-12 feature' + 'card-13 card-14 card-15'; + } + + .sm-card-2.sm-card-horizontal, + .sm-card-3.sm-card-horizontal, + .sm-card-4.sm-card-horizontal, + .sm-card-5.sm-card-horizontal, + .sm-card-6.sm-card-vertical, + .sm-card-7.sm-card-vertical, + .sm-card-8.sm-card-horizontal, + .sm-card-9.sm-card-horizontal, + .sm-card-10.sm-card-horizontal, + .sm-card-11.sm-card-vertical, + .sm-card-12.sm-card-vertical, + .sm-card-13.sm-card-horizontal, + .sm-card-14.sm-card-horizontal, + .sm-card-15.sm-card-horizontal { + display: none; + } + + .sm-card-2.sm-card-vertical, + .sm-card-3.sm-card-vertical, + .sm-card-4.sm-card-vertical, + .sm-card-5.sm-card-vertical, + .sm-card-6.sm-card-horizontal, + .sm-card-7.sm-card-horizontal, + .sm-card-8.sm-card-vertical, + .sm-card-9.sm-card-vertical, + .sm-card-10.sm-card-vertical, + .sm-card-11.sm-card-horizontal, + .sm-card-12.sm-card-horizontal, + .sm-card-13.sm-card-vertical, + .sm-card-14.sm-card-vertical, + .sm-card-15.sm-card-vertical { + display: inline; + display: initial; + } + + .sm-feature-card { + grid-area: feature; + } + + .sm-card-6 { + grid-area: card-6; + } + + .sm-card-7 { + grid-area: card-7; + } + .sm-card-8 { + grid-area: card-8; + } + .sm-card-9 { + grid-area: card-9; + } + .sm-card-10 { + grid-area: card-10; + } + .sm-card-11 { + grid-area: card-11; + } + .sm-card-12 { + grid-area: card-12; + } + .sm-card-13 { + grid-area: card-13; + } + .sm-card-14 { + grid-area: card-14; + } + .sm-card-15 { + grid-area: card-15; + } +} +.sm-post-title { + -webkit-margin-after: 1rem; + margin-block-end: 1rem; +} +/* TODO - Combine with card.css */ +.sm-post-excerpt { + max-width: 66ch; + margin-inline: auto; + color: var(--element-light); + opacity: 0.75; +} +.sm-post-author-block { + display: flex; + align-items: center; + justify-content: center; + text-align: left; + gap: 0.5rem; +} +.sm-post-author-block p { + text-align: left; +} +.sm-post-author-profile-image { + line-height: 1; +} +.sm-post-author-profile-image:empty { + display: none; +} +.sm-post-author-profile-image:empty + div { + text-align: center; +} +.sm-post-author-profile-image img { + position: relative; + z-index: 5; + width: 3rem; + height: 3rem; + border: 1px solid var(--border-color); + border-radius: 50%; + -o-object-fit: cover; + object-fit: cover; +} +.sm-post-author-profile-image img + img { + z-index: 4; + -webkit-margin-end: -1rem; + margin-inline-end: -1rem; + transform: translateX(-1rem); +} +.sm-post-author-profile-image img:nth-of-type(3) { + z-index: 3; +} +.sm-post-author-profile-image img:nth-of-type(4) { + z-index: 2; +} +.sm-post-author-profile-image img:nth-of-type(5) { + z-index: 1; +} +.sm-post-meta { + display: flex; + flex-wrap: wrap; + font-size: var(--x-small); + color: var(--element-light); + text-transform: uppercase; + letter-spacing: var(--letter-spacing); + opacity: 0.8; + gap: 0 0.5em; +} +.sm-post-meta > *:not(:last-child):after { + -webkit-margin-start: 0.5em; + margin-inline-start: 0.5em; + content: '\002301'; +} +.sm-post-meta > a:hover::after { + color: var(--element-light); +} +.sm-post-save-button { + display: flex; + align-items: center; + text-transform: uppercase; + transition: color 0.3s; +} +.sm-post-save-button.sm-love-button { + transform: none; +} +.sm-post-meta a:hover, +.sm-post-save-button:hover { + color: var(--primary); +} +.sm-post-save-button span { + display: flex; + align-items: center; + gap: 3px; +} +.sm-post-save-button.sm-love-button.sm-love-toggle .sm-heart-fill-icon { + display: flex; +} +.sm-post-save-button svg { + width: 1em; + height: 1em; + fill: currentcolor; +} +/* Related posts */ +.sm-related-posts { + margin-block: 1rem 6rem; + grid-column: content; +} +/* Related posts block */ +.sm-related-posts h2 { + -webkit-margin-before: 1rem; + margin-block-start: 1rem; +} +.sm-related-posts-grid-container { + grid-template-columns: 1fr; + gap: var(--gap); +} +@media (min-width: 500px) { + .sm-related-posts-grid-container { + grid-template-columns: 1fr 1fr; + } + + .sm-related-posts-grid-container > article:last-child { + display: none; + } +} +@media (min-width: 768px) { + .sm-related-posts-grid-container { + grid-template-columns: repeat(3, 1fr); + } + .sm-related-posts-grid-container > article:last-child { + display: inline; + display: initial; + } +} +.sm-related-posts .sm-card { + grid-area: auto; +} +/* Comments */ +/* stylelint-disable-next-line selector-max-id */ +#ghost-comments-root { + grid-column: content; +} +/* Content */ +.sm-post-content { + -webkit-margin-after: 3rem; + margin-block-end: 3rem; +} +.sm-post-content > * { + grid-column: content; + -webkit-margin-after: 1rem; + margin-block-end: 1rem; +} +/* Links */ +.sm-post-content a { + text-decoration: underline; + text-decoration-thickness: 2px; + transition: text-decoration-color 0.1s; +} +.sm-post-content a:hover { + text-decoration-color: var(--primary); +} +/* Divider */ +.sm-post-content hr { + height: 1px; + background-color: var(--border-color); + border: none; +} +/* Table */ +.sm-table-wrapper { + border: 1px solid var(--border-color); + border-radius: var(--radius); + border-radius: var(--radius); +} +.sm-post-content table { + width: 100%; + border-collapse: collapse; +} +.sm-post-content tbody tr { + border-top: 1px solid var(--border-color); + transition: background-color 0.3s; +} +.sm-post-content tbody tr:hover { + background-color: var(--surface-dark); +} +.sm-post-content thead th { + padding: var(--radius); + font-family: var(--heading-typeface); + text-align: left; +} +.sm-post-content tbody td { + padding: var(--radius); + font-size: var(--small); +} +/* Code */ +.sm-post-content code:not([class*='language']) { + padding: 0.15em 0.25em; + font-family: var(--mono-typeface); + font-size: var(--small); + color: var(--element-light); + background-color: var(--border-color); + border-radius: 4px; +} +/* List */ +.sm-post-content li { + line-height: inherit; +} +.sm-post-content li:not(:last-child) { + -webkit-margin-after: 0.5em; + margin-block-end: 0.5em; +} +.sm-search { + position: fixed; + top: 0; + left: 0; + z-index: 35; + display: none; + width: 100%; + height: 100%; + overflow: auto; + background-color: var(--surface-85); + -webkit-backdrop-filter: blur(15px); + backdrop-filter: blur(15px); +} +.sm-search-form { + -webkit-margin-before: 1.5rem; + margin-block-start: 1.5rem; + grid-auto-rows: min-content; +} +.sm-show-search { + display: inline; + display: initial; +} +.sm-search-form-container { + grid-column: content; + margin-block: 2rem; +} +.sm-search-input-container { + position: relative; +} +.sm-clear-search-button { + position: absolute; + top: 50%; + right: 0.75em; + box-sizing: content-box; + display: none; + width: 1em; + height: 1em; + line-height: 1; + transform: translate(0, -50%); +} +.sm-clear-search-button.sm-show-clear-button { + display: inline; + display: initial; +} +.sm-clear-search-button svg { + width: 1em; + height: 1em; + transition: fill 0.3s; + fill: var(--element-light); +} +.sm-clear-search-button:hover svg { + fill: var(--secondary); +} +.sm-search-form input { + width: 100%; + padding: var(--button-padding); + color: var(--element); + background-color: var(--surface-dark); + border: 1px solid transparent; + border-radius: var(--radius); + caret-color: var(--secondary); +} +.sm-search-form input::-moz-placeholder { + color: var(--element-dark); +} +.sm-search-form input::placeholder { + color: var(--element-dark); +} +.sm-search-form input.focus-visible { + border-color: var(--primary); + outline: 0; +} +.sm-search-form input:focus-visible { + border-color: var(--primary); + outline: 0; +} +.sm-search-results-container { + grid-column: content; + -webkit-padding-after: 3rem; + padding-block-end: 3rem; +} +.sm-search-result { + font-family: var(--heading-typeface); + font-size: var(--h3); + font-weight: 700; + line-height: 1.1; +} +.sm-search-result-link { + display: block; + width: -moz-fit-content; + width: fit-content; + -webkit-margin-after: 1rem; + margin-block-end: 1rem; + transition: color 0.3s; +} +.sm-search-result-link:hover, +.sm-search-result-link:focus { + color: var(--secondary); + outline: 0; +} +.sm-matching-terms { + display: flex; + gap: 0.5em; + font-size: var(--small); + color: var(--surface); +} +.sm-matching-terms span { + padding: 0 0.25em; + background-color: var(--primary); + border-radius: var(--radius); + opacity: 0.75; +} +.sm-author-profile-image { + width: 6.5rem; + height: 6.5rem; + border: 1px solid var(--border-color); + border-radius: 50%; + box-shadow: var(--box-shadow); +} +.sm-author-location { + display: flex; + align-items: center; + justify-content: center; + gap: 0.35em; + -webkit-margin-after: 1rem; + margin-block-end: 1rem; +} +.sm-author-location svg { + width: 1em; + height: 1em; + fill: var(--element-light); +} +.sm-author-socials { + display: flex; + justify-content: center; + -webkit-margin-before: 2rem; + margin-block-start: 2rem; + gap: 1rem; +} +.sm-author-posts-container > h2 span { + display: none; + vertical-align: middle; +} +.paged .sm-author-posts-container > h2 span { + display: inline; + display: initial; +} +.sm-author-posts-container > * { + grid-column: content; +} +.sm-author-posts-container > h2 { + margin: 3rem 0 0; + /* border-top: 1px solid var(--border-color); */ +} +.sm-author-posts-container .sm-basic-grid:last-child { + -webkit-padding-after: 3rem; + padding-block-end: 3rem; +} +.sm-404 { + grid-column: content; +} +.sm-404 a { + text-decoration: underline; +} +.page-template .sm-grid > * { + grid-column: content; +} +/* Components */ +.sm-card { + position: relative; + border-radius: var(--radius); + transition: background 3s; +} +.sm-card::before { + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + content: ''; + border-radius: var(--radius); + box-shadow: var(--box-shadow); + opacity: 0; + transition: opacity 0.3s; +} +.sm-card:hover, +.sm-card:focus { + outline: none; +} +.sm-card:hover::before, +.sm-card:focus::before { + opacity: 1; +} +.sm-card-link { + position: relative; + display: flex; + flex-direction: column; + justify-content: space-between; + height: 100%; + overflow: hidden; + background-color: var(--surface-light); + border-radius: var(--radius); +} +.sm-cta-card, +.sm-tags-card { + background-color: var(--surface-light); +} +.sm-card img { + width: 100%; + height: 100%; + border-top-left-radius: var(--radius-small); + border-top-right-radius: var(--radius-small); + aspect-ratio: 16 / 9; + -o-object-fit: cover; + object-fit: cover; +} +.sm-card h2 { + margin: 0; + font-size: 2rem; + line-height: 1.1; +} +.sm-card h2:not(.large) { + font-size: 1.35rem; +} +.sm-card-body { + display: flex; + flex-direction: column; + justify-content: space-between; + height: inherit; + padding: 1rem; +} +.sm-card .sm-excerpt { + -webkit-margin-before: 0.75rem; + margin-block-start: 0.75rem; + font-size: 0.875rem; +} +.sm-card-footer { + display: flex; + justify-content: space-between; + -webkit-margin-before: 2rem; + margin-block-start: 2rem; + gap: 1rem; +} +.sm-card .sm-tag { + display: inline-block; + max-width: 70%; + padding: 0 0.75em; + overflow: hidden; + font-size: var(--x-small); + color: var(--element-light); + text-overflow: ellipsis; + text-transform: uppercase; + letter-spacing: var(--letter-spacing); + white-space: nowrap; + background-color: var(--border-color); + border-radius: var(--radius); +} +.sm-card .sm-reading-time { + font-size: var(--x-small); + color: var(--element-light); +} +@media (min-width: 768px) { + .sm-card-horizontal .sm-card-link { + flex-direction: row; + } + + .sm-grid-feature .sm-card-horizontal picture { + max-width: 50%; + } + + .sm-grid-feature .sm-card-horizontal img { + max-width: none; + } + + .sm-card-horizontal img { + max-width: 12.5rem; + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } +} +.sm-card-horizontal .sm-card-body { + display: flex; + flex: 1; + flex-direction: column; + justify-content: space-between; +} +.sm-card-1 .sm-card-horizontal .sm-card-link img { + flex: 1; + width: 50%; +} +/* Feature cards */ +.sm-feature-card { + border-radius: var(--radius); +} +.sm-feature-card h2 { + margin-top: 0; +} +/* CTA */ +.sm-cta-card { + position: relative; +} +.sm-cta-card picture + form { + height: auto; + -webkit-margin-before: 2rem; + margin-block-start: 2rem; +} +.sm-cta-card img { + position: absolute; + top: 0; + left: 50%; + display: block; + width: 4rem; + height: 4rem; + margin-inline: auto; + transform: translate(-50%, -50%); +} +.sm-cta-card form { + display: flex; + flex-direction: column; + align-items: center; + justify-content: space-between; + height: 100%; + padding: 1.5rem 1rem; + text-align: center; +} +.sm-cta-copy { + display: flex; + flex-direction: column; +} +.sm-cta-card h2 { + margin: 0 0 0.5rem; + line-height: 1.1; + background: linear-gradient(45deg, var(--primary), var(--secondary)); + -webkit-background-clip: text; + background-clip: text; + -webkit-text-fill-color: transparent; +} +.sm-cta-card input { + width: 100%; + padding: 0.25em; + -webkit-margin-before: 2rem; + margin-block-start: 2rem; + color: var(--element); + text-align: center; + background-color: transparent; + border-bottom: 3px solid var(--border-color); + transition: border-color 0.3s; +} +.sm-cta-card input.focus-visible { + border-color: var(--element); + outline: none; +} +.sm-cta-card input:focus-visible { + border-color: var(--element); + outline: none; +} +.sm-cta-card input::-moz-placeholder { + color: var(--element-light); + text-align: center; + opacity: 0.5; +} +.sm-cta-card input::placeholder { + color: var(--element-light); + text-align: center; + opacity: 0.5; +} +.sm-cta-card button { + -webkit-margin-before: 2rem; + margin-block-start: 2rem; +} +/* Tags */ +.sm-tags-card { + display: flex; + flex-direction: column; + justify-content: space-between; + overflow: hidden; +} +.sm-tags-card > * { + flex: 1; +} +/* Tags card */ +.sm-tags-card h2 { + margin: 1rem; +} +.sm-tags-card > h2 > a { + transition: color var(--transition); +} +.sm-tags-card > h2 > a:hover { + color: var(--primary); +} +.sm-tags-card > a { + padding: 1rem; + font-weight: 700; + color: var(--element-light); + text-transform: uppercase; + letter-spacing: var(--letter-spacing); + border-bottom: 1px solid var(--border-color); + transition: background-color 0.1s, color 0.1s; +} +.sm-tags-card > a:first-of-type { + border-top: 1px solid var(--border-color); +} +.sm-tags-card > a:last-child { + border-bottom: none; +} +.sm-tags-card span { + float: right; + font-feature-settings: "tnum"; + font-variant-numeric: tabular-nums; +} +.sm-tags-card > a:hover { + color: var(--surface); + background-color: var(--secondary); +} +.sm-tags-card > a:nth-of-type(2):hover { + background-color: hsla( + var(--complementary-color) var(--saturation) var(--lightness) / 0.75 + ); +} +.sm-tags-card > a:nth-of-type(3):hover { + color: var(--element); + background-color: hsla( + var(--complementary-color) var(--saturation) var(--lightness) / 0.5 + ); +} +.sm-tags-card > a:nth-of-type(4):hover { + color: var(--element); + background-color: hsla( + var(--complementary-color) var(--saturation) var(--lightness) / 0.25 + ); +} +.sm-tags-card > a:nth-of-type(5):hover { + color: var(--element); + background-color: hsla( + var(--complementary-color) var(--saturation) var(--lightness) / 0.05 + ); +} +:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(2):hover { + color: var(--element); + background-color: hsla( + var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) / + 0.75 + ); +} +:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(3):hover { + color: var(--element); + background-color: hsla( + var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) / + 0.5 + ); +} +:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(4):hover { + color: var(--element); + background-color: hsla( + var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) / + 0.25 + ); +} +:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(5):hover { + color: var(--element); + background-color: hsla( + var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) / + 0.05 + ); +} +.sm-card .sm-love-button { + position: absolute; + right: 1rem; + bottom: 1rem; +} +.sm-card .sm-love-button svg { + width: 1rem; + height: 1rem; + fill: var(--primary); +} +.sm-form-button, +.sm-button, +.sm-icon-button, +.sm-button-simple { + padding: var(--button-padding); + font-size: var(--small); + font-weight: 700; + line-height: 1; + text-transform: uppercase; + letter-spacing: var(--letter-spacing); + border-radius: var(--radius); +} +.sm-form-button, +.sm-button { + color: var(--button-text); + background-color: var(--primary); +} +/* Icon button */ +.sm-icon-button { + display: flex; + align-items: center; + color: var(--element); + text-align: center; + white-space: nowrap; + background-color: hsla( + var(--primary-h) var(--saturation) var(--lightness) / 0.15 + ); + transition: background-color 0.3s; + gap: 1em; +} +.sm-icon-button:hover { + background-color: hsla( + var(--primary-h) var(--saturation) var(--lightness) / 0.25 + ); +} +.sm-icon-button svg { + width: 1em; + height: 1em; + fill: var(--element); +} +/* Circle icon button +Used in navigation and pagination */ +.sm-circle-icon-button { + box-sizing: content-box; + width: 1em; + height: 1em; + padding: 0.25em; + line-height: 1; + border-radius: 50%; + transition: background-color 0.3s; +} +.sm-circle-icon-button svg { + width: 1em; + height: 1em; + fill: var(--element-light); +} +.sm-circle-icon-button:not([disabled]):hover { + background-color: var(--border-color); +} +.sm-circle-icon-button[disabled] { + opacity: 0.5; +} +/* Simple button +Used in footer */ +.sm-button-simple { + display: flex; + align-items: center; + border: 1px solid var(--border-color); + transition: background-color 0.3s; + gap: 1em; +} +.sm-button-simple svg { + width: 1em; + height: 1em; + fill: var(--element-light); +} +.sm-button-simple.focus-visible, +.sm-button-simple:hover { + background-color: var(--border-color); + outline: none; +} +.sm-button-simple:focus-visible, +.sm-button-simple:hover { + background-color: var(--border-color); + outline: none; +} +/* Circle close button +Used in search and */ +.sm-circle-close-button { + position: absolute; + top: 1rem; + right: 1rem; + box-sizing: content-box; + + width: max(1rem, 30px); + height: max(1rem, 30px); + padding: 0.25rem; + line-height: 1; + border-radius: 50%; + transition: background-color 0.3s; +} +.sm-circle-close-button:hover { + background-color: var(--border-color); +} +.sm-circle-close-button svg { + width: max(1rem, 30px); + height: max(1rem, 30px); + fill: var(--element); +} +.sm-overflow-container { + position: relative; + line-height: 1; +} +.sm-overflow-button { + box-sizing: content-box; + display: flex; + align-items: center; + justify-content: center; + width: 1rem; + height: 1rem; + padding: 0.25rem; + line-height: 0; + line-height: 0; + border-radius: 50%; + transition: background-color var(--transition); + transform: translate(0, 0.15em); +} +.sm-overflow-button svg { + display: inline-block; + width: 1em; + height: 1em; + line-height: 0; + /* transform: translateY(0.125rem); */ + fill: var(--element); +} +.sm-overflow-menu { + position: absolute; + top: 2rem; + left: 50%; + z-index: 20; + display: none; + max-width: 75vw; + background-color: var(--surface); + border: 1px solid var(--border-color); + border-radius: var(--radius); + box-shadow: var(--box-shadow); + transform: translate(-50%, 0); +} +.sm-overflow-menu > div { + flex-direction: column; + justify-content: center; + padding: 1rem; + gap: 1rem; +} +.sm-overflow-buttons { + display: flex; +} +.sm-overflow-button:hover { + background-color: var(--border-color); +} +.sm-overflow-menu::before { + position: absolute; + top: 0; + left: 50%; + pointer-events: none; + content: ''; + border-color: transparent transparent var(--border-color) transparent; + border-style: solid; + border-width: 0.5rem; + transform: translate(-50%, -100%); +} +[data-color-pref='light'] .sm-light-mode { + display: none; +} +[data-color-pref='dark'] .sm-dark-mode { + display: none; +} +/* Follow */ +.sm-overflow-follow, +.sm-overflow-share, +.sm-overflow-saves { + display: none; +} +.sm-overflow-back { + position: absolute; + top: 0.5em; + left: -0.5em; + box-sizing: content-box; + display: flex; + align-items: center; + justify-content: center; + width: 1rem; + height: 1rem; + padding: 0.25em; + line-height: 0; + background-color: var(--surface-light); + border-radius: 50%; + box-shadow: var(--box-shadow); + transform: translate(-100%, 50%); +} +.sm-overflow-back svg { + display: inline-block; + width: inherit; + height: inherit; +} +.sm-show { + display: flex; +} +.sm-hide { + display: none; +} +.sm-pagination { + display: flex; + align-items: center; + justify-content: center; + padding: var(--button-padding); + font-size: var(--small); + border: 1px solid var(--border-color); + border-radius: var(--radius); + grid-column: content; + gap: var(--gap); +} +.sm-pagination, +.sm-pagination-holder { + margin-block: 6rem 3rem; +} +.sm-current { + color: var(--primary); +} +.sm-pagination-item:hover { + color: var(--primary); +} +.sm-prev { + -webkit-margin-end: auto; + margin-inline-end: auto; +} +.sm-next { + -webkit-margin-start: auto; + margin-inline-start: auto; +} +.sm-nav-disabled { + opacity: 0.3; +} +.sm-circle-icon-button.sm-nav-disabled:hover { + background-color: transparent; +} +.sm-loading, +.sm-footer-loading, +.sm-success, +.sm-footer-success, +.sm-error, +.sm-footer-error { + display: none; +} +[data-members-form].loading .sm-default:not(.sm-cta-copy), +[data-members-form].success .sm-default, +[data-members-form].error .sm-default, +[data-members-form].loading .sm-footer-default:not(.sm-footer-default-text), +[data-members-form].success .sm-footer-default, +[data-members-form].error .sm-footer-default { + display: none; +} +[data-members-form].loading .sm-loading, +[data-members-form].success .sm-success, +[data-members-form].error .sm-error, +[data-members-form].loading .sm-footer-loading, +[data-members-form].success .sm-footer-success, +[data-members-form].error .sm-footer-error { + display: flex; +} +.sm-loading svg, +.sm-footer-loading svg { + animation: sm-spin 1s infinite linear; +} +@keyframes sm-spin { + to { + transform: rotate(1turn); + } +} +.sm-nav-menu-container { + position: fixed; + top: 0; + left: 0; + z-index: 35; + display: none; + /* align-items: center; */ + justify-content: center; + width: 100%; + height: 100%; + height: 100vh; + padding: 3rem var(--gap); + overflow-y: auto; + + text-align: center; + background-color: var(--surface); +} +.sm-nav-menu-container.sm-show-menu { + display: flex; +} +.sm-nav-menu-navigation-container { + display: flex; + flex-direction: column; + /* align-items: center; */ + gap: 1rem; + height: 100vh; + margin-bottom: 3rem; + /* margin-block-start: 6rem; */ +} +.sm-nav-menu-navigation-container .sm-navigation { + flex-direction: column; + align-items: center; +} +.sm-nav-menu-header { + margin-block: 2rem 1rem; + font-size: var(--small); + color: var(--element-light); + text-transform: uppercase; + letter-spacing: var(--letter-spacing); + opacity: 0.8; +} +.sm-nav-menu-navigation-container .sm-navigation a { + font-size: 1.25rem; + font-weight: 700; +} +.sm-nav-menu-section { + display: flex; + flex-direction: column; + flex-wrap: wrap; + justify-content: center; + gap: var(--gap); +} +.sm-nav-menu-section :where(button, a) { + justify-content: center; +} +.sm-nav-menu-navigation-container > .sm-icon-button { + -webkit-margin-before: 2rem; + margin-block-start: 2rem; +} +.sm-nav-menu-grid-container { + grid-template-columns: 1fr 1fr; + gap: var(--gap); + justify-content: space-between; + width: 100%; +} +.sm-nav-menu-navigation-container :where(.sm-dark-mode, .sm-light-mode) { + justify-content: center; + -webkit-margin-after: 3rem; + margin-block-end: 3rem; +} +.sm-header-grid > * { + grid-column: content; + text-align: center; +} +.sm-header-title { + margin: 0; + font-weight: 900; +} +.sm-header-excerpt { + max-width: 66ch; + margin-inline: auto; + color: var(--element-light); + opacity: 0.85; +} +.sm-header-image { + width: 100%; + aspect-ratio: 16 / 9; +} +.sm-header-image figcaption { + -webkit-margin-before: 3px; + margin-block-start: 3px; + font-size: var(--small); + opacity: 0.8; +} +.sm-header-image img { + display: block; + width: 100%; + height: 100%; + border-radius: var(--radius); + -o-object-fit: cover; + object-fit: cover; +} +.sm-tag-count { + display: inline-block; + padding: var(--button-padding); + -webkit-margin-start: 1em; + margin-inline-start: 1em; + font-family: 'Work Sans', sans-serif; + font-size: var(--x-small); + font-weight: 400; + line-height: 1; + color: var(--element-light); + text-transform: uppercase; + letter-spacing: var(--letter-spacing); + background-color: var(--border-color); + border-radius: var(--radius); + translate: 0 -0.5em; +} +.sm-love-button { + display: inline-block; + transform: translateY(0.25em); +} +.sm-love-button .sm-heart-fill-icon { + display: none; +} +.sm-love-button.sm-love-toggle .sm-heart-outline-icon { + display: none; +} +.sm-love-button.sm-love-toggle .sm-heart-fill-icon { + display: inline-block; +} +.sm-overflow-articles { + display: grid; + min-width: 18rem; + max-width: 100%; + grid-gap: var(--gap); + gap: var(--gap); +} +.sm-saves { + padding: 0.5em 1em; + border-radius: var(--radius); +} +.sm-saves progress::-webkit-progress-bar { + background-color: var(--primary-light); + border-radius: var(--radius); + opacity: 0.5; +} +.sm-saves progress::-webkit-progress-value { + overflow: hidden; + background-color: var(--primary); + border-radius: var(--radius); +} +.sm-saves-meta { + display: flex; + align-items: center; + justify-content: space-between; + gap: var(--gap); +} +.sm-saves-meta button { + font-size: 1rem; + transform: none; +} +.sm-saves-title { + font-family: var(--heading-typeface); + font-weight: 700; + text-align: left; + transition: 0.3s color; +} +.sm-saves-title:hover { + color: var(--primary); +} +.sm-saves-date { + margin-block: 0.5rem 0; + font-size: var(--x-small); + text-align: left; +} +.sm-saves button span { + line-height: 0; +} +.sm-hero { + position: relative; + min-height: 60vmin; + -webkit-padding-after: 3rem; + padding-block-end: 3rem; +} +.sm-hero + .sm-grid .sm-grid-home { + -webkit-padding-before: 3rem; + padding-block-start: 3rem; +} +.sm-hero-inner { + height: 100%; + -webkit-padding-before: 6rem; + padding-block-start: 6rem; + grid-column: content; +} +@media (min-width: 768px) { + .sm-hero-inner { + display: grid; + grid-template-columns: repeat(2, minmax(0, 1fr)); + grid-gap: var(--gap); + gap: var(--gap); + align-items: center; + } +} +.sm-hero-left { + position: relative; + z-index: 1; + display: flex; + flex-direction: column; + justify-content: center; + height: 100%; + -webkit-padding-end: 1rem; + padding-inline-end: 1rem; + text-align: center; +} +.sm-hero-subtitle { + -webkit-margin-after: 1rem; + margin-block-end: 1rem; + font-family: var(--heading-typeface); + font-size: var(--h1); + font-weight: 900; + line-height: 1.2; + background-image: linear-gradient(45deg, var(--primary), var(--secondary)); + -webkit-background-clip: text; + background-clip: text; + -webkit-text-fill-color: transparent; +} +@supports (color: color(display-p3 1 0.5 0)) { + .sm-hero-subtitle, + .sm-cta-card h2 { + background-image: linear-gradient( + 45deg, + color(display-p3 var(--r) var(--g) var(--b)), + color(display-p3 var(--cr) var(--cg) var(--cb)) + ); + } + + :root[data-color-pref='dark'] :where(.sm-hero-subtitle, .sm-cta-card h2) { + filter: brightness(1.5); + } +} +.sm-hero-description { + font-size: 1.15rem; + color: var(--element-dark); +} +.sm-hero-bg { + position: absolute; + display: block; + width: 100%; + height: 100%; + opacity: 0.25; + -o-object-fit: cover; + object-fit: cover; + mix-blend-mode: multiply; +} +.sm-hero-img img { + display: block; + width: 100%; + height: auto; + margin: 0 auto; + border-radius: var(--radius); + -o-object-fit: cover; + object-fit: cover; +} +.sm-hero-right { + display: none; +} +.sm-hero-button-container:not(:empty) { + display: flex; + justify-content: center; + -webkit-margin-before: 2rem; + margin-block-start: 2rem; + gap: 1rem; +} +.sm-hero-cta-2 { + position: relative; + color: var(--element); + background-color: transparent; +} +.sm-hero-cta-2 svg { + position: absolute; + top: 40%; + left: 0; + z-index: -1; + width: 100%; + height: 100%; + /* opacity: 0.5; */ +} +@media (min-width: 768px) { + .sm-hero-bg { + display: none; + } + + .sm-hero-img { + max-height: 50vmin; + } + + .sm-hero-left { + text-align: start; + } + + .sm-hero-right { + display: inline; + display: initial; + } + + .sm-hero-button-container:not(:empty) { + justify-content: flex-start; + } +} +.sm-form { + display: flex; + flex-direction: column; + width: 100%; + max-width: var(--content-width); + padding: var(--gap); + margin: 2rem auto; + border: 1px solid var(--border-color); + border-radius: var(--radius); +} +.sm-form label, +.sm-form input, +.sm-form textarea, +.sm-form button { + /* display: inline-block; */ +} +.sm-form input, +.sm-form textarea { + padding: var(--button-padding); + -webkit-margin-after: 1rem; + margin-block-end: 1rem; + color: var(--element); + background-color: var(--surface); + border: 1px solid var(--border-color); + border-radius: var(--radius); +} +.sm-form textarea { + height: 10rem; + resize: none; +} +.sm-form input.focus-visible, +.sm-form textarea.focus-visible { + border-color: var(--secondary); + outline: none; +} +.sm-form input:focus-visible, +.sm-form textarea:focus-visible { + border-color: var(--secondary); + outline: none; +} +.sm-form button:hover, +.sm-form button.focus-visible { + background-color: var(--secondary); + outline: none; +} +.sm-form button:hover, +.sm-form button:focus-visible { + background-color: var(--secondary); + outline: none; +} +.sm-gradient-divider { + height: 5rem; + background-image: linear-gradient(0deg, var(--surface), var(--surface-dark)); +} +.sm-gradient-divider-reverse { + height: 5rem; + background-image: linear-gradient( + 180deg, + var(--surface), + var(--surface-dark) + ); +} +.sm-post-toc { + position: fixed; + bottom: 28px; + left: 28px; + z-index: 5; + pointer-events: none; + transition: opacity 0.5s; + isolation: isolate; +} +.sm-post-toc-btn { + position: relative; + box-sizing: content-box; + width: 30px; + height: 30px; + padding: 0.75rem; + pointer-events: all; + background: var(--surface-light); + border-radius: 50%; + box-shadow: 0 4px 1rem hsl(var(--primary-h) var(--saturation) 9% / 0.1); + transition: color var(--transition); + --conic-gradient: var(--surface-light) 0deg 0%, var(--surface-light) 0deg 100%; +} +.sm-post-toc-btn::before { + position: absolute; + z-index: -1; + content: ''; + background-image: conic-gradient(var(--conic-gradient)); + border-radius: 50%; + opacity: 0.5; + transition: background-image var(--transition); + inset: -3px; +} +.sm-post-toc-btn:hover, +.sm-post-toc-btn.focus-visible { + color: var(--primary); +} +.sm-post-toc-btn:hover, +.sm-post-toc-btn:focus-visible { + color: var(--primary); +} +.sm-post-toc-btn svg { + width: 100%; + height: 100%; + fill: currentcolor; +} +.sm-post-toc-contents { + position: relative; + display: flex; + flex-direction: column; + align-items: flex-start; + max-width: min(500px, calc(100vw - 56px)); + padding: 1rem 0.75rem; + -webkit-margin-after: 1rem; + margin-block-end: 1rem; + pointer-events: none; + background: var(--surface-light); + filter: drop-shadow( + 0 4px 1rem hsl(var(--primary-h) var(--saturation) 9% / 0.1) + ); + border-radius: var(--radius); + opacity: 0; + transition: scale 0.2s ease-out, opacity 0.2s 0.1s ease-out, + translate 0.2s 0.1s ease-out; + transform-origin: bottom left; + gap: 0.5rem; + scale: 0; + translate: 15px 10%; + max-height: 70vh; + overflow-y: auto; +} +.sm-post-toc-contents::before { + position: absolute; + top: 0; + right: 0; + padding: 0.25rem 0.5rem; + font-size: var(--x-small); + color: var(--element-light); + text-transform: uppercase; + letter-spacing: var(--letter-spacing); + opacity: 0.5; + content: 'Contents'; +} +.toc-show { + pointer-events: all; + opacity: 1; + transition: scale 0.2s ease-in, opacity 0.2s ease-in, translate 0.2s ease-in; + scale: 1; + translate: 0 0; +} +.sm-toc-h3 { + -webkit-padding-start: 0.5rem; + padding-inline-start: 0.5rem; +} +.sm-toc-h4 { + -webkit-padding-start: 1rem; + padding-inline-start: 1rem; +} +.sm-toc-h5 { + -webkit-padding-start: 1.5rem; + padding-inline-start: 1.5rem; +} +.sm-toc-h6 { + -webkit-padding-start: 2rem; + padding-inline-start: 2rem; +} +.sm-toc-link { + transition: color var(--transition); +} +.sm-toc-link:hover, +.sm-toc-link:focus { + color: var(--primary); +} +.sm-toc-active { + color: var(--primary); +} +.toc-hide { + opacity: 0; +} +.sm-toc-icon-close { + display: none; +} +.toc-show ~ .sm-post-toc-btn .sm-toc-icon-close { + display: inline; + display: initial; +} +.toc-show ~ .sm-post-toc-btn .sm-toc-icon { + display: none; +} +/* Vendor */ +/* Blockquote */ +blockquote:not(.kg-blockquote-alt) { + -webkit-padding-start: 2rem; + padding-inline-start: 2rem; + border-left: 3px solid var(--border-color); +} +.kg-blockquote-alt { + font-family: var(--heading-typeface); + line-height: 1.2; +} +.kg-blockquote-alt::before, +.kg-blockquote-alt::after { + color: var(--secondary); +} +.kg-blockquote-alt::before { + -webkit-padding-end: 0.1em; + padding-inline-end: 0.1em; + content: '\002301'; +} +.kg-blockquote-alt::after { + content: '\002301'; +} +/* Cards and images */ +.kg-card { + width: 100%; + margin-inline: auto; +} +.kg-card, +.kg-blockquote-alt { + margin-block: 1rem 2rem; +} +.kg-image, +.sm-post-content img { + display: block; + max-width: 100%; + height: auto; + margin-inline: auto; +} +.sm-post-content figcaption { + padding: 0.25rem; + font-size: var(--small); + text-align: center; +} +.kg-width-wide, +.kg-embed-card, +.kg-gallery-card { + grid-column: content; +} +.kg-embed-card .twitter-tweet { + margin-inline: auto; +} +@media (min-width: 768px) { + .kg-width-wide, + .kg-gallery-card { + grid-column: wide; + } +} +.kg-width-full { + grid-column: start / end; +} +.kg-embed-card [src*='youtube'], +.kg-embed-card [src*='vimeo'] { + width: 100%; + height: auto; + aspect-ratio: 16 / 9; +} +.kg-embed-card iframe { + margin-inline: auto !important; +} +.kg-embed-card iframe { + /* stylelint-disable-next-line declaration-no-important */ +} +.medium-zoom-overlay { + z-index: 10; +} +.medium-zoom-image { + z-index: 11; +} + /*# sourceMappingURL=app.css.map */ \ No newline at end of file diff --git a/assets/built/app.css.map b/assets/built/app.css.map index 9e3d928d..b6b71171 100644 --- a/assets/built/app.css.map +++ b/assets/built/app.css.map @@ -1 +1 @@ -{"version":3,"sources":["abstracts/variables.css","base/reset.css","base/default.css","base/typography.css","layout/grid.css","layout/navbar.css","layout/footer.css","pages/home.css","pages/post.css","pages/post-content.css","pages/search.css","pages/author.css","pages/404.css","pages/page.css","components/card.css","components/button.css","components/overflow.css","components/pagination.css","components/subscribe.css","components/nav-menu.css","components/header.css","components/saves.css","components/hero.css","components/form.css","components/gradient.css","components/toc.css","vendor/kg.css","vendor/medium-zoom.css"],"names":[],"mappings":"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","file":"app.css","sourcesContent":["@custom-media --phone (min-width: 500px);\n@custom-media --tablet (min-width: 768px);\n@custom-media --laptop (min-width: 992px);\n@custom-media --desktop (min-width: 1200px);\n@custom-media --widescreen (min-width: 1400px);\n\n:root {\n /* Space */\n --tablet: 768px;\n --laptop: 992px;\n --desktop: 1200px;\n --widescreen: 1400px;\n --gap: 1rem;\n --gutter: max(20px, 3vw);\n --width: 992px;\n --post-width: 768px;\n --content-width: 700px;\n --radius: 0.5em;\n --radius-small: 3px;\n\n /* Type */\n --heading-typeface: 'Archivo', sans-serif;\n --mono-typeface: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', 'Menlo',\n monospace;\n --letter-spacing: 0.2px;\n --h1: 2.488rem;\n --h2: 2.074rem;\n --h3: 1.728rem;\n --h4: 1.44rem;\n --h5: 1.2rem;\n --h6: 1rem;\n --small: 0.833rem;\n --x-small: 0.694rem;\n --xx-small: 0.579rem;\n --button-padding: 0.5em 0.75em;\n\n --transition: 0.3s;\n}\n\n/* Color scheme */\n:root[data-color-pref='light'] {\n --primary: hsl(var(--primary-h) var(--saturation) var(--lightness));\n --primary-light: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 1.5)\n );\n --primary-dark: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 0.5)\n );\n --secondary: hsl(\n var(--complementary-color) var(--saturation) var(--lightness)\n );\n --secondary-light: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5)\n );\n --secondary-dark: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 0.5)\n );\n\n --surface: hsl(var(--primary-h) 10% 96%);\n --surface-85: hsla(var(--primary-h) 10% 96% / 0.85);\n --surface-light: hsl(var(--primary-h) 10% 100%);\n --surface-dark: hsl(var(--primary-h) 10% 89%);\n --surface-darker: hsl(var(--primary-h) 10% 82%);\n\n --element: hsl(var(--primary-h) 10% 5%);\n --element-light: hsl(var(--primary-h) 10% 35%);\n --element-dark: hsl(var(--primary-h) 10% 1%);\n\n --border-color: hsla(var(--primary-h) 10% 82% / 0.5);\n --border-color-accent: hsla(var(--primary-h) 10% 72% / 0.5);\n --button-text: hsl(var(--primary-h) 10% 100%);\n\n --box-shadow: 0 0.7px 2.2px hsla(var(--primary-h) var(--saturation) 9% / 0.02),\n 0 1.6px 5.3px hsla(var(--primary-h) var(--saturation) 9% / 0.028),\n 0 3px 10px hsla(var(--primary-h) var(--saturation) 9% / 0.035),\n 0 5.4px 17.9px hsla(var(--primary-h) var(--saturation) 9% / 0.042),\n 0 10px 33.4px hsla(var(--primary-h) var(--saturation) 9% / 0.05),\n 0 24px 80px hsla(var(--primary-h) var(--saturation) 9% / 0.07);\n}\n\n:root[data-color-pref='dark'] {\n /* Color */\n --primary: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 1.5)\n );\n --primary-light: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 1.75)\n );\n --primary-dark: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 1.15)\n );\n\n --secondary: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5)\n );\n --secondary-light: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.75)\n );\n --secondary-dark: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.15)\n );\n\n --element: hsl(var(--primary-h) 10% 96%);\n --element-light: hsl(var(--primary-h) 10% 100%);\n --element-dark: hsl(var(--primary-h) 10% 89%);\n --element-darker: hsl(var(--primary-h) 10% 82%);\n\n --surface: hsl(var(--primary-h) 10% 12%);\n --surface-85: hsla(var(--primary-h) 10% 15% / 0.85);\n --surface-light: hsl(var(--primary-h) 10% 18%);\n --surface-dark: hsl(var(--primary-h) 10% 8%);\n --surface-darker: hsl(var(--primary-h) 10% 3%);\n\n --border-color: hsla(var(--primary-h) 10% 35% / 0.5);\n --border-color-accent: hsla(var(--primary-h) 10% 25% / 0.5);\n --button-text: hsl(var(--primary-h) 10% 3%);\n\n --box-shadow: 0 0.7px 2.2px hsla(var(--primary-h) var(--saturation) 1% / 0.02),\n 0 1.6px 5.3px hsla(var(--primary-h) var(--saturation) 1% / 0.048),\n 0 3px 10px hsla(var(--primary-h) var(--saturation) 1% / 0.055),\n 0 5.4px 17.9px hsla(var(--primary-h) var(--saturation) 1% / 0.062),\n 0 10px 33.4px hsla(var(--primary-h) var(--saturation) 1% / 0.07),\n 0 24px 80px hsla(var(--primary-h) var(--saturation) 1% / 0.09);\n}\n","*,\n*:before,\n*:after {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n}\n\nbutton {\n cursor: pointer;\n background: none;\n border: none;\n}\n\na,\n:link,\n:visited {\n color: inherit;\n text-decoration: none;\n}\n\nul,\nol {\n padding-inline-start: 2em;\n}\n\ninput,\ntextarea,\nbutton {\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n color: inherit;\n border: none;\n}\n","html {\n height: 100%;\n font-family: 'Work Sans', system-ui, -apple-system, BlinkMacSystemFont,\n 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',\n sans-serif;\n\n font-size: 1rem;\n font-size: clamp(\n 1rem,\n 0.9285714285714286rem + 0.35714285714285715vw,\n 1.25rem\n );\n font-size: 1rem;\n font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);\n line-height: 1.5;\n color: var(--element);\n background-color: var(--surface);\n scroll-behavior: smooth;\n scroll-padding-block-start: 3.5rem;\n}\n\nbody {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n:target::before {\n margin-inline-end: 0.25em;\n color: var(--primary);\n content: '➠';\n}\n\n::selection {\n color: #000;\n background-color: var(--primary-light);\n}\n\n.sm-grid > .sm-zap {\n grid-column: content;\n}\n\n.sm-zap {\n position: relative;\n color: var(--border-color);\n text-align: center;\n}\n\n.sm-zap::before,\n.sm-zap::after {\n position: absolute;\n top: 50%;\n width: 48%;\n height: 1px;\n content: '';\n}\n\n.sm-zap::before {\n left: 0;\n background-image: linear-gradient(90deg, var(--border-color), transparent);\n}\n\n.sm-zap::after {\n right: 0;\n background-image: linear-gradient(-90deg, var(--border-color), transparent);\n}\n","/* work-sans-regular - latin */\n@font-face {\n font-family: 'Work Sans';\n font-style: normal;\n font-weight: 400;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/work-sans-v17-latin-regular.woff2') format('woff2'),\n /* Chrome 26+, Opera 23+, Firefox 39+ */\n url('/assets/fonts/work-sans-v17-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\n}\n/* work-sans-700 - latin */\n@font-face {\n font-family: 'Work Sans';\n font-style: normal;\n font-weight: 700;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/work-sans-v17-latin-700.woff2') format('woff2'),\n /* Chrome 26+, Opera 23+, Firefox 39+ */\n url('/assets/fonts/work-sans-v17-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\n}\n/* work-sans-italic - latin */\n@font-face {\n font-family: 'Work Sans';\n font-style: italic;\n font-weight: 400;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/work-sans-v17-latin-italic.woff2') format('woff2'),\n /* Chrome 26+, Opera 23+, Firefox 39+ */\n url('/assets/fonts/work-sans-v17-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\n}\n/* work-sans-700italic - latin */\n@font-face {\n font-family: 'Work Sans';\n font-style: italic;\n font-weight: 700;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/work-sans-v17-latin-700italic.woff2') format('woff2'),\n /* Chrome 26+, Opera 23+, Firefox 39+ */\n url('/assets/fonts/work-sans-v17-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\n}\n\n@font-face {\n font-family: Archivo;\n font-style: normal;\n font-weight: 700;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/archivo-v18-latin-700.woff2') format('woff2'),\n url('/assets/fonts/archivo-v18-latin-700.woff') format('woff');\n}\n\n@font-face {\n font-family: Archivo;\n font-style: italic;\n font-weight: 700;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/archivo-v18-latin-700italic.woff2') format('woff2'),\n url('/assets/fonts/archivo-v18-latin-700italic.woff') format('woff');\n}\n\n@font-face {\n font-family: Archivo;\n font-weight: 900;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/archivo-v18-latin-900.woff2') format('woff2'),\n url('/assets/fonts/archivo-v18-latin-900.woff') format('woff');\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin: 3rem 0 1.38rem;\n font-family: Archivo, sans-serif;\n font-weight: 700;\n line-height: 1.3;\n}\n\nh1 {\n margin-top: 0;\n font-size: var(--h1);\n}\n\nh2 {\n font-size: var(--h2);\n}\n\nh3 {\n font-size: var(--h3);\n}\n\nh4 {\n font-size: var(--h4);\n}\n\nh5 {\n font-size: var(--h5);\n}\n\nh6 {\n font-size: var(--h6);\n}\n","[class*='grid'] {\n display: grid;\n}\n\n.sm-grid {\n grid-template-columns:\n [start] var(--gutter) [content-start] 1fr [content-end] var(--gutter)\n [end];\n}\n\n.sm-header-grid {\n grid-template-columns:\n [start] var(--gutter) 1fr 1fr [content-start] minmax(\n min(300px, 100%),\n var(--post-width)\n )\n [content-end]\n 1fr 1fr var(--gutter) [end];\n margin-block: 6rem 3rem;\n row-gap: 2rem;\n}\n\n.sm-content-grid {\n grid-template-columns:\n [start] var(--gutter)\n [full-start] 1fr [wide-start] 1fr [content-start] minmax(\n min(300px, 100%),\n var(--content-width)\n )\n [content-end]\n 1fr [wide-end] 1fr [full-end] var(--gutter) [end];\n}\n\n.sm-basic-grid {\n grid-template-columns: 1fr;\n gap: var(--gap);\n padding-block: 3rem 6rem;\n}\n\n.sm-grid > .sm-basic-grid {\n grid-column: content;\n}\n\n@media (--phone) {\n .sm-basic-grid {\n grid-template-columns: 1fr 1fr;\n }\n}\n\n@media (--tablet) {\n .sm-grid {\n grid-template-columns:\n [start] var(--gutter) 1fr [content-start] minmax(\n min(100%, 600px),\n var(--width)\n )\n [content-end] 1fr var(--gutter)\n [end];\n }\n\n .sm-basic-grid {\n grid-template-columns: 1fr 1fr 1fr;\n }\n}\n",".sm-navbar-container {\n position: relative;\n position: fixed;\n top: 0;\n left: 0;\n z-index: 10;\n width: 100%;\n background-color: var(--surface);\n /* box-shadow: 0 1px 1em rgb(0 0 0 / 0.15); */\n}\n\n.sm-navbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.75rem 0;\n grid-column: content;\n}\n\n.sm-navbar button,\n.sm-search-button {\n box-sizing: content-box;\n font-size: var(--small);\n line-height: 1;\n}\n\n.sm-navbar button:not(.sm-overflow-button) svg,\n.sm-search-button svg {\n width: max(1rem, 20px);\n height: max(1rem, 20px);\n fill: var(--element);\n}\n\n.sm-navbar-left {\n display: flex;\n gap: 1rem;\n align-items: baseline;\n}\n\n.sm-site-title {\n margin: 0;\n overflow: hidden;\n font-family: var(--heading-typeface);\n font-size: 1rem;\n font-weight: 800;\n line-height: 1.1;\n white-space: nowrap;\n}\n\n@media (--tablet) {\n .sm-site-title {\n font-size: 1.15rem;\n }\n}\n\n.sm-navigation-container {\n display: none;\n gap: 0.25rem;\n align-items: flex-end;\n}\n\n.sm-navbar .sm-navbar-menu-button {\n align-self: flex-end;\n line-height: 0;\n}\n\n@media (--tablet) {\n .sm-navigation-container {\n display: flex;\n }\n\n .sm-navbar-menu-button {\n display: none;\n }\n}\n\n.sm-navigation {\n display: flex;\n padding-inline-start: 0;\n list-style-type: none;\n gap: 1rem;\n}\n\n.sm-navigation-item {\n position: relative;\n font-size: var(--small);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n}\n\n.sm-navigation-item a::before {\n position: absolute;\n bottom: 0;\n left: 0;\n z-index: -1;\n width: 100%;\n height: 2px;\n content: '';\n background-color: var(--primary);\n border-radius: var(--radius);\n transition: clip-path 0.3s;\n clip-path: inset(0 100% 0 0);\n}\n\n.sm-navigation-item a:hover::before {\n clip-path: inset(0 0 0 0);\n}\n\n.sm-navbar-right {\n display: flex;\n gap: 1rem;\n align-items: center;\n}\n",".sm-footer-container {\n margin-block-start: auto;\n background-color: var(--surface-dark);\n /* gap: 1rem var(--gap); */\n}\n\n.sm-footer {\n padding-block: 2rem;\n font-size: var(--small);\n color: var(--element-dark);\n grid-column: content;\n}\n\n.sm-footer > *:not(:last-child) {\n margin-block-end: 1em;\n}\n\n@media (--phone) {\n .sm-footer {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n gap: 1rem var(--gap);\n margin-block-end: 0;\n }\n\n .sm-footer > div:not(:last-child) {\n padding-inline-end: 1em;\n margin-block-end: 0;\n }\n}\n\n.sm-footer-title {\n font-family: var(--heading-typeface);\n font-weight: 700;\n}\n\n.sm-footer-secondary-navigation ul {\n padding: 0;\n list-style: none;\n}\n\n.sm-footer input {\n display: block;\n width: 100%;\n margin-block: 0.25em 0.75em;\n color: var(--primary);\n background-color: transparent;\n border-bottom: 1px solid var(--border-color);\n transition: border-color 0.3s;\n}\n\n.sm-footer input::placeholder {\n font-size: var(--x-small);\n color: var(--element-light);\n opacity: 0.5;\n}\n\n.sm-footer .sm-button-simple {\n font-size: var(--x-small);\n font-weight: 400;\n}\n\n.sm-footer input:focus-visible {\n border-color: var(--element-light);\n outline: 0;\n}\n\n.sm-footer-meta {\n padding-block: 2rem;\n font-size: var(--x-small);\n color: var(--element-light);\n text-align: center;\n border-top: 1px solid var(--border-color);\n grid-column: content;\n}\n\n.sm-footer-meta a {\n white-space: nowrap;\n}\n",".sm-home-accent {\n background-color: var(--surface-dark);\n}\n\n.sm-home-accent .sm-card,\n.sm-home-accent .sm-cta-card {\n border-color: var(--border-color-accent);\n}\n\n.sm-home-accent .sm-card .sm-tag {\n background-color: var(--surface-darker);\n}\n\n.home-template .sm-pagination {\n margin-block: var(--gap) 3rem;\n}\n\n/* Grid */\n.sm-grid-home {\n display: grid;\n gap: var(--gap);\n grid-column: content;\n padding: 6rem 0;\n grid-template-columns: repeat(auto-fit, minmax(min(21.875rem, 100%), 1fr));\n}\n\n.sm-card-2.sm-card-horizontal,\n.sm-card-3.sm-card-vertical,\n.sm-card-4.sm-card-vertical,\n.sm-card-5.sm-card-vertical,\n.sm-card-6.sm-card-vertical,\n.sm-card-7.sm-card-vertical,\n.sm-card-8.sm-card-vertical,\n.sm-card-9.sm-card-vertical,\n.sm-card-10.sm-card-vertical,\n.sm-card-11.sm-card-horizontal,\n.sm-card-12.sm-card-vertical,\n.sm-card-13.sm-card-vertical,\n.sm-card-14.sm-card-vertical,\n.sm-card-15.sm-card-vertical {\n display: none;\n}\n\n.sm-card-1.sm-card-horizontal .sm-card-link {\n flex-direction: column;\n}\n\n.sm-card-1.sm-card-horizontal .sm-card-link > img {\n width: 100%;\n max-width: 100%;\n}\n\n@media (--tablet) {\n .sm-card-1.sm-card-horizontal .sm-card-link {\n flex-direction: row;\n }\n .sm-card-1.sm-card-horizontal .sm-card-link > img {\n width: 50%;\n }\n}\n\n@media (--tablet) {\n .sm-grid-feature {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n grid-template-areas:\n 'card-1 card-1 card-1 card-1'\n 'card-2 card-2 card-3 card-3'\n 'card-4 card-4 card-5 card-5';\n }\n\n .sm-grid-feature-left,\n .sm-grid-feature-right {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n\n .sm-card-1 {\n grid-area: card-1;\n }\n\n .sm-card-2 {\n grid-area: card-2;\n }\n\n .sm-card-3 {\n grid-area: card-3;\n }\n\n .sm-card-4 {\n grid-area: card-4;\n }\n .sm-card-5 {\n grid-area: card-5;\n }\n\n .sm-grid-feature-left {\n grid-template-areas:\n 'feature card-6 card-6'\n 'feature card-7 card-7'\n 'card-8 card-9 card-10';\n }\n\n .sm-grid-feature-right {\n grid-template-areas:\n 'card-11 card-11 feature'\n 'card-12 card-12 feature'\n 'card-13 card-14 card-15';\n }\n\n .sm-card-2.sm-card-horizontal,\n .sm-card-3.sm-card-horizontal,\n .sm-card-4.sm-card-horizontal,\n .sm-card-5.sm-card-horizontal,\n .sm-card-6.sm-card-vertical,\n .sm-card-7.sm-card-vertical,\n .sm-card-8.sm-card-horizontal,\n .sm-card-9.sm-card-horizontal,\n .sm-card-10.sm-card-horizontal,\n .sm-card-11.sm-card-vertical,\n .sm-card-12.sm-card-vertical,\n .sm-card-13.sm-card-horizontal,\n .sm-card-14.sm-card-horizontal,\n .sm-card-15.sm-card-horizontal {\n display: none;\n }\n\n .sm-card-2.sm-card-vertical,\n .sm-card-3.sm-card-vertical,\n .sm-card-4.sm-card-vertical,\n .sm-card-5.sm-card-vertical,\n .sm-card-6.sm-card-horizontal,\n .sm-card-7.sm-card-horizontal,\n .sm-card-8.sm-card-vertical,\n .sm-card-9.sm-card-vertical,\n .sm-card-10.sm-card-vertical,\n .sm-card-11.sm-card-horizontal,\n .sm-card-12.sm-card-horizontal,\n .sm-card-13.sm-card-vertical,\n .sm-card-14.sm-card-vertical,\n .sm-card-15.sm-card-vertical {\n display: initial;\n }\n\n .sm-feature-card {\n grid-area: feature;\n }\n\n .sm-card-6 {\n grid-area: card-6;\n }\n\n .sm-card-7 {\n grid-area: card-7;\n }\n .sm-card-8 {\n grid-area: card-8;\n }\n .sm-card-9 {\n grid-area: card-9;\n }\n .sm-card-10 {\n grid-area: card-10;\n }\n .sm-card-11 {\n grid-area: card-11;\n }\n .sm-card-12 {\n grid-area: card-12;\n }\n .sm-card-13 {\n grid-area: card-13;\n }\n .sm-card-14 {\n grid-area: card-14;\n }\n .sm-card-15 {\n grid-area: card-15;\n }\n}\n",".sm-post-title {\n margin-block-end: 1rem;\n}\n\n/* TODO - Combine with card.css */\n.sm-post-excerpt {\n max-width: 66ch;\n margin-inline: auto;\n color: var(--element-light);\n opacity: 0.75;\n}\n\n.sm-post-author-block {\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: left;\n gap: 0.5rem;\n}\n\n.sm-post-author-block p {\n text-align: left;\n}\n\n.sm-post-author-profile-image {\n line-height: 1;\n}\n\n.sm-post-author-profile-image:empty {\n display: none;\n}\n\n.sm-post-author-profile-image:empty + div {\n text-align: center;\n}\n\n.sm-post-author-profile-image img {\n position: relative;\n z-index: 5;\n width: 3rem;\n height: 3rem;\n border: 1px solid var(--border-color);\n border-radius: 50%;\n object-fit: cover;\n}\n\n.sm-post-author-profile-image img + img {\n z-index: 4;\n margin-inline-end: -1rem;\n transform: translateX(-1rem);\n}\n\n.sm-post-author-profile-image img:nth-of-type(3) {\n z-index: 3;\n}\n\n.sm-post-author-profile-image img:nth-of-type(4) {\n z-index: 2;\n}\n\n.sm-post-author-profile-image img:nth-of-type(5) {\n z-index: 1;\n}\n\n.sm-post-meta {\n display: flex;\n flex-wrap: wrap;\n font-size: var(--x-small);\n color: var(--element-light);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n opacity: 0.8;\n gap: 0 0.5em;\n}\n\n.sm-post-meta > *:not(:last-child):after {\n margin-inline-start: 0.5em;\n content: '\\002301';\n}\n\n.sm-post-meta > a:hover::after {\n color: var(--element-light);\n}\n\n.sm-post-save-button {\n display: flex;\n align-items: center;\n text-transform: uppercase;\n transition: color 0.3s;\n}\n\n.sm-post-save-button.sm-love-button {\n transform: none;\n}\n\n.sm-post-meta a:hover,\n.sm-post-save-button:hover {\n color: var(--primary);\n}\n\n.sm-post-save-button span {\n display: flex;\n align-items: center;\n gap: 3px;\n}\n.sm-post-save-button.sm-love-button.sm-love-toggle .sm-heart-fill-icon {\n display: flex;\n}\n\n.sm-post-save-button svg {\n width: 1em;\n height: 1em;\n fill: currentcolor;\n}\n\n/* Related posts */\n.sm-related-posts {\n margin-block: 1rem 6rem;\n grid-column: content;\n}\n\n/* Related posts block */\n.sm-related-posts h2 {\n margin-block-start: 1rem;\n}\n\n.sm-related-posts-grid-container {\n grid-template-columns: 1fr;\n gap: var(--gap);\n}\n\n@media (--phone) {\n .sm-related-posts-grid-container {\n grid-template-columns: 1fr 1fr;\n }\n\n .sm-related-posts-grid-container > article:last-child {\n display: none;\n }\n}\n\n@media (--tablet) {\n .sm-related-posts-grid-container {\n grid-template-columns: repeat(3, 1fr);\n }\n .sm-related-posts-grid-container > article:last-child {\n display: initial;\n }\n}\n\n.sm-related-posts .sm-card {\n grid-area: auto;\n}\n\n/* Comments */\n/* stylelint-disable-next-line selector-max-id */\n#ghost-comments-root {\n grid-column: content;\n}\n","/* Content */\n.sm-post-content {\n margin-block-end: 3rem;\n}\n\n.sm-post-content > * {\n grid-column: content;\n margin-block-end: 1rem;\n}\n\n/* Links */\n.sm-post-content a {\n text-decoration: underline;\n text-decoration-thickness: 2px;\n transition: text-decoration-color 0.1s;\n}\n\n.sm-post-content a:hover {\n text-decoration-color: var(--primary);\n}\n\n/* Divider */\n.sm-post-content hr {\n height: 1px;\n background-color: var(--border-color);\n border: none;\n}\n\n/* Table */\n.sm-table-wrapper {\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n border-radius: var(--radius);\n}\n\n.sm-post-content table {\n width: 100%;\n border-collapse: collapse;\n}\n\n.sm-post-content tbody tr {\n border-top: 1px solid var(--border-color);\n transition: background-color 0.3s;\n}\n\n.sm-post-content tbody tr:hover {\n background-color: var(--surface-dark);\n}\n\n.sm-post-content thead th {\n padding: var(--radius);\n font-family: var(--heading-typeface);\n text-align: left;\n}\n\n.sm-post-content tbody td {\n padding: var(--radius);\n font-size: var(--small);\n}\n\n/* Code */\n.sm-post-content code:not([class*='language']) {\n padding: 0.15em 0.25em;\n font-family: var(--mono-typeface);\n font-size: var(--small);\n color: var(--element-light);\n background-color: var(--border-color);\n border-radius: 4px;\n}\n\n/* List */\n.sm-post-content li {\n line-height: inherit;\n}\n\n.sm-post-content li:not(:last-child) {\n margin-block-end: 0.5em;\n}\n",".sm-search {\n position: fixed;\n top: 0;\n left: 0;\n z-index: 35;\n display: none;\n width: 100%;\n height: 100%;\n overflow: auto;\n background-color: var(--surface-85);\n backdrop-filter: blur(15px);\n}\n\n.sm-search-form {\n margin-block-start: 1.5rem;\n grid-auto-rows: min-content;\n}\n\n.sm-show-search {\n display: initial;\n}\n\n.sm-search-form-container {\n grid-column: content;\n margin-block: 2rem;\n}\n\n.sm-search-input-container {\n position: relative;\n}\n\n.sm-clear-search-button {\n position: absolute;\n top: 50%;\n right: 0.75em;\n box-sizing: content-box;\n display: none;\n width: 1em;\n height: 1em;\n line-height: 1;\n transform: translate(0, -50%);\n}\n\n.sm-clear-search-button.sm-show-clear-button {\n display: initial;\n}\n\n.sm-clear-search-button svg {\n width: 1em;\n height: 1em;\n transition: fill 0.3s;\n fill: var(--element-light);\n}\n\n.sm-clear-search-button:hover svg {\n fill: var(--secondary);\n}\n\n.sm-search-form input {\n width: 100%;\n padding: var(--button-padding);\n color: var(--element);\n background-color: var(--surface-dark);\n border: 1px solid transparent;\n border-radius: var(--radius);\n caret-color: var(--secondary);\n}\n\n.sm-search-form input::placeholder {\n color: var(--element-dark);\n}\n\n.sm-search-form input:focus-visible {\n border-color: var(--primary);\n outline: 0;\n}\n\n.sm-search-results-container {\n grid-column: content;\n padding-block-end: 3rem;\n}\n\n.sm-search-result {\n font-family: var(--heading-typeface);\n font-size: var(--h3);\n font-weight: 700;\n line-height: 1.1;\n}\n\n.sm-search-result-link {\n display: block;\n width: fit-content;\n margin-block-end: 1rem;\n transition: color 0.3s;\n}\n\n.sm-search-result-link:hover,\n.sm-search-result-link:focus {\n color: var(--secondary);\n outline: 0;\n}\n\n.sm-matching-terms {\n display: flex;\n gap: 0.5em;\n font-size: var(--small);\n color: var(--surface);\n}\n\n.sm-matching-terms span {\n padding: 0 0.25em;\n background-color: var(--primary);\n border-radius: var(--radius);\n opacity: 0.75;\n}\n",".sm-author-profile-image {\n width: 6.5rem;\n height: 6.5rem;\n border: 1px solid var(--border-color);\n border-radius: 50%;\n box-shadow: var(--box-shadow);\n}\n\n.sm-author-location {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.35em;\n margin-block-end: 1rem;\n}\n\n.sm-author-location svg {\n width: 1em;\n height: 1em;\n fill: var(--element-light);\n}\n\n.sm-author-socials {\n display: flex;\n justify-content: center;\n margin-block-start: 2rem;\n gap: 1rem;\n}\n\n.sm-author-posts-container > h2 span {\n display: none;\n vertical-align: middle;\n}\n\n.paged .sm-author-posts-container > h2 span {\n display: initial;\n}\n\n.sm-author-posts-container > * {\n grid-column: content;\n}\n\n.sm-author-posts-container > h2 {\n margin: 3rem 0 0;\n /* border-top: 1px solid var(--border-color); */\n}\n\n.sm-author-posts-container .sm-basic-grid:last-child {\n padding-block-end: 3rem;\n}\n",".sm-404 {\n grid-column: content;\n}\n\n.sm-404 a {\n text-decoration: underline;\n}\n",".page-template .sm-grid > * {\n grid-column: content;\n}\n",".sm-card {\n position: relative;\n border-radius: var(--radius);\n transition: background 3s;\n}\n\n.sm-card::before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n content: '';\n border-radius: var(--radius);\n box-shadow: var(--box-shadow);\n opacity: 0;\n transition: opacity 0.3s;\n}\n\n.sm-card:hover,\n.sm-card:focus {\n outline: none;\n}\n\n.sm-card:hover::before,\n.sm-card:focus::before {\n opacity: 1;\n}\n\n.sm-card-link {\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n height: 100%;\n overflow: hidden;\n background-color: var(--surface-light);\n border-radius: var(--radius);\n}\n\n.sm-cta-card,\n.sm-tags-card {\n background-color: var(--surface-light);\n}\n\n.sm-card img {\n width: 100%;\n height: 100%;\n border-top-left-radius: var(--radius-small);\n border-top-right-radius: var(--radius-small);\n aspect-ratio: 16 / 9;\n object-fit: cover;\n}\n\n.sm-card h2 {\n margin: 0;\n font-size: 2rem;\n line-height: 1.1;\n}\n\n.sm-card h2:not(.large) {\n font-size: 1.35rem;\n}\n\n.sm-card-body {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n height: inherit;\n padding: 1rem;\n}\n\n.sm-card .sm-excerpt {\n margin-block-start: 0.75rem;\n font-size: 0.875rem;\n}\n\n.sm-card-footer {\n display: flex;\n justify-content: space-between;\n margin-block-start: 2rem;\n gap: 1rem;\n}\n\n.sm-card .sm-tag {\n display: inline-block;\n max-width: 70%;\n padding: 0 0.75em;\n overflow: hidden;\n font-size: var(--x-small);\n color: var(--element-light);\n text-overflow: ellipsis;\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n white-space: nowrap;\n background-color: var(--border-color);\n border-radius: var(--radius);\n}\n\n.sm-card .sm-reading-time {\n font-size: var(--x-small);\n color: var(--element-light);\n}\n\n@media (--tablet) {\n .sm-card-horizontal .sm-card-link {\n flex-direction: row;\n }\n\n .sm-grid-feature .sm-card-horizontal picture {\n max-width: 50%;\n }\n\n .sm-grid-feature .sm-card-horizontal img {\n max-width: none;\n }\n\n .sm-card-horizontal img {\n max-width: 12.5rem;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n}\n\n.sm-card-horizontal .sm-card-body {\n display: flex;\n flex: 1;\n flex-direction: column;\n justify-content: space-between;\n}\n\n.sm-card-1 .sm-card-horizontal .sm-card-link img {\n flex: 1;\n width: 50%;\n}\n\n/* Feature cards */\n.sm-feature-card {\n border-radius: var(--radius);\n}\n\n.sm-feature-card h2 {\n margin-top: 0;\n}\n\n/* CTA */\n.sm-cta-card {\n position: relative;\n}\n\n.sm-cta-card picture + form {\n height: auto;\n margin-block-start: 2rem;\n}\n\n.sm-cta-card img {\n position: absolute;\n top: 0;\n left: 50%;\n display: block;\n width: 4rem;\n height: 4rem;\n margin-inline: auto;\n transform: translate(-50%, -50%);\n}\n\n.sm-cta-card form {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n height: 100%;\n padding: 1.5rem 1rem;\n text-align: center;\n}\n\n.sm-cta-copy {\n display: flex;\n flex-direction: column;\n}\n\n.sm-cta-card h2 {\n margin: 0 0 0.5rem;\n line-height: 1.1;\n background: linear-gradient(45deg, var(--primary), var(--secondary));\n background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n.sm-cta-card p {\n font-size: 1.2rem;\n}\n\n.sm-cta-card input {\n width: 100%;\n padding: 0.25em;\n /* border-radius: var(--radius); */\n margin-block-start: 2rem;\n color: var(--element);\n text-align: center;\n background-color: transparent;\n border-bottom: 3px solid var(--border-color);\n transition: border-color 0.3s;\n}\n\n.sm-cta-card input:focus-visible {\n border-color: var(--element);\n outline: none;\n}\n\n.sm-cta-card input::placeholder {\n color: var(--element-light);\n text-align: center;\n opacity: 0.5;\n}\n\n.sm-cta-card button {\n margin-block-start: 2rem;\n}\n\n/* Tags */\n.sm-tags-card {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n overflow: hidden;\n}\n\n.sm-tags-card > * {\n flex: 1;\n}\n\n/* Tags card */\n.sm-tags-card h2 {\n margin: 1rem;\n}\n\n.sm-tags-card > h2 > a {\n transition: color var(--transition);\n}\n\n.sm-tags-card > h2 > a:hover {\n color: var(--primary);\n}\n\n.sm-tags-card > a {\n padding: 1rem;\n font-weight: 700;\n color: var(--element-light);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n border-bottom: 1px solid var(--border-color);\n transition: background-color 0.1s, color 0.1s;\n}\n\n.sm-tags-card > a:first-of-type {\n border-top: 1px solid var(--border-color);\n}\n\n.sm-tags-card > a:last-child {\n border-bottom: none;\n}\n\n.sm-tags-card span {\n float: right;\n font-variant-numeric: tabular-nums;\n}\n\n.sm-tags-card > a:hover {\n color: var(--surface);\n background-color: var(--secondary);\n}\n\n.sm-tags-card > a:nth-of-type(2):hover {\n background-color: hsla(\n var(--complementary-color) var(--saturation) var(--lightness) / 0.75\n );\n}\n\n.sm-tags-card > a:nth-of-type(3):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) var(--lightness) / 0.5\n );\n}\n\n.sm-tags-card > a:nth-of-type(4):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) var(--lightness) / 0.25\n );\n}\n\n.sm-tags-card > a:nth-of-type(5):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) var(--lightness) / 0.05\n );\n}\n\n:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(2):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) /\n 0.75\n );\n}\n\n:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(3):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) /\n 0.5\n );\n}\n:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(4):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) /\n 0.25\n );\n}\n:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(5):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) /\n 0.05\n );\n}\n\n.sm-card .sm-love-button {\n position: absolute;\n right: 1rem;\n bottom: 1rem;\n}\n\n.sm-card .sm-love-button svg {\n width: 1rem;\n height: 1rem;\n fill: var(--primary);\n}\n",".sm-form-button,\n.sm-button,\n.sm-icon-button,\n.sm-button-simple {\n padding: var(--button-padding);\n font-size: var(--small);\n font-weight: 700;\n line-height: 1;\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n border-radius: var(--radius);\n}\n\n.sm-form-button,\n.sm-button {\n color: var(--button-text);\n background-color: var(--primary);\n}\n\n/* Icon button */\n.sm-icon-button {\n display: flex;\n align-items: center;\n color: var(--element);\n text-align: center;\n white-space: nowrap;\n background-color: hsla(\n var(--primary-h) var(--saturation) var(--lightness) / 0.15\n );\n transition: background-color 0.3s;\n gap: 1em;\n}\n\n.sm-icon-button:hover {\n background-color: hsla(\n var(--primary-h) var(--saturation) var(--lightness) / 0.25\n );\n}\n\n.sm-icon-button svg {\n width: 1em;\n height: 1em;\n fill: var(--element);\n}\n\n/* Circle icon button \nUsed in navigation and pagination */\n.sm-circle-icon-button {\n box-sizing: content-box;\n width: 1em;\n height: 1em;\n padding: 0.25em;\n line-height: 1;\n border-radius: 50%;\n transition: background-color 0.3s;\n}\n\n.sm-circle-icon-button svg {\n width: 1em;\n height: 1em;\n fill: var(--element-light);\n}\n\n.sm-circle-icon-button:not([disabled]):hover {\n background-color: var(--border-color);\n}\n\n.sm-circle-icon-button[disabled] {\n opacity: 0.5;\n}\n\n/* Simple button\nUsed in footer */\n.sm-button-simple {\n display: flex;\n align-items: center;\n border: 1px solid var(--border-color);\n transition: background-color 0.3s;\n gap: 1em;\n}\n\n.sm-button-simple svg {\n width: 1em;\n height: 1em;\n fill: var(--element-light);\n}\n\n.sm-button-simple:focus-visible,\n.sm-button-simple:hover {\n background-color: var(--border-color);\n outline: none;\n}\n\n/* Circle close button \nUsed in search and */\n.sm-circle-close-button {\n position: absolute;\n top: 1rem;\n right: 1rem;\n box-sizing: content-box;\n\n width: max(1rem, 30px);\n height: max(1rem, 30px);\n padding: 0.25rem;\n line-height: 1;\n border-radius: 50%;\n transition: background-color 0.3s;\n}\n\n.sm-circle-close-button:hover {\n background-color: var(--border-color);\n}\n\n.sm-circle-close-button svg {\n width: max(1rem, 30px);\n height: max(1rem, 30px);\n fill: var(--element);\n}\n",".sm-overflow-container {\n position: relative;\n line-height: 1;\n}\n\n.sm-overflow-button {\n box-sizing: content-box;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1rem;\n height: 1rem;\n padding: 0.25rem;\n line-height: 0;\n line-height: 0;\n border-radius: 50%;\n transition: background-color var(--transition);\n transform: translate(0, 0.15em);\n}\n\n.sm-overflow-button svg {\n display: inline-block;\n width: 1em;\n height: 1em;\n line-height: 0;\n /* transform: translateY(0.125rem); */\n fill: var(--element);\n}\n\n.sm-overflow-menu {\n position: absolute;\n top: 2rem;\n left: 50%;\n z-index: 20;\n display: none;\n max-width: 75vw;\n background-color: var(--surface);\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n box-shadow: var(--box-shadow);\n transform: translate(-50%, 0);\n}\n\n.sm-overflow-menu > div {\n flex-direction: column;\n justify-content: center;\n padding: 1rem;\n gap: 1rem;\n}\n\n.sm-overflow-buttons {\n display: flex;\n}\n\n.sm-overflow-button:hover {\n background-color: var(--border-color);\n}\n\n.sm-overflow-menu::before {\n position: absolute;\n top: 0;\n left: 50%;\n pointer-events: none;\n content: '';\n border-color: transparent transparent var(--border-color) transparent;\n border-style: solid;\n border-width: 0.5rem;\n transform: translate(-50%, -100%);\n}\n\n[data-color-pref='light'] .sm-light-mode {\n display: none;\n}\n\n[data-color-pref='dark'] .sm-dark-mode {\n display: none;\n}\n\n/* Follow */\n.sm-overflow-follow,\n.sm-overflow-share,\n.sm-overflow-saves {\n display: none;\n}\n\n.sm-overflow-back {\n position: absolute;\n top: 0.5em;\n left: -0.5em;\n box-sizing: content-box;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1rem;\n height: 1rem;\n padding: 0.25em;\n line-height: 0;\n background-color: var(--surface-light);\n border-radius: 50%;\n box-shadow: var(--box-shadow);\n transform: translate(-100%, 50%);\n}\n\n.sm-overflow-back svg {\n display: inline-block;\n width: inherit;\n height: inherit;\n}\n\n.sm-show {\n display: flex;\n}\n\n.sm-hide {\n display: none;\n}\n",".sm-pagination {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--button-padding);\n font-size: var(--small);\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n grid-column: content;\n gap: var(--gap);\n}\n\n.sm-pagination,\n.sm-pagination-holder {\n margin-block: 6rem 3rem;\n}\n\n.sm-current {\n color: var(--primary);\n}\n\n.sm-pagination-item:hover {\n color: var(--primary);\n}\n\n.sm-prev {\n margin-inline-end: auto;\n}\n\n.sm-next {\n margin-inline-start: auto;\n}\n\n.sm-nav-disabled {\n opacity: 0.3;\n}\n\n.sm-circle-icon-button.sm-nav-disabled:hover {\n background-color: transparent;\n}\n",".sm-loading,\n.sm-footer-loading,\n.sm-success,\n.sm-footer-success,\n.sm-error,\n.sm-footer-error {\n display: none;\n}\n\n[data-members-form].loading .sm-default:not(.sm-cta-copy),\n[data-members-form].success .sm-default,\n[data-members-form].error .sm-default,\n[data-members-form].loading .sm-footer-default:not(.sm-footer-default-text),\n[data-members-form].success .sm-footer-default,\n[data-members-form].error .sm-footer-default {\n display: none;\n}\n\n[data-members-form].loading .sm-loading,\n[data-members-form].success .sm-success,\n[data-members-form].error .sm-error,\n[data-members-form].loading .sm-footer-loading,\n[data-members-form].success .sm-footer-success,\n[data-members-form].error .sm-footer-error {\n display: flex;\n}\n\n.sm-loading svg,\n.sm-footer-loading svg {\n animation: sm-spin 1s infinite linear;\n}\n\n@keyframes sm-spin {\n to {\n transform: rotate(1turn);\n }\n}\n",".sm-nav-menu-container {\n position: fixed;\n top: 0;\n left: 0;\n z-index: 35;\n display: none;\n /* align-items: center; */\n justify-content: center;\n width: 100%;\n height: 100%;\n height: 100vh;\n padding: 3rem var(--gap);\n overflow-y: auto;\n\n text-align: center;\n background-color: var(--surface);\n}\n\n.sm-nav-menu-container.sm-show-menu {\n display: flex;\n}\n\n.sm-nav-menu-navigation-container {\n display: flex;\n flex-direction: column;\n /* align-items: center; */\n gap: 1rem;\n height: 100vh;\n margin-bottom: 3rem;\n /* margin-block-start: 6rem; */\n}\n\n.sm-nav-menu-navigation-container .sm-navigation {\n flex-direction: column;\n align-items: center;\n}\n\n.sm-nav-menu-header {\n margin-block: 2rem 1rem;\n font-size: var(--small);\n color: var(--element-light);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n opacity: 0.8;\n}\n\n.sm-nav-menu-navigation-container .sm-navigation a {\n font-size: 1.25rem;\n font-weight: 700;\n}\n\n.sm-nav-menu-section {\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n justify-content: center;\n gap: var(--gap);\n}\n\n.sm-nav-menu-section :where(button, a) {\n justify-content: center;\n}\n\n.sm-nav-menu-navigation-container > .sm-icon-button {\n margin-block-start: 2rem;\n}\n\n.sm-nav-menu-grid-container {\n grid-template-columns: 1fr 1fr;\n gap: var(--gap);\n justify-content: space-between;\n width: 100%;\n}\n\n.sm-nav-menu-navigation-container :where(.sm-dark-mode, .sm-light-mode) {\n justify-content: center;\n margin-block-end: 3rem;\n}\n",".sm-header-grid > * {\n grid-column: content;\n text-align: center;\n}\n\n.sm-header-title {\n margin: 0;\n font-weight: 900;\n}\n\n.sm-header-excerpt {\n max-width: 66ch;\n margin-inline: auto;\n color: var(--element-light);\n opacity: 0.85;\n}\n\n.sm-header-image {\n width: 100%;\n aspect-ratio: 16 / 9;\n}\n\n.sm-header-image figcaption {\n margin-block-start: 3px;\n font-size: var(--small);\n opacity: 0.8;\n}\n\n.sm-header-image img {\n display: block;\n width: 100%;\n height: 100%;\n border-radius: var(--radius);\n object-fit: cover;\n}\n\n.sm-tag-count {\n display: inline-block;\n padding: var(--button-padding);\n margin-inline-start: 1em;\n font-family: 'Work Sans', sans-serif;\n font-size: var(--x-small);\n font-weight: 400;\n line-height: 1;\n color: var(--element-light);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n background-color: var(--border-color);\n border-radius: var(--radius);\n translate: 0 -0.5em;\n}\n",".sm-love-button {\n display: inline-block;\n transform: translateY(0.25em);\n}\n\n.sm-love-button .sm-heart-fill-icon {\n display: none;\n}\n\n.sm-love-button.sm-love-toggle .sm-heart-outline-icon {\n display: none;\n}\n\n.sm-love-button.sm-love-toggle .sm-heart-fill-icon {\n display: inline-block;\n}\n\n.sm-overflow-articles {\n display: grid;\n min-width: 18rem;\n max-width: 100%;\n gap: var(--gap);\n}\n\n.sm-saves {\n padding: 0.5em 1em;\n border-radius: var(--radius);\n}\n\n.sm-saves progress::-webkit-progress-bar {\n background-color: var(--primary-light);\n border-radius: var(--radius);\n opacity: 0.5;\n}\n\n.sm-saves progress::-webkit-progress-value {\n overflow: hidden;\n background-color: var(--primary);\n border-radius: var(--radius);\n}\n\n.sm-saves-meta {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--gap);\n}\n\n.sm-saves-meta button {\n font-size: 1rem;\n transform: none;\n}\n\n.sm-saves-title {\n font-family: var(--heading-typeface);\n font-weight: 700;\n text-align: left;\n transition: 0.3s color;\n}\n\n.sm-saves-title:hover {\n color: var(--primary);\n}\n\n.sm-saves-date {\n margin-block: 0.5rem 0;\n font-size: var(--x-small);\n text-align: left;\n}\n\n.sm-saves button span {\n line-height: 0;\n}\n",".sm-hero {\n position: relative;\n min-height: 60vmin;\n padding-block-end: 3rem;\n}\n\n.sm-hero + .sm-grid .sm-grid-home {\n padding-block-start: 3rem;\n}\n\n.sm-hero-inner {\n height: 100%;\n padding-block-start: 6rem;\n grid-column: content;\n}\n\n@media (--tablet) {\n .sm-hero-inner {\n display: grid;\n grid-template-columns: repeat(2, minmax(0, 1fr));\n gap: var(--gap);\n align-items: center;\n }\n}\n\n.sm-hero-left {\n position: relative;\n z-index: 1;\n display: flex;\n flex-direction: column;\n justify-content: center;\n height: 100%;\n padding-inline-end: 1rem;\n text-align: center;\n}\n\n.sm-hero-subtitle {\n margin-block-end: 1rem;\n font-family: var(--heading-typeface);\n font-size: var(--h1);\n font-weight: 900;\n line-height: 1.2;\n background-image: linear-gradient(45deg, var(--primary), var(--secondary));\n background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n@supports (color: color(display-p3 1 0.5 0)) {\n .sm-hero-subtitle {\n background-image: linear-gradient(\n 45deg,\n color(display-p3 var(--r) var(--g) var(--b)),\n color(display-p3 var(--cr) var(--cg) var(--cb))\n );\n }\n\n :root[data-color-pref='dark'] .sm-hero-subtitle {\n filter: brightness(1.5);\n }\n}\n\n.sm-hero-description {\n font-size: 1.15rem;\n color: var(--element-dark);\n}\n\n.sm-hero-bg {\n position: absolute;\n display: block;\n width: 100%;\n height: 100%;\n opacity: 0.25;\n object-fit: cover;\n mix-blend-mode: multiply;\n}\n\n.sm-hero-img img {\n display: block;\n width: 100%;\n height: auto;\n margin: 0 auto;\n border-radius: var(--radius);\n object-fit: cover;\n}\n\n.sm-hero-right {\n display: none;\n}\n\n.sm-hero-button-container:not(:empty) {\n display: flex;\n justify-content: center;\n margin-block-start: 2rem;\n gap: 1rem;\n}\n\n.sm-hero-cta-2 {\n position: relative;\n color: var(--element);\n background-color: transparent;\n}\n\n.sm-hero-cta-2 svg {\n position: absolute;\n top: 40%;\n left: 0;\n z-index: -1;\n width: 100%;\n height: 100%;\n /* opacity: 0.5; */\n}\n\n@media (--tablet) {\n .sm-hero-bg {\n display: none;\n }\n\n .sm-hero-img {\n max-height: 50vmin;\n }\n\n .sm-hero-left {\n text-align: start;\n }\n\n .sm-hero-right {\n display: initial;\n }\n\n .sm-hero-button-container:not(:empty) {\n justify-content: flex-start;\n }\n}\n",".sm-form {\n display: flex;\n flex-direction: column;\n width: 100%;\n max-width: var(--content-width);\n padding: var(--gap);\n margin: 2rem auto;\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n}\n\n.sm-form label,\n.sm-form input,\n.sm-form textarea,\n.sm-form button {\n /* display: inline-block; */\n}\n\n.sm-form input,\n.sm-form textarea {\n padding: var(--button-padding);\n margin-block-end: 1rem;\n color: var(--element);\n background-color: var(--surface);\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n}\n\n.sm-form textarea {\n height: 10rem;\n resize: none;\n}\n\n.sm-form input:focus-visible,\n.sm-form textarea:focus-visible {\n border-color: var(--secondary);\n outline: none;\n}\n\n.sm-form button:hover,\n.sm-form button:focus-visible {\n background-color: var(--secondary);\n outline: none;\n}\n",".sm-gradient-divider {\n height: 5rem;\n background-image: linear-gradient(0deg, var(--surface), var(--surface-dark));\n}\n\n.sm-gradient-divider-reverse {\n height: 5rem;\n background-image: linear-gradient(\n 180deg,\n var(--surface),\n var(--surface-dark)\n );\n}\n",".sm-post-toc {\n position: fixed;\n bottom: 28px;\n left: 28px;\n z-index: 2;\n pointer-events: none;\n transition: opacity 0.5s;\n isolation: isolate;\n}\n\n.sm-post-toc-btn {\n position: relative;\n box-sizing: content-box;\n width: 30px;\n height: 30px;\n padding: 0.75rem;\n pointer-events: all;\n background: var(--surface-light);\n border-radius: 50%;\n box-shadow: 0 4px 1rem hsl(var(--primary-h) var(--saturation) 9% / 0.1);\n transition: color var(--transition);\n --conic-gradient: var(--surface-light) 0deg 0%, var(--surface-light) 0deg 100%;\n}\n\n.sm-post-toc-btn::before {\n position: absolute;\n z-index: -1;\n content: '';\n background-image: conic-gradient(var(--conic-gradient));\n border-radius: 50%;\n opacity: 0.5;\n transition: background-image var(--transition);\n inset: -3px;\n}\n\n.sm-post-toc-btn:hover,\n.sm-post-toc-btn:focus-visible {\n color: var(--primary);\n}\n\n.sm-post-toc-btn svg {\n width: 100%;\n height: 100%;\n fill: currentcolor;\n}\n\n.sm-post-toc-contents {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n max-width: min(500px, calc(100vw - 56px));\n padding: 0.75rem;\n margin-block-end: 1rem;\n /* font-size: var(--small); */\n pointer-events: none;\n background: var(--surface-light);\n filter: drop-shadow(\n 0 4px 1rem hsl(var(--primary-h) var(--saturation) 9% / 0.1)\n );\n border-radius: 0 var(--radius) var(--radius) var(--radius);\n opacity: 0;\n transition: scale 0.2s ease-out, opacity 0.2s 0.1s ease-out,\n translate 0.2s 0.1s ease-out;\n transform-origin: bottom left;\n gap: 0.5rem;\n scale: 0;\n translate: 15px 10%;\n}\n\n.sm-post-toc-contents-title {\n position: absolute;\n top: 0;\n left: 0;\n padding: 0.15rem 0.75rem;\n font-size: var(--x-small);\n color: var(--surface-dark);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n background: var(--primary-dark);\n border-radius: var(--radius) var(--radius) 0 0;\n translate: 0 -100%;\n}\n\n.toc-show {\n pointer-events: all;\n opacity: 1;\n transition: scale 0.2s ease-in, opacity 0.2s ease-in, translate 0.2s ease-in;\n scale: 1;\n translate: 0 0;\n}\n\n.sm-toc-h3 {\n padding-inline-start: 0.5rem;\n}\n\n.sm-toc-h4 {\n padding-inline-start: 1rem;\n}\n\n.sm-toc-h5 {\n padding-inline-start: 1.5rem;\n}\n\n.sm-toc-h6 {\n padding-inline-start: 2rem;\n}\n\n.sm-toc-link {\n transition: color var(--transition);\n}\n\n.sm-toc-link:hover,\n.sm-toc-link:focus {\n color: var(--primary);\n}\n\n.sm-toc-active {\n color: var(--primary);\n}\n\n.toc-hide {\n opacity: 0;\n}\n\n.sm-toc-icon-close {\n display: none;\n}\n\n.toc-show ~ .sm-post-toc-btn .sm-toc-icon-close {\n display: initial;\n}\n\n.toc-show ~ .sm-post-toc-btn .sm-toc-icon {\n display: none;\n}\n","/* Blockquote */\nblockquote:not(.kg-blockquote-alt) {\n padding-inline-start: 2rem;\n border-left: 3px solid var(--border-color);\n}\n\n.kg-blockquote-alt {\n font-family: var(--heading-typeface);\n line-height: 1.2;\n}\n\n.kg-blockquote-alt::before,\n.kg-blockquote-alt::after {\n color: var(--secondary);\n}\n\n.kg-blockquote-alt::before {\n padding-inline-end: 0.1em;\n content: '\\002301';\n}\n\n.kg-blockquote-alt::after {\n content: '\\002301';\n}\n\n/* Cards and images */\n.kg-card {\n width: 100%;\n margin-inline: auto;\n}\n\n.kg-card,\n.kg-blockquote-alt {\n margin-block: 1rem 2rem;\n}\n\n.kg-image,\n.sm-post-content img {\n display: block;\n max-width: 100%;\n height: auto;\n margin-inline: auto;\n}\n\n.sm-post-content figcaption {\n padding: 0.25rem;\n font-size: var(--small);\n text-align: center;\n}\n\n.kg-width-wide,\n.kg-embed-card,\n.kg-gallery-card {\n grid-column: content;\n}\n\n.kg-embed-card .twitter-tweet {\n margin-inline: auto;\n}\n\n@media (--tablet) {\n .kg-width-wide,\n .kg-gallery-card {\n grid-column: wide;\n }\n}\n\n.kg-width-full {\n grid-column: start / end;\n}\n\n.kg-embed-card [src*='youtube'],\n.kg-embed-card [src*='vimeo'] {\n width: 100%;\n height: auto;\n aspect-ratio: 16 / 9;\n}\n\n.kg-embed-card iframe {\n /* stylelint-disable-next-line declaration-no-important */\n margin-inline: auto !important;\n}\n",".medium-zoom-overlay {\n z-index: 10;\n}\n\n.medium-zoom-image {\n z-index: 11;\n}\n"]} \ No newline at end of file +{"version":3,"sources":["index.css","abstracts/variables.css","base/reset.css","base/default.css","base/typography.css","layout/grid.css","layout/navbar.css","layout/footer.css","pages/home.css","pages/post.css","pages/post-content.css","pages/search.css","pages/author.css","pages/404.css","pages/page.css","components/card.css","components/button.css","components/overflow.css","components/pagination.css","components/subscribe.css","components/nav-menu.css","components/header.css","components/saves.css","components/hero.css","components/form.css","components/gradient.css","components/toc.css","vendor/kg.css","vendor/medium-zoom.css"],"names":[],"mappings":"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","file":"app.css","sourcesContent":["/* Abstracts */\n@import './abstracts/variables.css';\n\n/* Base */\n@import './base/reset.css';\n@import './base/default.css';\n@import './base/typography.css';\n\n/* Layout */\n@import './layout/grid.css';\n@import './layout/navbar.css';\n@import './layout/footer.css';\n\n/* Pages */\n@import './pages/home.css';\n@import './pages/post.css';\n@import './pages/post-content.css';\n@import './pages/search.css';\n@import './pages/author.css';\n@import './pages/404.css';\n@import './pages/page.css';\n\n/* Components */\n@import './components/card.css';\n@import './components/button.css';\n@import './components/overflow.css';\n@import './components/pagination.css';\n@import './components/subscribe.css';\n@import './components/nav-menu.css';\n@import './components/header.css';\n@import './components/saves.css';\n@import './components/hero.css';\n@import './components/form.css';\n@import './components/gradient.css';\n@import './components/toc.css';\n\n/* Vendor */\n@import './vendor/kg.css';\n@import './vendor/medium-zoom.css';\n","@custom-media --phone (min-width: 500px);\n@custom-media --tablet (min-width: 768px);\n@custom-media --laptop (min-width: 992px);\n@custom-media --desktop (min-width: 1200px);\n@custom-media --widescreen (min-width: 1400px);\n\n:root {\n /* Space */\n --tablet: 768px;\n --laptop: 992px;\n --desktop: 1200px;\n --widescreen: 1400px;\n --gap: 1rem;\n --gutter: max(20px, 3vw);\n --width: 992px;\n --post-width: 768px;\n --content-width: 700px;\n --radius: 0.5em;\n --radius-small: 3px;\n\n /* Type */\n --heading-typeface: 'Archivo', sans-serif;\n --mono-typeface: 'JetBrains Mono', 'Cascadia Code', 'Fira Code', 'Menlo',\n monospace;\n --letter-spacing: 0.2px;\n --h1: 2.488rem;\n --h2: 2.074rem;\n --h3: 1.728rem;\n --h4: 1.44rem;\n --h5: 1.2rem;\n --h6: 1rem;\n --small: 0.833rem;\n --x-small: 0.694rem;\n --xx-small: 0.579rem;\n --button-padding: 0.5em 0.75em;\n\n --transition: 0.3s;\n}\n\n/* Color scheme */\n:root[data-color-pref='light'] {\n --primary: hsl(var(--primary-h) var(--saturation) var(--lightness));\n --primary-light: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 1.5)\n );\n --primary-dark: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 0.5)\n );\n --secondary: hsl(\n var(--complementary-color) var(--saturation) var(--lightness)\n );\n --secondary-light: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5)\n );\n --secondary-dark: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 0.5)\n );\n\n --surface: hsl(var(--primary-h) 10% 96%);\n --surface-85: hsla(var(--primary-h) 10% 96% / 0.85);\n --surface-light: hsl(var(--primary-h) 10% 100%);\n --surface-dark: hsl(var(--primary-h) 10% 89%);\n --surface-darker: hsl(var(--primary-h) 10% 82%);\n\n --element: hsl(var(--primary-h) 10% 5%);\n --element-light: hsl(var(--primary-h) 10% 35%);\n --element-dark: hsl(var(--primary-h) 10% 1%);\n\n --border-color: hsla(var(--primary-h) 10% 82% / 0.5);\n --border-color-accent: hsla(var(--primary-h) 10% 72% / 0.5);\n --button-text: hsl(var(--primary-h) 10% 100%);\n\n --box-shadow: 0 0.7px 2.2px hsla(var(--primary-h) var(--saturation) 9% / 0.02),\n 0 1.6px 5.3px hsla(var(--primary-h) var(--saturation) 9% / 0.028),\n 0 3px 10px hsla(var(--primary-h) var(--saturation) 9% / 0.035),\n 0 5.4px 17.9px hsla(var(--primary-h) var(--saturation) 9% / 0.042),\n 0 10px 33.4px hsla(var(--primary-h) var(--saturation) 9% / 0.05),\n 0 24px 80px hsla(var(--primary-h) var(--saturation) 9% / 0.07);\n}\n\n:root[data-color-pref='dark'] {\n /* Color */\n --primary: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 1.5)\n );\n --primary-light: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 1.75)\n );\n --primary-dark: hsl(\n var(--primary-h) var(--saturation) calc(var(--lightness) * 1.15)\n );\n\n --secondary: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5)\n );\n --secondary-light: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.75)\n );\n --secondary-dark: hsl(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.15)\n );\n\n --element: hsl(var(--primary-h) 10% 96%);\n --element-light: hsl(var(--primary-h) 10% 100%);\n --element-dark: hsl(var(--primary-h) 10% 89%);\n --element-darker: hsl(var(--primary-h) 10% 82%);\n\n --surface: hsl(var(--primary-h) 10% 12%);\n --surface-85: hsla(var(--primary-h) 10% 15% / 0.85);\n --surface-light: hsl(var(--primary-h) 10% 18%);\n --surface-dark: hsl(var(--primary-h) 10% 8%);\n --surface-darker: hsl(var(--primary-h) 10% 3%);\n\n --border-color: hsla(var(--primary-h) 10% 35% / 0.5);\n --border-color-accent: hsla(var(--primary-h) 10% 25% / 0.5);\n --button-text: hsl(var(--primary-h) 10% 3%);\n\n --box-shadow: 0 0.7px 2.2px hsla(var(--primary-h) var(--saturation) 1% / 0.02),\n 0 1.6px 5.3px hsla(var(--primary-h) var(--saturation) 1% / 0.048),\n 0 3px 10px hsla(var(--primary-h) var(--saturation) 1% / 0.055),\n 0 5.4px 17.9px hsla(var(--primary-h) var(--saturation) 1% / 0.062),\n 0 10px 33.4px hsla(var(--primary-h) var(--saturation) 1% / 0.07),\n 0 24px 80px hsla(var(--primary-h) var(--saturation) 1% / 0.09);\n}\n","*,\n*:before,\n*:after {\n box-sizing: border-box;\n padding: 0;\n margin: 0;\n}\n\nbutton {\n cursor: pointer;\n background: none;\n border: none;\n}\n\na,\n:link,\n:visited {\n color: inherit;\n text-decoration: none;\n}\n\nul,\nol {\n padding-inline-start: 2em;\n}\n\ninput,\ntextarea,\nbutton {\n font-family: inherit;\n font-size: inherit;\n line-height: inherit;\n color: inherit;\n border: none;\n}\n","html {\n height: 100%;\n font-family: 'Work Sans', system-ui, -apple-system, BlinkMacSystemFont,\n 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue',\n sans-serif;\n\n font-size: 1rem;\n font-size: clamp(\n 1rem,\n 0.9285714285714286rem + 0.35714285714285715vw,\n 1.25rem\n );\n font-size: 1rem;\n font-size: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);\n line-height: 1.5;\n color: var(--element);\n background-color: var(--surface);\n scroll-behavior: smooth;\n scroll-padding-block-start: 3.5rem;\n}\n\nbody {\n display: flex;\n flex-direction: column;\n height: 100%;\n}\n\n:target::before {\n margin-inline-end: 0.25em;\n color: var(--primary);\n content: '➠';\n}\n\n::selection {\n color: #000;\n background-color: var(--primary-light);\n}\n\n.sm-grid > .sm-zap {\n grid-column: content;\n}\n\n.sm-zap {\n position: relative;\n color: var(--border-color);\n text-align: center;\n}\n\n.sm-zap::before,\n.sm-zap::after {\n position: absolute;\n top: 50%;\n width: 48%;\n height: 1px;\n content: '';\n}\n\n.sm-zap::before {\n left: 0;\n background-image: linear-gradient(90deg, var(--border-color), transparent);\n}\n\n.sm-zap::after {\n right: 0;\n background-image: linear-gradient(-90deg, var(--border-color), transparent);\n}\n","/* work-sans-regular - latin */\n@font-face {\n font-family: 'Work Sans';\n font-style: normal;\n font-weight: 400;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/work-sans-v17-latin-regular.woff2') format('woff2'),\n /* Chrome 26+, Opera 23+, Firefox 39+ */\n url('/assets/fonts/work-sans-v17-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\n}\n/* work-sans-700 - latin */\n@font-face {\n font-family: 'Work Sans';\n font-style: normal;\n font-weight: 700;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/work-sans-v17-latin-700.woff2') format('woff2'),\n /* Chrome 26+, Opera 23+, Firefox 39+ */\n url('/assets/fonts/work-sans-v17-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\n}\n/* work-sans-italic - latin */\n@font-face {\n font-family: 'Work Sans';\n font-style: italic;\n font-weight: 400;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/work-sans-v17-latin-italic.woff2') format('woff2'),\n /* Chrome 26+, Opera 23+, Firefox 39+ */\n url('/assets/fonts/work-sans-v17-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\n}\n/* work-sans-700italic - latin */\n@font-face {\n font-family: 'Work Sans';\n font-style: italic;\n font-weight: 700;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/work-sans-v17-latin-700italic.woff2') format('woff2'),\n /* Chrome 26+, Opera 23+, Firefox 39+ */\n url('/assets/fonts/work-sans-v17-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */\n}\n\n@font-face {\n font-family: Archivo;\n font-style: normal;\n font-weight: 700;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/archivo-v18-latin-700.woff2') format('woff2'),\n url('/assets/fonts/archivo-v18-latin-700.woff') format('woff');\n}\n\n@font-face {\n font-family: Archivo;\n font-style: italic;\n font-weight: 700;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/archivo-v18-latin-700italic.woff2') format('woff2'),\n url('/assets/fonts/archivo-v18-latin-700italic.woff') format('woff');\n}\n\n@font-face {\n font-family: Archivo;\n font-weight: 900;\n font-display: swap;\n src: local(''),\n url('/assets/fonts/archivo-v18-latin-900.woff2') format('woff2'),\n url('/assets/fonts/archivo-v18-latin-900.woff') format('woff');\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n margin: 3rem 0 1.38rem;\n font-family: Archivo, sans-serif;\n font-weight: 700;\n line-height: 1.3;\n}\n\nh1 {\n margin-top: 0;\n font-size: var(--h1);\n}\n\nh2 {\n font-size: var(--h2);\n}\n\nh3 {\n font-size: var(--h3);\n}\n\nh4 {\n font-size: var(--h4);\n}\n\nh5 {\n font-size: var(--h5);\n}\n\nh6 {\n font-size: var(--h6);\n}\n","[class*='grid'] {\n display: grid;\n}\n\n.sm-grid {\n grid-template-columns:\n [start] var(--gutter) [content-start] 1fr [content-end] var(--gutter)\n [end];\n}\n\n.sm-header-grid {\n grid-template-columns:\n [start] var(--gutter) 1fr 1fr [content-start] minmax(\n min(300px, 100%),\n var(--post-width)\n )\n [content-end]\n 1fr 1fr var(--gutter) [end];\n margin-block: 6rem 3rem;\n row-gap: 2rem;\n}\n\n.sm-content-grid {\n grid-template-columns:\n [start] var(--gutter)\n [full-start] 1fr [wide-start] 1fr [content-start] minmax(\n min(300px, 100%),\n var(--content-width)\n )\n [content-end]\n 1fr [wide-end] 1fr [full-end] var(--gutter) [end];\n}\n\n.sm-basic-grid {\n grid-template-columns: 1fr;\n gap: var(--gap);\n padding-block: 3rem 6rem;\n}\n\n.sm-grid > .sm-basic-grid {\n grid-column: content;\n}\n\n@media (--phone) {\n .sm-basic-grid {\n grid-template-columns: 1fr 1fr;\n }\n}\n\n@media (--tablet) {\n .sm-grid {\n grid-template-columns:\n [start] var(--gutter) 1fr [content-start] minmax(\n min(100%, 600px),\n var(--width)\n )\n [content-end] 1fr var(--gutter)\n [end];\n }\n\n .sm-basic-grid {\n grid-template-columns: 1fr 1fr 1fr;\n }\n}\n",".sm-navbar-container {\n position: relative;\n position: fixed;\n top: 0;\n left: 0;\n z-index: 10;\n width: 100%;\n background-color: var(--surface);\n /* box-shadow: 0 1px 1em rgb(0 0 0 / 0.15); */\n}\n\n.sm-navbar {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.75rem 0;\n grid-column: content;\n}\n\n.sm-navbar button,\n.sm-search-button {\n box-sizing: content-box;\n font-size: var(--small);\n line-height: 1;\n}\n\n.sm-navbar button:not(.sm-overflow-button) svg,\n.sm-search-button svg {\n width: max(1rem, 20px);\n height: max(1rem, 20px);\n fill: var(--element);\n}\n\n.sm-navbar-left {\n display: flex;\n gap: 1rem;\n align-items: baseline;\n}\n\n.sm-site-title {\n margin: 0;\n overflow: hidden;\n font-family: var(--heading-typeface);\n font-size: 1rem;\n font-weight: 800;\n line-height: 1.1;\n white-space: nowrap;\n}\n\n@media (--tablet) {\n .sm-site-title {\n font-size: 1.15rem;\n }\n}\n\n.sm-navigation-container {\n display: none;\n gap: 0.25rem;\n align-items: flex-end;\n}\n\n.sm-navbar .sm-navbar-menu-button {\n align-self: flex-end;\n line-height: 0;\n}\n\n@media (--tablet) {\n .sm-navigation-container {\n display: flex;\n }\n\n .sm-navbar-menu-button {\n display: none;\n }\n}\n\n.sm-navigation {\n display: flex;\n padding-inline-start: 0;\n list-style-type: none;\n gap: 1rem;\n}\n\n.sm-navigation-item {\n position: relative;\n font-size: var(--small);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n}\n\n.sm-navigation-item a::before {\n position: absolute;\n bottom: 0;\n left: 0;\n z-index: -1;\n width: 100%;\n height: 2px;\n content: '';\n background-color: var(--primary);\n border-radius: var(--radius);\n transition: clip-path 0.3s;\n clip-path: inset(0 100% 0 0);\n}\n\n.sm-navigation-item a:hover::before {\n clip-path: inset(0 0 0 0);\n}\n\n.sm-navbar-right {\n display: flex;\n gap: 1rem;\n align-items: center;\n}\n",".sm-footer-container {\n margin-block-start: auto;\n background-color: var(--surface-dark);\n /* gap: 1rem var(--gap); */\n}\n\n.sm-footer {\n padding-block: 2rem;\n font-size: var(--small);\n color: var(--element-dark);\n grid-column: content;\n}\n\n.sm-footer > *:not(:last-child) {\n margin-block-end: 1em;\n}\n\n@media (--phone) {\n .sm-footer {\n display: grid;\n grid-template-columns: repeat(3, minmax(0, 1fr));\n gap: 1rem var(--gap);\n margin-block-end: 0;\n }\n\n .sm-footer > div:not(:last-child) {\n padding-inline-end: 1em;\n margin-block-end: 0;\n }\n}\n\n.sm-footer-title {\n font-family: var(--heading-typeface);\n font-weight: 700;\n}\n\n.sm-footer-secondary-navigation ul {\n padding: 0;\n list-style: none;\n}\n\n.sm-footer input {\n display: block;\n width: 100%;\n margin-block: 0.25em 0.75em;\n color: var(--primary);\n background-color: transparent;\n border-bottom: 1px solid var(--border-color);\n transition: border-color 0.3s;\n}\n\n.sm-footer input::placeholder {\n font-size: var(--x-small);\n color: var(--element-light);\n opacity: 0.5;\n}\n\n.sm-footer .sm-button-simple {\n font-size: var(--x-small);\n font-weight: 400;\n}\n\n.sm-footer input:focus-visible {\n border-color: var(--element-light);\n outline: 0;\n}\n\n.sm-footer-meta {\n padding-block: 2rem;\n font-size: var(--x-small);\n color: var(--element-light);\n text-align: center;\n border-top: 1px solid var(--border-color);\n grid-column: content;\n}\n\n.sm-footer-meta a {\n white-space: nowrap;\n}\n",".sm-home-accent {\n background-color: var(--surface-dark);\n}\n\n.sm-home-accent .sm-card,\n.sm-home-accent .sm-cta-card {\n border-color: var(--border-color-accent);\n}\n\n.sm-home-accent .sm-card .sm-tag {\n background-color: var(--surface-darker);\n}\n\n.home-template .sm-pagination {\n margin-block: var(--gap) 3rem;\n}\n\n/* Grid */\n.sm-grid-home {\n display: grid;\n gap: var(--gap);\n grid-column: content;\n padding: 6rem 0;\n grid-template-columns: repeat(auto-fit, minmax(min(21.875rem, 100%), 1fr));\n}\n\n.sm-card-2.sm-card-horizontal,\n.sm-card-3.sm-card-vertical,\n.sm-card-4.sm-card-vertical,\n.sm-card-5.sm-card-vertical,\n.sm-card-6.sm-card-vertical,\n.sm-card-7.sm-card-vertical,\n.sm-card-8.sm-card-vertical,\n.sm-card-9.sm-card-vertical,\n.sm-card-10.sm-card-vertical,\n.sm-card-11.sm-card-horizontal,\n.sm-card-12.sm-card-vertical,\n.sm-card-13.sm-card-vertical,\n.sm-card-14.sm-card-vertical,\n.sm-card-15.sm-card-vertical {\n display: none;\n}\n\n.sm-card-1.sm-card-horizontal .sm-card-link {\n flex-direction: column;\n}\n\n.sm-card-1.sm-card-horizontal .sm-card-link > img {\n width: 100%;\n max-width: 100%;\n}\n\n@media (--tablet) {\n .sm-card-1.sm-card-horizontal .sm-card-link {\n flex-direction: row;\n }\n .sm-card-1.sm-card-horizontal .sm-card-link > img {\n width: 50%;\n }\n}\n\n@media (--tablet) {\n .sm-grid-feature {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n grid-template-areas:\n 'card-1 card-1 card-1 card-1'\n 'card-2 card-2 card-3 card-3'\n 'card-4 card-4 card-5 card-5';\n }\n\n .sm-grid-feature-left,\n .sm-grid-feature-right {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n\n .sm-card-1 {\n grid-area: card-1;\n }\n\n .sm-card-2 {\n grid-area: card-2;\n }\n\n .sm-card-3 {\n grid-area: card-3;\n }\n\n .sm-card-4 {\n grid-area: card-4;\n }\n .sm-card-5 {\n grid-area: card-5;\n }\n\n .sm-grid-feature-left {\n grid-template-areas:\n 'feature card-6 card-6'\n 'feature card-7 card-7'\n 'card-8 card-9 card-10';\n }\n\n .sm-grid-feature-right {\n grid-template-areas:\n 'card-11 card-11 feature'\n 'card-12 card-12 feature'\n 'card-13 card-14 card-15';\n }\n\n .sm-card-2.sm-card-horizontal,\n .sm-card-3.sm-card-horizontal,\n .sm-card-4.sm-card-horizontal,\n .sm-card-5.sm-card-horizontal,\n .sm-card-6.sm-card-vertical,\n .sm-card-7.sm-card-vertical,\n .sm-card-8.sm-card-horizontal,\n .sm-card-9.sm-card-horizontal,\n .sm-card-10.sm-card-horizontal,\n .sm-card-11.sm-card-vertical,\n .sm-card-12.sm-card-vertical,\n .sm-card-13.sm-card-horizontal,\n .sm-card-14.sm-card-horizontal,\n .sm-card-15.sm-card-horizontal {\n display: none;\n }\n\n .sm-card-2.sm-card-vertical,\n .sm-card-3.sm-card-vertical,\n .sm-card-4.sm-card-vertical,\n .sm-card-5.sm-card-vertical,\n .sm-card-6.sm-card-horizontal,\n .sm-card-7.sm-card-horizontal,\n .sm-card-8.sm-card-vertical,\n .sm-card-9.sm-card-vertical,\n .sm-card-10.sm-card-vertical,\n .sm-card-11.sm-card-horizontal,\n .sm-card-12.sm-card-horizontal,\n .sm-card-13.sm-card-vertical,\n .sm-card-14.sm-card-vertical,\n .sm-card-15.sm-card-vertical {\n display: initial;\n }\n\n .sm-feature-card {\n grid-area: feature;\n }\n\n .sm-card-6 {\n grid-area: card-6;\n }\n\n .sm-card-7 {\n grid-area: card-7;\n }\n .sm-card-8 {\n grid-area: card-8;\n }\n .sm-card-9 {\n grid-area: card-9;\n }\n .sm-card-10 {\n grid-area: card-10;\n }\n .sm-card-11 {\n grid-area: card-11;\n }\n .sm-card-12 {\n grid-area: card-12;\n }\n .sm-card-13 {\n grid-area: card-13;\n }\n .sm-card-14 {\n grid-area: card-14;\n }\n .sm-card-15 {\n grid-area: card-15;\n }\n}\n",".sm-post-title {\n margin-block-end: 1rem;\n}\n\n/* TODO - Combine with card.css */\n.sm-post-excerpt {\n max-width: 66ch;\n margin-inline: auto;\n color: var(--element-light);\n opacity: 0.75;\n}\n\n.sm-post-author-block {\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: left;\n gap: 0.5rem;\n}\n\n.sm-post-author-block p {\n text-align: left;\n}\n\n.sm-post-author-profile-image {\n line-height: 1;\n}\n\n.sm-post-author-profile-image:empty {\n display: none;\n}\n\n.sm-post-author-profile-image:empty + div {\n text-align: center;\n}\n\n.sm-post-author-profile-image img {\n position: relative;\n z-index: 5;\n width: 3rem;\n height: 3rem;\n border: 1px solid var(--border-color);\n border-radius: 50%;\n object-fit: cover;\n}\n\n.sm-post-author-profile-image img + img {\n z-index: 4;\n margin-inline-end: -1rem;\n transform: translateX(-1rem);\n}\n\n.sm-post-author-profile-image img:nth-of-type(3) {\n z-index: 3;\n}\n\n.sm-post-author-profile-image img:nth-of-type(4) {\n z-index: 2;\n}\n\n.sm-post-author-profile-image img:nth-of-type(5) {\n z-index: 1;\n}\n\n.sm-post-meta {\n display: flex;\n flex-wrap: wrap;\n font-size: var(--x-small);\n color: var(--element-light);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n opacity: 0.8;\n gap: 0 0.5em;\n}\n\n.sm-post-meta > *:not(:last-child):after {\n margin-inline-start: 0.5em;\n content: '\\002301';\n}\n\n.sm-post-meta > a:hover::after {\n color: var(--element-light);\n}\n\n.sm-post-save-button {\n display: flex;\n align-items: center;\n text-transform: uppercase;\n transition: color 0.3s;\n}\n\n.sm-post-save-button.sm-love-button {\n transform: none;\n}\n\n.sm-post-meta a:hover,\n.sm-post-save-button:hover {\n color: var(--primary);\n}\n\n.sm-post-save-button span {\n display: flex;\n align-items: center;\n gap: 3px;\n}\n.sm-post-save-button.sm-love-button.sm-love-toggle .sm-heart-fill-icon {\n display: flex;\n}\n\n.sm-post-save-button svg {\n width: 1em;\n height: 1em;\n fill: currentcolor;\n}\n\n/* Related posts */\n.sm-related-posts {\n margin-block: 1rem 6rem;\n grid-column: content;\n}\n\n/* Related posts block */\n.sm-related-posts h2 {\n margin-block-start: 1rem;\n}\n\n.sm-related-posts-grid-container {\n grid-template-columns: 1fr;\n gap: var(--gap);\n}\n\n@media (--phone) {\n .sm-related-posts-grid-container {\n grid-template-columns: 1fr 1fr;\n }\n\n .sm-related-posts-grid-container > article:last-child {\n display: none;\n }\n}\n\n@media (--tablet) {\n .sm-related-posts-grid-container {\n grid-template-columns: repeat(3, 1fr);\n }\n .sm-related-posts-grid-container > article:last-child {\n display: initial;\n }\n}\n\n.sm-related-posts .sm-card {\n grid-area: auto;\n}\n\n/* Comments */\n/* stylelint-disable-next-line selector-max-id */\n#ghost-comments-root {\n grid-column: content;\n}\n","/* Content */\n.sm-post-content {\n margin-block-end: 3rem;\n}\n\n.sm-post-content > * {\n grid-column: content;\n margin-block-end: 1rem;\n}\n\n/* Links */\n.sm-post-content a {\n text-decoration: underline;\n text-decoration-thickness: 2px;\n transition: text-decoration-color 0.1s;\n}\n\n.sm-post-content a:hover {\n text-decoration-color: var(--primary);\n}\n\n/* Divider */\n.sm-post-content hr {\n height: 1px;\n background-color: var(--border-color);\n border: none;\n}\n\n/* Table */\n.sm-table-wrapper {\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n border-radius: var(--radius);\n}\n\n.sm-post-content table {\n width: 100%;\n border-collapse: collapse;\n}\n\n.sm-post-content tbody tr {\n border-top: 1px solid var(--border-color);\n transition: background-color 0.3s;\n}\n\n.sm-post-content tbody tr:hover {\n background-color: var(--surface-dark);\n}\n\n.sm-post-content thead th {\n padding: var(--radius);\n font-family: var(--heading-typeface);\n text-align: left;\n}\n\n.sm-post-content tbody td {\n padding: var(--radius);\n font-size: var(--small);\n}\n\n/* Code */\n.sm-post-content code:not([class*='language']) {\n padding: 0.15em 0.25em;\n font-family: var(--mono-typeface);\n font-size: var(--small);\n color: var(--element-light);\n background-color: var(--border-color);\n border-radius: 4px;\n}\n\n/* List */\n.sm-post-content li {\n line-height: inherit;\n}\n\n.sm-post-content li:not(:last-child) {\n margin-block-end: 0.5em;\n}\n",".sm-search {\n position: fixed;\n top: 0;\n left: 0;\n z-index: 35;\n display: none;\n width: 100%;\n height: 100%;\n overflow: auto;\n background-color: var(--surface-85);\n backdrop-filter: blur(15px);\n}\n\n.sm-search-form {\n margin-block-start: 1.5rem;\n grid-auto-rows: min-content;\n}\n\n.sm-show-search {\n display: initial;\n}\n\n.sm-search-form-container {\n grid-column: content;\n margin-block: 2rem;\n}\n\n.sm-search-input-container {\n position: relative;\n}\n\n.sm-clear-search-button {\n position: absolute;\n top: 50%;\n right: 0.75em;\n box-sizing: content-box;\n display: none;\n width: 1em;\n height: 1em;\n line-height: 1;\n transform: translate(0, -50%);\n}\n\n.sm-clear-search-button.sm-show-clear-button {\n display: initial;\n}\n\n.sm-clear-search-button svg {\n width: 1em;\n height: 1em;\n transition: fill 0.3s;\n fill: var(--element-light);\n}\n\n.sm-clear-search-button:hover svg {\n fill: var(--secondary);\n}\n\n.sm-search-form input {\n width: 100%;\n padding: var(--button-padding);\n color: var(--element);\n background-color: var(--surface-dark);\n border: 1px solid transparent;\n border-radius: var(--radius);\n caret-color: var(--secondary);\n}\n\n.sm-search-form input::placeholder {\n color: var(--element-dark);\n}\n\n.sm-search-form input:focus-visible {\n border-color: var(--primary);\n outline: 0;\n}\n\n.sm-search-results-container {\n grid-column: content;\n padding-block-end: 3rem;\n}\n\n.sm-search-result {\n font-family: var(--heading-typeface);\n font-size: var(--h3);\n font-weight: 700;\n line-height: 1.1;\n}\n\n.sm-search-result-link {\n display: block;\n width: fit-content;\n margin-block-end: 1rem;\n transition: color 0.3s;\n}\n\n.sm-search-result-link:hover,\n.sm-search-result-link:focus {\n color: var(--secondary);\n outline: 0;\n}\n\n.sm-matching-terms {\n display: flex;\n gap: 0.5em;\n font-size: var(--small);\n color: var(--surface);\n}\n\n.sm-matching-terms span {\n padding: 0 0.25em;\n background-color: var(--primary);\n border-radius: var(--radius);\n opacity: 0.75;\n}\n",".sm-author-profile-image {\n width: 6.5rem;\n height: 6.5rem;\n border: 1px solid var(--border-color);\n border-radius: 50%;\n box-shadow: var(--box-shadow);\n}\n\n.sm-author-location {\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 0.35em;\n margin-block-end: 1rem;\n}\n\n.sm-author-location svg {\n width: 1em;\n height: 1em;\n fill: var(--element-light);\n}\n\n.sm-author-socials {\n display: flex;\n justify-content: center;\n margin-block-start: 2rem;\n gap: 1rem;\n}\n\n.sm-author-posts-container > h2 span {\n display: none;\n vertical-align: middle;\n}\n\n.paged .sm-author-posts-container > h2 span {\n display: initial;\n}\n\n.sm-author-posts-container > * {\n grid-column: content;\n}\n\n.sm-author-posts-container > h2 {\n margin: 3rem 0 0;\n /* border-top: 1px solid var(--border-color); */\n}\n\n.sm-author-posts-container .sm-basic-grid:last-child {\n padding-block-end: 3rem;\n}\n",".sm-404 {\n grid-column: content;\n}\n\n.sm-404 a {\n text-decoration: underline;\n}\n",".page-template .sm-grid > * {\n grid-column: content;\n}\n",".sm-card {\n position: relative;\n border-radius: var(--radius);\n transition: background 3s;\n}\n\n.sm-card::before {\n position: absolute;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n content: '';\n border-radius: var(--radius);\n box-shadow: var(--box-shadow);\n opacity: 0;\n transition: opacity 0.3s;\n}\n\n.sm-card:hover,\n.sm-card:focus {\n outline: none;\n}\n\n.sm-card:hover::before,\n.sm-card:focus::before {\n opacity: 1;\n}\n\n.sm-card-link {\n position: relative;\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n height: 100%;\n overflow: hidden;\n background-color: var(--surface-light);\n border-radius: var(--radius);\n}\n\n.sm-cta-card,\n.sm-tags-card {\n background-color: var(--surface-light);\n}\n\n.sm-card img {\n width: 100%;\n height: 100%;\n border-top-left-radius: var(--radius-small);\n border-top-right-radius: var(--radius-small);\n aspect-ratio: 16 / 9;\n object-fit: cover;\n}\n\n.sm-card h2 {\n margin: 0;\n font-size: 2rem;\n line-height: 1.1;\n}\n\n.sm-card h2:not(.large) {\n font-size: 1.35rem;\n}\n\n.sm-card-body {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n height: inherit;\n padding: 1rem;\n}\n\n.sm-card .sm-excerpt {\n margin-block-start: 0.75rem;\n font-size: 0.875rem;\n}\n\n.sm-card-footer {\n display: flex;\n justify-content: space-between;\n margin-block-start: 2rem;\n gap: 1rem;\n}\n\n.sm-card .sm-tag {\n display: inline-block;\n max-width: 70%;\n padding: 0 0.75em;\n overflow: hidden;\n font-size: var(--x-small);\n color: var(--element-light);\n text-overflow: ellipsis;\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n white-space: nowrap;\n background-color: var(--border-color);\n border-radius: var(--radius);\n}\n\n.sm-card .sm-reading-time {\n font-size: var(--x-small);\n color: var(--element-light);\n}\n\n@media (--tablet) {\n .sm-card-horizontal .sm-card-link {\n flex-direction: row;\n }\n\n .sm-grid-feature .sm-card-horizontal picture {\n max-width: 50%;\n }\n\n .sm-grid-feature .sm-card-horizontal img {\n max-width: none;\n }\n\n .sm-card-horizontal img {\n max-width: 12.5rem;\n border-top-right-radius: 0;\n border-bottom-right-radius: 0;\n }\n}\n\n.sm-card-horizontal .sm-card-body {\n display: flex;\n flex: 1;\n flex-direction: column;\n justify-content: space-between;\n}\n\n.sm-card-1 .sm-card-horizontal .sm-card-link img {\n flex: 1;\n width: 50%;\n}\n\n/* Feature cards */\n.sm-feature-card {\n border-radius: var(--radius);\n}\n\n.sm-feature-card h2 {\n margin-top: 0;\n}\n\n/* CTA */\n.sm-cta-card {\n position: relative;\n}\n\n.sm-cta-card picture + form {\n height: auto;\n margin-block-start: 2rem;\n}\n\n.sm-cta-card img {\n position: absolute;\n top: 0;\n left: 50%;\n display: block;\n width: 4rem;\n height: 4rem;\n margin-inline: auto;\n transform: translate(-50%, -50%);\n}\n\n.sm-cta-card form {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n height: 100%;\n padding: 1.5rem 1rem;\n text-align: center;\n}\n\n.sm-cta-copy {\n display: flex;\n flex-direction: column;\n}\n\n.sm-cta-card h2 {\n margin: 0 0 0.5rem;\n line-height: 1.1;\n background: linear-gradient(45deg, var(--primary), var(--secondary));\n background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n.sm-cta-card input {\n width: 100%;\n padding: 0.25em;\n margin-block-start: 2rem;\n color: var(--element);\n text-align: center;\n background-color: transparent;\n border-bottom: 3px solid var(--border-color);\n transition: border-color 0.3s;\n}\n\n.sm-cta-card input:focus-visible {\n border-color: var(--element);\n outline: none;\n}\n\n.sm-cta-card input::placeholder {\n color: var(--element-light);\n text-align: center;\n opacity: 0.5;\n}\n\n.sm-cta-card button {\n margin-block-start: 2rem;\n}\n\n/* Tags */\n.sm-tags-card {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n overflow: hidden;\n}\n\n.sm-tags-card > * {\n flex: 1;\n}\n\n/* Tags card */\n.sm-tags-card h2 {\n margin: 1rem;\n}\n\n.sm-tags-card > h2 > a {\n transition: color var(--transition);\n}\n\n.sm-tags-card > h2 > a:hover {\n color: var(--primary);\n}\n\n.sm-tags-card > a {\n padding: 1rem;\n font-weight: 700;\n color: var(--element-light);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n border-bottom: 1px solid var(--border-color);\n transition: background-color 0.1s, color 0.1s;\n}\n\n.sm-tags-card > a:first-of-type {\n border-top: 1px solid var(--border-color);\n}\n\n.sm-tags-card > a:last-child {\n border-bottom: none;\n}\n\n.sm-tags-card span {\n float: right;\n font-variant-numeric: tabular-nums;\n}\n\n.sm-tags-card > a:hover {\n color: var(--surface);\n background-color: var(--secondary);\n}\n\n.sm-tags-card > a:nth-of-type(2):hover {\n background-color: hsla(\n var(--complementary-color) var(--saturation) var(--lightness) / 0.75\n );\n}\n\n.sm-tags-card > a:nth-of-type(3):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) var(--lightness) / 0.5\n );\n}\n\n.sm-tags-card > a:nth-of-type(4):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) var(--lightness) / 0.25\n );\n}\n\n.sm-tags-card > a:nth-of-type(5):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) var(--lightness) / 0.05\n );\n}\n\n:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(2):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) /\n 0.75\n );\n}\n\n:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(3):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) /\n 0.5\n );\n}\n:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(4):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) /\n 0.25\n );\n}\n:root[data-color-pref='dark'] .sm-tags-card > a:nth-of-type(5):hover {\n color: var(--element);\n background-color: hsla(\n var(--complementary-color) var(--saturation) calc(var(--lightness) * 1.5) /\n 0.05\n );\n}\n\n.sm-card .sm-love-button {\n position: absolute;\n right: 1rem;\n bottom: 1rem;\n}\n\n.sm-card .sm-love-button svg {\n width: 1rem;\n height: 1rem;\n fill: var(--primary);\n}\n",".sm-form-button,\n.sm-button,\n.sm-icon-button,\n.sm-button-simple {\n padding: var(--button-padding);\n font-size: var(--small);\n font-weight: 700;\n line-height: 1;\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n border-radius: var(--radius);\n}\n\n.sm-form-button,\n.sm-button {\n color: var(--button-text);\n background-color: var(--primary);\n}\n\n/* Icon button */\n.sm-icon-button {\n display: flex;\n align-items: center;\n color: var(--element);\n text-align: center;\n white-space: nowrap;\n background-color: hsla(\n var(--primary-h) var(--saturation) var(--lightness) / 0.15\n );\n transition: background-color 0.3s;\n gap: 1em;\n}\n\n.sm-icon-button:hover {\n background-color: hsla(\n var(--primary-h) var(--saturation) var(--lightness) / 0.25\n );\n}\n\n.sm-icon-button svg {\n width: 1em;\n height: 1em;\n fill: var(--element);\n}\n\n/* Circle icon button \nUsed in navigation and pagination */\n.sm-circle-icon-button {\n box-sizing: content-box;\n width: 1em;\n height: 1em;\n padding: 0.25em;\n line-height: 1;\n border-radius: 50%;\n transition: background-color 0.3s;\n}\n\n.sm-circle-icon-button svg {\n width: 1em;\n height: 1em;\n fill: var(--element-light);\n}\n\n.sm-circle-icon-button:not([disabled]):hover {\n background-color: var(--border-color);\n}\n\n.sm-circle-icon-button[disabled] {\n opacity: 0.5;\n}\n\n/* Simple button\nUsed in footer */\n.sm-button-simple {\n display: flex;\n align-items: center;\n border: 1px solid var(--border-color);\n transition: background-color 0.3s;\n gap: 1em;\n}\n\n.sm-button-simple svg {\n width: 1em;\n height: 1em;\n fill: var(--element-light);\n}\n\n.sm-button-simple:focus-visible,\n.sm-button-simple:hover {\n background-color: var(--border-color);\n outline: none;\n}\n\n/* Circle close button \nUsed in search and */\n.sm-circle-close-button {\n position: absolute;\n top: 1rem;\n right: 1rem;\n box-sizing: content-box;\n\n width: max(1rem, 30px);\n height: max(1rem, 30px);\n padding: 0.25rem;\n line-height: 1;\n border-radius: 50%;\n transition: background-color 0.3s;\n}\n\n.sm-circle-close-button:hover {\n background-color: var(--border-color);\n}\n\n.sm-circle-close-button svg {\n width: max(1rem, 30px);\n height: max(1rem, 30px);\n fill: var(--element);\n}\n",".sm-overflow-container {\n position: relative;\n line-height: 1;\n}\n\n.sm-overflow-button {\n box-sizing: content-box;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1rem;\n height: 1rem;\n padding: 0.25rem;\n line-height: 0;\n line-height: 0;\n border-radius: 50%;\n transition: background-color var(--transition);\n transform: translate(0, 0.15em);\n}\n\n.sm-overflow-button svg {\n display: inline-block;\n width: 1em;\n height: 1em;\n line-height: 0;\n /* transform: translateY(0.125rem); */\n fill: var(--element);\n}\n\n.sm-overflow-menu {\n position: absolute;\n top: 2rem;\n left: 50%;\n z-index: 20;\n display: none;\n max-width: 75vw;\n background-color: var(--surface);\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n box-shadow: var(--box-shadow);\n transform: translate(-50%, 0);\n}\n\n.sm-overflow-menu > div {\n flex-direction: column;\n justify-content: center;\n padding: 1rem;\n gap: 1rem;\n}\n\n.sm-overflow-buttons {\n display: flex;\n}\n\n.sm-overflow-button:hover {\n background-color: var(--border-color);\n}\n\n.sm-overflow-menu::before {\n position: absolute;\n top: 0;\n left: 50%;\n pointer-events: none;\n content: '';\n border-color: transparent transparent var(--border-color) transparent;\n border-style: solid;\n border-width: 0.5rem;\n transform: translate(-50%, -100%);\n}\n\n[data-color-pref='light'] .sm-light-mode {\n display: none;\n}\n\n[data-color-pref='dark'] .sm-dark-mode {\n display: none;\n}\n\n/* Follow */\n.sm-overflow-follow,\n.sm-overflow-share,\n.sm-overflow-saves {\n display: none;\n}\n\n.sm-overflow-back {\n position: absolute;\n top: 0.5em;\n left: -0.5em;\n box-sizing: content-box;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1rem;\n height: 1rem;\n padding: 0.25em;\n line-height: 0;\n background-color: var(--surface-light);\n border-radius: 50%;\n box-shadow: var(--box-shadow);\n transform: translate(-100%, 50%);\n}\n\n.sm-overflow-back svg {\n display: inline-block;\n width: inherit;\n height: inherit;\n}\n\n.sm-show {\n display: flex;\n}\n\n.sm-hide {\n display: none;\n}\n",".sm-pagination {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: var(--button-padding);\n font-size: var(--small);\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n grid-column: content;\n gap: var(--gap);\n}\n\n.sm-pagination,\n.sm-pagination-holder {\n margin-block: 6rem 3rem;\n}\n\n.sm-current {\n color: var(--primary);\n}\n\n.sm-pagination-item:hover {\n color: var(--primary);\n}\n\n.sm-prev {\n margin-inline-end: auto;\n}\n\n.sm-next {\n margin-inline-start: auto;\n}\n\n.sm-nav-disabled {\n opacity: 0.3;\n}\n\n.sm-circle-icon-button.sm-nav-disabled:hover {\n background-color: transparent;\n}\n",".sm-loading,\n.sm-footer-loading,\n.sm-success,\n.sm-footer-success,\n.sm-error,\n.sm-footer-error {\n display: none;\n}\n\n[data-members-form].loading .sm-default:not(.sm-cta-copy),\n[data-members-form].success .sm-default,\n[data-members-form].error .sm-default,\n[data-members-form].loading .sm-footer-default:not(.sm-footer-default-text),\n[data-members-form].success .sm-footer-default,\n[data-members-form].error .sm-footer-default {\n display: none;\n}\n\n[data-members-form].loading .sm-loading,\n[data-members-form].success .sm-success,\n[data-members-form].error .sm-error,\n[data-members-form].loading .sm-footer-loading,\n[data-members-form].success .sm-footer-success,\n[data-members-form].error .sm-footer-error {\n display: flex;\n}\n\n.sm-loading svg,\n.sm-footer-loading svg {\n animation: sm-spin 1s infinite linear;\n}\n\n@keyframes sm-spin {\n to {\n transform: rotate(1turn);\n }\n}\n",".sm-nav-menu-container {\n position: fixed;\n top: 0;\n left: 0;\n z-index: 35;\n display: none;\n /* align-items: center; */\n justify-content: center;\n width: 100%;\n height: 100%;\n height: 100vh;\n padding: 3rem var(--gap);\n overflow-y: auto;\n\n text-align: center;\n background-color: var(--surface);\n}\n\n.sm-nav-menu-container.sm-show-menu {\n display: flex;\n}\n\n.sm-nav-menu-navigation-container {\n display: flex;\n flex-direction: column;\n /* align-items: center; */\n gap: 1rem;\n height: 100vh;\n margin-bottom: 3rem;\n /* margin-block-start: 6rem; */\n}\n\n.sm-nav-menu-navigation-container .sm-navigation {\n flex-direction: column;\n align-items: center;\n}\n\n.sm-nav-menu-header {\n margin-block: 2rem 1rem;\n font-size: var(--small);\n color: var(--element-light);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n opacity: 0.8;\n}\n\n.sm-nav-menu-navigation-container .sm-navigation a {\n font-size: 1.25rem;\n font-weight: 700;\n}\n\n.sm-nav-menu-section {\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n justify-content: center;\n gap: var(--gap);\n}\n\n.sm-nav-menu-section :where(button, a) {\n justify-content: center;\n}\n\n.sm-nav-menu-navigation-container > .sm-icon-button {\n margin-block-start: 2rem;\n}\n\n.sm-nav-menu-grid-container {\n grid-template-columns: 1fr 1fr;\n gap: var(--gap);\n justify-content: space-between;\n width: 100%;\n}\n\n.sm-nav-menu-navigation-container :where(.sm-dark-mode, .sm-light-mode) {\n justify-content: center;\n margin-block-end: 3rem;\n}\n",".sm-header-grid > * {\n grid-column: content;\n text-align: center;\n}\n\n.sm-header-title {\n margin: 0;\n font-weight: 900;\n}\n\n.sm-header-excerpt {\n max-width: 66ch;\n margin-inline: auto;\n color: var(--element-light);\n opacity: 0.85;\n}\n\n.sm-header-image {\n width: 100%;\n aspect-ratio: 16 / 9;\n}\n\n.sm-header-image figcaption {\n margin-block-start: 3px;\n font-size: var(--small);\n opacity: 0.8;\n}\n\n.sm-header-image img {\n display: block;\n width: 100%;\n height: 100%;\n border-radius: var(--radius);\n object-fit: cover;\n}\n\n.sm-tag-count {\n display: inline-block;\n padding: var(--button-padding);\n margin-inline-start: 1em;\n font-family: 'Work Sans', sans-serif;\n font-size: var(--x-small);\n font-weight: 400;\n line-height: 1;\n color: var(--element-light);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n background-color: var(--border-color);\n border-radius: var(--radius);\n translate: 0 -0.5em;\n}\n",".sm-love-button {\n display: inline-block;\n transform: translateY(0.25em);\n}\n\n.sm-love-button .sm-heart-fill-icon {\n display: none;\n}\n\n.sm-love-button.sm-love-toggle .sm-heart-outline-icon {\n display: none;\n}\n\n.sm-love-button.sm-love-toggle .sm-heart-fill-icon {\n display: inline-block;\n}\n\n.sm-overflow-articles {\n display: grid;\n min-width: 18rem;\n max-width: 100%;\n gap: var(--gap);\n}\n\n.sm-saves {\n padding: 0.5em 1em;\n border-radius: var(--radius);\n}\n\n.sm-saves progress::-webkit-progress-bar {\n background-color: var(--primary-light);\n border-radius: var(--radius);\n opacity: 0.5;\n}\n\n.sm-saves progress::-webkit-progress-value {\n overflow: hidden;\n background-color: var(--primary);\n border-radius: var(--radius);\n}\n\n.sm-saves-meta {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: var(--gap);\n}\n\n.sm-saves-meta button {\n font-size: 1rem;\n transform: none;\n}\n\n.sm-saves-title {\n font-family: var(--heading-typeface);\n font-weight: 700;\n text-align: left;\n transition: 0.3s color;\n}\n\n.sm-saves-title:hover {\n color: var(--primary);\n}\n\n.sm-saves-date {\n margin-block: 0.5rem 0;\n font-size: var(--x-small);\n text-align: left;\n}\n\n.sm-saves button span {\n line-height: 0;\n}\n",".sm-hero {\n position: relative;\n min-height: 60vmin;\n padding-block-end: 3rem;\n}\n\n.sm-hero + .sm-grid .sm-grid-home {\n padding-block-start: 3rem;\n}\n\n.sm-hero-inner {\n height: 100%;\n padding-block-start: 6rem;\n grid-column: content;\n}\n\n@media (--tablet) {\n .sm-hero-inner {\n display: grid;\n grid-template-columns: repeat(2, minmax(0, 1fr));\n gap: var(--gap);\n align-items: center;\n }\n}\n\n.sm-hero-left {\n position: relative;\n z-index: 1;\n display: flex;\n flex-direction: column;\n justify-content: center;\n height: 100%;\n padding-inline-end: 1rem;\n text-align: center;\n}\n\n.sm-hero-subtitle {\n margin-block-end: 1rem;\n font-family: var(--heading-typeface);\n font-size: var(--h1);\n font-weight: 900;\n line-height: 1.2;\n background-image: linear-gradient(45deg, var(--primary), var(--secondary));\n background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n@supports (color: color(display-p3 1 0.5 0)) {\n .sm-hero-subtitle,\n .sm-cta-card h2 {\n background-image: linear-gradient(\n 45deg,\n color(display-p3 var(--r) var(--g) var(--b)),\n color(display-p3 var(--cr) var(--cg) var(--cb))\n );\n }\n\n :root[data-color-pref='dark'] :where(.sm-hero-subtitle, .sm-cta-card h2) {\n filter: brightness(1.5);\n }\n}\n\n.sm-hero-description {\n font-size: 1.15rem;\n color: var(--element-dark);\n}\n\n.sm-hero-bg {\n position: absolute;\n display: block;\n width: 100%;\n height: 100%;\n opacity: 0.25;\n object-fit: cover;\n mix-blend-mode: multiply;\n}\n\n.sm-hero-img img {\n display: block;\n width: 100%;\n height: auto;\n margin: 0 auto;\n border-radius: var(--radius);\n object-fit: cover;\n}\n\n.sm-hero-right {\n display: none;\n}\n\n.sm-hero-button-container:not(:empty) {\n display: flex;\n justify-content: center;\n margin-block-start: 2rem;\n gap: 1rem;\n}\n\n.sm-hero-cta-2 {\n position: relative;\n color: var(--element);\n background-color: transparent;\n}\n\n.sm-hero-cta-2 svg {\n position: absolute;\n top: 40%;\n left: 0;\n z-index: -1;\n width: 100%;\n height: 100%;\n /* opacity: 0.5; */\n}\n\n@media (--tablet) {\n .sm-hero-bg {\n display: none;\n }\n\n .sm-hero-img {\n max-height: 50vmin;\n }\n\n .sm-hero-left {\n text-align: start;\n }\n\n .sm-hero-right {\n display: initial;\n }\n\n .sm-hero-button-container:not(:empty) {\n justify-content: flex-start;\n }\n}\n",".sm-form {\n display: flex;\n flex-direction: column;\n width: 100%;\n max-width: var(--content-width);\n padding: var(--gap);\n margin: 2rem auto;\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n}\n\n.sm-form label,\n.sm-form input,\n.sm-form textarea,\n.sm-form button {\n /* display: inline-block; */\n}\n\n.sm-form input,\n.sm-form textarea {\n padding: var(--button-padding);\n margin-block-end: 1rem;\n color: var(--element);\n background-color: var(--surface);\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n}\n\n.sm-form textarea {\n height: 10rem;\n resize: none;\n}\n\n.sm-form input:focus-visible,\n.sm-form textarea:focus-visible {\n border-color: var(--secondary);\n outline: none;\n}\n\n.sm-form button:hover,\n.sm-form button:focus-visible {\n background-color: var(--secondary);\n outline: none;\n}\n",".sm-gradient-divider {\n height: 5rem;\n background-image: linear-gradient(0deg, var(--surface), var(--surface-dark));\n}\n\n.sm-gradient-divider-reverse {\n height: 5rem;\n background-image: linear-gradient(\n 180deg,\n var(--surface),\n var(--surface-dark)\n );\n}\n",".sm-post-toc {\n position: fixed;\n bottom: 28px;\n left: 28px;\n z-index: 5;\n pointer-events: none;\n transition: opacity 0.5s;\n isolation: isolate;\n}\n\n.sm-post-toc-btn {\n position: relative;\n box-sizing: content-box;\n width: 30px;\n height: 30px;\n padding: 0.75rem;\n pointer-events: all;\n background: var(--surface-light);\n border-radius: 50%;\n box-shadow: 0 4px 1rem hsl(var(--primary-h) var(--saturation) 9% / 0.1);\n transition: color var(--transition);\n --conic-gradient: var(--surface-light) 0deg 0%, var(--surface-light) 0deg 100%;\n}\n\n.sm-post-toc-btn::before {\n position: absolute;\n z-index: -1;\n content: '';\n background-image: conic-gradient(var(--conic-gradient));\n border-radius: 50%;\n opacity: 0.5;\n transition: background-image var(--transition);\n inset: -3px;\n}\n\n.sm-post-toc-btn:hover,\n.sm-post-toc-btn:focus-visible {\n color: var(--primary);\n}\n\n.sm-post-toc-btn svg {\n width: 100%;\n height: 100%;\n fill: currentcolor;\n}\n\n.sm-post-toc-contents {\n position: relative;\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n max-width: min(500px, calc(100vw - 56px));\n padding: 1rem 0.75rem;\n margin-block-end: 1rem;\n pointer-events: none;\n background: var(--surface-light);\n filter: drop-shadow(\n 0 4px 1rem hsl(var(--primary-h) var(--saturation) 9% / 0.1)\n );\n border-radius: var(--radius);\n opacity: 0;\n transition: scale 0.2s ease-out, opacity 0.2s 0.1s ease-out,\n translate 0.2s 0.1s ease-out;\n transform-origin: bottom left;\n gap: 0.5rem;\n scale: 0;\n translate: 15px 10%;\n max-height: 70vh;\n overflow-y: auto;\n}\n\n.sm-post-toc-contents::before {\n position: absolute;\n top: 0;\n right: 0;\n padding: 0.25rem 0.5rem;\n font-size: var(--x-small);\n color: var(--element-light);\n text-transform: uppercase;\n letter-spacing: var(--letter-spacing);\n opacity: 0.5;\n content: 'Contents';\n}\n\n.toc-show {\n pointer-events: all;\n opacity: 1;\n transition: scale 0.2s ease-in, opacity 0.2s ease-in, translate 0.2s ease-in;\n scale: 1;\n translate: 0 0;\n}\n\n.sm-toc-h3 {\n padding-inline-start: 0.5rem;\n}\n\n.sm-toc-h4 {\n padding-inline-start: 1rem;\n}\n\n.sm-toc-h5 {\n padding-inline-start: 1.5rem;\n}\n\n.sm-toc-h6 {\n padding-inline-start: 2rem;\n}\n\n.sm-toc-link {\n transition: color var(--transition);\n}\n\n.sm-toc-link:hover,\n.sm-toc-link:focus {\n color: var(--primary);\n}\n\n.sm-toc-active {\n color: var(--primary);\n}\n\n.toc-hide {\n opacity: 0;\n}\n\n.sm-toc-icon-close {\n display: none;\n}\n\n.toc-show ~ .sm-post-toc-btn .sm-toc-icon-close {\n display: initial;\n}\n\n.toc-show ~ .sm-post-toc-btn .sm-toc-icon {\n display: none;\n}\n","/* Blockquote */\nblockquote:not(.kg-blockquote-alt) {\n padding-inline-start: 2rem;\n border-left: 3px solid var(--border-color);\n}\n\n.kg-blockquote-alt {\n font-family: var(--heading-typeface);\n line-height: 1.2;\n}\n\n.kg-blockquote-alt::before,\n.kg-blockquote-alt::after {\n color: var(--secondary);\n}\n\n.kg-blockquote-alt::before {\n padding-inline-end: 0.1em;\n content: '\\002301';\n}\n\n.kg-blockquote-alt::after {\n content: '\\002301';\n}\n\n/* Cards and images */\n.kg-card {\n width: 100%;\n margin-inline: auto;\n}\n\n.kg-card,\n.kg-blockquote-alt {\n margin-block: 1rem 2rem;\n}\n\n.kg-image,\n.sm-post-content img {\n display: block;\n max-width: 100%;\n height: auto;\n margin-inline: auto;\n}\n\n.sm-post-content figcaption {\n padding: 0.25rem;\n font-size: var(--small);\n text-align: center;\n}\n\n.kg-width-wide,\n.kg-embed-card,\n.kg-gallery-card {\n grid-column: content;\n}\n\n.kg-embed-card .twitter-tweet {\n margin-inline: auto;\n}\n\n@media (--tablet) {\n .kg-width-wide,\n .kg-gallery-card {\n grid-column: wide;\n }\n}\n\n.kg-width-full {\n grid-column: start / end;\n}\n\n.kg-embed-card [src*='youtube'],\n.kg-embed-card [src*='vimeo'] {\n width: 100%;\n height: auto;\n aspect-ratio: 16 / 9;\n}\n\n.kg-embed-card iframe {\n /* stylelint-disable-next-line declaration-no-important */\n margin-inline: auto !important;\n}\n",".medium-zoom-overlay {\n z-index: 10;\n}\n\n.medium-zoom-image {\n z-index: 11;\n}\n"]} \ No newline at end of file diff --git a/assets/built/app.js b/assets/built/app.js index 57f063e9..feaba382 100644 --- a/assets/built/app.js +++ b/assets/built/app.js @@ -1,2 +1,472 @@ -!function(){"use strict";function e(e){document.documentElement.setAttribute("data-color-pref",e),localStorage.setItem("pref",e)}async function t(){const e=window.location.href;await navigator.clipboard.writeText(e),document.querySelectorAll(".sm-copy-button").forEach((e=>{const t=e,s=t.innerHTML;t.innerHTML=' Copied ✅',setTimeout((()=>{t.innerHTML=s}),3e3)}))}class s{constructor(e){this.id=e&&e.dataset.id||null,this.title=e&&e.dataset.title||null,this.items=()=>s.makeArray(JSON.parse(localStorage.getItem("saves"))),this.int=null}generateItem(){return{id:this.id,title:this.title,timestamp:new Date,scrollPos:this.scrollStatus().scrollPos,progress:this.scrollStatus().progress}}save(){localStorage.setItem("saves",JSON.stringify([this.generateItem(),...this.items()])),this.populateSavesMenu(),this.updateScrollPosition();document.querySelectorAll(`button[data-id=${this.id}]`).forEach((e=>{e.classList.add("sm-love-toggle")}))}remove(){const e=[...this.items()],t=e.findIndex((e=>this.id===e.id));e.splice(t,1),localStorage.removeItem("saves"),e.length&&localStorage.setItem("saves",JSON.stringify(e)),this.int=null,this.populateSavesMenu();document.querySelectorAll(`button[data-id=${this.id}]`).forEach((e=>{e.classList.remove("sm-love-toggle")}))}static makeArray(e){return e?e.length?e:[e]:[]}scrollStatus(){return this.isCurrentPageSaved()<0?{scrollPos:null,progress:null}:{scrollPos:window.scrollY,progress:Math.round(window.scrollY/(document.body.scrollHeight-document.body.clientHeight)*100)}}identifySaves(){this.items()&&this.items().forEach((e=>{const{id:t}=e,s=document.querySelectorAll(`button[data-id=${t}]`);s&&s.forEach((e=>e.classList.add("sm-love-toggle")))}))}isCurrentPageSaved(){const e=window.location.pathname.replace(/\//g,"");return this.items().findIndex((t=>t.id===e))}step(){const e=this.isCurrentPageSaved();if(e<0)return;const t=this.items();t[e].progress=this.scrollStatus().progress,t[e].scrollPos=this.scrollStatus().scrollPos,localStorage.removeItem("saves"),localStorage.setItem("saves",JSON.stringify(t)),this.populateSavesMenu(),setTimeout((()=>{window.requestAnimationFrame(this.step.bind(this))}),1e3)}updateScrollPosition(){if(!this.items().length)return;this.isCurrentPageSaved()<0||window.requestAnimationFrame(this.step.bind(this))}scrollToPos(){if(this.isCurrentPageSaved()>-1){const e=this.items();window.scrollTo({top:e[this.isCurrentPageSaved()].scrollPos,behavior:"smooth"})}}renderSavesMenu(){return this.items().map((e=>`
No articles saved yet. Hit the heart to get started!
";return e.innerHTML=s,void(t.innerHTML=s)}e.innerHTML=this.renderSavesMenu(),t.innerHTML=this.renderSavesMenu()}init(){this.identifySaves(),this.populateSavesMenu(),this.scrollToPos(),this.updateScrollPosition()}}function o(o){if(o.target.closest(".sm-navbar-menu-button")&&document.querySelector(".sm-nav-menu-container").classList.add("sm-show-menu"),o.target.closest(".sm-love-button"))!function(e){const t=new s(e),o=t.items();if(!o.length)return void t.save();const{id:n}=t;o.find((e=>e.id===n))?t.remove():t.save()}(o.target.closest(".sm-love-button"));else if(o.target.closest(".sm-nav-menu-close-button")&&document.querySelector(".sm-nav-menu-container").classList.remove("sm-show-menu"),o.target.closest(".sm-copy-button"))t();else if(o.target.closest(".sm-dark-mode"))e("dark");else{if(!o.target.closest(".sm-light-mode"))return o.target.closest(".sm-follow-button")?(document.querySelector(".sm-overflow-buttons").classList.add("sm-hide"),void document.querySelector(".sm-overflow-follow").classList.add("sm-show")):o.target.closest(".sm-share-button")?(document.querySelector(".sm-overflow-buttons").classList.add("sm-hide"),void document.querySelector(".sm-overflow-share").classList.add("sm-show")):o.target.closest(".sm-saves-button")?(document.querySelector(".sm-overflow-buttons").classList.add("sm-hide"),void document.querySelector(".sm-overflow-saves").classList.add("sm-show")):o.target.closest(".sm-overflow-back")?(o.target.closest(".sm-overflow-back").parentElement.classList.remove("sm-show"),void document.querySelector(".sm-overflow-buttons").classList.remove("sm-hide")):void(o.target.closest(".sm-overflow-button")?document.querySelector(".sm-overflow-menu").classList.toggle("sm-show"):"A"===o.target.tagName&&o.target.closest(".sm-overflow-menu")||document.querySelector(".sm-overflow-menu").classList.contains("sm-show")&&(o.preventDefault(),document.querySelector(".sm-overflow-menu").classList.remove("sm-show")));e("light")}}function n(e){"Escape"===e.code&&document.querySelector("[class*=show]")}function r(e,t,s){const o="previous"===t?"left":"right",n="previous"===t?"sm-prev":"sm-next",r=e?document.createElement("a"):document.createElement("span");r.innerHTML=``,r.classList.add("sm-circle-icon-button",n),e?(r.setAttribute("aria-label",`${t} posts`),r.setAttribute("href",e)):r.classList.add("sm-circle-icon-button","sm-nav-disabled"),s.append(r)}document.body.addEventListener("click",o),function(){const e=document.documentElement.clientHeight,{scrollHeight:t}=document.documentElement,s=document.querySelector(".sm-navbar-container");s.style.transition="background-color .6s",document.addEventListener("scroll",(()=>{const o=Math.round(window.scrollY)/(t-e);s.style.backgroundColor=o>.15?"var(--surface-light)":"var(--surface)"}))}(),function(){const e=document.querySelectorAll(".sm-dark-mode, .sm-light-mode");window.CSS&&CSS.supports("color","var(--primary)")||e.forEach((e=>{e.style.display="none"}))}(),function(){const e=document.querySelector(".sm-pagination");if(!e)return;const t=function(e){return/page/.test(e)?e.split("page")[0]:e}(window.location.pathname),{page:s,prev:o,next:n}=e.dataset;r(o,"previous",e);const a=s-2>0?s-2:1;for(let o=a-1;o { + e.style.display = 'none'; + }); + } + } + + function updateCopyButtonState() { + const copyButtons = document.querySelectorAll('.sm-copy-button'); + copyButtons.forEach((el) => { + const copyButton = el; + const currentState = copyButton.innerHTML; + copyButton.innerHTML = + ' Copied ✅'; + setTimeout(() => { + copyButton.innerHTML = currentState; + }, 3000); + }); + } + async function copyToClipboard() { + const currentURL = window.location.href; + await navigator.clipboard.writeText(currentURL); + updateCopyButtonState(); + } + + class Saves { + constructor(e) { + this.id = (e && e.dataset.id) || null; + this.title = (e && e.dataset.title) || null; + this.items = () => + Saves.makeArray(JSON.parse(localStorage.getItem('saves'))); + this.int = null; + } + + generateItem() { + return { + id: this.id, + title: this.title, + timestamp: new Date(), + scrollPos: this.scrollStatus().scrollPos, + progress: this.scrollStatus().progress, + }; + } + + save() { + localStorage.setItem( + 'saves', + JSON.stringify([this.generateItem(), ...this.items()]), + ); + + this.populateSavesMenu(); + this.updateScrollPosition(); + + const els = document.querySelectorAll(`button[data-id=${this.id}]`); + els.forEach((el) => { + el.classList.add('sm-love-toggle'); + }); + } + + remove() { + const items = [...this.items()]; + const itemIndex = items.findIndex((el) => this.id === el.id); + items.splice(itemIndex, 1); + localStorage.removeItem('saves'); + if (items.length) { + localStorage.setItem('saves', JSON.stringify(items)); + } + + this.int = null; + this.populateSavesMenu(); + + const els = document.querySelectorAll(`button[data-id=${this.id}]`); + els.forEach((el) => { + el.classList.remove('sm-love-toggle'); + }); + } + + static makeArray(data) { + if (!data) return []; + return data.length ? data : [data]; + } + + scrollStatus() { + if (this.isCurrentPageSaved() < 0) { + return { + scrollPos: null, + progress: null, + }; + } + return { + scrollPos: window.scrollY, + progress: Math.round( + (window.scrollY / + (document.body.scrollHeight - document.body.clientHeight)) * + 100, + ), + }; + } + + identifySaves() { + if (!this.items()) return; + + this.items().forEach((el) => { + const { id } = el; + const domEl = document.querySelectorAll(`button[data-id=${id}]`); + if (domEl) { + domEl.forEach((button) => button.classList.add('sm-love-toggle')); + } + }); + } + + isCurrentPageSaved() { + const currentPage = window.location.pathname.replace(/\//g, ''); + return this.items().findIndex((item) => item.id === currentPage); + } + + step() { + const itemIndex = this.isCurrentPageSaved(); + if (itemIndex < 0) { + return; + } + + const items = this.items(); + items[itemIndex].progress = this.scrollStatus().progress; + items[itemIndex].scrollPos = this.scrollStatus().scrollPos; + localStorage.removeItem('saves'); + localStorage.setItem('saves', JSON.stringify(items)); + this.populateSavesMenu(); + + setTimeout(() => { + window.requestAnimationFrame(this.step.bind(this)); + }, 1000); + } + + updateScrollPosition() { + const items = this.items(); + if (!items.length) return; + const itemIndex = this.isCurrentPageSaved(); + + if (itemIndex < 0) { + return; + } + + window.requestAnimationFrame(this.step.bind(this)); + } + + scrollToPos() { + if (this.isCurrentPageSaved() > -1) { + const items = this.items(); + window.scrollTo({ + top: items[this.isCurrentPageSaved()].scrollPos, + behavior: 'smooth', + }); + } + } + + renderSavesMenu() { + const template = this.items().map( + (el) => + `No articles saved yet. Hit the heart to get started!
'; + savesMenu.innerHTML = noSavesText; + navSavesMenu.innerHTML = noSavesText; + return; + } + savesMenu.innerHTML = this.renderSavesMenu(); + navSavesMenu.innerHTML = this.renderSavesMenu(); + } + + init() { + this.identifySaves(); + this.populateSavesMenu(); + this.scrollToPos(); + this.updateScrollPosition(); + } + } + + function save(e) { + const savedItems = new Saves(e); + + const items = savedItems.items(); + + if (!items.length) { + savedItems.save(); + return; + } + + const { id } = savedItems; + + if (items.find((el) => el.id === id)) { + savedItems.remove(); + } else { + savedItems.save(); + } + } + + function handleClick$1(e) { + if (e.target.closest('.sm-navbar-menu-button')) { + document + .querySelector('.sm-nav-menu-container') + .classList.add('sm-show-menu'); + } + + if (e.target.closest('.sm-love-button')) { + save(e.target.closest('.sm-love-button')); + // e.target.closest('.sm-love-button').classList.toggle('sm-love-toggle'); + return; + } + + if (e.target.closest('.sm-nav-menu-close-button')) { + document + .querySelector('.sm-nav-menu-container') + .classList.remove('sm-show-menu'); + } + + // if (e.target.closest('.sm-search-button')) { + // document.querySelector('.sm-search').classList.add('sm-show-search'); + // document.querySelector('#sm-search-input').focus(); + // return; + // } + + // if (e.target.closest('.sm-search-form-close-button')) { + // document.querySelector('.sm-search').classList.remove('sm-show-search'); + // return; + // } + + // if (e.target.closest('.sm-clear-search-button')) { + // document.querySelector('.sm-search-form input').value = ''; + // document.querySelector('.sm-search-results-container').innerHTML = ''; + // document + // .querySelector('.sm-clear-search-button') + // .classList.remove('sm-show-clear-button'); + // document.querySelector('.sm-search-form input').focus(); + // return; + // } + + if (e.target.closest('.sm-copy-button')) { + copyToClipboard(); + return; + } + + if (e.target.closest('.sm-dark-mode')) { + toggleColorMode('dark'); + return; + } + + if (e.target.closest('.sm-light-mode')) { + toggleColorMode('light'); + return; + } + + if (e.target.closest('.sm-follow-button')) { + document.querySelector('.sm-overflow-buttons').classList.add('sm-hide'); + document.querySelector('.sm-overflow-follow').classList.add('sm-show'); + return; + } + + if (e.target.closest('.sm-share-button')) { + document.querySelector('.sm-overflow-buttons').classList.add('sm-hide'); + document.querySelector('.sm-overflow-share').classList.add('sm-show'); + return; + } + + if (e.target.closest('.sm-saves-button')) { + document.querySelector('.sm-overflow-buttons').classList.add('sm-hide'); + document.querySelector('.sm-overflow-saves').classList.add('sm-show'); + return; + } + + if (e.target.closest('.sm-overflow-back')) { + e.target + .closest('.sm-overflow-back') + .parentElement.classList.remove('sm-show'); + document.querySelector('.sm-overflow-buttons').classList.remove('sm-hide'); + return; + } + + if (e.target.closest('.sm-overflow-button')) { + document.querySelector('.sm-overflow-menu').classList.toggle('sm-show'); + return; + } + + if (e.target.tagName === 'A' && e.target.closest('.sm-overflow-menu')) { + return; + } + + if ( + document.querySelector('.sm-overflow-menu').classList.contains('sm-show') + ) { + e.preventDefault(); + document.querySelector('.sm-overflow-menu').classList.remove('sm-show'); + } + } + + function eventHandler() { + document.body.addEventListener('click', handleClick$1); + } + + function animateNavbar() { + const height = document.documentElement.clientHeight; + const { scrollHeight } = document.documentElement; + const navbar = document.querySelector('.sm-navbar-container'); + navbar.style.transition = 'background-color .6s'; + + document.addEventListener('scroll', () => { + const scrollPercentage = + Math.round(window.scrollY) / (scrollHeight - height); + + if (scrollPercentage > 0.15) { + navbar.style.backgroundColor = 'var(--surface-light)'; + } else { + navbar.style.backgroundColor = 'var(--surface)'; + } + }); + } + + function handleClick(e) { + if (e.code === 'Escape') { + document.querySelector('[class*=show]'); + } + } + + function keyClickHandler() { + document.body.addEventListener('keyup', handleClick); + } + + function pathnameParser(pathname) { + if (!/page/.test(pathname)) { + return pathname; + } + + return pathname.split('page')[0]; + } + + function navButtonFormatter(nextOrPrevEl, nextOrPrevName, paginationEl) { + const icon = nextOrPrevName === 'previous' ? 'left' : 'right'; + const className = nextOrPrevName === 'previous' ? 'sm-prev' : 'sm-next'; + + const navButton = nextOrPrevEl + ? document.createElement('a') + : document.createElement('span'); + navButton.innerHTML = ``; + navButton.classList.add('sm-circle-icon-button', className); + + if (nextOrPrevEl) { + navButton.setAttribute('aria-label', `${nextOrPrevName} posts`); + navButton.setAttribute('href', nextOrPrevEl); + } else { + navButton.classList.add('sm-circle-icon-button', 'sm-nav-disabled'); + } + + paginationEl.append(navButton); + } + + function generatePagination() { + const pagination = document.querySelector('.sm-pagination'); + + if (!pagination) return; + const pathname = pathnameParser(window.location.pathname); + const { page, prev, next } = pagination.dataset; + + navButtonFormatter(prev, 'previous', pagination); + + const paginationStart = page - 2 > 0 ? page - 2 : 1; + + for ( + let index = paginationStart - 1; + index < paginationStart + 4; + index += 1 + ) { + let urlPath; + + if (index === 0 && pathname === '/') { + urlPath = '/'; + } else if (index === 0 && pathname !== '/') { + urlPath = pathname; + } else { + urlPath = `${pathname}page/${index + 1}/`; + } + + const div = document.createElement('div'); + div.classList.add('sm-pagination-item'); + const a = document.createElement('a'); + a.setAttribute('href', urlPath); + a.textContent = index + 1; + + if (+page === index + 1) { + div.classList.add('sm-current'); + } + div.append(a); + pagination.append(div); + } + + navButtonFormatter(next, 'next', pagination); + } + + // eslint-disable-next-line no-undef + { + const script = document.createElement('script'); + script.src = `http://${ + (window.location.host || 'localhost').split(':')[0] + }:35729/livereload.js?snipver=1`; + document.head.append(script); + console.info('Reload script added'); + } + + eventHandler(); + animateNavbar(); + determineColorModeSupport(); + generatePagination(); + keyClickHandler(); + new Saves().init(); + +})(); //# sourceMappingURL=app.js.map diff --git a/assets/built/app.js.map b/assets/built/app.js.map index d18b91ce..ffd94174 100644 --- a/assets/built/app.js.map +++ b/assets/built/app.js.map @@ -1 +1 @@ -{"version":3,"file":"app.js","sources":["../../src/js/app/colorModeToggle.js","../../src/js/app/copy.js","../../src/js/app/saves.js","../../src/js/app/clickHandler.js","../../src/js/app/keyHandler.js","../../src/js/app/pagination.js","../../src/js/app/navbarAnimation.js","../../src/js/app/index.js"],"sourcesContent":["/*\n * Color mode toggle\n */\n\nexport function toggleColorMode(color) {\n document.documentElement.setAttribute('data-color-pref', color);\n localStorage.setItem('pref', color);\n}\n\nexport function determineColorModeSupport() {\n const colorPrefButtons = document.querySelectorAll('.sm-dark-mode, .sm-light-mode');\n\n const hasSupport = window.CSS && CSS.supports('color', 'var(--primary)');\n\n // If the browser doesn't support custom settings, hide buttons\n if (!hasSupport) {\n colorPrefButtons.forEach((e) => {\n e.style.display = 'none';\n });\n }\n}\n","function updateCopyButtonState() {\n const copyButtons = document.querySelectorAll('.sm-copy-button');\n copyButtons.forEach((el) => {\n const copyButton = el;\n const currentState = copyButton.innerHTML;\n copyButton.innerHTML =\n ' Copied ✅';\n setTimeout(() => {\n copyButton.innerHTML = currentState;\n }, 3000);\n });\n}\nexport default async function copyToClipboard() {\n const currentURL = window.location.href;\n await navigator.clipboard.writeText(currentURL);\n updateCopyButtonState();\n}\n","export class Saves {\n constructor(e) {\n this.id = (e && e.dataset.id) || null;\n this.title = (e && e.dataset.title) || null;\n this.items = () =>\n Saves.makeArray(JSON.parse(localStorage.getItem('saves')));\n this.int = null;\n }\n\n generateItem() {\n return {\n id: this.id,\n title: this.title,\n timestamp: new Date(),\n scrollPos: this.scrollStatus().scrollPos,\n progress: this.scrollStatus().progress,\n };\n }\n\n save() {\n localStorage.setItem(\n 'saves',\n JSON.stringify([this.generateItem(), ...this.items()]),\n );\n\n this.populateSavesMenu();\n this.updateScrollPosition();\n\n const els = document.querySelectorAll(`button[data-id=${this.id}]`);\n els.forEach((el) => {\n el.classList.add('sm-love-toggle');\n });\n }\n\n remove() {\n const items = [...this.items()];\n const itemIndex = items.findIndex((el) => this.id === el.id);\n items.splice(itemIndex, 1);\n localStorage.removeItem('saves');\n if (items.length) {\n localStorage.setItem('saves', JSON.stringify(items));\n }\n\n this.int = null;\n this.populateSavesMenu();\n\n const els = document.querySelectorAll(`button[data-id=${this.id}]`);\n els.forEach((el) => {\n el.classList.remove('sm-love-toggle');\n });\n }\n\n static makeArray(data) {\n if (!data) return [];\n return data.length ? data : [data];\n }\n\n scrollStatus() {\n if (this.isCurrentPageSaved() < 0) {\n return {\n scrollPos: null,\n progress: null,\n };\n }\n return {\n scrollPos: window.scrollY,\n progress: Math.round(\n (window.scrollY /\n (document.body.scrollHeight - document.body.clientHeight)) *\n 100,\n ),\n };\n }\n\n identifySaves() {\n if (!this.items()) return;\n\n this.items().forEach((el) => {\n const { id } = el;\n const domEl = document.querySelectorAll(`button[data-id=${id}]`);\n if (domEl) {\n domEl.forEach((button) => button.classList.add('sm-love-toggle'));\n }\n });\n }\n\n isCurrentPageSaved() {\n const currentPage = window.location.pathname.replace(/\\//g, '');\n return this.items().findIndex((item) => item.id === currentPage);\n }\n\n step() {\n const itemIndex = this.isCurrentPageSaved();\n if (itemIndex < 0) {\n return;\n }\n\n const items = this.items();\n items[itemIndex].progress = this.scrollStatus().progress;\n items[itemIndex].scrollPos = this.scrollStatus().scrollPos;\n localStorage.removeItem('saves');\n localStorage.setItem('saves', JSON.stringify(items));\n this.populateSavesMenu();\n\n setTimeout(() => {\n window.requestAnimationFrame(this.step.bind(this));\n }, 1000);\n }\n\n updateScrollPosition() {\n const items = this.items();\n if (!items.length) return;\n const itemIndex = this.isCurrentPageSaved();\n\n if (itemIndex < 0) {\n return;\n }\n\n window.requestAnimationFrame(this.step.bind(this));\n }\n\n scrollToPos() {\n if (this.isCurrentPageSaved() > -1) {\n const items = this.items();\n window.scrollTo({\n top: items[this.isCurrentPageSaved()].scrollPos,\n behavior: 'smooth',\n });\n }\n }\n\n renderSavesMenu() {\n const template = this.items().map(\n (el) =>\n `No articles saved yet. Hit the heart to get started!
';\n savesMenu.innerHTML = noSavesText;\n navSavesMenu.innerHTML = noSavesText;\n return;\n }\n savesMenu.innerHTML = this.renderSavesMenu();\n navSavesMenu.innerHTML = this.renderSavesMenu();\n }\n\n init() {\n this.identifySaves();\n this.populateSavesMenu();\n this.scrollToPos();\n this.updateScrollPosition();\n }\n}\n\nexport function save(e) {\n const savedItems = new Saves(e);\n\n const items = savedItems.items();\n\n if (!items.length) {\n savedItems.save();\n return;\n }\n\n const { id } = savedItems;\n\n if (items.find((el) => el.id === id)) {\n savedItems.remove();\n } else {\n savedItems.save();\n }\n}\n","import { toggleColorMode } from './colorModeToggle';\nimport copyToClipboard from './copy';\nimport { save } from './saves';\n\nfunction handleClick(e) {\n if (e.target.closest('.sm-navbar-menu-button')) {\n document\n .querySelector('.sm-nav-menu-container')\n .classList.add('sm-show-menu');\n }\n\n if (e.target.closest('.sm-love-button')) {\n save(e.target.closest('.sm-love-button'));\n // e.target.closest('.sm-love-button').classList.toggle('sm-love-toggle');\n return;\n }\n\n if (e.target.closest('.sm-nav-menu-close-button')) {\n document\n .querySelector('.sm-nav-menu-container')\n .classList.remove('sm-show-menu');\n }\n\n // if (e.target.closest('.sm-search-button')) {\n // document.querySelector('.sm-search').classList.add('sm-show-search');\n // document.querySelector('#sm-search-input').focus();\n // return;\n // }\n\n // if (e.target.closest('.sm-search-form-close-button')) {\n // document.querySelector('.sm-search').classList.remove('sm-show-search');\n // return;\n // }\n\n // if (e.target.closest('.sm-clear-search-button')) {\n // document.querySelector('.sm-search-form input').value = '';\n // document.querySelector('.sm-search-results-container').innerHTML = '';\n // document\n // .querySelector('.sm-clear-search-button')\n // .classList.remove('sm-show-clear-button');\n // document.querySelector('.sm-search-form input').focus();\n // return;\n // }\n\n if (e.target.closest('.sm-copy-button')) {\n copyToClipboard();\n return;\n }\n\n if (e.target.closest('.sm-dark-mode')) {\n toggleColorMode('dark');\n return;\n }\n\n if (e.target.closest('.sm-light-mode')) {\n toggleColorMode('light');\n return;\n }\n\n if (e.target.closest('.sm-follow-button')) {\n document.querySelector('.sm-overflow-buttons').classList.add('sm-hide');\n document.querySelector('.sm-overflow-follow').classList.add('sm-show');\n return;\n }\n\n if (e.target.closest('.sm-share-button')) {\n document.querySelector('.sm-overflow-buttons').classList.add('sm-hide');\n document.querySelector('.sm-overflow-share').classList.add('sm-show');\n return;\n }\n\n if (e.target.closest('.sm-saves-button')) {\n document.querySelector('.sm-overflow-buttons').classList.add('sm-hide');\n document.querySelector('.sm-overflow-saves').classList.add('sm-show');\n return;\n }\n\n if (e.target.closest('.sm-overflow-back')) {\n e.target\n .closest('.sm-overflow-back')\n .parentElement.classList.remove('sm-show');\n document.querySelector('.sm-overflow-buttons').classList.remove('sm-hide');\n return;\n }\n\n if (e.target.closest('.sm-overflow-button')) {\n document.querySelector('.sm-overflow-menu').classList.toggle('sm-show');\n return;\n }\n\n if (e.target.tagName === 'A' && e.target.closest('.sm-overflow-menu')) {\n return;\n }\n\n if (\n document.querySelector('.sm-overflow-menu').classList.contains('sm-show')\n ) {\n e.preventDefault();\n document.querySelector('.sm-overflow-menu').classList.remove('sm-show');\n }\n}\n\nexport default function eventHandler() {\n document.body.addEventListener('click', handleClick);\n}\n","function handleClick(e) {\n if (e.code === 'Escape') {\n document.querySelector('[class*=show]');\n }\n}\n\nexport default function keyClickHandler() {\n document.body.addEventListener('keyup', handleClick);\n}\n","function pathnameParser(pathname) {\n if (!/page/.test(pathname)) {\n return pathname;\n }\n\n return pathname.split('page')[0];\n}\n\nfunction navButtonFormatter(nextOrPrevEl, nextOrPrevName, paginationEl) {\n const icon = nextOrPrevName === 'previous' ? 'left' : 'right';\n const className = nextOrPrevName === 'previous' ? 'sm-prev' : 'sm-next';\n\n const navButton = nextOrPrevEl\n ? document.createElement('a')\n : document.createElement('span');\n navButton.innerHTML = ``;\n navButton.classList.add('sm-circle-icon-button', className);\n\n if (nextOrPrevEl) {\n navButton.setAttribute('aria-label', `${nextOrPrevName} posts`);\n navButton.setAttribute('href', nextOrPrevEl);\n } else {\n navButton.classList.add('sm-circle-icon-button', 'sm-nav-disabled');\n }\n\n paginationEl.append(navButton);\n}\n\nexport default function generatePagination() {\n const pagination = document.querySelector('.sm-pagination');\n\n if (!pagination) return;\n const pathname = pathnameParser(window.location.pathname);\n const { page, prev, next } = pagination.dataset;\n\n navButtonFormatter(prev, 'previous', pagination);\n\n const paginationStart = page - 2 > 0 ? page - 2 : 1;\n\n for (\n let index = paginationStart - 1;\n index < paginationStart + 4;\n index += 1\n ) {\n let urlPath;\n\n if (index === 0 && pathname === '/') {\n urlPath = '/';\n } else if (index === 0 && pathname !== '/') {\n urlPath = pathname;\n } else {\n urlPath = `${pathname}page/${index + 1}/`;\n }\n\n const div = document.createElement('div');\n div.classList.add('sm-pagination-item');\n const a = document.createElement('a');\n a.setAttribute('href', urlPath);\n a.textContent = index + 1;\n\n if (+page === index + 1) {\n div.classList.add('sm-current');\n }\n div.append(a);\n pagination.append(div);\n }\n\n navButtonFormatter(next, 'next', pagination);\n}\n","export default function animateNavbar() {\n const height = document.documentElement.clientHeight;\n const { scrollHeight } = document.documentElement;\n const navbar = document.querySelector('.sm-navbar-container');\n navbar.style.transition = 'background-color .6s';\n\n document.addEventListener('scroll', () => {\n const scrollPercentage =\n Math.round(window.scrollY) / (scrollHeight - height);\n\n if (scrollPercentage > 0.15) {\n navbar.style.backgroundColor = 'var(--surface-light)';\n } else {\n navbar.style.backgroundColor = 'var(--surface)';\n }\n });\n}\n","import '../../css/app/index.css';\n\nimport initClickHandler from './clickHandler';\nimport animateNavbar from './navbarAnimation';\nimport { determineColorModeSupport } from './colorModeToggle';\nimport keyClickHandler from './keyHandler';\nimport generatePagination from './pagination';\nimport { Saves } from './saves';\n\n// eslint-disable-next-line no-undef\nif (ENV === 'development') {\n const script = document.createElement('script');\n script.src = `http://${\n (window.location.host || 'localhost').split(':')[0]\n }:35729/livereload.js?snipver=1`;\n document.head.append(script);\n console.info('Reload script added');\n}\n\ninitClickHandler();\nanimateNavbar();\ndetermineColorModeSupport();\ngeneratePagination();\nkeyClickHandler();\nnew Saves().init();\n"],"names":["toggleColorMode","color","document","documentElement","setAttribute","localStorage","setItem","async","copyToClipboard","currentURL","window","location","href","navigator","clipboard","writeText","querySelectorAll","forEach","el","copyButton","currentState","innerHTML","setTimeout","Saves","constructor","e","this","id","dataset","title","items","makeArray","JSON","parse","getItem","int","generateItem","timestamp","Date","scrollPos","scrollStatus","progress","save","stringify","populateSavesMenu","updateScrollPosition","classList","add","remove","itemIndex","findIndex","splice","removeItem","length","static","data","isCurrentPageSaved","scrollY","Math","round","body","scrollHeight","clientHeight","identifySaves","domEl","button","currentPage","pathname","replace","item","step","requestAnimationFrame","bind","scrollToPos","scrollTo","top","behavior","renderSavesMenu","map","Intl","DateTimeFormat","format","join","savesMenu","querySelector","navSavesMenu","noSavesText","init","handleClick","target","closest","savedItems","find","parentElement","toggle","tagName","contains","preventDefault","code","navButtonFormatter","nextOrPrevEl","nextOrPrevName","paginationEl","icon","className","navButton","createElement","append","addEventListener","height","navbar","style","transition","scrollPercentage","backgroundColor","animateNavbar","colorPrefButtons","CSS","supports","display","determineColorModeSupport","pagination","test","split","pathnameParser","page","prev","next","paginationStart","index","urlPath","div","a","textContent","generatePagination"],"mappings":"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"} \ No newline at end of file +{"version":3,"file":"app.js","sources":["../../src/js/app/colorModeToggle.js","../../src/js/app/copy.js","../../src/js/app/saves.js","../../src/js/app/clickHandler.js","../../src/js/app/navbarAnimation.js","../../src/js/app/keyHandler.js","../../src/js/app/pagination.js","../../src/js/app/index.js"],"sourcesContent":["/*\n * Color mode toggle\n */\n\nexport function toggleColorMode(color) {\n document.documentElement.setAttribute('data-color-pref', color);\n localStorage.setItem('pref', color);\n}\n\nexport function determineColorModeSupport() {\n const colorPrefButtons = document.querySelectorAll('.sm-dark-mode, .sm-light-mode');\n\n const hasSupport = window.CSS && CSS.supports('color', 'var(--primary)');\n\n // If the browser doesn't support custom settings, hide buttons\n if (!hasSupport) {\n colorPrefButtons.forEach((e) => {\n e.style.display = 'none';\n });\n }\n}\n","function updateCopyButtonState() {\n const copyButtons = document.querySelectorAll('.sm-copy-button');\n copyButtons.forEach((el) => {\n const copyButton = el;\n const currentState = copyButton.innerHTML;\n copyButton.innerHTML =\n ' Copied ✅';\n setTimeout(() => {\n copyButton.innerHTML = currentState;\n }, 3000);\n });\n}\nexport default async function copyToClipboard() {\n const currentURL = window.location.href;\n await navigator.clipboard.writeText(currentURL);\n updateCopyButtonState();\n}\n","export class Saves {\n constructor(e) {\n this.id = (e && e.dataset.id) || null;\n this.title = (e && e.dataset.title) || null;\n this.items = () =>\n Saves.makeArray(JSON.parse(localStorage.getItem('saves')));\n this.int = null;\n }\n\n generateItem() {\n return {\n id: this.id,\n title: this.title,\n timestamp: new Date(),\n scrollPos: this.scrollStatus().scrollPos,\n progress: this.scrollStatus().progress,\n };\n }\n\n save() {\n localStorage.setItem(\n 'saves',\n JSON.stringify([this.generateItem(), ...this.items()]),\n );\n\n this.populateSavesMenu();\n this.updateScrollPosition();\n\n const els = document.querySelectorAll(`button[data-id=${this.id}]`);\n els.forEach((el) => {\n el.classList.add('sm-love-toggle');\n });\n }\n\n remove() {\n const items = [...this.items()];\n const itemIndex = items.findIndex((el) => this.id === el.id);\n items.splice(itemIndex, 1);\n localStorage.removeItem('saves');\n if (items.length) {\n localStorage.setItem('saves', JSON.stringify(items));\n }\n\n this.int = null;\n this.populateSavesMenu();\n\n const els = document.querySelectorAll(`button[data-id=${this.id}]`);\n els.forEach((el) => {\n el.classList.remove('sm-love-toggle');\n });\n }\n\n static makeArray(data) {\n if (!data) return [];\n return data.length ? data : [data];\n }\n\n scrollStatus() {\n if (this.isCurrentPageSaved() < 0) {\n return {\n scrollPos: null,\n progress: null,\n };\n }\n return {\n scrollPos: window.scrollY,\n progress: Math.round(\n (window.scrollY /\n (document.body.scrollHeight - document.body.clientHeight)) *\n 100,\n ),\n };\n }\n\n identifySaves() {\n if (!this.items()) return;\n\n this.items().forEach((el) => {\n const { id } = el;\n const domEl = document.querySelectorAll(`button[data-id=${id}]`);\n if (domEl) {\n domEl.forEach((button) => button.classList.add('sm-love-toggle'));\n }\n });\n }\n\n isCurrentPageSaved() {\n const currentPage = window.location.pathname.replace(/\\//g, '');\n return this.items().findIndex((item) => item.id === currentPage);\n }\n\n step() {\n const itemIndex = this.isCurrentPageSaved();\n if (itemIndex < 0) {\n return;\n }\n\n const items = this.items();\n items[itemIndex].progress = this.scrollStatus().progress;\n items[itemIndex].scrollPos = this.scrollStatus().scrollPos;\n localStorage.removeItem('saves');\n localStorage.setItem('saves', JSON.stringify(items));\n this.populateSavesMenu();\n\n setTimeout(() => {\n window.requestAnimationFrame(this.step.bind(this));\n }, 1000);\n }\n\n updateScrollPosition() {\n const items = this.items();\n if (!items.length) return;\n const itemIndex = this.isCurrentPageSaved();\n\n if (itemIndex < 0) {\n return;\n }\n\n window.requestAnimationFrame(this.step.bind(this));\n }\n\n scrollToPos() {\n if (this.isCurrentPageSaved() > -1) {\n const items = this.items();\n window.scrollTo({\n top: items[this.isCurrentPageSaved()].scrollPos,\n behavior: 'smooth',\n });\n }\n }\n\n renderSavesMenu() {\n const template = this.items().map(\n (el) =>\n `No articles saved yet. Hit the heart to get started!
';\n savesMenu.innerHTML = noSavesText;\n navSavesMenu.innerHTML = noSavesText;\n return;\n }\n savesMenu.innerHTML = this.renderSavesMenu();\n navSavesMenu.innerHTML = this.renderSavesMenu();\n }\n\n init() {\n this.identifySaves();\n this.populateSavesMenu();\n this.scrollToPos();\n this.updateScrollPosition();\n }\n}\n\nexport function save(e) {\n const savedItems = new Saves(e);\n\n const items = savedItems.items();\n\n if (!items.length) {\n savedItems.save();\n return;\n }\n\n const { id } = savedItems;\n\n if (items.find((el) => el.id === id)) {\n savedItems.remove();\n } else {\n savedItems.save();\n }\n}\n","import { toggleColorMode } from './colorModeToggle';\nimport copyToClipboard from './copy';\nimport { save } from './saves';\n\nfunction handleClick(e) {\n if (e.target.closest('.sm-navbar-menu-button')) {\n document\n .querySelector('.sm-nav-menu-container')\n .classList.add('sm-show-menu');\n }\n\n if (e.target.closest('.sm-love-button')) {\n save(e.target.closest('.sm-love-button'));\n // e.target.closest('.sm-love-button').classList.toggle('sm-love-toggle');\n return;\n }\n\n if (e.target.closest('.sm-nav-menu-close-button')) {\n document\n .querySelector('.sm-nav-menu-container')\n .classList.remove('sm-show-menu');\n }\n\n // if (e.target.closest('.sm-search-button')) {\n // document.querySelector('.sm-search').classList.add('sm-show-search');\n // document.querySelector('#sm-search-input').focus();\n // return;\n // }\n\n // if (e.target.closest('.sm-search-form-close-button')) {\n // document.querySelector('.sm-search').classList.remove('sm-show-search');\n // return;\n // }\n\n // if (e.target.closest('.sm-clear-search-button')) {\n // document.querySelector('.sm-search-form input').value = '';\n // document.querySelector('.sm-search-results-container').innerHTML = '';\n // document\n // .querySelector('.sm-clear-search-button')\n // .classList.remove('sm-show-clear-button');\n // document.querySelector('.sm-search-form input').focus();\n // return;\n // }\n\n if (e.target.closest('.sm-copy-button')) {\n copyToClipboard();\n return;\n }\n\n if (e.target.closest('.sm-dark-mode')) {\n toggleColorMode('dark');\n return;\n }\n\n if (e.target.closest('.sm-light-mode')) {\n toggleColorMode('light');\n return;\n }\n\n if (e.target.closest('.sm-follow-button')) {\n document.querySelector('.sm-overflow-buttons').classList.add('sm-hide');\n document.querySelector('.sm-overflow-follow').classList.add('sm-show');\n return;\n }\n\n if (e.target.closest('.sm-share-button')) {\n document.querySelector('.sm-overflow-buttons').classList.add('sm-hide');\n document.querySelector('.sm-overflow-share').classList.add('sm-show');\n return;\n }\n\n if (e.target.closest('.sm-saves-button')) {\n document.querySelector('.sm-overflow-buttons').classList.add('sm-hide');\n document.querySelector('.sm-overflow-saves').classList.add('sm-show');\n return;\n }\n\n if (e.target.closest('.sm-overflow-back')) {\n e.target\n .closest('.sm-overflow-back')\n .parentElement.classList.remove('sm-show');\n document.querySelector('.sm-overflow-buttons').classList.remove('sm-hide');\n return;\n }\n\n if (e.target.closest('.sm-overflow-button')) {\n document.querySelector('.sm-overflow-menu').classList.toggle('sm-show');\n return;\n }\n\n if (e.target.tagName === 'A' && e.target.closest('.sm-overflow-menu')) {\n return;\n }\n\n if (\n document.querySelector('.sm-overflow-menu').classList.contains('sm-show')\n ) {\n e.preventDefault();\n document.querySelector('.sm-overflow-menu').classList.remove('sm-show');\n }\n}\n\nexport default function eventHandler() {\n document.body.addEventListener('click', handleClick);\n}\n","export default function animateNavbar() {\n const height = document.documentElement.clientHeight;\n const { scrollHeight } = document.documentElement;\n const navbar = document.querySelector('.sm-navbar-container');\n navbar.style.transition = 'background-color .6s';\n\n document.addEventListener('scroll', () => {\n const scrollPercentage =\n Math.round(window.scrollY) / (scrollHeight - height);\n\n if (scrollPercentage > 0.15) {\n navbar.style.backgroundColor = 'var(--surface-light)';\n } else {\n navbar.style.backgroundColor = 'var(--surface)';\n }\n });\n}\n","function handleClick(e) {\n if (e.code === 'Escape') {\n document.querySelector('[class*=show]');\n }\n}\n\nexport default function keyClickHandler() {\n document.body.addEventListener('keyup', handleClick);\n}\n","function pathnameParser(pathname) {\n if (!/page/.test(pathname)) {\n return pathname;\n }\n\n return pathname.split('page')[0];\n}\n\nfunction navButtonFormatter(nextOrPrevEl, nextOrPrevName, paginationEl) {\n const icon = nextOrPrevName === 'previous' ? 'left' : 'right';\n const className = nextOrPrevName === 'previous' ? 'sm-prev' : 'sm-next';\n\n const navButton = nextOrPrevEl\n ? document.createElement('a')\n : document.createElement('span');\n navButton.innerHTML = ``;\n navButton.classList.add('sm-circle-icon-button', className);\n\n if (nextOrPrevEl) {\n navButton.setAttribute('aria-label', `${nextOrPrevName} posts`);\n navButton.setAttribute('href', nextOrPrevEl);\n } else {\n navButton.classList.add('sm-circle-icon-button', 'sm-nav-disabled');\n }\n\n paginationEl.append(navButton);\n}\n\nexport default function generatePagination() {\n const pagination = document.querySelector('.sm-pagination');\n\n if (!pagination) return;\n const pathname = pathnameParser(window.location.pathname);\n const { page, prev, next } = pagination.dataset;\n\n navButtonFormatter(prev, 'previous', pagination);\n\n const paginationStart = page - 2 > 0 ? page - 2 : 1;\n\n for (\n let index = paginationStart - 1;\n index < paginationStart + 4;\n index += 1\n ) {\n let urlPath;\n\n if (index === 0 && pathname === '/') {\n urlPath = '/';\n } else if (index === 0 && pathname !== '/') {\n urlPath = pathname;\n } else {\n urlPath = `${pathname}page/${index + 1}/`;\n }\n\n const div = document.createElement('div');\n div.classList.add('sm-pagination-item');\n const a = document.createElement('a');\n a.setAttribute('href', urlPath);\n a.textContent = index + 1;\n\n if (+page === index + 1) {\n div.classList.add('sm-current');\n }\n div.append(a);\n pagination.append(div);\n }\n\n navButtonFormatter(next, 'next', pagination);\n}\n","import '../../css/app/index.css';\n\nimport initClickHandler from './clickHandler';\nimport animateNavbar from './navbarAnimation';\nimport { determineColorModeSupport } from './colorModeToggle';\nimport keyClickHandler from './keyHandler';\nimport generatePagination from './pagination';\nimport { Saves } from './saves';\n\n// eslint-disable-next-line no-undef\nif (ENV === 'development') {\n const script = document.createElement('script');\n script.src = `http://${\n (window.location.host || 'localhost').split(':')[0]\n }:35729/livereload.js?snipver=1`;\n document.head.append(script);\n console.info('Reload script added');\n}\n\ninitClickHandler();\nanimateNavbar();\ndetermineColorModeSupport();\ngeneratePagination();\nkeyClickHandler();\nnew Saves().init();\n"],"names":["handleClick","initClickHandler"],"mappings":"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"} \ No newline at end of file diff --git a/assets/built/generateColorPalette.js b/assets/built/generateColorPalette.js index bfc64756..3640a5a3 100644 --- a/assets/built/generateColorPalette.js +++ b/assets/built/generateColorPalette.js @@ -1,2 +1,88 @@ -!function(){"use strict";function t(t){let e=0,n=0,o=0;return 4===t.length?(e=`0x${t[1]}${t[1]}`,n=`0x${t[2]}${t[2]}`,o=`0x${t[3]}${t[3]}`):7===t.length&&(e=`0x${t[1]}${t[2]}`,n=`0x${t[3]}${t[4]}`,o=`0x${t[5]}${t[6]}`),[e,n,o]}!function(){const[e,n,o]=document.documentElement.dataset.accentColor?t(document.documentElement.dataset.accentColor):t("#ff0000"),[m,c,r]=function(t){const[e,n,o]=t,m=e/255,c=n/255,r=o/255,s=Math.min(m,c,r),u=Math.max(m,c,r),l=u-s;let d=0,y=0,a=0;return d=0===l?0:u===m?(c-r)/l%6:u===c?(r-m)/l+2:(m-c)/l+4,d=Math.round(60*d),d<0&&(d+=360),a=(u+s)/2,y=0===l?0:l/(1-Math.abs(2*a-1)),y=+(100*y).toFixed(1),a=+(100*a).toFixed(1),[d,y,a,parseInt(e),parseInt(n),parseInt(o)]}([e,n,o]),s=m+180>360?m-180:m+180;document.documentElement.style.setProperty("--primary-h",m),document.documentElement.style.setProperty("--saturation",`${c}%`),document.documentElement.style.setProperty("--lightness",`${r}%`),document.documentElement.style.setProperty("--complementary-color",s),document.documentElement.style.setProperty("--r",e/255),document.documentElement.style.setProperty("--g",n/255),document.documentElement.style.setProperty("--b",o/255),document.documentElement.style.setProperty("--cr",(255-e)/255),document.documentElement.style.setProperty("--cg",(255-n)/255),document.documentElement.style.setProperty("--cb",(255-o)/255)}()}(); +(function () { + 'use strict'; + + // From CSS Tricks + function hexToRgb(H) { + // Convert hex to RGB first + let r = 0; + let g = 0; + let b = 0; + + if (H.length === 4) { + r = `0x${H[1]}${H[1]}`; + g = `0x${H[2]}${H[2]}`; + b = `0x${H[3]}${H[3]}`; + } else if (H.length === 7) { + r = `0x${H[1]}${H[2]}`; + g = `0x${H[3]}${H[4]}`; + b = `0x${H[5]}${H[6]}`; + } + return [r, g, b]; + } + + function rgbToHSL(rgb) { + const [r, g, b] = rgb; + + // Then to HSL + const sr = r / 255; + const sg = g / 255; + const sb = b / 255; + + const cmin = Math.min(sr, sg, sb); + const cmax = Math.max(sr, sg, sb); + const delta = cmax - cmin; + let h = 0; + let s = 0; + let l = 0; + + if (delta === 0) { + h = 0; + } else if (cmax === sr) { + h = ((sg - sb) / delta) % 6; + } else if (cmax === sg) { + h = (sb - sr) / delta + 2; + } else { + h = (sr - sg) / delta + 4; + } + + h = Math.round(h * 60); + + if (h < 0) { + h += 360; + } + + l = (cmax + cmin) / 2; + s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1)); + s = +(s * 100).toFixed(1); + l = +(l * 100).toFixed(1); + + return [h, s, l, parseInt(r), parseInt(g), parseInt(b)]; + } + + function generateColorPalette() { + const [r, g, b] = document.documentElement.dataset.accentColor + ? hexToRgb(document.documentElement.dataset.accentColor) + : hexToRgb('#ff0000'); + + const [h, s, l] = rgbToHSL([r, g, b]); + + const complementaryColor = h + 180 > 360 ? h - 180 : h + 180; + document.documentElement.style.setProperty('--primary-h', h); + document.documentElement.style.setProperty('--saturation', `${s}%`); + document.documentElement.style.setProperty('--lightness', `${l}%`); + document.documentElement.style.setProperty( + '--complementary-color', + complementaryColor, + ); + document.documentElement.style.setProperty('--r', r / 255); + document.documentElement.style.setProperty('--g', g / 255); + document.documentElement.style.setProperty('--b', b / 255); + document.documentElement.style.setProperty('--cr', (255 - r) / 255); + document.documentElement.style.setProperty('--cg', (255 - g) / 255); + document.documentElement.style.setProperty('--cb', (255 - b) / 255); + } + + generateColorPalette(); + +})(); //# sourceMappingURL=generateColorPalette.js.map diff --git a/assets/built/generateColorPalette.js.map b/assets/built/generateColorPalette.js.map index 5c092381..b209ebf0 100644 --- a/assets/built/generateColorPalette.js.map +++ b/assets/built/generateColorPalette.js.map @@ -1 +1 @@ -{"version":3,"file":"generateColorPalette.js","sources":["../../src/js/generateColorPalette.js"],"sourcesContent":["// From CSS Tricks\nfunction hexToRgb(H) {\n // Convert hex to RGB first\n let r = 0;\n let g = 0;\n let b = 0;\n\n if (H.length === 4) {\n r = `0x${H[1]}${H[1]}`;\n g = `0x${H[2]}${H[2]}`;\n b = `0x${H[3]}${H[3]}`;\n } else if (H.length === 7) {\n r = `0x${H[1]}${H[2]}`;\n g = `0x${H[3]}${H[4]}`;\n b = `0x${H[5]}${H[6]}`;\n }\n return [r, g, b];\n}\n\nfunction rgbToHSL(rgb) {\n const [r, g, b] = rgb;\n\n // Then to HSL\n const sr = r / 255;\n const sg = g / 255;\n const sb = b / 255;\n\n const cmin = Math.min(sr, sg, sb);\n const cmax = Math.max(sr, sg, sb);\n const delta = cmax - cmin;\n let h = 0;\n let s = 0;\n let l = 0;\n\n if (delta === 0) {\n h = 0;\n } else if (cmax === sr) {\n h = ((sg - sb) / delta) % 6;\n } else if (cmax === sg) {\n h = (sb - sr) / delta + 2;\n } else {\n h = (sr - sg) / delta + 4;\n }\n\n h = Math.round(h * 60);\n\n if (h < 0) {\n h += 360;\n }\n\n l = (cmax + cmin) / 2;\n s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));\n s = +(s * 100).toFixed(1);\n l = +(l * 100).toFixed(1);\n\n return [h, s, l, parseInt(r), parseInt(g), parseInt(b)];\n}\n\nfunction generateColorPalette() {\n const [r, g, b] = document.documentElement.dataset.accentColor\n ? hexToRgb(document.documentElement.dataset.accentColor)\n : hexToRgb('#ff0000');\n\n const [h, s, l] = rgbToHSL([r, g, b]);\n\n const complementaryColor = h + 180 > 360 ? h - 180 : h + 180;\n document.documentElement.style.setProperty('--primary-h', h);\n document.documentElement.style.setProperty('--saturation', `${s}%`);\n document.documentElement.style.setProperty('--lightness', `${l}%`);\n document.documentElement.style.setProperty(\n '--complementary-color',\n complementaryColor,\n );\n document.documentElement.style.setProperty('--r', r / 255);\n document.documentElement.style.setProperty('--g', g / 255);\n document.documentElement.style.setProperty('--b', b / 255);\n document.documentElement.style.setProperty('--cr', (255 - r) / 255);\n document.documentElement.style.setProperty('--cg', (255 - g) / 255);\n document.documentElement.style.setProperty('--cb', (255 - b) / 255);\n}\n\ngenerateColorPalette();\n"],"names":["hexToRgb","H","r","g","b","length","document","documentElement","dataset","accentColor","h","s","l","rgb","sr","sg","sb","cmin","Math","min","cmax","max","delta","round","abs","toFixed","parseInt","rgbToHSL","complementaryColor","style","setProperty","generateColorPalette"],"mappings":"yBACA,SAASA,EAASC,GAEhB,IAAIC,EAAI,EACJC,EAAI,EACJC,EAAI,EAWR,OATiB,IAAbH,EAAEI,QACJH,EAAK,KAAID,EAAE,KAAKA,EAAE,KAClBE,EAAK,KAAIF,EAAE,KAAKA,EAAE,KAClBG,EAAK,KAAIH,EAAE,KAAKA,EAAE,MACI,IAAbA,EAAEI,SACXH,EAAK,KAAID,EAAE,KAAKA,EAAE,KAClBE,EAAK,KAAIF,EAAE,KAAKA,EAAE,KAClBG,EAAK,KAAIH,EAAE,KAAKA,EAAE,MAEb,CAACC,EAAGC,EAAGC,EAChB,EAyCA,WACE,MAAOF,EAAGC,EAAGC,GAAKE,SAASC,gBAAgBC,QAAQC,YAC/CT,EAASM,SAASC,gBAAgBC,QAAQC,aAC1CT,EAAS,YAENU,EAAGC,EAAGC,GA5Cf,SAAkBC,GAChB,MAAOX,EAAGC,EAAGC,GAAKS,EAGZC,EAAKZ,EAAI,IACTa,EAAKZ,EAAI,IACTa,EAAKZ,EAAI,IAETa,EAAOC,KAAKC,IAAIL,EAAIC,EAAIC,GACxBI,EAAOF,KAAKG,IAAIP,EAAIC,EAAIC,GACxBM,EAAQF,EAAOH,EACrB,IAAIP,EAAI,EACJC,EAAI,EACJC,EAAI,EAuBR,OApBEF,EADY,IAAVY,EACE,EACKF,IAASN,GACZC,EAAKC,GAAMM,EAAS,EACjBF,IAASL,GACbC,EAAKF,GAAMQ,EAAQ,GAEnBR,EAAKC,GAAMO,EAAQ,EAG1BZ,EAAIQ,KAAKK,MAAU,GAAJb,GAEXA,EAAI,IACNA,GAAK,KAGPE,GAAKQ,EAAOH,GAAQ,EACpBN,EAAc,IAAVW,EAAc,EAAIA,GAAS,EAAIJ,KAAKM,IAAI,EAAIZ,EAAI,IACpDD,IAAU,IAAJA,GAASc,QAAQ,GACvBb,IAAU,IAAJA,GAASa,QAAQ,GAEhB,CAACf,EAAGC,EAAGC,EAAGc,SAASxB,GAAIwB,SAASvB,GAAIuB,SAAStB,GACtD,CAOoBuB,CAAS,CAACzB,EAAGC,EAAGC,IAE5BwB,EAAqBlB,EAAI,IAAM,IAAMA,EAAI,IAAMA,EAAI,IACzDJ,SAASC,gBAAgBsB,MAAMC,YAAY,cAAepB,GAC1DJ,SAASC,gBAAgBsB,MAAMC,YAAY,eAAiB,GAAEnB,MAC9DL,SAASC,gBAAgBsB,MAAMC,YAAY,cAAgB,GAAElB,MAC7DN,SAASC,gBAAgBsB,MAAMC,YAC7B,wBACAF,GAEFtB,SAASC,gBAAgBsB,MAAMC,YAAY,MAAO5B,EAAI,KACtDI,SAASC,gBAAgBsB,MAAMC,YAAY,MAAO3B,EAAI,KACtDG,SAASC,gBAAgBsB,MAAMC,YAAY,MAAO1B,EAAI,KACtDE,SAASC,gBAAgBsB,MAAMC,YAAY,QAAS,IAAM5B,GAAK,KAC/DI,SAASC,gBAAgBsB,MAAMC,YAAY,QAAS,IAAM3B,GAAK,KAC/DG,SAASC,gBAAgBsB,MAAMC,YAAY,QAAS,IAAM1B,GAAK,IACjE,CAEA2B"} \ No newline at end of file +{"version":3,"file":"generateColorPalette.js","sources":["../../src/js/generateColorPalette.js"],"sourcesContent":["// From CSS Tricks\nfunction hexToRgb(H) {\n // Convert hex to RGB first\n let r = 0;\n let g = 0;\n let b = 0;\n\n if (H.length === 4) {\n r = `0x${H[1]}${H[1]}`;\n g = `0x${H[2]}${H[2]}`;\n b = `0x${H[3]}${H[3]}`;\n } else if (H.length === 7) {\n r = `0x${H[1]}${H[2]}`;\n g = `0x${H[3]}${H[4]}`;\n b = `0x${H[5]}${H[6]}`;\n }\n return [r, g, b];\n}\n\nfunction rgbToHSL(rgb) {\n const [r, g, b] = rgb;\n\n // Then to HSL\n const sr = r / 255;\n const sg = g / 255;\n const sb = b / 255;\n\n const cmin = Math.min(sr, sg, sb);\n const cmax = Math.max(sr, sg, sb);\n const delta = cmax - cmin;\n let h = 0;\n let s = 0;\n let l = 0;\n\n if (delta === 0) {\n h = 0;\n } else if (cmax === sr) {\n h = ((sg - sb) / delta) % 6;\n } else if (cmax === sg) {\n h = (sb - sr) / delta + 2;\n } else {\n h = (sr - sg) / delta + 4;\n }\n\n h = Math.round(h * 60);\n\n if (h < 0) {\n h += 360;\n }\n\n l = (cmax + cmin) / 2;\n s = delta === 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));\n s = +(s * 100).toFixed(1);\n l = +(l * 100).toFixed(1);\n\n return [h, s, l, parseInt(r), parseInt(g), parseInt(b)];\n}\n\nfunction generateColorPalette() {\n const [r, g, b] = document.documentElement.dataset.accentColor\n ? hexToRgb(document.documentElement.dataset.accentColor)\n : hexToRgb('#ff0000');\n\n const [h, s, l] = rgbToHSL([r, g, b]);\n\n const complementaryColor = h + 180 > 360 ? h - 180 : h + 180;\n document.documentElement.style.setProperty('--primary-h', h);\n document.documentElement.style.setProperty('--saturation', `${s}%`);\n document.documentElement.style.setProperty('--lightness', `${l}%`);\n document.documentElement.style.setProperty(\n '--complementary-color',\n complementaryColor,\n );\n document.documentElement.style.setProperty('--r', r / 255);\n document.documentElement.style.setProperty('--g', g / 255);\n document.documentElement.style.setProperty('--b', b / 255);\n document.documentElement.style.setProperty('--cr', (255 - r) / 255);\n document.documentElement.style.setProperty('--cg', (255 - g) / 255);\n document.documentElement.style.setProperty('--cb', (255 - b) / 255);\n}\n\ngenerateColorPalette();\n"],"names":[],"mappings":"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"} \ No newline at end of file diff --git a/assets/built/ghost-cards.css b/assets/built/ghost-cards.css index 4aefce3c..38f7f380 100644 --- a/assets/built/ghost-cards.css +++ b/assets/built/ghost-cards.css @@ -1,2 +1,71 @@ -.kg-bookmark-card a.kg-bookmark-container{border-color:var(--border-color);border-radius:var(--radius);transition:border-color .3s}.kg-bookmark-card .kg-bookmark-icon{margin-inline:0 6px}.kg-bookmark-title{font-size:1rem}.kg-bookmark-content{padding:1rem}.kg-bookmark-description{color:var(--element-light);font-size:var(--small)}.kg-bookmark-metadata{font-size:var(--small)}.kg-bookmark-card:hover a.kg-bookmark-container{border-color:var(--primary-light);border-radius:var(--radius)}.kg-toggle-card{border:1px solid var(--border-color);border-radius:var(--radius);box-shadow:none;padding:1rem}.kg-toggle-heading svg{color:var(--primary-light)}.kg-toggle-card:hover .kg-toggle-heading svg{color:var(--primary)}.kg-button-card{font-family:inherit;font-weight:700;text-transform:uppercase}.kg-btn,.kg-button-card{border-radius:var(--radius)}.kg-btn{height:auto;padding:var(--button-padding)}.kg-btn-accent{background-color:var(--primary);color:var(--button-text);transition:background-color .3s}.kg-btn-accent:hover{background-color:var(--primary-light);opacity:1}.kg-callout-card{background-color:var(--border-color);border-radius:var(--radius);padding:1rem} +/* Bookmark card */ +/* stylelint-disable-next-line selector-no-qualifying-type */ +.kg-bookmark-card a.kg-bookmark-container { + border-color: var(--border-color); + border-radius: var(--radius); + transition: border-color 0.3s; +} +.kg-bookmark-card .kg-bookmark-icon { + margin-inline: 0 6px; +} +.kg-bookmark-title { + font-size: 1rem; +} +.kg-bookmark-content { + padding: 1rem; +} +.kg-bookmark-description { + font-size: var(--small); + color: var(--element-light); +} +.kg-bookmark-metadata { + font-size: var(--small); +} +/* stylelint-disable-next-line selector-no-qualifying-type */ +.kg-bookmark-card:hover a.kg-bookmark-container { + border-color: var(--primary-light); + border-radius: var(--radius); +} +/* Toggle card */ +.kg-toggle-card { + padding: 1rem; + border: 1px solid var(--border-color); + border-radius: var(--radius); + box-shadow: none; +} +.kg-toggle-heading svg { + color: var(--primary-light); +} +.kg-toggle-card:hover .kg-toggle-heading svg { + color: var(--primary); +} +/* Button */ +.kg-button-card { + font-family: inherit; + font-weight: 700; + text-transform: uppercase; + border-radius: var(--radius); +} +.kg-btn { + height: auto; + height: initial; + padding: var(--button-padding); + border-radius: var(--radius); +} +.kg-btn-accent { + color: var(--button-text); + background-color: var(--primary); + transition: background-color 0.3s; +} +.kg-btn-accent:hover { + background-color: var(--primary-light); + opacity: 1; +} +/* Callout card */ +.kg-callout-card { + padding: 1rem; + background-color: var(--border-color); + border-radius: var(--radius); +} + /*# sourceMappingURL=ghost-cards.css.map */ \ No newline at end of file diff --git a/assets/built/ghost-cards.css.map b/assets/built/ghost-cards.css.map index 42c39381..53fc83be 100644 --- a/assets/built/ghost-cards.css.map +++ b/assets/built/ghost-cards.css.map @@ -1 +1 @@ -{"version":3,"sources":["ghost-cards.css"],"names":[],"mappings":"AAEA,0CACE,gCAAiC,CACjC,2BAA4B,CAC5B,2BACF,CACA,oCACE,mBACF,CAEA,mBACE,cACF,CAEA,qBACE,YACF,CAEA,yBAEE,0BAA2B,CAD3B,sBAEF,CAEA,sBACE,sBACF,CAGA,gDACE,iCAAkC,CAClC,2BACF,CAGA,gBAEE,oCAAqC,CACrC,2BAA4B,CAC5B,eAAgB,CAHhB,YAIF,CAEA,uBACE,0BACF,CAEA,6CACE,oBACF,CAGA,gBACE,mBAAoB,CACpB,eAAgB,CAChB,wBAEF,CACA,wBAFE,2BAMF,CAJA,QACE,WAAe,CACf,6BAEF,CAEA,eAEE,+BAAgC,CADhC,wBAAyB,CAEzB,+BACF,CAEA,qBACE,qCAAsC,CACtC,SACF,CAGA,iBAEE,oCAAqC,CACrC,2BAA4B,CAF5B,YAGF","file":"ghost-cards.css","sourcesContent":["/* Bookmark card */\n/* stylelint-disable-next-line selector-no-qualifying-type */\n.kg-bookmark-card a.kg-bookmark-container {\n border-color: var(--border-color);\n border-radius: var(--radius);\n transition: border-color 0.3s;\n}\n.kg-bookmark-card .kg-bookmark-icon {\n margin-inline: 0 6px;\n}\n\n.kg-bookmark-title {\n font-size: 1rem;\n}\n\n.kg-bookmark-content {\n padding: 1rem;\n}\n\n.kg-bookmark-description {\n font-size: var(--small);\n color: var(--element-light);\n}\n\n.kg-bookmark-metadata {\n font-size: var(--small);\n}\n\n/* stylelint-disable-next-line selector-no-qualifying-type */\n.kg-bookmark-card:hover a.kg-bookmark-container {\n border-color: var(--primary-light);\n border-radius: var(--radius);\n}\n\n/* Toggle card */\n.kg-toggle-card {\n padding: 1rem;\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n box-shadow: none;\n}\n\n.kg-toggle-heading svg {\n color: var(--primary-light);\n}\n\n.kg-toggle-card:hover .kg-toggle-heading svg {\n color: var(--primary);\n}\n\n/* Button */\n.kg-button-card {\n font-family: inherit;\n font-weight: 700;\n text-transform: uppercase;\n border-radius: var(--radius);\n}\n.kg-btn {\n height: initial;\n padding: var(--button-padding);\n border-radius: var(--radius);\n}\n\n.kg-btn-accent {\n color: var(--button-text);\n background-color: var(--primary);\n transition: background-color 0.3s;\n}\n\n.kg-btn-accent:hover {\n background-color: var(--primary-light);\n opacity: 1;\n}\n\n/* Callout card */\n.kg-callout-card {\n padding: 1rem;\n background-color: var(--border-color);\n border-radius: var(--radius);\n}\n"]} \ No newline at end of file +{"version":3,"sources":["ghost-cards.css"],"names":[],"mappings":"AAAA,kBAAkB;AAClB,4DAA4D;AAC5D;EACE,iCAAiC;EACjC,4BAA4B;EAC5B,6BAA6B;AAC/B;AACA;EACE,oBAAoB;AACtB;AAEA;EACE,eAAe;AACjB;AAEA;EACE,aAAa;AACf;AAEA;EACE,uBAAuB;EACvB,2BAA2B;AAC7B;AAEA;EACE,uBAAuB;AACzB;AAEA,4DAA4D;AAC5D;EACE,kCAAkC;EAClC,4BAA4B;AAC9B;AAEA,gBAAgB;AAChB;EACE,aAAa;EACb,qCAAqC;EACrC,4BAA4B;EAC5B,gBAAgB;AAClB;AAEA;EACE,2BAA2B;AAC7B;AAEA;EACE,qBAAqB;AACvB;AAEA,WAAW;AACX;EACE,oBAAoB;EACpB,gBAAgB;EAChB,yBAAyB;EACzB,4BAA4B;AAC9B;AACA;EACE,YAAe;EAAf,eAAe;EACf,8BAA8B;EAC9B,4BAA4B;AAC9B;AAEA;EACE,yBAAyB;EACzB,gCAAgC;EAChC,iCAAiC;AACnC;AAEA;EACE,sCAAsC;EACtC,UAAU;AACZ;AAEA,iBAAiB;AACjB;EACE,aAAa;EACb,qCAAqC;EACrC,4BAA4B;AAC9B","file":"ghost-cards.css","sourcesContent":["/* Bookmark card */\n/* stylelint-disable-next-line selector-no-qualifying-type */\n.kg-bookmark-card a.kg-bookmark-container {\n border-color: var(--border-color);\n border-radius: var(--radius);\n transition: border-color 0.3s;\n}\n.kg-bookmark-card .kg-bookmark-icon {\n margin-inline: 0 6px;\n}\n\n.kg-bookmark-title {\n font-size: 1rem;\n}\n\n.kg-bookmark-content {\n padding: 1rem;\n}\n\n.kg-bookmark-description {\n font-size: var(--small);\n color: var(--element-light);\n}\n\n.kg-bookmark-metadata {\n font-size: var(--small);\n}\n\n/* stylelint-disable-next-line selector-no-qualifying-type */\n.kg-bookmark-card:hover a.kg-bookmark-container {\n border-color: var(--primary-light);\n border-radius: var(--radius);\n}\n\n/* Toggle card */\n.kg-toggle-card {\n padding: 1rem;\n border: 1px solid var(--border-color);\n border-radius: var(--radius);\n box-shadow: none;\n}\n\n.kg-toggle-heading svg {\n color: var(--primary-light);\n}\n\n.kg-toggle-card:hover .kg-toggle-heading svg {\n color: var(--primary);\n}\n\n/* Button */\n.kg-button-card {\n font-family: inherit;\n font-weight: 700;\n text-transform: uppercase;\n border-radius: var(--radius);\n}\n.kg-btn {\n height: initial;\n padding: var(--button-padding);\n border-radius: var(--radius);\n}\n\n.kg-btn-accent {\n color: var(--button-text);\n background-color: var(--primary);\n transition: background-color 0.3s;\n}\n\n.kg-btn-accent:hover {\n background-color: var(--primary-light);\n opacity: 1;\n}\n\n/* Callout card */\n.kg-callout-card {\n padding: 1rem;\n background-color: var(--border-color);\n border-radius: var(--radius);\n}\n"]} \ No newline at end of file diff --git a/assets/built/post.js b/assets/built/post.js index a86a7804..09425499 100644 --- a/assets/built/post.js +++ b/assets/built/post.js @@ -1,3 +1,777 @@ -!function(){"use strict"; -/*! medium-zoom 1.0.8 | MIT License | https://github.com/francoischalifour/medium-zoom */var e=Object.assign||function(e){for(var t=1;t