merge with upstream
This commit is contained in:
commit
37886b6001
GPG key ID:
3F257B68F5BC9339
35 changed files with 4741 additions and 6669 deletions
76
USERS.md
76
USERS.md
|
|
@ -1,76 +0,0 @@
|
||||||
# Meet the users of Terminal theme!
|
|
||||||
|
|
||||||
- https://xicode.se **magistern** (Teacher)
|
|
||||||
- https://devmaster64.com **devmaster64** (Software Developer)
|
|
||||||
- https://calloc.net **Vaibhav Yenamandra** (Software Engineer)
|
|
||||||
- https://potatofrom.space **Kevin Liu** (Software)
|
|
||||||
- https://horochx.org **horochx** (Software Developer)
|
|
||||||
- https://feng.si **Si Feng** (Software Engineer)
|
|
||||||
- https://ben-on-vms.com **Benedikt Frenzel** (Technical Support Engineer)
|
|
||||||
- https://johngazzini.com **John Gazzini** (Software Engineer)
|
|
||||||
- https://tears.io/ **Alex** (SRE)
|
|
||||||
- https://ayushkarn.me/ **Ayush Karn** (Student Developer)
|
|
||||||
- https://zaine.me **Amine Zaine** (Cloud Engineer)
|
|
||||||
- https://notes.dmaitre.phyip3.dur.ac.uk/computing-club/ **Ryan Moodie** (Physics PhD student)
|
|
||||||
- https://lunar.computer **Lunar Computer** (DevOps Engineer)
|
|
||||||
- https://naxxfish.net **Chris Roberts** (Broadcast Systems Engineer)
|
|
||||||
- https://andreacaravano.net **Andrea Caravano** (Student)
|
|
||||||
- https://qbunt.com **Jeremy Bunting** (Software Engineer)
|
|
||||||
- https://smeik.org **Smeik** (Embedded Developer)
|
|
||||||
- https://code.willstocks.co.uk **Will Stocks** (Blogger & Developer)
|
|
||||||
- https://blog.vnandag.me **Nanda Gopal** (Student Developer)
|
|
||||||
- https://m47r1x.github.io **Neo** (Citizen of Zion)
|
|
||||||
- https://bgameiro.me/ **Bernardo Gameiro** (Engineer Physicist student)
|
|
||||||
- https://return-to-libc.com/ **elraro** (Cyber Security Specialist)
|
|
||||||
- https://pablart.com/ **Pablo Diaz-Gutierrez** (Software Engineer, General Tinkerer)
|
|
||||||
- https://monocle.rpod.club/ **classx** (DevOps Engineer)
|
|
||||||
- https://erisianrite.com/ **ErisianRite** (Coding, Engineering, Tools for Thought)
|
|
||||||
- https://isaes.com.tr/ **Isa Es** (Software Engineer)
|
|
||||||
- https://blog.m5e.de/ **Christoph Miksche** (Software Developer)
|
|
||||||
- https://mpostument.com/ **Maksym Postument** (DevOps Engineer)
|
|
||||||
- https://mathiejosh.xyz **Josh Mathie** (Electrical Engineering Technology Student/Sales and Engineering Tech)
|
|
||||||
- https://yuji.ne.jp/ **YUJI** (Student & Software Developer)
|
|
||||||
- https://blog.puvvadi.me **KD Puvvadi** (Software Dev & Cloud Orchestrator)
|
|
||||||
- https://hidden.land/ **Louisload** (Game Developer & Musician)
|
|
||||||
- https://linuxbase.nl **Michael Trip** (DevOps Engineer)
|
|
||||||
- https://blog.sethforprivacy.com **Seth For Privacy** (Security, privacy, and cryptocurrency writer, podcaster)
|
|
||||||
- https://thesprawl.city **crish** (Software and stuff)
|
|
||||||
- https://justinnuwin.com **Justin Nguyen** (Software & Hardware Developer)
|
|
||||||
- https://blog.woosal.com/ **Vusal Ismayilov** (Computer Engineering Student)
|
|
||||||
- https://itsembedded.com/ **Norbert Kremeris** (digital logic design and verification engineer)
|
|
||||||
- https://nereuxofficial.github.io **Nereuxofficial** (Software Developer & Student)
|
|
||||||
- https://biplav.xyz **Biplav's Blog** (Student)
|
|
||||||
- https://santiago.wtf **Nicholas Santiago** (DevOps Engineer)
|
|
||||||
- https://2200g.github.io/ **2200g** (Blogger/Student)
|
|
||||||
- https://they.mint.lgbt **Joey Aliaga** (Software Developer & Student)
|
|
||||||
- https://tatewilhelm.me **Tate Wilhelm** (Student, Programmer & Tinkerer)
|
|
||||||
- https://mikefoden.com **Mike Foden** (Software Developer)
|
|
||||||
- https://undemalum.github.io/portfolio/ **Mateusz Konat** (Student)
|
|
||||||
- https://ku0hn.radio **Ben Kuhn** (Ham Radio Operator, InfoSec Engineer, Tinkerer)
|
|
||||||
- https://www.grumpymetalguy.com **GrumpyMetalGuy** (General Grumper and Developer)
|
|
||||||
- https://blog.jontes.page **Jonte** (general tech geek)
|
|
||||||
- https://nazdarthegame.com/ **Michal Skoula** (Software Developer)
|
|
||||||
- https://1mup.myorange.house **Antonio Garosi** (Street art gallery)
|
|
||||||
- https://kitchvx.github.io **Nathan Kitching** (IT Student)
|
|
||||||
- https://dgood.win **Dom Goodwin** (Platform Engineer)
|
|
||||||
- https://sir-photch.xyz **Sir-Photch** (ComSci-student. German Blog)
|
|
||||||
- https://drewmorris.info **Drew Morris** (Mathematician && Computer Scientist)
|
|
||||||
- https://blog.darkiiiiiice.com **MarioMang** (Software Developer)
|
|
||||||
- https://www.sagbot.com **E. HADDAG** (Computer Scientist)
|
|
||||||
- https://adamperkowski.dev **Adam Perkowski** (A Random Developer)
|
|
||||||
- https://imortio.github.io **Azrul** (CompSci Student)
|
|
||||||
- https://carmar.is **Carmaris** (Amateur Hacker)
|
|
||||||
- https://ragonneau.github.io **Tom Ragonneau** (Engineer)
|
|
||||||
- https://katiethe.dev **KatieTheDev** (Amateur porgrammer and tinkerer)
|
|
||||||
- https://stefka.eu **Jiří Štefka** (Software Developer)
|
|
||||||
- https://blog.networkchuck.com **NetworkChuck** (YouTuber & Hacker)
|
|
||||||
- https://blog.arkb.me **AbdulRKB** (Security Researcher & Web Dev)
|
|
||||||
- https://harshv5094.netlify.app **Harsh Vyapari** (Developer & Linux Enthusiast)
|
|
||||||
<!--
|
|
||||||
TEMPLATE:
|
|
||||||
|
|
||||||
- https://radoslawkoziel.pl **Radek Kozieł** (Software Designer and Developer)
|
|
||||||
|
|
||||||
-->
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -14,7 +14,6 @@ a.button {
|
||||||
padding: 8px 18px;
|
padding: 8px 18px;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
border-radius: 8;
|
|
||||||
font: inherit;
|
font: inherit;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
appearance: none;
|
appearance: none;
|
||||||
|
|
@ -41,13 +40,13 @@ button.link,
|
||||||
.button.link,
|
.button.link,
|
||||||
a.button.link {
|
a.button.link {
|
||||||
background: none;
|
background: none;
|
||||||
font-size: 1rem;
|
font-size: var(--font-size);
|
||||||
}
|
}
|
||||||
|
|
||||||
button.small,
|
button.small,
|
||||||
.button.small,
|
.button.small,
|
||||||
a.button.small {
|
a.button.small {
|
||||||
font-size: 0.8rem;
|
font-size: calc(var(--font-size) * 0.8);
|
||||||
}
|
}
|
||||||
|
|
||||||
button.wide,
|
button.wide,
|
||||||
|
|
@ -72,22 +71,6 @@ a.button.inline:hover {
|
||||||
background: none;
|
background: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
a.button.inline::before {
|
|
||||||
content: "["
|
|
||||||
}
|
|
||||||
|
|
||||||
a.button.inline::after {
|
|
||||||
content: "]"
|
|
||||||
}
|
|
||||||
|
|
||||||
a.button.inline.prev::before {
|
|
||||||
content: "← ["
|
|
||||||
}
|
|
||||||
|
|
||||||
a.button.inline.next::after {
|
|
||||||
content: "] →"
|
|
||||||
}
|
|
||||||
|
|
||||||
a.read-more,
|
a.read-more,
|
||||||
a.read-more:hover,
|
a.read-more:hover,
|
||||||
a.read-more:active {
|
a.read-more:active {
|
||||||
|
|
@ -99,25 +82,3 @@ a.read-more:active {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.code-toolbar {
|
|
||||||
margin-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.code-toolbar .toolbar-item a {
|
|
||||||
position: relative;
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
padding: 3px 8px;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
text-decoration: none;
|
|
||||||
text-align: center;
|
|
||||||
font-size: 13px;
|
|
||||||
font-weight: 500;
|
|
||||||
border-radius: 8px;
|
|
||||||
border: 1px solid transparent;
|
|
||||||
appearance: none;
|
|
||||||
cursor: pointer;
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -1,86 +1,97 @@
|
||||||
pre {
|
:root {
|
||||||
|
--code-border: color-mix(in srgb, var(--foreground) 10%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
pre:not(.chroma) {
|
||||||
margin: 20px 0;
|
margin: 20px 0;
|
||||||
|
padding: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.code-toolbar {
|
pre.chroma {
|
||||||
position: relative;
|
margin: 0;
|
||||||
margin: 20px 0;
|
padding: 10px 0;
|
||||||
border: 1px solid color-mix(in srgb, var(--accent) 10%, transparent);
|
color: var(--foreground);
|
||||||
}
|
}
|
||||||
|
|
||||||
.code-toolbar + .code-toolbar,
|
pre code {
|
||||||
.code-toolbar + .highlight,
|
color: var(--foreground);
|
||||||
.code-toolbar + .highlight .code-toolbar {
|
|
||||||
border-top: 0;
|
|
||||||
margin-top: -20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.code-toolbar pre, .code-toolbar code {
|
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.code-toolbar code {
|
code {
|
||||||
display: block;
|
color: var(--accent);
|
||||||
color: color-mix(in srgb, var(--accent) 50%, var(--foreground));
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.code-toolbar > .toolbar button {
|
.highlight {
|
||||||
font-size: 0.8em !important;
|
position: relative;
|
||||||
font-weight: bold !important;
|
margin: 20px 0;
|
||||||
background: var(--accent) !important;
|
border: 1px solid var(--code-border);
|
||||||
color: var(--background) !important;
|
}
|
||||||
border-radius: var(--radius) !important;
|
|
||||||
box-shadow: none !important;
|
.highlight pre {
|
||||||
border: 1px solid var(--background) !important;
|
border: none;
|
||||||
margin: 6px !important;
|
}
|
||||||
padding: 10px !important;
|
|
||||||
user-select: none;
|
.code-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
background: color-mix(in srgb, var(--foreground) 5%, transparent);
|
||||||
|
border-bottom: 1px solid var(--code-border);
|
||||||
|
color: var(--comment);
|
||||||
|
text-transform:uppercase;
|
||||||
|
font-size: calc(var(--font-size) * 0.8);
|
||||||
|
padding: 6px 10px;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.copy-button {
|
||||||
|
position: relative;
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 3px 8px;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: 500;
|
||||||
|
border: 1px solid color-mix(in srgb, var(--accent) 15%, transparent);
|
||||||
|
appearance: none;
|
||||||
|
cursor: pointer;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.code-title .copy-button {
|
||||||
|
z-index: 1;
|
||||||
|
background: color-mix(in srgb, var(--foreground) 5%, var(--background));
|
||||||
|
}
|
||||||
|
|
||||||
|
.code-title:hover .copy-button {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.code-title .copy-button:hover {
|
||||||
|
background: color-mix(in srgb, var(--accent) 10%, var(--background));
|
||||||
}
|
}
|
||||||
|
|
||||||
.collapsable-code {
|
.collapsable-code {
|
||||||
position: relative;
|
position: relative;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 40px 0;
|
margin: 20px 0;
|
||||||
}
|
border: 1px solid var(--accent);
|
||||||
|
|
||||||
.collapsable-code input[type=checkbox] {
|
.highlight {
|
||||||
position: absolute;
|
margin: 0;
|
||||||
visibility: hidden;
|
}
|
||||||
}
|
|
||||||
|
|
||||||
.collapsable-code input[type=checkbox]:checked ~ pre,
|
|
||||||
.collapsable-code input[type=checkbox]:checked ~ .code-toolbar pre {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collapsable-code input[type=checkbox]:checked ~ .code-toolbar {
|
|
||||||
padding: 0;
|
|
||||||
border-top: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collapsable-code input[type=checkbox]:checked ~ .code-toolbar .toolbar {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.collapsable-code input[type=checkbox]:checked ~ label .collapsable-code__toggle::after {
|
|
||||||
content: attr(data-label-expand);
|
|
||||||
}
|
|
||||||
|
|
||||||
.collapsable-code label {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
min-width: 30px;
|
|
||||||
min-height: 30px;
|
|
||||||
margin: 0;
|
|
||||||
border-bottom: 1px solid var(--accent);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.collapsable-code__title {
|
.collapsable-code__title {
|
||||||
|
display: inline-flex;
|
||||||
|
align-items: center;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
padding: 3px 10px;
|
padding: 3px 10px;
|
||||||
|
font-size: calc(var(--font-size) * 0.9);
|
||||||
text-overflow: ellipsis;
|
text-overflow: ellipsis;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
@ -94,14 +105,14 @@ pre {
|
||||||
padding: 3px 10px;
|
padding: 3px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.collapsable-code__toggle {
|
.collapsable-code summary {
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
font-size: 16px;
|
padding: 0 10px;
|
||||||
padding: 3px 10px;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.collapsable-code__toggle::after {
|
.collapsable-code summary:hover {
|
||||||
content: attr(data-label-collapse);
|
background: color-mix(in srgb, var(--accent) 10%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
.collapsable-code pre {
|
.collapsable-code pre {
|
||||||
|
|
@ -111,7 +122,3 @@ pre {
|
||||||
.collapsable-code pre::first-line {
|
.collapsable-code pre::first-line {
|
||||||
line-height: 0;
|
line-height: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.collapsable-code .code-toolbar {
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -1,19 +1,18 @@
|
||||||
|
/* latin-ext */
|
||||||
@font-face {
|
@font-face {
|
||||||
font-display: swap;
|
font-family: 'Fira Code';
|
||||||
font-family: "Fira Code";
|
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: 400;
|
font-weight: 300 700;
|
||||||
src: url("../fonts/FiraCode-Regular.woff") format("woff");
|
font-display: swap;
|
||||||
font-feature-settings: "liga", "tnum", "ss01", "locl";
|
src: url("../fonts/FiraCode-LatinExt.woff2") format('woff2');
|
||||||
font-variant-ligatures: contextual;
|
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||||
}
|
}
|
||||||
|
/* latin */
|
||||||
@font-face {
|
@font-face {
|
||||||
font-display: swap;
|
font-family: 'Fira Code';
|
||||||
font-family: "Fira Code";
|
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
font-weight: 800;
|
font-weight: 300 700;
|
||||||
src: url("../fonts/FiraCode-Bold.woff") format("woff");
|
font-display: swap;
|
||||||
font-feature-settings: "liga", "tnum", "ss01", "locl";
|
src: url("../fonts/FiraCode-Latin.woff2") format('woff2');
|
||||||
font-variant-ligatures: contextual;
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
.footer {
|
.footer {
|
||||||
padding: 40px 0;
|
padding: 40px 0;
|
||||||
flex-grow: 0;
|
flex-grow: 0;
|
||||||
opacity: 0.5;
|
opacity: 0.65;
|
||||||
}
|
}
|
||||||
|
|
||||||
.footer__inner {
|
.footer__inner {
|
||||||
|
|
@ -9,7 +9,6 @@
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
width: 760px;
|
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -22,7 +21,6 @@
|
||||||
flex-flow: row wrap;
|
flex-flow: row wrap;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
font-size: 1rem;
|
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -35,6 +35,7 @@
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
background: var(--accent);
|
background: var(--accent);
|
||||||
color: var(--background);
|
color: var(--background);
|
||||||
|
font-weight: bold;
|
||||||
padding: 5px 10px;
|
padding: 5px 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,3 +1,12 @@
|
||||||
|
:root {
|
||||||
|
--background: #1a170f;
|
||||||
|
--foreground: #eceae5;
|
||||||
|
--accent: #eec35e;
|
||||||
|
--font-size: 1rem;
|
||||||
|
--line-height: 1.54em;
|
||||||
|
--radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
html {
|
html {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
@ -12,9 +21,8 @@ body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
font-family: "Fira Code", Monaco, Consolas, "Ubuntu Mono", monospace;
|
font-family: "Fira Code", Monaco, Consolas, "Ubuntu Mono", monospace;
|
||||||
font-size: 1rem;
|
font-size: var(--font-size);
|
||||||
line-height: 1.54;
|
line-height: var(--line-height);
|
||||||
letter-spacing: -0.02em;
|
|
||||||
background-color: var(--background);
|
background-color: var(--background);
|
||||||
color: var(--foreground);
|
color: var(--foreground);
|
||||||
text-rendering: optimizelegibility;
|
text-rendering: optimizelegibility;
|
||||||
|
|
@ -23,6 +31,370 @@ body {
|
||||||
text-size-adjust: 100%;
|
text-size-adjust: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: calc(var(--font-size) * 1.45);
|
||||||
|
letter-spacing: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h2 {
|
||||||
|
font-size: calc(var(--font-size) * 1.35);
|
||||||
|
letter-spacing: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h3 {
|
||||||
|
font-size: calc(var(--font-size) * 1.15);
|
||||||
|
letter-spacing: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6 {
|
||||||
|
font-size: calc(var(--font-size) * 1);
|
||||||
|
letter-spacing: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1,
|
||||||
|
h2,
|
||||||
|
h3,
|
||||||
|
h4,
|
||||||
|
h5,
|
||||||
|
h6,
|
||||||
|
p,
|
||||||
|
ul,
|
||||||
|
ol,
|
||||||
|
img,
|
||||||
|
figure,
|
||||||
|
video,
|
||||||
|
table {
|
||||||
|
margin: 25px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
position: relative;
|
||||||
|
font: inherit;
|
||||||
|
font-weight: bold;
|
||||||
|
text-decoration: none;
|
||||||
|
text-align: center;
|
||||||
|
background: transparent;
|
||||||
|
color: var(--accent);
|
||||||
|
padding: 5px 18px;
|
||||||
|
border: 4px solid var(--accent);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
transition: background 0.15s linear;
|
||||||
|
appearance: none;
|
||||||
|
cursor: pointer;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
button:hover {
|
||||||
|
background: color-mix(in srgb, var(--accent) 15%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
button:focus-visible,
|
||||||
|
a:focus-visible {
|
||||||
|
outline: 1px solid var(--accent);
|
||||||
|
outline-offset: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
fieldset {
|
||||||
|
display: inline-block;
|
||||||
|
border: 2px solid var(--foreground);
|
||||||
|
border-radius: calc(var(--radius) * 1.6);
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
fieldset *:first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
fieldset input,
|
||||||
|
fieldset select,
|
||||||
|
fieldset textarea,
|
||||||
|
fieldset label,
|
||||||
|
fieldset button {
|
||||||
|
margin-top: calc(var(--line-height) * 0.5);
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
label {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
label input {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
input,
|
||||||
|
textarea,
|
||||||
|
select {
|
||||||
|
background: transparent;
|
||||||
|
color: var(--foreground);
|
||||||
|
border: 1px solid var(--foreground);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
padding: 10px;
|
||||||
|
font: inherit;
|
||||||
|
appearance: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="checkbox"] {
|
||||||
|
width: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
input:focus-visible,
|
||||||
|
input:active,
|
||||||
|
textarea:focus-visible,
|
||||||
|
textarea:active,
|
||||||
|
select:focus-visible,
|
||||||
|
select:active {
|
||||||
|
border-color: var(--accent);
|
||||||
|
outline: 1px solid var(--accent);
|
||||||
|
outline-offset: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input:active,
|
||||||
|
textarea:active,
|
||||||
|
select:active {
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
select {
|
||||||
|
background-image: linear-gradient(
|
||||||
|
45deg,
|
||||||
|
transparent 50%,
|
||||||
|
var(--foreground) 50%
|
||||||
|
),
|
||||||
|
linear-gradient(135deg, var(--foreground) 50%, transparent 50%);
|
||||||
|
background-position: calc(100% - 20px), calc(100% - 1em);
|
||||||
|
background-size:
|
||||||
|
5px 5px,
|
||||||
|
5px 5px;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
padding-right: 40px;
|
||||||
|
}
|
||||||
|
|
||||||
|
select option {
|
||||||
|
background: var(--background);
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="checkbox"] {
|
||||||
|
vertical-align: middle;
|
||||||
|
padding: 10px;
|
||||||
|
box-shadow: inset 0 0 0 3px var(--background);
|
||||||
|
}
|
||||||
|
|
||||||
|
input[type="checkbox"]:checked {
|
||||||
|
background: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
display: block;
|
||||||
|
max-width: 100%;
|
||||||
|
border: 8px solid var(--accent);
|
||||||
|
border-radius: var(--radius);
|
||||||
|
padding: 8px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
img.left {
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
img.center {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
img.right {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
figure {
|
||||||
|
width: fit-content;
|
||||||
|
}
|
||||||
|
|
||||||
|
figure.left {
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
figure.center {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
figure.right {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
figure img,
|
||||||
|
figure video {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
figure figcaption {
|
||||||
|
background: var(--accent);
|
||||||
|
color: var(--background);
|
||||||
|
text-align: center;
|
||||||
|
font-size: var(--font-size);
|
||||||
|
font-weight: normal;
|
||||||
|
margin-top: -8px;
|
||||||
|
padding: 0 8px;
|
||||||
|
border-radius: 0 0 var(--radius) var(--radius);
|
||||||
|
}
|
||||||
|
|
||||||
|
figure figcaption p:first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul,
|
||||||
|
ol {
|
||||||
|
margin-left: 4ch;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
ul ul,
|
||||||
|
ul ol,
|
||||||
|
ol ul,
|
||||||
|
ol ol {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
li::marker {
|
||||||
|
color: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
ul li,
|
||||||
|
ol li {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
code,
|
||||||
|
kbd {
|
||||||
|
font-family:
|
||||||
|
"Fira Code",
|
||||||
|
Monaco,
|
||||||
|
Consolas,
|
||||||
|
"Ubuntu Mono",
|
||||||
|
monospace !important;
|
||||||
|
font-feature-settings: normal;
|
||||||
|
background: color-mix(in srgb, var(--foreground) 5%, transparent);
|
||||||
|
border: 1px solid var(--code-border);
|
||||||
|
padding: 1px 6px;
|
||||||
|
margin: 0 2px;
|
||||||
|
font-size: calc(var(--font-size) * 0.95);
|
||||||
|
}
|
||||||
|
|
||||||
|
kbd {
|
||||||
|
border-top: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
|
||||||
|
border-left: 1px solid var(--accent);
|
||||||
|
border-right: 1px solid var(--accent);
|
||||||
|
border-bottom: 4px solid var(--accent);
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
code code {
|
||||||
|
background: transparent;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
pre {
|
||||||
|
tab-size: 4;
|
||||||
|
background: color-mix(in srgb, var(--foreground) 5%, transparent) !important;
|
||||||
|
color: var(--foreground);
|
||||||
|
padding: 20px 10px;
|
||||||
|
font-size: calc(var(--font-size) * 0.95) !important;
|
||||||
|
overflow: auto;
|
||||||
|
border-radius: var(--radius);
|
||||||
|
border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent);
|
||||||
|
}
|
||||||
|
|
||||||
|
pre code {
|
||||||
|
background: none !important;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup {
|
||||||
|
line-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
abbr {
|
||||||
|
position: relative;
|
||||||
|
text-decoration-style: wavy;
|
||||||
|
text-decoration-color: var(--accent);
|
||||||
|
cursor: help;
|
||||||
|
}
|
||||||
|
|
||||||
|
sub {
|
||||||
|
bottom: -0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
sup {
|
||||||
|
top: -0.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
mark {
|
||||||
|
background: color-mix(in srgb, var(--accent) 45%, transparent);
|
||||||
|
color: var(--foreground);
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote {
|
||||||
|
position: relative;
|
||||||
|
border-top: 1px solid var(--accent);
|
||||||
|
border-bottom: 1px solid var(--accent);
|
||||||
|
margin: 0;
|
||||||
|
padding: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote::before {
|
||||||
|
content: ">";
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
color: var(--accent);
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote p:first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
blockquote p:last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
table {
|
||||||
|
table-layout: auto;
|
||||||
|
border-collapse: collapse;
|
||||||
|
}
|
||||||
|
|
||||||
|
table,
|
||||||
|
th,
|
||||||
|
td {
|
||||||
|
border: 2px solid var(--foreground);
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
th {
|
||||||
|
border-style: solid;
|
||||||
|
color: var(--foreground);
|
||||||
|
text-align: left;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 0.04em;
|
||||||
|
}
|
||||||
|
|
||||||
|
hr {
|
||||||
|
width: 100%;
|
||||||
|
border: none;
|
||||||
|
background: var(--accent);
|
||||||
|
height: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* One Heading Size */
|
||||||
.headings--one-size h1,
|
.headings--one-size h1,
|
||||||
.headings--one-size h2,
|
.headings--one-size h2,
|
||||||
.headings--one-size h3,
|
.headings--one-size h3,
|
||||||
|
|
@ -43,44 +415,6 @@ body {
|
||||||
margin-top: 20px;
|
margin-top: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
img.left {
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
img.center {
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
img.right {
|
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
figure.left {
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
figure.center {
|
|
||||||
margin-left: auto;
|
|
||||||
margin-right: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
figure.right {
|
|
||||||
margin-left: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
figure figcaption.left {
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
|
|
||||||
figure figcaption.center {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
figure figcaption.right {
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote.twitter-tweet {
|
blockquote.twitter-tweet {
|
||||||
position: relative;
|
position: relative;
|
||||||
background: var(--background);
|
background: var(--background);
|
||||||
|
|
@ -132,8 +466,31 @@ blockquote.twitter-tweet::before {
|
||||||
}
|
}
|
||||||
|
|
||||||
.__h_video {
|
.__h_video {
|
||||||
padding-bottom: 58.23% !important;
|
position: relative;
|
||||||
overflow: visible !important;
|
overflow: visible !important;
|
||||||
|
height: auto !important;
|
||||||
|
padding-bottom: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.__h_video a {
|
||||||
|
position: relative;
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.__h_video a img {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.__h_video a .play {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
margin: auto;
|
||||||
|
width: 60px;
|
||||||
|
height: 60px;
|
||||||
}
|
}
|
||||||
|
|
||||||
iframe[src*="youtube.com"] {
|
iframe[src*="youtube.com"] {
|
||||||
|
|
@ -142,18 +499,13 @@ iframe[src*="youtube.com"] {
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 684px) {
|
@media (max-width: 684px) {
|
||||||
body {
|
:root {
|
||||||
font-size: 1rem;
|
--font-size: 0.95rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
ul,
|
|
||||||
ol {
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media print {
|
@media print {
|
||||||
|
|
|
||||||
|
|
@ -100,7 +100,7 @@
|
||||||
.menu--language-selector .menu__trigger {
|
.menu--language-selector .menu__trigger {
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
border: 2px solid;
|
border: 2px solid;
|
||||||
margin-left: 10px;
|
margin-left: 5px;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
padding: 3px 8px;
|
padding: 3px 8px;
|
||||||
margin-bottom: 0 !important;
|
margin-bottom: 0 !important;
|
||||||
|
|
|
||||||
|
|
@ -15,7 +15,7 @@
|
||||||
padding: 5px 10px;
|
padding: 5px 10px;
|
||||||
background: var(--background);
|
background: var(--background);
|
||||||
color: color-mix(in srgb var(--foreground) 30%, transparent);
|
color: color-mix(in srgb var(--foreground) 30%, transparent);
|
||||||
font-size: 0.8rem;
|
font-size: calc(var(--font-size) * 0.8);
|
||||||
text-transform: uppercase;
|
text-transform: uppercase;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
letter-spacing: 0.1em;
|
letter-spacing: 0.1em;
|
||||||
|
|
@ -53,7 +53,7 @@
|
||||||
display: inline-flex;
|
display: inline-flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
font-size: 1rem;
|
font-size: inherit;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
appearance: none;
|
appearance: none;
|
||||||
}
|
}
|
||||||
|
|
@ -63,10 +63,6 @@
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
flex: 1;
|
flex: 1;
|
||||||
padding: 8px 16px;
|
padding: 8px 16px;
|
||||||
text-decoration: none;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
white-space: nowrap;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.button__text {
|
.button__text {
|
||||||
|
|
@ -83,12 +79,6 @@
|
||||||
margin-right: 8px;
|
margin-right: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 684px) {
|
|
||||||
.button {
|
|
||||||
flex: 1;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media print {
|
@media print {
|
||||||
.pagination {
|
.pagination {
|
||||||
display: none;
|
display: none;
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
.index-content {
|
.index-content {
|
||||||
margin-top: 20px;
|
margin: 25px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.framed {
|
.framed {
|
||||||
|
|
@ -22,7 +22,7 @@
|
||||||
.post {
|
.post {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
padding: 40px 0;
|
padding: 30px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.post:not(:last-of-type) {
|
.post:not(:last-of-type) {
|
||||||
|
|
@ -30,9 +30,9 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-meta {
|
.post-meta {
|
||||||
font-size: 1rem;
|
font-size: inherit;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
color: color-mix(in srgb, var(--foreground) 50%, transparent);
|
color: color-mix(in srgb, var(--foreground) 65%, transparent);
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-meta > *:not(:first-child)::before {
|
.post-meta > *:not(:first-child)::before {
|
||||||
|
|
@ -67,7 +67,7 @@
|
||||||
.post-tags {
|
.post-tags {
|
||||||
display: block;
|
display: block;
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
font-size: 1rem;
|
font-size: inherit;
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -76,11 +76,11 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-content {
|
.post-content {
|
||||||
margin-top: 30px;
|
margin-top: 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.post-cover {
|
.post-cover {
|
||||||
margin: 40px 0;
|
margin: 25px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.post ul {
|
.post ul {
|
||||||
|
|
|
||||||
|
|
@ -1,322 +0,0 @@
|
||||||
/* PrismJS 1.24.1
|
|
||||||
https://prismjs.com/download.html#themes=prism-tomorrow&languages=markup+css+clike+javascript+actionscript+apacheconf+applescript+bash+c+csharp+cpp+cmake+coffeescript+csp+css-extras+diff+django+docker+elixir+elm+erlang+fsharp+flow+git+go+graphql+haml+handlebars+haskell+http+java+json+kotlin+latex+less+llvm+makefile+markdown+markup-templating+nasm+objectivec+ocaml+perl+php+php-extras+powershell+processing+pug+python+r+jsx+tsx+reason+ruby+rust+sass+scss+scala+scheme+sql+stylus+swift+textile+toml+twig+typescript+vim+visual-basic+wasm+yaml&plugins=line-highlight+line-numbers+jsonp-highlight+highlight-keywords+command-line+toolbar+copy-to-clipboard */
|
|
||||||
|
|
||||||
/**
|
|
||||||
* prism.js tomorrow night eighties for JavaScript, CoffeeScript, CSS and HTML
|
|
||||||
* Based on https://github.com/chriskempson/tomorrow-theme
|
|
||||||
* @author Rose Pritchard
|
|
||||||
*/
|
|
||||||
code[class*=language-],
|
|
||||||
pre[class*=language-] {
|
|
||||||
color: #ccc;
|
|
||||||
background: none;
|
|
||||||
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;
|
|
||||||
tab-size: 4;
|
|
||||||
hyphens: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Code blocks */
|
|
||||||
pre[class*=language-] {
|
|
||||||
padding: 1em;
|
|
||||||
margin: 0.5em 0;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
:not(pre) > code[class*=language-],
|
|
||||||
pre[class*=language-] {
|
|
||||||
background: #2d2d2d;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Inline code */
|
|
||||||
:not(pre) > code[class*=language-] {
|
|
||||||
padding: 0.1em;
|
|
||||||
border-radius: 0.3em;
|
|
||||||
white-space: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.comment,
|
|
||||||
.token.block-comment,
|
|
||||||
.token.prolog,
|
|
||||||
.token.doctype,
|
|
||||||
.token.cdata {
|
|
||||||
color: #999;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.punctuation {
|
|
||||||
color: #ccc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.tag,
|
|
||||||
.token.attr-name,
|
|
||||||
.token.namespace,
|
|
||||||
.token.deleted {
|
|
||||||
color: #e2777a;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.function-name {
|
|
||||||
color: #6196cc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.boolean,
|
|
||||||
.token.number,
|
|
||||||
.token.function {
|
|
||||||
color: #f08d49;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.property,
|
|
||||||
.token.class-name,
|
|
||||||
.token.constant,
|
|
||||||
.token.symbol {
|
|
||||||
color: #f8c555;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.selector,
|
|
||||||
.token.important,
|
|
||||||
.token.atrule,
|
|
||||||
.token.keyword,
|
|
||||||
.token.builtin {
|
|
||||||
color: #cc99cd;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.string,
|
|
||||||
.token.char,
|
|
||||||
.token.attr-value,
|
|
||||||
.token.regex,
|
|
||||||
.token.variable {
|
|
||||||
color: #7ec699;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.operator,
|
|
||||||
.token.entity,
|
|
||||||
.token.url {
|
|
||||||
color: #67cdcc;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.important,
|
|
||||||
.token.bold {
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.italic {
|
|
||||||
font-style: italic;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.entity {
|
|
||||||
cursor: help;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.inserted {
|
|
||||||
color: green;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre[data-line] {
|
|
||||||
position: relative;
|
|
||||||
padding: 1em 0 1em 3em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-highlight {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
padding: inherit 0;
|
|
||||||
margin-top: 1em;
|
|
||||||
|
|
||||||
/* Same as .prism’s padding-top */
|
|
||||||
background: hsla(24deg, 20%, 50%, 8%);
|
|
||||||
background: linear-gradient(to right, hsla(24deg, 20%, 50%, 10%) 70%, hsla(24deg, 20%, 50%, 0%));
|
|
||||||
pointer-events: none;
|
|
||||||
line-height: inherit;
|
|
||||||
white-space: pre;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media print {
|
|
||||||
.line-highlight {
|
|
||||||
/*
|
|
||||||
* This will prevent browsers from replacing the background color with white.
|
|
||||||
* It's necessary because the element is layered on top of the displayed code.
|
|
||||||
*/
|
|
||||||
-webkit-print-color-adjust: exact;
|
|
||||||
color-adjust: exact;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-highlight::before,
|
|
||||||
.line-highlight[data-end]::after {
|
|
||||||
content: attr(data-start);
|
|
||||||
position: absolute;
|
|
||||||
top: 0.4em;
|
|
||||||
left: 0.6em;
|
|
||||||
min-width: 1em;
|
|
||||||
padding: 0 0.5em;
|
|
||||||
background-color: hsla(24deg, 20%, 50%, 40%);
|
|
||||||
color: hsl(24deg, 20%, 95%);
|
|
||||||
font: bold 65%/1.5 sans-serif;
|
|
||||||
text-align: center;
|
|
||||||
vertical-align: 0.3em;
|
|
||||||
border-radius: 999px;
|
|
||||||
text-shadow: none;
|
|
||||||
box-shadow: 0 1px white;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-highlight[data-end]::after {
|
|
||||||
content: attr(data-end);
|
|
||||||
top: auto;
|
|
||||||
bottom: 0.4em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-numbers .line-highlight::before,
|
|
||||||
.line-numbers .line-highlight::after {
|
|
||||||
content: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre[id].linkable-line-numbers span.line-numbers-rows {
|
|
||||||
pointer-events: all;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre[id].linkable-line-numbers span.line-numbers-rows > span::before {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre[id].linkable-line-numbers span.line-numbers-rows > span:hover::before {
|
|
||||||
background-color: rgba(128, 128, 128, 20%);
|
|
||||||
}
|
|
||||||
|
|
||||||
pre[class*=language-].line-numbers {
|
|
||||||
position: relative;
|
|
||||||
padding-left: 3.8em;
|
|
||||||
counter-reset: linenumber;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre[class*=language-].line-numbers > code {
|
|
||||||
position: relative;
|
|
||||||
white-space: inherit;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-numbers .line-numbers-rows {
|
|
||||||
position: absolute;
|
|
||||||
pointer-events: none;
|
|
||||||
top: 0;
|
|
||||||
font-size: 100%;
|
|
||||||
left: -3.8em;
|
|
||||||
width: 3em;
|
|
||||||
|
|
||||||
/* works for line-numbers below 1000 lines */
|
|
||||||
letter-spacing: -1px;
|
|
||||||
border-right: 1px solid #999;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-numbers-rows > span {
|
|
||||||
display: block;
|
|
||||||
counter-increment: linenumber;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-numbers-rows > span::before {
|
|
||||||
content: counter(linenumber);
|
|
||||||
color: #999;
|
|
||||||
display: block;
|
|
||||||
padding-right: 0.8em;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
.command-line-prompt {
|
|
||||||
border-right: 1px solid #999;
|
|
||||||
display: block;
|
|
||||||
float: left;
|
|
||||||
font-size: 100%;
|
|
||||||
letter-spacing: -1px;
|
|
||||||
margin-right: 1em;
|
|
||||||
pointer-events: none;
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.command-line-prompt > span::before {
|
|
||||||
color: #999;
|
|
||||||
content: " ";
|
|
||||||
display: block;
|
|
||||||
padding-right: 0.8em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.command-line-prompt > span[data-user]::before {
|
|
||||||
content: "["attr(data-user) "@"attr(data-host) "] $";
|
|
||||||
}
|
|
||||||
|
|
||||||
.command-line-prompt > span[data-user=root]::before {
|
|
||||||
content: "["attr(data-user) "@"attr(data-host) "] #";
|
|
||||||
}
|
|
||||||
|
|
||||||
.command-line-prompt > span[data-prompt]::before {
|
|
||||||
content: attr(data-prompt);
|
|
||||||
}
|
|
||||||
|
|
||||||
div.code-toolbar {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.code-toolbar > .toolbar {
|
|
||||||
position: absolute;
|
|
||||||
top: 0.3em;
|
|
||||||
right: 0.2em;
|
|
||||||
transition: opacity 0.3s ease-in-out;
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.code-toolbar:hover > .toolbar {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Separate line b/c rules are thrown out if selector is invalid.
|
|
||||||
IE11 and old Edge versions don't support :focus-within. */
|
|
||||||
div.code-toolbar:focus-within > .toolbar {
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > a {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > button {
|
|
||||||
background: none;
|
|
||||||
border: 0;
|
|
||||||
color: inherit;
|
|
||||||
font: inherit;
|
|
||||||
line-height: normal;
|
|
||||||
overflow: visible;
|
|
||||||
padding: 0;
|
|
||||||
|
|
||||||
/* for button */
|
|
||||||
user-select: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > a,
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > button,
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > span {
|
|
||||||
color: #bbb;
|
|
||||||
font-size: 0.8em;
|
|
||||||
padding: 0 0.5em;
|
|
||||||
background: #f5f2f0;
|
|
||||||
background: rgba(224, 224, 224, 20%);
|
|
||||||
box-shadow: 0 2px 0 0 rgba(0, 0, 0, 20%);
|
|
||||||
border-radius: 0.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > a:hover,
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > a:focus,
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > button:hover,
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > button:focus,
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > span:hover,
|
|
||||||
div.code-toolbar > .toolbar > .toolbar-item > span:focus {
|
|
||||||
color: inherit;
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
|
|
@ -1,115 +1,97 @@
|
||||||
code.language-css,
|
:root {
|
||||||
code.language-scss,
|
--first-tone: var(--accent);
|
||||||
.token.boolean,
|
--second-tone: color-mix(in srgb, var(--accent) 70%, transparent);
|
||||||
.token.string,
|
--comment: color-mix(in srgb, var(--foreground) 50%, transparent);
|
||||||
.token.entity,
|
|
||||||
.token.url,
|
|
||||||
.language-css .token.string,
|
|
||||||
.language-scss .token.string,
|
|
||||||
.style .token.string,
|
|
||||||
.token.attr-value,
|
|
||||||
.token.keyword,
|
|
||||||
.token.control,
|
|
||||||
.token.directive,
|
|
||||||
.token.statement,
|
|
||||||
.token.regex,
|
|
||||||
.token.atrule,
|
|
||||||
.token.number,
|
|
||||||
.token.inserted,
|
|
||||||
.token.important {
|
|
||||||
color: var(--accent) !important;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.token.tag-id,
|
/* Background */ .bg { }
|
||||||
.token.atrule-id,
|
/* PreWrapper */ .chroma { overflow:auto; }
|
||||||
.token.operator,
|
/* Other */ .chroma .x { }
|
||||||
.token.unit,
|
/* Error */ .chroma .err { }
|
||||||
.token.placeholder,
|
/* CodeLine */ .chroma .cl { }
|
||||||
.token.variable,
|
/* LineLink */ .chroma .lnlinks { outline:none;text-decoration:none;color:inherit }
|
||||||
.token.attr-name,
|
/* LineTableTD */ .chroma .lntd { width:100%;vertical-align:top;padding:0;margin:0;border:0; }
|
||||||
.token.namespace,
|
/* LineTableTDNumbers */ .chroma .lntd:first-child { width: auto; }
|
||||||
.token.deleted,
|
/* Custom */ .chroma .lntd code { display:grid; }
|
||||||
.token.property,
|
/* LineTable */ .chroma .lntable { width:100%;border-spacing:0;padding:0;margin:0;border:0; }
|
||||||
.token.class-name,
|
/* LineHighlight */ .chroma .hl { background-color:color-mix(in srgb, var(--foreground) 5%, transparent) !important}
|
||||||
.token.constant,
|
/* LineNumbersTable */ .chroma .lnt { color:var(--comment);white-space:pre;-webkit-user-select:none;user-select:none;padding:0 10px; }
|
||||||
.token.symbol {
|
/* LineNumbers */ .chroma .ln { color:var(--comment);white-space:pre;-webkit-user-select:none;user-select:none;margin-right:0.8em;padding:0 0.4em 0 0; }
|
||||||
color: color-mix(in srgb, var(--accent) 70%, transparent) !important;
|
/* Line */ .chroma .line { display:flex;padding:0 10px; }
|
||||||
}
|
/* Keyword */ .chroma .k { color:var(--second-tone) }
|
||||||
|
/* KeywordConstant */ .chroma .kc { color:var(--second-tone) }
|
||||||
|
/* KeywordDeclaration */ .chroma .kd { color:var(--second-tone) }
|
||||||
|
/* KeywordNamespace */ .chroma .kn { color:var(--second-tone) }
|
||||||
|
/* KeywordPseudo */ .chroma .kp { color:var(--second-tone) }
|
||||||
|
/* KeywordReserved */ .chroma .kr { color:var(--second-tone) }
|
||||||
|
/* KeywordType */ .chroma .kt { color:var(--second-tone) }
|
||||||
|
/* Name */ .chroma .n { color:var(--first-tone) }
|
||||||
|
/* NameAttribute */ .chroma .na { color:var(--second-tone) }
|
||||||
|
/* NameBuiltin */ .chroma .nb { color:var(--first-tone) }
|
||||||
|
/* NameBuiltinPseudo */ .chroma .bp { color:var(--first-tone) }
|
||||||
|
/* NameClass */ .chroma .nc { color:var(--foreground) }
|
||||||
|
/* NameConstant */ .chroma .no { color:var(--first-tone) }
|
||||||
|
/* NameDecorator */ .chroma .nd { color:var(--first-tone) }
|
||||||
|
/* NameEntity */ .chroma .ni { color:var(--first-tone) }
|
||||||
|
/* NameException */ .chroma .ne { color:var(--first-tone) }
|
||||||
|
/* NameFunction */ .chroma .nf { color:var(--first-tone); }
|
||||||
|
/* NameFunctionMagic */ .chroma .fm { color:var(--first-tone); }
|
||||||
|
/* NameLabel */ .chroma .nl { color:var(--first-tone) }
|
||||||
|
/* NameNamespace */ .chroma .nn { color:var(--first-tone) }
|
||||||
|
/* NameOther */ .chroma .nx { color:var(--first-tone) }
|
||||||
|
/* NameProperty */ .chroma .py { color:var(--first-tone) }
|
||||||
|
/* NameTag */ .chroma .nt { color:var(--first-tone) }
|
||||||
|
/* NameVariable */ .chroma .nv { color:var(--first-tone) }
|
||||||
|
/* NameVariableClass */ .chroma .vc { color:var(--first-tone) }
|
||||||
|
/* NameVariableGlobal */ .chroma .vg { color:var(--first-tone) }
|
||||||
|
/* NameVariableInstance */ .chroma .vi { color:var(--first-tone) }
|
||||||
|
/* NameVariableMagic */ .chroma .vm { color:var(--first-tone) }
|
||||||
|
/* Literal */ .chroma .l { }
|
||||||
|
/* LiteralDate */ .chroma .ld { }
|
||||||
|
/* LiteralString */ .chroma .s { color:var(--foreground) }
|
||||||
|
/* LiteralStringAffix */ .chroma .sa { color:var(--foreground) }
|
||||||
|
/* LiteralStringBacktick */ .chroma .sb { color:var(--foreground) }
|
||||||
|
/* LiteralStringChar */ .chroma .sc { color:var(--foreground) }
|
||||||
|
/* LiteralStringDelimiter */ .chroma .dl { color:var(--foreground) }
|
||||||
|
/* LiteralStringDoc */ .chroma .sd { color:var(--foreground) }
|
||||||
|
/* LiteralStringDouble */ .chroma .s2 { color:var(--foreground) }
|
||||||
|
/* LiteralStringEscape */ .chroma .se { color:var(--foreground) }
|
||||||
|
/* LiteralStringHeredoc */ .chroma .sh { color:var(--foreground) }
|
||||||
|
/* LiteralStringInterpol */ .chroma .si { color:var(--foreground) }
|
||||||
|
/* LiteralStringOther */ .chroma .sx { color:var(--foreground) }
|
||||||
|
/* LiteralStringRegex */ .chroma .sr { color:var(--foreground) }
|
||||||
|
/* LiteralStringSingle */ .chroma .s1 { color:var(--foreground) }
|
||||||
|
/* LiteralStringSymbol */ .chroma .ss { color:var(--foreground) }
|
||||||
|
/* LiteralNumber */ .chroma .m { color:var(--first-tone) }
|
||||||
|
/* LiteralNumberBin */ .chroma .mb { color:var(--first-tone) }
|
||||||
|
/* LiteralNumberFloat */ .chroma .mf { color:var(--first-tone) }
|
||||||
|
/* LiteralNumberHex */ .chroma .mh { color:var(--first-tone) }
|
||||||
|
/* LiteralNumberInteger */ .chroma .mi { color:var(--first-tone) }
|
||||||
|
/* LiteralNumberIntegerLong */ .chroma .il { color:var(--first-tone) }
|
||||||
|
/* LiteralNumberOct */ .chroma .mo { color:var(--first-tone) }
|
||||||
|
/* Operator */ .chroma .o { color:var(--foreground) }
|
||||||
|
/* OperatorWord */ .chroma .ow { color:var(--foreground) }
|
||||||
|
/* Punctuation */ .chroma .p { color:var(--foreground) }
|
||||||
|
/* Comment */ .chroma .c { color:var(--comment) }
|
||||||
|
/* CommentHashbang */ .chroma .ch { color:var(--comment) }
|
||||||
|
/* CommentMultiline */ .chroma .cm { color:var(--comment) }
|
||||||
|
/* CommentSingle */ .chroma .c1 { color:var(--comment) }
|
||||||
|
/* CommentSpecial */ .chroma .cs { color:var(--comment) }
|
||||||
|
/* CommentPreproc */ .chroma .cp { color:var(--comment) }
|
||||||
|
/* CommentPreprocFile */ .chroma .cpf { color:var(--comment) }
|
||||||
|
/* Generic */ .chroma .g { }
|
||||||
|
/* GenericDeleted */ .chroma .gd { color:var(--first-tone) }
|
||||||
|
/* GenericEmph */ .chroma .ge { }
|
||||||
|
/* GenericError */ .chroma .gr { }
|
||||||
|
/* GenericHeading */ .chroma .gh { }
|
||||||
|
/* GenericInserted */ .chroma .gi { color:var(--second-tone); }
|
||||||
|
/* GenericOutput */ .chroma .go { }
|
||||||
|
/* GenericPrompt */ .chroma .gp { }
|
||||||
|
/* GenericStrong */ .chroma .gs { }
|
||||||
|
/* GenericSubheading */ .chroma .gu { }
|
||||||
|
/* GenericTraceback */ .chroma .gt { }
|
||||||
|
/* GenericUnderline */ .chroma .gl { }
|
||||||
|
/* TextWhitespace */ .chroma .w { }
|
||||||
|
|
||||||
.token.property,
|
/* LANGUAGE FIXES */
|
||||||
.token.function,
|
/* PHP CommentPreproc */ .chroma .language-php .cp { color:var(--foreground) }
|
||||||
.token.function-name,
|
|
||||||
.token.deleted,
|
|
||||||
code.language-javascript,
|
|
||||||
code.language-html,
|
|
||||||
.command-line-prompt > span::before {
|
|
||||||
color: var(--accent) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.selector,
|
|
||||||
.token.tag,
|
|
||||||
.token.punctuation {
|
|
||||||
color: color-mix(in srgb, var(--accent) 50%, var(--foreground)) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.comment,
|
|
||||||
.token.prolog,
|
|
||||||
.token.doctype,
|
|
||||||
.token.cdata {
|
|
||||||
color: color-mix(in srgb, var(--foreground) 30%, transparent) !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.token.namespace {
|
|
||||||
opacity: 0.7 !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre[data-line] {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre[class*=language-] {
|
|
||||||
margin: 0;
|
|
||||||
overflow: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-highlight {
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
background: color-mix(in srgb, var(--foreground) 7%, transparent);
|
|
||||||
pointer-events: none;
|
|
||||||
line-height: inherit;
|
|
||||||
white-space: pre;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-highlight::before,
|
|
||||||
.line-highlight[data-end]::after {
|
|
||||||
content: attr(data-start);
|
|
||||||
position: absolute;
|
|
||||||
|
|
||||||
/* top: .4em; */
|
|
||||||
left: 0.6em;
|
|
||||||
min-width: 1em;
|
|
||||||
padding: 0 0.5em;
|
|
||||||
background-color: color-mix(in srgb, var(--foreground) 40%, transparent);
|
|
||||||
color: var(--foreground);
|
|
||||||
font: bold 65%/1.5 sans-serif;
|
|
||||||
text-align: center;
|
|
||||||
vertical-align: 0.3em;
|
|
||||||
border-radius: 999px;
|
|
||||||
text-shadow: none;
|
|
||||||
box-shadow: 0 1px var(--foreground);
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-highlight[data-end]::after {
|
|
||||||
content: attr(data-end);
|
|
||||||
top: auto;
|
|
||||||
bottom: 0.4em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.line-numbers .line-highlight::before,
|
|
||||||
.line-numbers .line-highlight::after {
|
|
||||||
content: none;
|
|
||||||
}
|
|
||||||
|
|
|
||||||
|
|
@ -1,377 +1,2 @@
|
||||||
:root {
|
/* Placeholder file for your custom settings. */
|
||||||
--background: #1a170f;
|
/* You can get the color scheme variables from https://panr.github.io/terminal-css/ */
|
||||||
--foreground: #eceae5;
|
|
||||||
--accent: #eec35e;
|
|
||||||
--font-size: 1rem;
|
|
||||||
--line-height: 1.54rem;
|
|
||||||
--radius: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
html {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
*,
|
|
||||||
*::before,
|
|
||||||
*::after {
|
|
||||||
box-sizing: inherit;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
body {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
font-family:
|
|
||||||
"Fira Code",
|
|
||||||
Monaco,
|
|
||||||
Consolas,
|
|
||||||
"Ubuntu Mono",
|
|
||||||
monospace;
|
|
||||||
font-size: 1rem;
|
|
||||||
font-weight: 400;
|
|
||||||
line-height: var(--line-height);
|
|
||||||
letter-spacing: -0.02em;
|
|
||||||
background-color: var(--background);
|
|
||||||
color: var(--foreground);
|
|
||||||
text-rendering: optimizelegibility;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-webkit-overflow-scrolling: touch;
|
|
||||||
text-size-adjust: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
::placeholder {
|
|
||||||
color: color-mix(in srgb var(--foreground) 50%, black);
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2 {
|
|
||||||
font-size: calc(var(--font-size) * 1.1);
|
|
||||||
text-transform: uppercase;
|
|
||||||
letter-spacing: 0.04em;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1 {
|
|
||||||
text-decoration: underline;
|
|
||||||
text-decoration-thickness: 2px;
|
|
||||||
text-underline-offset: calc(var(--font-size) * 0.2);
|
|
||||||
}
|
|
||||||
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6 {
|
|
||||||
font-size: calc(var(--font-size) * 1.1);
|
|
||||||
letter-spacing: 0.04em;
|
|
||||||
}
|
|
||||||
|
|
||||||
h1,
|
|
||||||
h2,
|
|
||||||
h3,
|
|
||||||
h4,
|
|
||||||
h5,
|
|
||||||
h6,
|
|
||||||
p,
|
|
||||||
ul,
|
|
||||||
ol,
|
|
||||||
img,
|
|
||||||
figure,
|
|
||||||
video,
|
|
||||||
table {
|
|
||||||
margin: calc(var(--line-height) * 1.2) 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
a {
|
|
||||||
color: var(--accent);
|
|
||||||
}
|
|
||||||
|
|
||||||
button {
|
|
||||||
position: relative;
|
|
||||||
font: inherit;
|
|
||||||
font-weight: bold;
|
|
||||||
text-decoration: none;
|
|
||||||
text-align: center;
|
|
||||||
background: transparent;
|
|
||||||
color: var(--accent);
|
|
||||||
padding: 5px 18px;
|
|
||||||
border: 4px solid var(--accent);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
transition: background 0.15s linear;
|
|
||||||
appearance: none;
|
|
||||||
cursor: pointer;
|
|
||||||
outline: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
button:hover {
|
|
||||||
background: color-mix(in srgb, var(--accent) 15%, transparent);
|
|
||||||
}
|
|
||||||
|
|
||||||
button:focus-visible,
|
|
||||||
a:focus-visible {
|
|
||||||
outline: 1px solid var(--accent);
|
|
||||||
outline-offset: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset {
|
|
||||||
display: inline-block;
|
|
||||||
border: 2px solid var(--foreground);
|
|
||||||
border-radius: calc(var(--radius) * 1.6);
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset *:first-child {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
fieldset input,
|
|
||||||
fieldset select,
|
|
||||||
fieldset textarea,
|
|
||||||
fieldset label,
|
|
||||||
fieldset button {
|
|
||||||
margin-top: calc(var(--line-height) * 0.5);
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
label {
|
|
||||||
display: inline-block;
|
|
||||||
}
|
|
||||||
|
|
||||||
label input {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
input,
|
|
||||||
textarea,
|
|
||||||
select {
|
|
||||||
background: transparent;
|
|
||||||
color: var(--foreground);
|
|
||||||
border: 1px solid var(--foreground);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
padding: 10px;
|
|
||||||
font: inherit;
|
|
||||||
appearance: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="checkbox"] {
|
|
||||||
width: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
input:focus-visible,
|
|
||||||
input:active,
|
|
||||||
textarea:focus-visible,
|
|
||||||
textarea:active,
|
|
||||||
select:focus-visible,
|
|
||||||
select:active {
|
|
||||||
border-color: var(--accent);
|
|
||||||
outline: 1px solid var(--accent);
|
|
||||||
outline-offset: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
input:active,
|
|
||||||
textarea:active,
|
|
||||||
select:active {
|
|
||||||
box-shadow: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
select {
|
|
||||||
background-image: linear-gradient(
|
|
||||||
45deg,
|
|
||||||
transparent 50%,
|
|
||||||
var(--foreground) 50%
|
|
||||||
),
|
|
||||||
linear-gradient(135deg, var(--foreground) 50%, transparent 50%);
|
|
||||||
background-position: calc(100% - 20px), calc(100% - 1em);
|
|
||||||
background-size:
|
|
||||||
5px 5px,
|
|
||||||
5px 5px;
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
padding-right: 40px;
|
|
||||||
}
|
|
||||||
|
|
||||||
select option {
|
|
||||||
background: var(--background);
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="checkbox"] {
|
|
||||||
vertical-align: middle;
|
|
||||||
padding: 10px;
|
|
||||||
box-shadow: inset 0 0 0 3px var(--background);
|
|
||||||
}
|
|
||||||
|
|
||||||
input[type="checkbox"]:checked {
|
|
||||||
background: var(--accent);
|
|
||||||
}
|
|
||||||
|
|
||||||
img {
|
|
||||||
display: block;
|
|
||||||
max-width: 100%;
|
|
||||||
border: 8px solid var(--accent);
|
|
||||||
border-radius: var(--radius);
|
|
||||||
padding: 8px;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
|
|
||||||
figure {
|
|
||||||
width: fit-content;
|
|
||||||
}
|
|
||||||
|
|
||||||
figure img,
|
|
||||||
figure video {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
figure figcaption {
|
|
||||||
background: var(--accent);
|
|
||||||
color: var(--background);
|
|
||||||
text-align: center;
|
|
||||||
font-size: 1rem;
|
|
||||||
font-weight: normal;
|
|
||||||
margin-top: -8px;
|
|
||||||
border-radius: 0 0 var(--radius) var(--radius);
|
|
||||||
}
|
|
||||||
|
|
||||||
ul,
|
|
||||||
ol {
|
|
||||||
margin-left: 4ch;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
ul ul,
|
|
||||||
ul ol,
|
|
||||||
ol ul,
|
|
||||||
ol ol {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
li::marker {
|
|
||||||
color: var(--accent);
|
|
||||||
}
|
|
||||||
|
|
||||||
ul li,
|
|
||||||
ol li {
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
code,
|
|
||||||
kbd {
|
|
||||||
font-family:
|
|
||||||
"Fira Code",
|
|
||||||
Monaco,
|
|
||||||
Consolas,
|
|
||||||
"Ubuntu Mono",
|
|
||||||
monospace !important;
|
|
||||||
font-feature-settings: normal;
|
|
||||||
background: color-mix(in srgb, var(--foreground) 5%, transparent);
|
|
||||||
color: var(--accent);
|
|
||||||
padding: 1px 6px;
|
|
||||||
margin: 0 2px;
|
|
||||||
font-size: 0.95rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
kbd {
|
|
||||||
border-top: 1px solid color-mix(in srgb, var(--accent) 25%, transparent);
|
|
||||||
border-left: 1px solid var(--accent);
|
|
||||||
border-right: 1px solid var(--accent);
|
|
||||||
border-bottom: 4px solid var(--accent);
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
code code {
|
|
||||||
background: transparent;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
pre {
|
|
||||||
tab-size: 4;
|
|
||||||
background: color-mix(in srgb, var(--foreground) 5%, transparent) !important;
|
|
||||||
color: var(--foreground);
|
|
||||||
padding: 20px 10px;
|
|
||||||
font-size: 0.95rem !important;
|
|
||||||
overflow: auto;
|
|
||||||
border-radius: var(--radius);
|
|
||||||
border: 1px solid color-mix(in srgb, var(--foreground) 10%, transparent);
|
|
||||||
}
|
|
||||||
|
|
||||||
pre code {
|
|
||||||
background: none !important;
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
font-size: inherit;
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
sup {
|
|
||||||
line-height: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
abbr {
|
|
||||||
position: relative;
|
|
||||||
text-decoration-style: wavy;
|
|
||||||
text-decoration-color: var(--accent);
|
|
||||||
cursor: help;
|
|
||||||
}
|
|
||||||
|
|
||||||
sub {
|
|
||||||
bottom: -0.25em;
|
|
||||||
}
|
|
||||||
|
|
||||||
sup {
|
|
||||||
top: -0.25em;
|
|
||||||
}
|
|
||||||
|
|
||||||
mark {
|
|
||||||
background: color-mix(in srgb, var(--accent) 45%, transparent);
|
|
||||||
color: var(--foreground);
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote {
|
|
||||||
position: relative;
|
|
||||||
border-top: 1px solid var(--accent);
|
|
||||||
border-bottom: 1px solid var(--accent);
|
|
||||||
margin: 0;
|
|
||||||
padding: 25px;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote::before {
|
|
||||||
content: ">";
|
|
||||||
display: block;
|
|
||||||
position: absolute;
|
|
||||||
left: 0;
|
|
||||||
color: var(--accent);
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote p:first-child {
|
|
||||||
margin-top: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
blockquote p:last-child {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
table {
|
|
||||||
table-layout: auto;
|
|
||||||
border-collapse: collapse;
|
|
||||||
}
|
|
||||||
|
|
||||||
table,
|
|
||||||
th,
|
|
||||||
td {
|
|
||||||
border: 2px solid var(--foreground);
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
th {
|
|
||||||
border-style: solid;
|
|
||||||
color: var(--foreground);
|
|
||||||
text-align: left;
|
|
||||||
text-transform: uppercase;
|
|
||||||
letter-spacing: 0.04em;
|
|
||||||
}
|
|
||||||
|
|
||||||
hr {
|
|
||||||
width: 100%;
|
|
||||||
border: none;
|
|
||||||
background: var(--accent);
|
|
||||||
height: 2px;
|
|
||||||
}
|
|
||||||
|
|
|
||||||
32
assets/js/code.js
Normal file
32
assets/js/code.js
Normal file
|
|
@ -0,0 +1,32 @@
|
||||||
|
const blockcodes = document.querySelectorAll(".chroma code[data-lang]");
|
||||||
|
|
||||||
|
for (const bc of blockcodes) {
|
||||||
|
const parent = bc.parentElement;
|
||||||
|
const content = bc.innerText.split("\n").filter(Boolean).join("\n");
|
||||||
|
|
||||||
|
// Code title
|
||||||
|
const title = document.createElement("div");
|
||||||
|
const lang = bc.dataset.lang;
|
||||||
|
title.classList.add("code-title");
|
||||||
|
title.innerText = lang;
|
||||||
|
|
||||||
|
// Copy to clipboard
|
||||||
|
if (navigator.clipboard !== undefined) {
|
||||||
|
const cpbutton = document.createElement("button");
|
||||||
|
cpbutton.classList.add("copy-button");
|
||||||
|
cpbutton.innerText = "Copy";
|
||||||
|
|
||||||
|
cpbutton.addEventListener("click", () => {
|
||||||
|
cpbutton.innerText = "Copied";
|
||||||
|
setTimeout(() => {
|
||||||
|
cpbutton.innerText = "Copy";
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
|
navigator.clipboard.writeText(content);
|
||||||
|
});
|
||||||
|
|
||||||
|
title.append(cpbutton);
|
||||||
|
}
|
||||||
|
|
||||||
|
parent.closest(".highlight").prepend(title);
|
||||||
|
}
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -1,7 +1,7 @@
|
||||||
baseurl = "https://example.com/"
|
baseurl = "https://example.com/"
|
||||||
languageCode = "en-us"
|
languageCode = "en-us"
|
||||||
theme = "hugo-theme-terminal"
|
theme = "hugo-theme-terminal"
|
||||||
paginate = 5
|
pagination.pagerSize = 5
|
||||||
|
|
||||||
[markup.goldmark.renderer]
|
[markup.goldmark.renderer]
|
||||||
unsafe = true
|
unsafe = true
|
||||||
|
|
|
||||||
|
|
@ -46,7 +46,7 @@
|
||||||
|
|
||||||
{{ if not .Params.showFullContent }}
|
{{ if not .Params.showFullContent }}
|
||||||
<div>
|
<div>
|
||||||
<a class="read-more button inline" href="{{ .RelPermalink }}">{{ $.Site.Params.ReadMore }}</a>
|
<a class="read-more button inline" href="{{ .RelPermalink }}">[{{ $.Site.Params.ReadMore }}]</a>
|
||||||
</div>
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</article>
|
</article>
|
||||||
|
|
|
||||||
|
|
@ -36,7 +36,7 @@
|
||||||
|
|
||||||
{{ if not .Params.showFullContent }}
|
{{ if not .Params.showFullContent }}
|
||||||
<div>
|
<div>
|
||||||
<a class="read-more button inline" href="{{ .RelPermalink }}">{{ $.Site.Params.ReadMore }}</a>
|
<a class="read-more button inline" href="{{ .RelPermalink }}">[{{ $.Site.Params.ReadMore }}]</a>
|
||||||
</div>
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</article>
|
</article>
|
||||||
|
|
|
||||||
|
|
@ -1,40 +0,0 @@
|
||||||
{{- $pctx := . -}}
|
|
||||||
{{- if .IsHome -}}{{ $pctx = .Site }}{{- end -}}
|
|
||||||
{{- $pages := slice -}}
|
|
||||||
{{- if or $.IsHome $.IsSection -}}
|
|
||||||
{{- $pages = $pctx.RegularPages -}}
|
|
||||||
{{- else -}}
|
|
||||||
{{- $pages = $pctx.Pages -}}
|
|
||||||
{{- end -}}
|
|
||||||
{{- $limit := .Site.Config.Services.RSS.Limit -}}
|
|
||||||
{{- if ge $limit 1 -}}
|
|
||||||
{{- $pages = $pages | first $limit -}}
|
|
||||||
{{- end -}}
|
|
||||||
{{- printf "<?xml version=\"1.0\" encoding=\"utf-8\" standalone=\"yes\"?>" | safeHTML }}
|
|
||||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
|
||||||
<channel>
|
|
||||||
<title>{{ if eq .Title .Site.Title }}{{ .Site.Title }}{{ else }}{{ with .Title }}{{.}} on {{ end }}{{ .Site.Title }}{{ end }}</title>
|
|
||||||
<link>{{ .Permalink }}</link>
|
|
||||||
<description>Recent content {{ if ne .Title .Site.Title }}{{ with .Title }}in {{.}} {{ end }}{{ end }}on {{ .Site.Title }}</description>
|
|
||||||
<generator>Hugo -- gohugo.io</generator>{{ with .Site.LanguageCode }}
|
|
||||||
<language>{{.}}</language>{{end}}{{ with .Site.Author.email }}
|
|
||||||
<managingEditor>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</managingEditor>{{end}}{{ with .Site.Author.email }}
|
|
||||||
<webMaster>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</webMaster>{{end}}{{ with .Site.Copyright }}
|
|
||||||
<copyright>{{.}}</copyright>{{end}}{{ if not .Date.IsZero }}
|
|
||||||
<lastBuildDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</lastBuildDate>{{ end }}
|
|
||||||
{{- with .OutputFormats.Get "RSS" -}}
|
|
||||||
{{ printf "<atom:link href=%q rel=\"self\" type=%q />" .Permalink .MediaType | safeHTML }}
|
|
||||||
{{- end -}}
|
|
||||||
{{ range $pages }}
|
|
||||||
<item>
|
|
||||||
<title>{{ .Title }}</title>
|
|
||||||
<link>{{ .Permalink }}</link>
|
|
||||||
<pubDate>{{ .Date.Format "Mon, 02 Jan 2006 15:04:05 -0700" | safeHTML }}</pubDate>
|
|
||||||
{{ with .Site.Author.email }}<author>{{.}}{{ with $.Site.Author.name }} ({{.}}){{end}}</author>{{end}}
|
|
||||||
<guid>{{ .Permalink }}</guid>
|
|
||||||
<description>{{ .Summary | html }}</description>
|
|
||||||
<content>{{ .Content | html }}</content>
|
|
||||||
</item>
|
|
||||||
{{ end }}
|
|
||||||
</channel>
|
|
||||||
</rss>
|
|
||||||
|
|
@ -1,57 +1,57 @@
|
||||||
{{ define "main" }}
|
{{ define "main" }}
|
||||||
<h1>Posts for: #{{ .Title }}</h1>
|
<h1>Posts for: #{{ .Title }}</h1>
|
||||||
{{ with .Content }}
|
{{ with .Content }}
|
||||||
<div class="index-content">
|
<div class="index-content">
|
||||||
{{ . }}
|
{{ . }}
|
||||||
</div>
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
<div class="posts">
|
<div class="posts">
|
||||||
{{ range .Paginator.Pages }}
|
{{ range .Paginator.Pages }}
|
||||||
<article class="post on-list">
|
<article class="post on-list">
|
||||||
<h1 class="post-title">
|
<h1 class="post-title">
|
||||||
<a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
|
<a href="{{ .Permalink }}">{{ .Title | markdownify }}</a>
|
||||||
</h1>
|
</h1>
|
||||||
<div class="post-meta">
|
<div class="post-meta">
|
||||||
{{- if .Date -}}
|
{{- if .Date -}}
|
||||||
<time class="post-date">
|
<time class="post-date">
|
||||||
{{- .Date.Format "2006-01-02" -}}
|
{{- .Date.Format "2006-01-02" -}}
|
||||||
</time>
|
</time>
|
||||||
{{- end -}}
|
{{- end -}}
|
||||||
{{- with .Params.Author -}}
|
{{- with .Params.Author -}}
|
||||||
<span class="post-author">{{- . -}}</span>
|
<span class="post-author">{{- . -}}</span>
|
||||||
{{- end -}}
|
{{- end -}}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{{ if .Params.tags }}
|
{{ if .Params.tags }}
|
||||||
<span class="post-tags">
|
<span class="post-tags">
|
||||||
{{ range .Params.tags }}
|
{{ range .Params.tags }}
|
||||||
#<a href="{{ (urlize (printf "tags/%s/" . )) | absLangURL }}">
|
#<a href="{{ (urlize (printf "tags/%s/" . )) | absLangURL }}">
|
||||||
{{- . -}}
|
{{- . -}}
|
||||||
</a>
|
</a>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</span>
|
</span>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
{{ partial "cover.html" . }}
|
{{ partial "cover.html" . }}
|
||||||
|
|
||||||
<div class="post-content">
|
<div class="post-content">
|
||||||
{{ if .Params.showFullContent }}
|
{{ if .Params.showFullContent }}
|
||||||
{{ .Content }}
|
{{ .Content }}
|
||||||
{{ else if .Description }}
|
{{ else if .Description }}
|
||||||
<p>{{ .Description | markdownify }}</p>
|
<p>{{ .Description | markdownify }}</p>
|
||||||
{{ else }}
|
{{ else }}
|
||||||
{{ .Summary }}
|
{{ .Summary }}
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{{ if not .Params.showFullContent }}
|
{{ if not .Params.showFullContent }}
|
||||||
<div>
|
<div>
|
||||||
<a class="read-more button inline" href="{{ .RelPermalink }}">{{ $.Site.Params.ReadMore }}</a>
|
<a class="read-more button inline" href="{{ .RelPermalink }}">[{{ $.Site.Params.ReadMore }}]</a>
|
||||||
</div>
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</article>
|
</article>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
{{ partial "pagination.html" . }}
|
{{ partial "pagination.html" . }}
|
||||||
</div>
|
</div>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
|
||||||
|
|
@ -13,9 +13,9 @@
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
{{ $menu := resources.Get "js/menu.js" | js.Build }}
|
{{ $menu := resources.Get "js/menu.js" | js.Build }}
|
||||||
{{ $prism := resources.Get "js/prism.js" | js.Build }}
|
{{ $cp := resources.Get "js/code.js" | js.Build }}
|
||||||
|
|
||||||
{{ $bundle := slice $menu $prism | resources.Concat "bundle.js" | resources.Minify }}
|
{{ $bundle := slice $menu $cp | resources.Concat "bundle.js" | resources.Minify }}
|
||||||
|
|
||||||
<script type="text/javascript" src="{{ $bundle.RelPermalink }}"></script>
|
<script type="text/javascript" src="{{ $bundle.RelPermalink }}"></script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,15 +1,16 @@
|
||||||
<div class="pagination">
|
<div class="pagination">
|
||||||
<div class="pagination__buttons">
|
<div class="pagination__buttons">
|
||||||
{{ if .Paginator.HasPrev }}
|
{{ if .Paginator.HasPrev }}
|
||||||
<a href="{{ .Paginator.Prev.URL }}" class="button prev">
|
<a href="{{ .Paginator.Prev.URL }}" class="button inline prev">
|
||||||
<span class="button__icon">←</span>
|
< [<span class="button__text">{{ $.Site.Params.newerPosts | default "Newer posts" }}</span>]
|
||||||
<span class="button__text">{{ $.Site.Params.newerPosts | default "Newer posts" }}</span>
|
|
||||||
</a>
|
</a>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
{{ if and .Paginator.HasPrev .Paginator.HasNext }}
|
||||||
|
::
|
||||||
|
{{ end }}
|
||||||
{{ if .Paginator.HasNext }}
|
{{ if .Paginator.HasNext }}
|
||||||
<a href="{{ .Paginator.Next.URL }}" class="button next">
|
<a href="{{ .Paginator.Next.URL }}" class="button inline next">
|
||||||
<span class="button__text">{{ $.Site.Params.olderPosts | default "Older posts" }}</span>
|
[<span class="button__text">{{ $.Site.Params.olderPosts | default "Older posts" }}</span>] >
|
||||||
<span class="button__icon">→</span>
|
|
||||||
</a>
|
</a>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@
|
||||||
<div class="pagination__buttons">
|
<div class="pagination__buttons">
|
||||||
{{ if .NextInSection }}
|
{{ if .NextInSection }}
|
||||||
<a href="{{ .NextInSection.Permalink }}" class="button inline prev">
|
<a href="{{ .NextInSection.Permalink }}" class="button inline prev">
|
||||||
{{ .NextInSection.Title }}
|
< [<span class="button__text">{{ .NextInSection.Title }}</span>]
|
||||||
</a>
|
</a>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
{{ if and .NextInSection .PrevInSection }}
|
{{ if and .NextInSection .PrevInSection }}
|
||||||
|
|
@ -15,7 +15,7 @@
|
||||||
{{ end }}
|
{{ end }}
|
||||||
{{ if .PrevInSection }}
|
{{ if .PrevInSection }}
|
||||||
<a href="{{ .PrevInSection.Permalink }}" class="button inline next">
|
<a href="{{ .PrevInSection.Permalink }}" class="button inline next">
|
||||||
{{ .PrevInSection.Title }}
|
[<span class="button__text">{{ .PrevInSection.Title }}</span>] >
|
||||||
</a>
|
</a>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,15 +1,16 @@
|
||||||
{{ $id := delimit (shuffle (seq 1 9)) "" }}
|
{{ $id := delimit (shuffle (seq 1 9)) "" }}
|
||||||
|
{{ $open := .Get "open" }}
|
||||||
|
{{ $lang := .Get "language" }}
|
||||||
|
{{ $opts := .Get "opts" }}
|
||||||
|
|
||||||
{{ if .Get "language" }}
|
{{- if $lang -}}
|
||||||
<div class="collapsable-code">
|
<details class="collapsable-code" {{ if eq $open "true" -}} open {{- end }}>
|
||||||
<input id="{{ .Get "id" | default $id }}" type="checkbox" {{ if ( eq ( .Get "isCollapsed" ) "true" ) -}} checked {{- end }} />
|
<summary title="Click to interact">
|
||||||
<label for="{{ .Get "id" | default $id }}">
|
{{- if .Get "title" }}<span class="collapsable-code__title">{{ .Get "title" | markdownify }}</span>{{ end -}}
|
||||||
<span class="collapsable-code__language">{{ .Get "language" }}</span>
|
</summary>
|
||||||
{{ if .Get "title" }}<span class="collapsable-code__title">{{ .Get "title" | markdownify }}</span>{{ end }}
|
{{ $trInner := trim .Inner "\n" }}
|
||||||
<span class="collapsable-code__toggle" data-label-expand="{{ .Get "expand" | default "△" }}" data-label-collapse="{{ .Get "collapse" | default "▽" }}"></span>
|
{{- transform.Highlight $trInner $lang $opts -}}
|
||||||
</label>
|
</details>
|
||||||
<pre {{ if .Get "language" }}class="language-{{ .Get "language" }}" {{ end }}><code>{{ .Inner | string }}</code></pre>
|
|
||||||
</div>
|
|
||||||
{{ else }}
|
{{ else }}
|
||||||
{{ errorf "If you want to use the \"collapsable code\" shortcode, you need to pass a mandatory \"language\" param. The issue occured in %q (%q)" .Page.File .Page.Permalink }}
|
{{ errorf "If you want to use the \"collapsable code\" shortcode, you need to pass a mandatory \"language\" param. The issue occured in %q (%q)" .Page.File .Page.Permalink }}
|
||||||
{{ end }}
|
{{- end -}}
|
||||||
|
|
|
||||||
|
|
@ -1,8 +0,0 @@
|
||||||
{{ if .Get "src" }}
|
|
||||||
<figure class="{{ with .Get "position"}}{{ . }}{{ else -}} left {{- end }}" >
|
|
||||||
<img src="{{ .Get "src" | safeURL }}" {{ with .Get "alt" }} alt="{{ . | plainify }}" {{ end }} {{ with .Get "style" }} style="{{ . | safeCSS }}" {{ end }} />
|
|
||||||
{{ if .Get "caption" }}
|
|
||||||
<figcaption class="{{ with .Get "captionPosition"}}{{ . }}{{ else -}} center {{- end }}" {{ with .Get "captionStyle" }} style="{{ . | safeCSS }}" {{ end }}>{{ .Get "caption" | safeHTML }}</figcaption>
|
|
||||||
{{ end }}
|
|
||||||
</figure>
|
|
||||||
{{ end }}
|
|
||||||
|
|
@ -1,26 +0,0 @@
|
||||||
{{ $inner := replaceRE "^\r?\n" "" .Inner | string }}
|
|
||||||
{{ if len .Params | eq 0 }}
|
|
||||||
<pre><code>{{ $inner }}</code></pre>
|
|
||||||
{{ else }}
|
|
||||||
{{ if .IsNamedParams }}
|
|
||||||
<pre class="
|
|
||||||
{{- if .Get "lang" }}language-{{ .Get "lang" }}{{ end }}
|
|
||||||
{{- if .Get "line-numbers" }} line-numbers{{ end }}
|
|
||||||
{{- if .Get "command-line" }} command-line{{ end }}"
|
|
||||||
{{- /* line highlight plugin */ -}}
|
|
||||||
{{- if .Get "line" }} data-line="{{ .Get "line" }}"{{ end }}
|
|
||||||
{{- /* line number plugin */ -}}
|
|
||||||
{{- if .Get "start" }} data-start="{{ .Get "start" }}"{{ end }}
|
|
||||||
{{- /* command-line plugin */ -}}
|
|
||||||
{{- if .Get "user" }} data-user="{{ .Get "user" }}"{{ end }}
|
|
||||||
{{- if .Get "host" }} data-host="{{ .Get "host" }}"{{ end }}
|
|
||||||
{{- if .Get "prompt" }} data-prompt="{{ .Get "prompt" }}"{{ end }}
|
|
||||||
{{- if .Get "output" }} data-output="{{ .Get "output" }}"{{ end }}
|
|
||||||
><code {{ if .Get "lang" }}class="language-{{ .Get "lang" }}"{{ end }}
|
|
||||||
>{{ $inner }}</code></pre>
|
|
||||||
{{ else }}
|
|
||||||
<pre class="language-{{ .Get 0 }}">
|
|
||||||
<code class="language-{{ .Get 0 }}">{{ $inner }}</code>
|
|
||||||
</pre>
|
|
||||||
{{ end }}
|
|
||||||
{{ end }}
|
|
||||||
5255
package-lock.json
generated
5255
package-lock.json
generated
File diff suppressed because it is too large
Load diff
|
|
@ -35,5 +35,5 @@
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"test": "echo 'Test'"
|
"test": "echo 'Test'"
|
||||||
},
|
},
|
||||||
"version": "2.1.0"
|
"version": "4.2.0"
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "terminal",
|
"name": "terminal",
|
||||||
"version": "3.1.0",
|
"version": "4.2.0",
|
||||||
"author": "Radosław Kozieł <@panr> <radoslaw.koziel@gmail.com>",
|
"author": "Radosław Kozieł <@panr> <radoslaw.koziel@gmail.com>",
|
||||||
"main": "index.js",
|
"main": "index.js",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|
|
||||||
Binary file not shown.
BIN
static/fonts/FiraCode-Latin.woff2
Normal file
BIN
static/fonts/FiraCode-Latin.woff2
Normal file
Binary file not shown.
BIN
static/fonts/FiraCode-LatinExt.woff2
Normal file
BIN
static/fonts/FiraCode-LatinExt.woff2
Normal file
Binary file not shown.
Binary file not shown.
|
|
@ -10,5 +10,4 @@ min_version = 0.90
|
||||||
|
|
||||||
[author]
|
[author]
|
||||||
name = "panr"
|
name = "panr"
|
||||||
homepage = "https://radoslawkoziel.pl"
|
homepage = "https://rkoziel.com"
|
||||||
twitter = "https://twitter.com/panr"
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue