tikz.escobar.life

 /*  This program is free software: you can redistribute it and/or modify
     it under the terms of the GNU General Public License as published by
     the Free Software Foundation, either version 3 of the License, or
     (at your option) any later version.
 
     This program is distributed in the hope that it will be useful,
     but WITHOUT ANY WARRANTY; without even the implied warranty of
     MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
     GNU General Public License for more details.
 
     You should have received a copy of the GNU General Public License
     along with this program. If not, see <https://www.gnu.org/licenses/>. */
 
 @import url('/css/alfa-slab.css');
 
 :root {
   --background: #02010f;
   --foreground: #dfdfdf;
   --accent: #80db4f;
 }
 
 body {
   padding: 1em;
   margin: 0;
 
   background: var(--background);
   color: var(--foreground);
 
   font-size: 14pt;
   line-height: 17pt;
   font-family: sans-serif;
 }
 
 @media (min-width: 800px) {
   body {
     padding: 1em 15vw;
   }
 }
 
 main {
   padding: 1em 0 2em 0;
 }
 
 main > *:first-child {
   margin-top: 0;
 }
 
 main > *:last-child {
   margin-bottom: 0;
 }
 
 footer {
   text-align: center;
 }
 
 p {
   margin-top: 1em;
   text-align: justify;
 }
 
 a {
   color: var(--accent);
   text-decoration: underline;
 }
 
 ul li::marker, ol li::marker {
   font-weight: bold;
   font-style: normal;
   color: var(--accent);
 }
 
 h1, h2, h3, h4, h5, h6 {
   font-family: 'Alfa Slab One', sans-serif;
   letter-spacing: 1pt;
   margin: 0;
   color: var(--accent);
   text-align: left;
   line-height: 1em;
 }
 
 h1 {
   font-size: 35pt;
 }
 
 h2 {
   font-size: 24pt;
 }
 
 h3 {
   font-size: 19pt;
 }
 
 img {
   max-width: 100%;
   max-height: 100%;
 }
 
 code {
   background: var(--foreground);
   color: var(--background);
   font-weight: bold;
   padding: 0 6pt;
   border-radius: 6pt;
 }
 
 .codeblock {
   display: block;
   margin: 1em 0;
   background: #1b192b;
 
   overflow-x: scroll;
   scrollbar-width: none;
 
   border-left: solid 4pt var(--accent);
   border-top-right-radius: 6pt;
   border-bottom-right-radius: 6pt;
 }
 
 .codeblock::-webkit-scrollbar {
   display: none;
 }
 
 .codeblock pre {
   width: max-content;
   margin: 1em 0;
   padding: 0 1em;
 }
 
 /* Remove special formatting for inline code */
 .codeblock pre code {
   background: none;
   color: var(--foreground);
   font-weight: normal;
   padding: 0;
 }
 
 #gallery {
   display: grid;
   grid-template-columns: 1fr;
   grid-gap: 1em;
 }
 
 @media (min-width: 800px) {
   #gallery {
     grid-template-columns: 1fr 1fr;
   }
 
   .tikz .img-container {
     aspect-ratio: 1;
   }
 
   .tikz .img-container img {
     max-height: 100%;
   }
 }
 
 .tikz .img-container {
   display: grid;
   grid-template-areas: "preview" "author";
   grid-gap: 1em;
   grid-template-rows: auto 17pt;
 
   max-width: 100%;
   border-radius: 6pt;
 
   background: white;
   color: var(--background);
   padding: 1em;
 }
 
 .tikz .preview {
   grid-area: preview;
   width: 100%;
   height: 100%;
 
   object-fit: contain;
 }
 
 .tikz .author {
   grid-area: author;
 
   font-style: italic;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
 .tikz .author a {
   color: currentColor;
 }
 
 .tikz a {
   postition: relative;
   bottom: 0;
 }