code[class*=language-],pre[class*=language-]{color:#f8f8f2;background:0 0;text-shadow:0 1px rgba(0,0,0,.3);font-family:Consolas,Monaco,'Andale Mono','Ubuntu Mono',monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none}pre[class*=language-]{padding:1em;margin:.5em 0;overflow:auto;border-radius:.3em}:not(pre)>code[class*=language-],pre[class*=language-]{background:#272822}:not(pre)>code[class*=language-]{padding:.1em;border-radius:.3em;white-space:normal}.token.cdata,.token.comment,.token.doctype,.token.prolog{color:#8292a2}.token.punctuation{color:#f8f8f2}.token.namespace{opacity:.7}.token.constant,.token.deleted,.token.property,.token.symbol,.token.tag{color:#f92672}.token.boolean,.token.number{color:#ae81ff}.token.attr-name,.token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color:#a6e22e}.language-css .token.string,.style .token.string,.token.entity,.token.operator,.token.url,.token.variable{color:#f8f8f2}.token.atrule,.token.attr-value,.token.class-name,.token.function{color:#e6db74}.token.keyword{color:#66d9ef}.token.important,.token.regex{color:#fd971f}.token.bold,.token.important{font-weight:700}.token.italic{font-style:italic}.token.entity{cursor:help} /* * New diff- syntax */ pre[class*="language-diff-"] { --eleventy-code-padding: 1.25em; padding-left: var(--eleventy-code-padding); padding-right: var(--eleventy-code-padding); } .token.deleted { background-color: hsl(0, 51%, 37%); color: inherit; } .token.inserted { background-color: hsl(126, 31%, 39%); color: inherit; } /* Make the + and - characters unselectable for copy/paste */ .token.prefix.unchanged, .token.prefix.inserted, .token.prefix.deleted { -webkit-user-select: none; user-select: none; display: inline-flex; align-items: center; justify-content: center; padding-top: 2px; padding-bottom: 2px; } .token.prefix.inserted, .token.prefix.deleted { width: var(--eleventy-code-padding); background-color: rgba(0,0,0,.2); } /* Optional: full-width background color */ .token.inserted:not(.prefix), .token.deleted:not(.prefix) { display: block; margin-left: calc(-1 * var(--eleventy-code-padding)); margin-right: calc(-1 * var(--eleventy-code-padding)); text-decoration: none; /* override del, ins, mark defaults */ color: inherit; /* override del, ins, mark defaults */ } article { padding-top: 2rem; text-align: left; } .links-nextprev { display: grid; grid-gap: 1rem; grid-template-columns: 1fr 1fr; padding: 0; margin: 0; list-style: none; } @media(max-width: 480px) { .links-nextprev { grid-template-columns: 1fr; } } .links-nextprev li { padding: 0.5rem; } .links-nextprev li.links-nextprev-prev, .links-nextprev li.links-nextprev-next { display: flex; flex-direction: column; justify-content: space-between; background-color: var(--bg-color-secondary); box-shadow: 2px 2px 4px var(--shadow-color); transition: background-color 0.3s; } .links-nextprev-next { text-align: right; } h1.post-title { margin-top: 1rem; margin-bottom: 1rem; } .post-metadata { display: flex; flex-wrap: wrap; list-style: none; padding: 0; margin: 0; gap: 1rem 2rem; } .post-metadata .tag, .post-metadata .serie { border: 1px solid var(--border-color); border-radius: 4px; background-color: var(--bg-color-secondary); padding: 0 0.25rem; transition: background-color 0.3s, border-color 0.3s; white-space: nowrap; } .post-metadata svg.icon { margin-right: 0.25rem; } [data-theme="dark"] { --svg-color: #9ca3af; } [data-theme="light"] { --svg-color: #777; } .social { display: flex; gap: 0.5rem; align-items: center; justify-content: right; margin-top: 2rem; margin-bottom: 1rem; } .social a { margin: 0.25rem; display: inline-flex; align-items: center; color: var(--svg-color) !important; cursor: pointer; transition: color 0.3s; } .social a:hover { color: var(--link-color-hover) !important; transition: color 0.3s; } .social .icon { width: 1.5rem; height: 1.5rem; } .series { display: grid; grid-gap: 1rem; grid-template-columns: 1fr 1fr 1fr; margin-top: 1rem; } @media(max-width: 1024px) { .series { grid-template-columns: 1fr 1fr; } } @media(max-width: 480px) { .series { grid-template-columns: 1fr; } } .series h3 { grid-column: 1 / -1; margin: 0 } .series-post { display: flex; flex-direction: column; justify-content: space-between; padding: 0.5rem; background-color: var(--bg-color-secondary); box-shadow: 2px 2px 4px var(--shadow-color); transition: background-color 0.3s; } #giscus-comments { margin-top: 1rem; width: 100%; } aside { width: 18em; display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end; } @media(max-width: 1024px) { aside { display: none; } } .sticky-container { position: sticky; bottom: 3rem; display: flex; flex-direction: column; gap: 2rem; justify-content: space-between; min-height: calc(100vh - 10.5rem); padding-top: 2rem; padding-bottom: 2rem; } .aside-content { margin-left: 0.5rem; padding: 0.5rem; font-size: 0.9rem; border-left: 1px solid var(--border-color); transition: border-color 0.3s; } .aside-content ol { list-style-type: none; padding: 0; margin: 0; } .aside-content li { margin-left: 1rem; margin-top: 1rem; }