From 51884e4fd6c306cffc7f951a0f8dcc207f45c701 Mon Sep 17 00:00:00 2001 From: Cristian Mayo Date: Thu, 28 Mar 2024 05:56:52 +0800 Subject: [PATCH] Updated articles page and about page --- src/_assets/css/scss/page/about-page.scss | 175 +++++++++++--------- src/_assets/css/scss/page/article-page.scss | 2 +- src/_assets/css/style.min.css | 2 +- src/about.njk | 30 ++-- src/articles.njk | 11 +- 5 files changed, 118 insertions(+), 102 deletions(-) diff --git a/src/_assets/css/scss/page/about-page.scss b/src/_assets/css/scss/page/about-page.scss index 1b5557d..f4158a6 100644 --- a/src/_assets/css/scss/page/about-page.scss +++ b/src/_assets/css/scss/page/about-page.scss @@ -1,115 +1,103 @@ -.page-content { +.about-page { display: grid; grid-template-columns: 2fr 1fr; - gap: var(--two-spacing); - margin: var(--default-spacing) 0; + gap: var(--three-spacing); + margin: 0; padding: 0; @media screen and (max-width:800px) { display: flex; flex-direction: column; - gap: var(--default-spacing); - } - - h3, h4, h5, h6 { - color: var(--text-white); - text-transform: capitalize; - } - - h2 { - // text-transform: capitalize; - size: var(--text-size-lg); - } - - h1 { - border-top: 5px solid var(--bg-primary); - padding-top: var(--default-spacing); - display: block; + gap: var(--two-spacing); } - > aside { + &__content { + order: 1; + grid-column: 0; + grid-row: span 3; display: flex; flex-direction: column; - gap: var(--default-spacing); - padding: 0 var(--two-spacing); - grid-column-start: 2; - grid-row-start: 1; - grid-row-end: 3; + gap: var(--three-spacing); @media screen and (max-width:800px) { - padding: 0 var(--default-spacing); + order: 2; + gap: var(--two-spacing); } - } - &__toc { - padding: var(--default-spacing); - background-color: var(--bg-slategray); - border-radius: 0.25rem; + &-header { + background-color: var(--bg-primary); + padding: var(--three-spacing) var(--two-spacing); + border-top-right-radius: 0.25rem; + border-bottom-right-radius: 0.25rem; - @media screen and (max-width:800px) { - width: calc(100% - var(--two-spacing)); - } + @media screen and (max-width:800px) { + padding: var(--two-spacing) var(--default-spacing); + margin-right: var(--default-spacing); + } - h6 { - text-transform: uppercase; - font-size: var(--text-size-default); - color: var(--text-light); + > h1 { + color: #fff; + padding: 0; + margin: 0; + } } - ul { - margin: 0; - padding: 0 0 0 1.5rem; + &-toc { + margin: 0 var(--two-spacing); - & > li a { - display: block; - padding: 0.25rem; - color: var(--text-lightgray); - font-size: small; + @media screen and (max-width:800px) { + margin: 0 var(--default-spacing); + } - &:hover { - color: var(--text-white); - } + h6 { + text-transform: uppercase; + font-size: var(--text-size-default); + color: var(--text-light); } - } - } - &__header { - background-color: var(--bg-primary); - padding: var(--three-spacing) var(--two-spacing); - border-top-right-radius: 0.25rem; - border-bottom-right-radius: 0.25rem; - grid-column-start: 1; - grid-column-end: 2; - grid-row-start: 1; + ul { + margin: 0; + padding: 0 0 0 1.5rem; - @media screen and (max-width:800px) { - padding: var(--default-spacing); - margin-right: var(--default-spacing); - } + & > li a { + display: block; + padding: 0.25rem; + color: var(--text-lightgray); + font-size: small; - > h1 { - color: #fff; - padding: 0; - margin: 0; + &:hover { + color: var(--text-white); + } + } + } } - } - &__content { - padding: 0 var(--two-spacing); - grid-column-start: 1; - grid-column-end: 2; - grid-row-start: 2; + &-entry { + padding: 0 var(--two-spacing); - @media screen and (max-width:800px) { - padding: 0 var(--default-spacing); - } + @media screen and (max-width:800px) { + padding: 0 var(--default-spacing); + } - &-entry:not(:first-child) { - margin-top: var(--three-spacing); - } + & h3, & h4, & h5, & h6 { + color: var(--text-white); + text-transform: capitalize; + } + + & h2 { + // text-transform: capitalize; + size: var(--text-size-lg); + } + + & h1 { + border-top: 5px solid var(--bg-primary); + padding-top: var(--default-spacing); + display: block; + } - img { - width: 100%; + & img { + width: 100%; + } } & > .giscus { @@ -118,4 +106,27 @@ padding-top: var(--two-spacing); } } + + &__callout-actions { + order: 3; + grid-column: 2; + margin: 0 var(--two-spacing) 0 0; + + @media screen and (max-width:800px) { + margin: 0 var(--default-spacing); + } + } + + > aside { + display: flex; + flex-direction: column; + gap: var(--default-spacing); + padding: 0 var(--two-spacing) 0 0; + order: 4; + grid-column: 2; + + @media screen and (max-width:800px) { + padding: 0 var(--default-spacing); + } + } } \ No newline at end of file diff --git a/src/_assets/css/scss/page/article-page.scss b/src/_assets/css/scss/page/article-page.scss index ac1c714..0fedc4e 100644 --- a/src/_assets/css/scss/page/article-page.scss +++ b/src/_assets/css/scss/page/article-page.scss @@ -109,7 +109,7 @@ > aside { display: flex; flex-direction: column; - gap: var(--default-spacing); + gap: var(--two-spacing); padding: 0 var(--two-spacing) 0 0; grid-column: 2; diff --git a/src/_assets/css/style.min.css b/src/_assets/css/style.min.css index 9898753..e02f05d 100644 --- a/src/_assets/css/style.min.css +++ b/src/_assets/css/style.min.css @@ -1 +1 @@ -@import url(https://fonts.googleapis.com/css2?family=Montserrat&family=Saira&display=swap);:root{--bg-primary:#0954ff;--bg-dark:rgb(33,37,41);--bg-dimgray:dimgray;--bg-slategray:rgb(44, 50, 56);--bg-lightgray:#c0c0c0;--bg-light:#dfdfdf;--device-width-lg:1440px;--device-width-md:768px;--device-width-sm:425px;--sidebar-width:350px;--default-spacing:1rem;--two-spacing:2rem;--three-spacing:3rem;--five-spacing:5rem;--text-lineheight:1.75rem;--text-size-title:1.5rem;--text-size-subtitle:1.2rem;--text-size-default:16px;--text-size-lg:1.5rem;--text-size-xl:2rem;--text-primary:#0954ff;--text-muted:#333333;--text-dark:rgb(33,37,41);--text-dimgray:dimgray;--text-slategray:rgb(42, 48, 56);--text-lightgray:#c0c0c0;--text-light:#dfdfdf;--font-body:'Montserrat',Verdana;--font-title:'Saira','Segoe UI';--shadow-dark-bg:rgba(0,0,0,.175);--shadow-dark-bottom:0 2rem 3rem var(--shadow-dark-bg);--shadow-dark-top:0 -2rem 3rem var(--shadow-dark-bg)}body{background-color:var(--bg-dark);font-family:Montserrat,Verdana;font-size:var(--text-size-default);color:var(--text-light);min-width:var(--device-width-sm);padding:0;margin:0}.container,article,footer,header,main,nav,section{-webkit-transition:width .5s ease-in-out;-moz-transition:width .5s ease-in-out;-o-transition:width .5s ease-in-out;transition:width .5s ease-in-out}article,p{line-height:var(--text-lineheight)}hr{border:inset 2px var(--bg-slategray)}h1,h2,h3,h4,h5,h6{font-family:Saira,'Segoe UI';color:var(--text-primary);margin:0 0 calc(var(--default-spacing)/2) 0}h1,h2{text-transform:uppercase;padding:.5rem 0}h3,h4,h5,h6{text-transform:capitalize;padding:0}h1{font-size:xx-large}h2{font-size:x-large}h3{font-size:larger}h4{font-size:large}h5{font-size:medium}h6{font-size:smaller}a{text-decoration:none;color:var(--text-primary)}.small,small{font-size:smaller}ul{list-style-type:square}ol{list-style:decimal-leading-zero}blockquote{border-left:solid 5px var(--bg-primary);padding-left:var(--two-spacing);margin:0;font-weight:700;font-style:italic;font-size:larger;margin:0}code{background-color:var(--bg-slategray);border-radius:3px;padding:calc(var(--default-spacing)/2) var(--default-spacing)}pre>code{padding:0}table{border-radius:.25rem;padding:var(--default-spacing);text-align:left}&>thead{text-transform:uppercase;font-family:var(--font-title);font-size:var(--text-size-default)}td{padding:.5rem 1rem;border:1px solid var(--bg-primary);margin:0}body{background-color:var(--bg-dark);font-family:Montserrat,Verdana;font-size:var(--text-size-default);color:var(--text-light);min-width:var(--device-width-sm);padding:0;margin:0}.container,article,footer,header,main,nav,section{-webkit-transition:width .5s ease-in-out;-moz-transition:width .5s ease-in-out;-o-transition:width .5s ease-in-out;transition:width .5s ease-in-out}article,p{line-height:var(--text-lineheight)}hr{border:inset 2px var(--bg-slategray)}h1,h2,h3,h4,h5,h6{font-family:Saira,'Segoe UI';color:var(--text-primary);margin:0 0 calc(var(--default-spacing)/2) 0}h1,h2{text-transform:uppercase;padding:.5rem 0}h3,h4,h5,h6{text-transform:capitalize;padding:0}h1{font-size:xx-large}h2{font-size:x-large}h3{font-size:larger}h4{font-size:large}h5{font-size:medium}h6{font-size:smaller}a{text-decoration:none;color:var(--text-primary)}a:visited{text-decoration:none;color:var(--text-primary)}a:hover{color:var(--text-light)}.small,small{font-size:smaller}ul{list-style-type:square}ul>li::marker{color:var(--text-primary)}ol{list-style:decimal-leading-zero}blockquote{border-left:solid 5px var(--bg-primary);padding-left:var(--two-spacing);margin:0;font-weight:700;font-style:italic;font-size:larger}blockquote>p{padding:var(--default-spacing) 0;margin:0}code,pre{background-color:var(--bg-slategray);border-radius:3px;padding:calc(var(--default-spacing)/2) var(--default-spacing)}pre>code{padding:0}table{border-radius:.25rem;padding:var(--default-spacing)}table>tbody,table>thead{vertical-align:text-top;text-align:left}table>thead{text-transform:uppercase;font-family:var(--font-title);font-size:var(--text-size-default)}table td{padding:.5rem 1rem;border:1px solid var(--bg-primary);margin:0}footer{color:var(--text-light);padding:var(--two-spacing) var(--default-spacing);margin:0;border-top:solid 1px var(--bg-slategray);background-color:var(--bg-dark);box-shadow:var(--shadow-dark-top);-webkit-box-shadow:var(--shadow-dark-top);-moz-box-shadow:var(--shadow-dark-top)}footer .footer__nav{display:flex;flex-direction:row;flex-wrap:wrap;align-content:center;align-items:baseline;justify-content:space-between;gap:var(--default-spacing);padding:0}@media screen and (max-width:800px){footer .footer__nav{flex-direction:column;align-content:flex-start}}footer .footer__notes{font-size:small;padding:0 .5rem}header{border-bottom:solid 1px var(--bg-slategray);background-color:var(--bg-dark);box-shadow:var(--shadow-dark-bottom);-webkit-box-shadow:var(--shadow-dark-bottom);-moz-box-shadow:var(--shadow-dark-bottom);padding:var(--two-spacing);display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:1rem}@media screen and (max-width:800px){header{padding:var(--default-spacing)}}header .logo-brand img{width:50px}header .header__title{flex:1;display:flex;flex-wrap:nowrap;flex-direction:column;align-items:normal}header .header__title p{font-family:Saira,'Segoe UI';color:var(--text-light);font-size:var(--text-size-title);font-weight:700;text-transform:uppercase;padding:0;margin:0}@media screen and (max-width:450px){header .header__title p{font-size:var(--text-size-subtitle)}}header .header__default-nav{display:block}@media screen and (max-width:800px){header .header__default-nav{display:none}}main{margin:var(--three-spacing) 0;display:flex;flex-direction:column;gap:var(--three-spacing)}@media screen and (max-width:800px){main{margin:var(--two-spacing) 0;gap:var(--two-spacing)}}nav .nav__menu{list-style-type:none;margin:0;padding:0;display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:flex-start;align-items:center;gap:calc(var(--default-spacing)/2)}@media screen and (max-width:450px){nav .nav__menu{flex-wrap:wrap}}nav .nav__menu-link a{font-family:var(--font-title);font-size:smaller;font-weight:700;color:var(--text-lightgray);text-transform:uppercase;padding:.5rem 1rem}nav .nav__menu-link a:hover{border-top:solid 3px var(--bg-primary);color:var(--text-white);text-decoration:none}*{box-sizing:content-box!important}.container{max-width:calc(var(--device-width-lg) - (2 * var(--default-spacing)));padding-left:var(--two-spacing);padding-right:var(--two-spacing);margin:0 auto}@media screen and (max-width:800px){.container{padding:0 var(--default-spacing)}}.container-block{padding:var(--default-spacing);background-color:var(--bg-slategray);border-radius:.25rem}.content-block{box-shadow:1rem 1rem 1rem var(--shadow-dark);background-color:var(--bg-slategray);padding:var(--default-spacing);border-radius:.5rem}.under-construction{border-left:solid 1rem var(--bg-primary);padding:0 1rem;margin:3rem 0}.under-construction>h2{margin:0;padding:0 0 1rem 0}@media screen and (max-width:450px){.under-construction>h2{font-size:larger}}.under-construction>div{border-left:solid 1rem var(--bg-light);padding:0 1rem 1rem 1rem;color:var(--text-light)}:root{--bg-primary:#0954ff;--bg-dark:rgb(33,37,41);--bg-dimgray:dimgray;--bg-slategray:rgb(44, 50, 56);--bg-lightgray:#c0c0c0;--bg-light:#dfdfdf;--device-width-lg:1440px;--device-width-md:768px;--device-width-sm:425px;--sidebar-width:350px;--default-spacing:1rem;--two-spacing:2rem;--three-spacing:3rem;--five-spacing:5rem;--text-lineheight:1.75rem;--text-size-title:1.5rem;--text-size-subtitle:1.2rem;--text-size-default:16px;--text-size-lg:1.5rem;--text-size-xl:2rem;--text-primary:#0954ff;--text-muted:#333333;--text-dark:rgb(33,37,41);--text-dimgray:dimgray;--text-slategray:rgb(42, 48, 56);--text-lightgray:#c0c0c0;--text-light:#dfdfdf;--font-body:'Montserrat',Verdana;--font-title:'Saira','Segoe UI';--shadow-dark-bg:rgba(0,0,0,.175);--shadow-dark-bottom:0 2rem 3rem var(--shadow-dark-bg);--shadow-dark-top:0 -2rem 3rem var(--shadow-dark-bg)}pre.mermaid{background-color:transparent;border-radius:unset;padding:var(--default-spacing);font-size:var(--text-size-default);fill:#333}pre.mermaid .edge-thickness-normal{stroke-width:2px}pre.mermaid .edge-thickness-thick{stroke-width:3.5px}pre.mermaid .edge-pattern-solid{stroke-dasharray:0}pre.mermaid .edge-pattern-dashed{stroke-dasharray:3}pre.mermaid .edge-pattern-dotted{stroke-dasharray:2}pre.mermaid .marker{fill:var(--bg-lightgray);stroke:var(--bg-lightgray)}pre.mermaid .marker.cross{stroke:var(--bg-lightgray)}pre.mermaid svg{font-family:var(--font-body);font-size:16px}pre.mermaid .label{font-family:var(--font-body);color:#333}pre.mermaid .cluster-label text{fill:#333}pre.mermaid .cluster-label span,pre.mermaid p{color:#333}pre.mermaid .label text,pre.mermaid p,pre.mermaid span{fill:#333;color:#333}pre.mermaid .node circle,pre.mermaid .node ellipse,pre.mermaid .node path,pre.mermaid .node polygon,pre.mermaid .node rect{fill:#ececff;stroke:#9370db;stroke-width:1px}pre.mermaid .flowchart-label text{text-anchor:middle}pre.mermaid .node .label{text-align:center}pre.mermaid .node.clickable{cursor:pointer}pre.mermaid .arrowheadPath{fill:var(--bg-lightgray)}pre.mermaid .edgePath .path{stroke:var(--bg-lightgray);stroke-width:2px}pre.mermaid .flowchart-link{stroke:var(--bg-lightgray);fill:none}pre.mermaid .edgeLabel{background-color:#e8e8e8;text-align:center}pre.mermaid .edgeLabel rect{opacity:.5;background-color:#e8e8e8;fill:#e8e8e8}pre.mermaid .cluster rect{fill:#ffffde;stroke:#aa3;stroke-width:1px}pre.mermaid .cluster text{fill:#333}pre.mermaid .cluster span,pre.mermaid p{color:#333}pre.mermaid div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:var(--font-body);font-size:12px;background:#f9ffec;border:1px solid #aa3;border-radius:2px;pointer-events:none;z-index:100}pre.mermaid .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333}.page-content{display:grid;grid-template-columns:2fr 1fr;gap:var(--two-spacing);margin:var(--default-spacing) 0;padding:0}@media screen and (max-width:800px){.page-content{display:flex;flex-direction:column;gap:var(--default-spacing)}}.page-content h3,.page-content h4,.page-content h5,.page-content h6{color:var(--text-white);text-transform:capitalize}.page-content h2{size:var(--text-size-lg)}.page-content h1{border-top:5px solid var(--bg-primary);padding-top:var(--default-spacing);display:block}.page-content>aside{display:flex;flex-direction:column;gap:var(--default-spacing);padding:0 var(--two-spacing);grid-column-start:2;grid-row-start:1;grid-row-end:3}@media screen and (max-width:800px){.page-content>aside{padding:0 var(--default-spacing)}}.page-content__toc{padding:var(--default-spacing);background-color:var(--bg-slategray);border-radius:.25rem}@media screen and (max-width:800px){.page-content__toc{width:calc(100% - var(--two-spacing))}}.page-content__toc h6{text-transform:uppercase;font-size:var(--text-size-default);color:var(--text-light)}.page-content__toc ul{margin:0;padding:0 0 0 1.5rem}.page-content__toc ul>li a{display:block;padding:.25rem;color:var(--text-lightgray);font-size:small}.page-content__toc ul>li a:hover{color:var(--text-white)}.page-content__header{background-color:var(--bg-primary);padding:var(--three-spacing) var(--two-spacing);border-top-right-radius:.25rem;border-bottom-right-radius:.25rem;grid-column-start:1;grid-column-end:2;grid-row-start:1}@media screen and (max-width:800px){.page-content__header{padding:var(--default-spacing);margin-right:var(--default-spacing)}}.page-content__header>h1{color:#fff;padding:0;margin:0}.page-content__content{padding:0 var(--two-spacing);grid-column-start:1;grid-column-end:2;grid-row-start:2}@media screen and (max-width:800px){.page-content__content{padding:0 var(--default-spacing)}}.page-content__content-entry:not(:first-child){margin-top:var(--three-spacing)}.page-content__content img{width:100%}.page-content__content>.giscus{border-top:5px solid var(--bg-primary);margin-top:var(--two-spacing);padding-top:var(--two-spacing)}.articles-page{margin:0;padding:0;display:grid;grid-template-columns:2fr 1fr;justify-items:stretch;gap:var(--three-spacing)}@media screen and (max-width:800px){.articles-page{display:flex;flex-direction:column;gap:var(--two-spacing)}}.articles-page__articles-list{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:var(--two-spacing);grid-column:1;grid-row:span 3}@media screen and (max-width:800px){.articles-page__articles-list{gap:0}}.articles-page__articles-list .articles-list__header{background-color:var(--bg-primary);padding:var(--three-spacing) var(--two-spacing);border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}@media screen and (max-width:800px){.articles-page__articles-list .articles-list__header{padding:var(--two-spacing) var(--default-spacing);margin-right:var(--default-spacing)}}.articles-page__articles-list .articles-list__header>h1{color:#fff;padding:0;margin:0}@media screen and (max-width:800px){.articles-page__articles-list .articles-list{padding:0 var(--default-spacing)}}.articles-page__articles-list .articles-list__entry{padding:0 var(--two-spacing)}@media screen and (max-width:800px){.articles-page__articles-list .articles-list__entry{padding:var(--default-spacing)}}.articles-page__articles-list .articles-list__entry .article-entry__title{color:var(--text-primary);font-size:var(--text-size-lg);font-family:var(--font-title);font-weight:700;display:block}.articles-page__articles-list .articles-list__entry .article-entry__title:hover,.articles-page__articles-list .articles-list__entry .article-entry__title:visited{color:var(--text-primary)}.articles-page__articles-list .articles-list__entry .article-entry__meta{color:var(--text-lightgray);padding-bottom:calc(var(--default-spacing)/2)}.articles-page__articles-list .articles-list__entry .article-entry__excerpt{line-height:1.5;color:var(--text-light);display:block}@media screen and (max-width:800px){.articles-page__articles-list .articles-list__entry .article-entry__excerpt{font-size:var(--text-size-default)}}.articles-page__articles-list .articles-list__entry .article-entry__excerpt:visited{color:var(--text-light)}.articles-page__articles-list .articles-list__entry .article-entry__excerpt:hover{color:#fff}.articles-page__callout-actions{grid-column:2;margin:0 var(--two-spacing) 0 0}@media screen and (max-width:800px){.articles-page__callout-actions{margin:0 var(--default-spacing)}}.articles-page>aside{display:flex;flex-direction:column;gap:var(--default-spacing);padding:0 var(--two-spacing) 0 0;grid-column:2}@media screen and (max-width:800px){.articles-page>aside{padding:0 var(--default-spacing)}}.home-page{padding:0;display:grid;grid-template-columns:2fr 1fr;gap:var(--three-spacing)}@media screen and (max-width:800px){.home-page{display:flex;flex-direction:column;gap:var(--two-spacing)}}.home-page__featured-figure{grid-column:1;margin:0;padding:0}@media screen and (max-width:1025px){.home-page__featured-figure{padding-right:var(--two-spacing);grid-column:span 2}}@media screen and (max-width:800px){.home-page__featured-figure{padding:0}}.home-page__featured-figure .featured-figure__title{background-color:var(--bg-primary);padding:var(--three-spacing) var(--two-spacing);border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}@media screen and (max-width:800px){.home-page__featured-figure .featured-figure__title{margin:0 var(--default-spacing) 0 0;padding:var(--two-spacing) var(--default-spacing)}}.home-page__featured-figure .featured-figure__title h1{text-transform:capitalize;color:#fff}@media screen and (max-width:800px){.home-page__featured-figure .featured-figure__title h1{font-size:var(--text-size-title)}}.home-page__featured-figure .featured-figure__title span{font-size:var(--text-size-default);line-height:1.5}.home-page__featured-figure figcaption h5{color:var(--text-dimgray);text-transform:uppercase;padding:var(--default-spacing) 0 0 var(--two-spacing)}@media screen and (max-width:800px){.home-page__featured-figure figcaption h5{padding:var(--default-spacing)}}.home-page__featured-figure img{margin:var(--default-spacing) 0 0 var(--two-spacing);width:calc(100% - var(--two-spacing))}@media screen and (max-width:800px){.home-page__featured-figure img{margin:var(--default-spacing);width:calc(100% - var(--two-spacing))}}.home-page__meta{grid-column:2;padding:0 var(--two-spacing) 0 0}@media screen and (max-width:1025px){.home-page__meta{padding:0 var(--two-spacing);grid-column:span 2}.home-page__meta>section:first-child{display:flex;flex-direction:row}}@media screen and (max-width:800px){.home-page__meta{padding:var(--default-spacing)}.home-page__meta>section:first-child{display:flex;flex-direction:column}}.home-page__recent-articles{grid-column:1;padding:0 var(--two-spacing)}@media screen and (max-width:800px){.home-page__recent-articles{padding:var(--default-spacing)}}.home-page>aside{grid-column:2;padding:0 var(--two-spacing)}@media screen and (max-width:800px){.home-page>aside{padding:var(--default-spacing)}}.article-category-cards{display:flex;gap:var(--two-spacing);color:var(--text-light);flex-direction:column}.article-category-cards__item{background-color:var(--bg-slategray);border-top:solid 5px var(--bg-primary)}.article-category-cards__item .category-card{display:flex;flex-direction:column;color:var(--text-light);padding:var(--two-spacing)}@media screen and (max-width:450px){.article-category-cards__item .category-card{padding:var(--two-spacing) var(--default-spacing)}}.article-category-cards__item .category-card:hover{color:#fff}.article-category-cards__item .category-card>[class*=fa-]{font-size:calc(var(--text-size-xl) * 5);color:var(--text-dark);position:absolute;align-self:center;z-index:1}.article-category-cards__item .category-card__title{font-family:var(--font-title);font-size:var(--text-size-title);font-weight:700;color:var(--text-primary);z-index:2}@media screen and (max-width:1024px){.article-category-cards__item .category-card__title{font-size:calc(var(--text-size-title) * .9)}}.article-category-cards__item .category-card__description{font-size:small;line-height:1.5;flex:1;z-index:2}@media screen and (max-width:800px){.article-category-cards__item .category-card__description{font-size:var(--text-size-default);margin-top:0}}.article-category-cards__item .category-card__post-count{z-index:2}.article-categories__title{color:var(--text-dimgray);text-transform:uppercase}.article-categories__list>li{line-height:var(--text-lineheight)}.article-categories__list>li>a,.article-categories__list>li>a:visited{color:var(--text-lightgray)}.article-categories__list>li>a:hover{color:#fff}.article-subcategories__title{color:var(--text-dimgray);text-transform:uppercase}.article-subcategories__list>li{line-height:var(--text-lineheight)}.article-subcategories__list>li>a,.article-subcategories__list>li>a:visited{color:var(--text-lightgray)}.article-subcategories__list>li>a:hover{color:#fff}.author-info{margin:var(--default-spacing) 0}.author-info__card{display:flex;flex-direction:row;flex-wrap:wrap;align-content:center;justify-content:flex-start;align-items:center;gap:var(--default-spacing)}.author-info__card-img{width:5rem;height:5rem;border-radius:50%}.author-info__card-name{flex:1}.author-info__card-name h2{font-weight:700;padding:0;margin:0}.author-info__summary{font-size:var(--text-size-default);font-weight:400}.page-callout{background-color:var(--bg-primary);color:var(--text-white);padding:var(--three-spacing) var(--default-spacing)}@media screen and (max-width:800px){.page-callout{margin-bottom:var(--two-spacing)}}.page-callout>.container{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:space-between;align-items:center;gap:var(--five-spacing)}@media screen and (max-width:800px){.page-callout>.container{flex-direction:column;align-items:flex-start;gap:0}}.page-callout>.container article{flex:1}.page-callout>.container div{background-color:transparent;text-align:center;width:25%}@media screen and (max-width:800px){.page-callout>.container div{display:none}}.page-callout>.container div>[class*=fa-]{font-size:calc(var(--text-size-lg) * 5)}.page-callout__title{color:var(--text-white);text-transform:unset;padding:.25rem 0;margin:0}@media screen and (max-width:450px){.page-callout__title{font-size:var(--text-size-lg)}}.page-callout__description{margin:.5rem 0}.page-callout__action-link{margin-top:var(--two-spacing);padding:1rem var(--two-spacing);background-color:var(--bg-light);border-radius:3px;display:inline-block}@media screen and (max-width:800px){.page-callout__action-link{flex-wrap:wrap;align-content:flex-start}}.page-callout__action-link:hover{background-color:#fff;color:var(--text-primary)}.page-callout__action-text{font-family:var(--font-title);font-weight:700;font-size:var(--text-size-title);text-transform:uppercase}.recent-articles__title{color:var(--text-dimgray);text-transform:uppercase}.recent-articles__list{display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:space-between;align-items:flex-start;gap:var(--two-spacing);padding-top:var(--default-spacing)}.recent-articles__list .article-entry__title{color:var(--text-primary);font-size:var(--text-size-lg);font-family:var(--font-title);font-weight:700;display:block}.recent-articles__list .article-entry__title:hover,.recent-articles__list .article-entry__title:visited{color:var(--text-primary)}.recent-articles__list .article-entry__meta{color:var(--text-lightgray);padding-bottom:calc(var(--default-spacing)/2)}.recent-articles__list .article-entry__excerpt{line-height:1.5;color:var(--text-light);display:block}@media screen and (max-width:800px){.recent-articles__list .article-entry__excerpt{font-size:var(--text-size-default)}}.recent-articles__list .article-entry__excerpt:visited{color:var(--text-light)}.recent-articles__list .article-entry__excerpt:hover{color:#fff}.articles-header{background-color:var(--bg-primary);color:var(--text-white);padding:var(--two-spacing) var(--default-spacing)}.articles-header__title{color:var(--text-white);text-transform:unset;padding:0;margin:0}@media screen and (max-width:800px){.articles-header__title{font-size:var(--text-size-lg)}}.articles-header .articles-breadcrumb{text-transform:uppercase;font-family:var(--font-body);font-weight:700;padding:var(--default-spacing) 0;color:var(--text-lightgray)}.articles-header .articles-breadcrumb ul{list-style:none;padding:0;margin:0 0 var(--default-spacing) 0;display:flex;align-items:center;flex-wrap:nowrap;flex-direction:row}.articles-header .articles-breadcrumb__item a{color:var(--text-lightgray)!important}.articles-header .articles-breadcrumb__item a:hover{color:var(--text-primary)}.articles-header .articles-breadcrumb__divider{margin:0 calc(var(--default-spacing)/2);color:var(--text-lightgray)}.articles-entry{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;justify-content:flex-end;align-items:flex-start;gap:var(--three-spacing)}@media screen and (max-width:800px){.articles-entry{flex-direction:column;gap:var(--default-spacing);width:calc(100%-var(--default-spacing))}}.articles-entry__toc{padding:var(--default-spacing);background-color:var(--bg-slategray);border-radius:.25rem}@media screen and (max-width:800px){.articles-entry__toc{width:100%}}.articles-entry__toc h6{text-transform:uppercase;font-size:var(--text-size-default);color:var(--text-light)}.articles-entry__toc ul{margin:0;padding:0 0 0 1.5rem}.articles-entry__toc ul>li a{display:block;padding:.25rem;color:var(--text-lightgray);font-size:small}.articles-entry__toc ul>li a:hover{color:var(--text-white)}.articles-entry__content{flex:1}.articles-entry__content h1,.articles-entry__content h2,.articles-entry__content h3,.articles-entry__content h4,.articles-entry__content h5,.articles-entry__content h6{color:var(--text-white);text-transform:capitalize;margin-top:var(--two-spacing);font-weight:700}.articles-entry__content h1,.articles-entry__content h2{border-top:5px solid var(--bg-primary);padding-top:var(--two-spacing);margin-top:var(--three-spacing);display:block}.articles-entry__content-featured-image{background-color:var(--bg-dark);border-radius:3px;padding:0 var(--default-spacing);margin:0 0 var(--default-spacing) 0}@media screen and (max-width:450px){.articles-entry__content-featured-image{padding:0 var(--default-spacing)}}.articles-entry__content-featured-image>img{width:100%}.articles-entry__content-featured-image>figcaption{font-size:small;font-weight:700}.articles-entry__content img{width:100%}.articles-entry__content .giscus-area .giscus{border-top:5px solid var(--bg-primary);margin-top:var(--default-spacing);padding-top:var(--three-spacing)} \ No newline at end of file +@import url(https://fonts.googleapis.com/css2?family=Montserrat&family=Saira&display=swap);:root{--bg-primary:#0954ff;--bg-dark:rgb(33,37,41);--bg-dimgray:dimgray;--bg-slategray:rgb(44, 50, 56);--bg-lightgray:#c0c0c0;--bg-light:#dfdfdf;--device-width-lg:1440px;--device-width-md:768px;--device-width-sm:425px;--sidebar-width:350px;--default-spacing:1rem;--two-spacing:2rem;--three-spacing:3rem;--five-spacing:5rem;--text-lineheight:1.75rem;--text-size-title:1.5rem;--text-size-subtitle:1.2rem;--text-size-default:16px;--text-size-lg:1.5rem;--text-size-xl:2rem;--text-primary:#0954ff;--text-muted:#333333;--text-dark:rgb(33,37,41);--text-dimgray:dimgray;--text-slategray:rgb(42, 48, 56);--text-lightgray:#c0c0c0;--text-light:#dfdfdf;--font-body:'Montserrat',Verdana;--font-title:'Saira','Segoe UI';--shadow-dark-bg:rgba(0,0,0,.175);--shadow-dark-bottom:0 2rem 3rem var(--shadow-dark-bg);--shadow-dark-top:0 -2rem 3rem var(--shadow-dark-bg)}body{background-color:var(--bg-dark);font-family:Montserrat,Verdana;font-size:var(--text-size-default);color:var(--text-light);min-width:var(--device-width-sm);padding:0;margin:0}.container,article,footer,header,main,nav,section{-webkit-transition:width .5s ease-in-out;-moz-transition:width .5s ease-in-out;-o-transition:width .5s ease-in-out;transition:width .5s ease-in-out}article,p{line-height:var(--text-lineheight)}hr{border:inset 2px var(--bg-slategray)}h1,h2,h3,h4,h5,h6{font-family:Saira,'Segoe UI';color:var(--text-primary);margin:0 0 calc(var(--default-spacing)/2) 0}h1,h2{text-transform:uppercase;padding:.5rem 0}h3,h4,h5,h6{text-transform:capitalize;padding:0}h1{font-size:xx-large}h2{font-size:x-large}h3{font-size:larger}h4{font-size:large}h5{font-size:medium}h6{font-size:smaller}a{text-decoration:none;color:var(--text-primary)}.small,small{font-size:smaller}ul{list-style-type:square}ol{list-style:decimal-leading-zero}blockquote{border-left:solid 5px var(--bg-primary);padding-left:var(--two-spacing);margin:0;font-weight:700;font-style:italic;font-size:larger;margin:0}code{background-color:var(--bg-slategray);border-radius:3px;padding:calc(var(--default-spacing)/2) var(--default-spacing)}pre>code{padding:0}table{border-radius:.25rem;padding:var(--default-spacing);text-align:left}&>thead{text-transform:uppercase;font-family:var(--font-title);font-size:var(--text-size-default)}td{padding:.5rem 1rem;border:1px solid var(--bg-primary);margin:0}body{background-color:var(--bg-dark);font-family:Montserrat,Verdana;font-size:var(--text-size-default);color:var(--text-light);min-width:var(--device-width-sm);padding:0;margin:0}.container,article,footer,header,main,nav,section{-webkit-transition:width .5s ease-in-out;-moz-transition:width .5s ease-in-out;-o-transition:width .5s ease-in-out;transition:width .5s ease-in-out}article,p{line-height:var(--text-lineheight)}hr{border:inset 2px var(--bg-slategray)}h1,h2,h3,h4,h5,h6{font-family:Saira,'Segoe UI';color:var(--text-primary);margin:0 0 calc(var(--default-spacing)/2) 0}h1,h2{text-transform:uppercase;padding:.5rem 0}h3,h4,h5,h6{text-transform:capitalize;padding:0}h1{font-size:xx-large}h2{font-size:x-large}h3{font-size:larger}h4{font-size:large}h5{font-size:medium}h6{font-size:smaller}a{text-decoration:none;color:var(--text-primary)}a:visited{text-decoration:none;color:var(--text-primary)}a:hover{color:var(--text-light)}.small,small{font-size:smaller}ul{list-style-type:square}ul>li::marker{color:var(--text-primary)}ol{list-style:decimal-leading-zero}blockquote{border-left:solid 5px var(--bg-primary);padding-left:var(--two-spacing);margin:0;font-weight:700;font-style:italic;font-size:larger}blockquote>p{padding:var(--default-spacing) 0;margin:0}code,pre{background-color:var(--bg-slategray);border-radius:3px;padding:calc(var(--default-spacing)/2) var(--default-spacing)}pre>code{padding:0}table{border-radius:.25rem;padding:var(--default-spacing)}table>tbody,table>thead{vertical-align:text-top;text-align:left}table>thead{text-transform:uppercase;font-family:var(--font-title);font-size:var(--text-size-default)}table td{padding:.5rem 1rem;border:1px solid var(--bg-primary);margin:0}footer{color:var(--text-light);padding:var(--two-spacing) var(--default-spacing);margin:0;border-top:solid 1px var(--bg-slategray);background-color:var(--bg-dark);box-shadow:var(--shadow-dark-top);-webkit-box-shadow:var(--shadow-dark-top);-moz-box-shadow:var(--shadow-dark-top)}footer .footer__nav{display:flex;flex-direction:row;flex-wrap:wrap;align-content:center;align-items:baseline;justify-content:space-between;gap:var(--default-spacing);padding:0}@media screen and (max-width:800px){footer .footer__nav{flex-direction:column;align-content:flex-start}}footer .footer__notes{font-size:small;padding:0 .5rem}header{border-bottom:solid 1px var(--bg-slategray);background-color:var(--bg-dark);box-shadow:var(--shadow-dark-bottom);-webkit-box-shadow:var(--shadow-dark-bottom);-moz-box-shadow:var(--shadow-dark-bottom);padding:var(--two-spacing);display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:1rem}@media screen and (max-width:800px){header{padding:var(--default-spacing)}}header .logo-brand img{width:50px}header .header__title{flex:1;display:flex;flex-wrap:nowrap;flex-direction:column;align-items:normal}header .header__title p{font-family:Saira,'Segoe UI';color:var(--text-light);font-size:var(--text-size-title);font-weight:700;text-transform:uppercase;padding:0;margin:0}@media screen and (max-width:450px){header .header__title p{font-size:var(--text-size-subtitle)}}header .header__default-nav{display:block}@media screen and (max-width:800px){header .header__default-nav{display:none}}main{margin:var(--three-spacing) 0;display:flex;flex-direction:column;gap:var(--three-spacing)}@media screen and (max-width:800px){main{margin:var(--two-spacing) 0;gap:var(--two-spacing)}}nav .nav__menu{list-style-type:none;margin:0;padding:0;display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:flex-start;align-items:center;gap:calc(var(--default-spacing)/2)}@media screen and (max-width:450px){nav .nav__menu{flex-wrap:wrap}}nav .nav__menu-link a{font-family:var(--font-title);font-size:smaller;font-weight:700;color:var(--text-lightgray);text-transform:uppercase;padding:.5rem 1rem}nav .nav__menu-link a:hover{border-top:solid 3px var(--bg-primary);color:var(--text-white);text-decoration:none}*{box-sizing:content-box!important}.container{max-width:calc(var(--device-width-lg) - (2 * var(--default-spacing)));padding-left:var(--two-spacing);padding-right:var(--two-spacing);margin:0 auto}@media screen and (max-width:800px){.container{padding:0 var(--default-spacing)}}.container-block{padding:var(--default-spacing);background-color:var(--bg-slategray);border-radius:.25rem}.content-block{box-shadow:1rem 1rem 1rem var(--shadow-dark);background-color:var(--bg-slategray);padding:var(--default-spacing);border-radius:.5rem}.under-construction{border-left:solid 1rem var(--bg-primary);padding:0 1rem;margin:3rem 0}.under-construction>h2{margin:0;padding:0 0 1rem 0}@media screen and (max-width:450px){.under-construction>h2{font-size:larger}}.under-construction>div{border-left:solid 1rem var(--bg-light);padding:0 1rem 1rem 1rem;color:var(--text-light)}:root{--bg-primary:#0954ff;--bg-dark:rgb(33,37,41);--bg-dimgray:dimgray;--bg-slategray:rgb(44, 50, 56);--bg-lightgray:#c0c0c0;--bg-light:#dfdfdf;--device-width-lg:1440px;--device-width-md:768px;--device-width-sm:425px;--sidebar-width:350px;--default-spacing:1rem;--two-spacing:2rem;--three-spacing:3rem;--five-spacing:5rem;--text-lineheight:1.75rem;--text-size-title:1.5rem;--text-size-subtitle:1.2rem;--text-size-default:16px;--text-size-lg:1.5rem;--text-size-xl:2rem;--text-primary:#0954ff;--text-muted:#333333;--text-dark:rgb(33,37,41);--text-dimgray:dimgray;--text-slategray:rgb(42, 48, 56);--text-lightgray:#c0c0c0;--text-light:#dfdfdf;--font-body:'Montserrat',Verdana;--font-title:'Saira','Segoe UI';--shadow-dark-bg:rgba(0,0,0,.175);--shadow-dark-bottom:0 2rem 3rem var(--shadow-dark-bg);--shadow-dark-top:0 -2rem 3rem var(--shadow-dark-bg)}pre.mermaid{background-color:transparent;border-radius:unset;padding:var(--default-spacing);font-size:var(--text-size-default);fill:#333}pre.mermaid .edge-thickness-normal{stroke-width:2px}pre.mermaid .edge-thickness-thick{stroke-width:3.5px}pre.mermaid .edge-pattern-solid{stroke-dasharray:0}pre.mermaid .edge-pattern-dashed{stroke-dasharray:3}pre.mermaid .edge-pattern-dotted{stroke-dasharray:2}pre.mermaid .marker{fill:var(--bg-lightgray);stroke:var(--bg-lightgray)}pre.mermaid .marker.cross{stroke:var(--bg-lightgray)}pre.mermaid svg{font-family:var(--font-body);font-size:16px}pre.mermaid .label{font-family:var(--font-body);color:#333}pre.mermaid .cluster-label text{fill:#333}pre.mermaid .cluster-label span,pre.mermaid p{color:#333}pre.mermaid .label text,pre.mermaid p,pre.mermaid span{fill:#333;color:#333}pre.mermaid .node circle,pre.mermaid .node ellipse,pre.mermaid .node path,pre.mermaid .node polygon,pre.mermaid .node rect{fill:#ececff;stroke:#9370db;stroke-width:1px}pre.mermaid .flowchart-label text{text-anchor:middle}pre.mermaid .node .label{text-align:center}pre.mermaid .node.clickable{cursor:pointer}pre.mermaid .arrowheadPath{fill:var(--bg-lightgray)}pre.mermaid .edgePath .path{stroke:var(--bg-lightgray);stroke-width:2px}pre.mermaid .flowchart-link{stroke:var(--bg-lightgray);fill:none}pre.mermaid .edgeLabel{background-color:#e8e8e8;text-align:center}pre.mermaid .edgeLabel rect{opacity:.5;background-color:#e8e8e8;fill:#e8e8e8}pre.mermaid .cluster rect{fill:#ffffde;stroke:#aa3;stroke-width:1px}pre.mermaid .cluster text{fill:#333}pre.mermaid .cluster span,pre.mermaid p{color:#333}pre.mermaid div.mermaidTooltip{position:absolute;text-align:center;max-width:200px;padding:2px;font-family:var(--font-body);font-size:12px;background:#f9ffec;border:1px solid #aa3;border-radius:2px;pointer-events:none;z-index:100}pre.mermaid .flowchartTitleText{text-anchor:middle;font-size:18px;fill:#333}.about-page{display:grid;grid-template-columns:2fr 1fr;gap:var(--three-spacing);margin:0;padding:0}@media screen and (max-width:800px){.about-page{display:flex;flex-direction:column;gap:var(--two-spacing)}}.about-page__content{order:1;grid-column:0;grid-row:span 3;display:flex;flex-direction:column;gap:var(--three-spacing)}@media screen and (max-width:800px){.about-page__content{order:2;gap:var(--two-spacing)}}.about-page__content-header{background-color:var(--bg-primary);padding:var(--three-spacing) var(--two-spacing);border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}@media screen and (max-width:800px){.about-page__content-header{padding:var(--two-spacing) var(--default-spacing);margin-right:var(--default-spacing)}}.about-page__content-header>h1{color:#fff;padding:0;margin:0}.about-page__content-toc{margin:0 var(--two-spacing)}@media screen and (max-width:800px){.about-page__content-toc{margin:0 var(--default-spacing)}}.about-page__content-toc h6{text-transform:uppercase;font-size:var(--text-size-default);color:var(--text-light)}.about-page__content-toc ul{margin:0;padding:0 0 0 1.5rem}.about-page__content-toc ul>li a{display:block;padding:.25rem;color:var(--text-lightgray);font-size:small}.about-page__content-toc ul>li a:hover{color:var(--text-white)}.about-page__content-entry{padding:0 var(--two-spacing)}@media screen and (max-width:800px){.about-page__content-entry{padding:0 var(--default-spacing)}}.about-page__content-entry h3,.about-page__content-entry h4,.about-page__content-entry h5,.about-page__content-entry h6{color:var(--text-white);text-transform:capitalize}.about-page__content-entry h2{size:var(--text-size-lg)}.about-page__content-entry h1{border-top:5px solid var(--bg-primary);padding-top:var(--default-spacing);display:block}.about-page__content-entry img{width:100%}.about-page__content>.giscus{border-top:5px solid var(--bg-primary);margin-top:var(--two-spacing);padding-top:var(--two-spacing)}.about-page__callout-actions{order:3;grid-column:2;margin:0 var(--two-spacing) 0 0}@media screen and (max-width:800px){.about-page__callout-actions{margin:0 var(--default-spacing)}}.about-page>aside{display:flex;flex-direction:column;gap:var(--default-spacing);padding:0 var(--two-spacing) 0 0;order:4;grid-column:2}@media screen and (max-width:800px){.about-page>aside{padding:0 var(--default-spacing)}}.articles-page{margin:0;padding:0;display:grid;grid-template-columns:2fr 1fr;justify-items:stretch;gap:var(--three-spacing)}@media screen and (max-width:800px){.articles-page{display:flex;flex-direction:column;gap:var(--two-spacing)}}.articles-page__articles-list{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:var(--two-spacing);grid-column:1;grid-row:span 3}@media screen and (max-width:800px){.articles-page__articles-list{gap:0}}.articles-page__articles-list .articles-list__header{background-color:var(--bg-primary);padding:var(--three-spacing) var(--two-spacing);border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}@media screen and (max-width:800px){.articles-page__articles-list .articles-list__header{padding:var(--two-spacing) var(--default-spacing);margin-right:var(--default-spacing)}}.articles-page__articles-list .articles-list__header>h1{color:#fff;padding:0;margin:0}@media screen and (max-width:800px){.articles-page__articles-list .articles-list{padding:0 var(--default-spacing)}}.articles-page__articles-list .articles-list__entry{padding:0 var(--two-spacing)}@media screen and (max-width:800px){.articles-page__articles-list .articles-list__entry{padding:var(--default-spacing)}}.articles-page__articles-list .articles-list__entry .article-entry__title{color:var(--text-primary);font-size:var(--text-size-lg);font-family:var(--font-title);font-weight:700;display:block}.articles-page__articles-list .articles-list__entry .article-entry__title:hover,.articles-page__articles-list .articles-list__entry .article-entry__title:visited{color:var(--text-primary)}.articles-page__articles-list .articles-list__entry .article-entry__meta{color:var(--text-lightgray);padding-bottom:calc(var(--default-spacing)/2)}.articles-page__articles-list .articles-list__entry .article-entry__excerpt{line-height:1.5;color:var(--text-light);display:block}@media screen and (max-width:800px){.articles-page__articles-list .articles-list__entry .article-entry__excerpt{font-size:var(--text-size-default)}}.articles-page__articles-list .articles-list__entry .article-entry__excerpt:visited{color:var(--text-light)}.articles-page__articles-list .articles-list__entry .article-entry__excerpt:hover{color:#fff}.articles-page__callout-actions{grid-column:2;margin:0 var(--two-spacing) 0 0}@media screen and (max-width:800px){.articles-page__callout-actions{margin:0 var(--default-spacing)}}.articles-page>aside{display:flex;flex-direction:column;gap:var(--two-spacing);padding:0 var(--two-spacing) 0 0;grid-column:2}@media screen and (max-width:800px){.articles-page>aside{padding:0 var(--default-spacing)}}.home-page{padding:0;display:grid;grid-template-columns:2fr 1fr;gap:var(--three-spacing)}@media screen and (max-width:800px){.home-page{display:flex;flex-direction:column;gap:var(--two-spacing)}}.home-page__featured-figure{grid-column:1;margin:0;padding:0}@media screen and (max-width:1025px){.home-page__featured-figure{padding-right:var(--two-spacing);grid-column:span 2}}@media screen and (max-width:800px){.home-page__featured-figure{padding:0}}.home-page__featured-figure .featured-figure__title{background-color:var(--bg-primary);padding:var(--three-spacing) var(--two-spacing);border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}@media screen and (max-width:800px){.home-page__featured-figure .featured-figure__title{margin:0 var(--default-spacing) 0 0;padding:var(--two-spacing) var(--default-spacing)}}.home-page__featured-figure .featured-figure__title h1{text-transform:capitalize;color:#fff}@media screen and (max-width:800px){.home-page__featured-figure .featured-figure__title h1{font-size:var(--text-size-title)}}.home-page__featured-figure .featured-figure__title span{font-size:var(--text-size-default);line-height:1.5}.home-page__featured-figure figcaption h5{color:var(--text-dimgray);text-transform:uppercase;padding:var(--default-spacing) 0 0 var(--two-spacing)}@media screen and (max-width:800px){.home-page__featured-figure figcaption h5{padding:var(--default-spacing)}}.home-page__featured-figure img{margin:var(--default-spacing) 0 0 var(--two-spacing);width:calc(100% - var(--two-spacing))}@media screen and (max-width:800px){.home-page__featured-figure img{margin:var(--default-spacing);width:calc(100% - var(--two-spacing))}}.home-page__meta{grid-column:2;padding:0 var(--two-spacing) 0 0}@media screen and (max-width:1025px){.home-page__meta{padding:0 var(--two-spacing);grid-column:span 2}.home-page__meta>section:first-child{display:flex;flex-direction:row}}@media screen and (max-width:800px){.home-page__meta{padding:var(--default-spacing)}.home-page__meta>section:first-child{display:flex;flex-direction:column}}.home-page__recent-articles{grid-column:1;padding:0 var(--two-spacing)}@media screen and (max-width:800px){.home-page__recent-articles{padding:var(--default-spacing)}}.home-page>aside{grid-column:2;padding:0 var(--two-spacing)}@media screen and (max-width:800px){.home-page>aside{padding:var(--default-spacing)}}.articles-header{background-color:var(--bg-primary);color:var(--text-white);padding:var(--two-spacing) var(--default-spacing)}.articles-header__title{color:var(--text-white);text-transform:unset;padding:0;margin:0}@media screen and (max-width:800px){.articles-header__title{font-size:var(--text-size-lg)}}.articles-header .articles-breadcrumb{text-transform:uppercase;font-family:var(--font-body);font-weight:700;padding:var(--default-spacing) 0;color:var(--text-lightgray)}.articles-header .articles-breadcrumb ul{list-style:none;padding:0;margin:0 0 var(--default-spacing) 0;display:flex;align-items:center;flex-wrap:nowrap;flex-direction:row}.articles-header .articles-breadcrumb__item a{color:var(--text-lightgray)!important}.articles-header .articles-breadcrumb__item a:hover{color:var(--text-primary)}.articles-header .articles-breadcrumb__divider{margin:0 calc(var(--default-spacing)/2);color:var(--text-lightgray)}.articles-entry{display:flex;flex-direction:row-reverse;flex-wrap:nowrap;justify-content:flex-end;align-items:flex-start;gap:var(--three-spacing)}@media screen and (max-width:800px){.articles-entry{flex-direction:column;gap:var(--default-spacing);width:calc(100%-var(--default-spacing))}}.articles-entry__toc{padding:var(--default-spacing);background-color:var(--bg-slategray);border-radius:.25rem}@media screen and (max-width:800px){.articles-entry__toc{width:100%}}.articles-entry__toc h6{text-transform:uppercase;font-size:var(--text-size-default);color:var(--text-light)}.articles-entry__toc ul{margin:0;padding:0 0 0 1.5rem}.articles-entry__toc ul>li a{display:block;padding:.25rem;color:var(--text-lightgray);font-size:small}.articles-entry__toc ul>li a:hover{color:var(--text-white)}.articles-entry__content{flex:1}.articles-entry__content h1,.articles-entry__content h2,.articles-entry__content h3,.articles-entry__content h4,.articles-entry__content h5,.articles-entry__content h6{color:var(--text-white);text-transform:capitalize;margin-top:var(--two-spacing);font-weight:700}.articles-entry__content h1,.articles-entry__content h2{border-top:5px solid var(--bg-primary);padding-top:var(--two-spacing);margin-top:var(--three-spacing);display:block}.articles-entry__content-featured-image{background-color:var(--bg-dark);border-radius:3px;padding:0 var(--default-spacing);margin:0 0 var(--default-spacing) 0}@media screen and (max-width:450px){.articles-entry__content-featured-image{padding:0 var(--default-spacing)}}.articles-entry__content-featured-image>img{width:100%}.articles-entry__content-featured-image>figcaption{font-size:small;font-weight:700}.articles-entry__content img{width:100%}.articles-entry__content .giscus-area .giscus{border-top:5px solid var(--bg-primary);margin-top:var(--default-spacing);padding-top:var(--three-spacing)}.article-category-cards{display:flex;gap:var(--two-spacing);color:var(--text-light);flex-direction:column}.article-category-cards__item{background-color:var(--bg-slategray);border-top:solid 5px var(--bg-primary)}.article-category-cards__item .category-card{display:flex;flex-direction:column;color:var(--text-light);padding:var(--two-spacing)}@media screen and (max-width:450px){.article-category-cards__item .category-card{padding:var(--two-spacing) var(--default-spacing)}}.article-category-cards__item .category-card:hover{color:#fff}.article-category-cards__item .category-card>[class*=fa-]{font-size:calc(var(--text-size-xl) * 5);color:var(--text-dark);position:absolute;align-self:center;z-index:1}.article-category-cards__item .category-card__title{font-family:var(--font-title);font-size:var(--text-size-title);font-weight:700;color:var(--text-primary);z-index:2}@media screen and (max-width:1024px){.article-category-cards__item .category-card__title{font-size:calc(var(--text-size-title) * .9)}}.article-category-cards__item .category-card__description{font-size:small;line-height:1.5;flex:1;z-index:2}@media screen and (max-width:800px){.article-category-cards__item .category-card__description{font-size:var(--text-size-default);margin-top:0}}.article-category-cards__item .category-card__post-count{z-index:2}.article-categories__title{color:var(--text-dimgray);text-transform:uppercase}.article-categories__list>li{line-height:var(--text-lineheight)}.article-categories__list>li>a,.article-categories__list>li>a:visited{color:var(--text-lightgray)}.article-categories__list>li>a:hover{color:#fff}.article-subcategories__title{color:var(--text-dimgray);text-transform:uppercase}.article-subcategories__list>li{line-height:var(--text-lineheight)}.article-subcategories__list>li>a,.article-subcategories__list>li>a:visited{color:var(--text-lightgray)}.article-subcategories__list>li>a:hover{color:#fff}.author-info{margin:var(--default-spacing) 0}.author-info__card{display:flex;flex-direction:row;flex-wrap:wrap;align-content:center;justify-content:flex-start;align-items:center;gap:var(--default-spacing)}.author-info__card-img{width:5rem;height:5rem;border-radius:50%}.author-info__card-name{flex:1}.author-info__card-name h2{font-weight:700;padding:0;margin:0}.author-info__summary{font-size:var(--text-size-default);font-weight:400}.page-callout{background-color:var(--bg-primary);color:var(--text-white);padding:var(--three-spacing) var(--default-spacing)}@media screen and (max-width:800px){.page-callout{margin-bottom:var(--two-spacing)}}.page-callout>.container{display:flex;flex-direction:row;flex-wrap:nowrap;align-content:center;justify-content:space-between;align-items:center;gap:var(--five-spacing)}@media screen and (max-width:800px){.page-callout>.container{flex-direction:column;align-items:flex-start;gap:0}}.page-callout>.container article{flex:1}.page-callout>.container div{background-color:transparent;text-align:center;width:25%}@media screen and (max-width:800px){.page-callout>.container div{display:none}}.page-callout>.container div>[class*=fa-]{font-size:calc(var(--text-size-lg) * 5)}.page-callout__title{color:var(--text-white);text-transform:unset;padding:.25rem 0;margin:0}@media screen and (max-width:450px){.page-callout__title{font-size:var(--text-size-lg)}}.page-callout__description{margin:.5rem 0}.page-callout__action-link{margin-top:var(--two-spacing);padding:1rem var(--two-spacing);background-color:var(--bg-light);border-radius:3px;display:inline-block}@media screen and (max-width:800px){.page-callout__action-link{flex-wrap:wrap;align-content:flex-start}}.page-callout__action-link:hover{background-color:#fff;color:var(--text-primary)}.page-callout__action-text{font-family:var(--font-title);font-weight:700;font-size:var(--text-size-title);text-transform:uppercase}.recent-articles__title{color:var(--text-dimgray);text-transform:uppercase}.recent-articles__list{display:flex;flex-direction:column;flex-wrap:nowrap;justify-content:space-between;align-items:flex-start;gap:var(--two-spacing);padding-top:var(--default-spacing)}.recent-articles__list .article-entry__title{color:var(--text-primary);font-size:var(--text-size-lg);font-family:var(--font-title);font-weight:700;display:block}.recent-articles__list .article-entry__title:hover,.recent-articles__list .article-entry__title:visited{color:var(--text-primary)}.recent-articles__list .article-entry__meta{color:var(--text-lightgray);padding-bottom:calc(var(--default-spacing)/2)}.recent-articles__list .article-entry__excerpt{line-height:1.5;color:var(--text-light);display:block}@media screen and (max-width:800px){.recent-articles__list .article-entry__excerpt{font-size:var(--text-size-default)}}.recent-articles__list .article-entry__excerpt:visited{color:var(--text-light)}.recent-articles__list .article-entry__excerpt:hover{color:#fff} \ No newline at end of file diff --git a/src/about.njk b/src/about.njk index 29f4460..fa52929 100644 --- a/src/about.njk +++ b/src/about.njk @@ -2,28 +2,26 @@ title: "About" --- -
- -
-

{{title}}

-
-
+
{% for markdownContent in collections.aboutpage | sortedCollectionByFilenameAsc %} {% if markdownContent.templateContent %} -
+
{% if markdownContent.data.title %}

@@ -34,5 +32,11 @@ title: "About"

{% endif %} {% endfor %} - + + {#
+ Callout Actions here... +
#} + \ No newline at end of file diff --git a/src/articles.njk b/src/articles.njk index 73b8905..c0cdd6c 100644 --- a/src/articles.njk +++ b/src/articles.njk @@ -28,11 +28,12 @@ title: Articles
{% endfor %} -
- {% include '_content/article-category-list.njk' %} -
+ {#
+ Callout Actions here... +
#}