02/04 - Font Switch + minty.nu

This commit is contained in:
SultanOfSauce 2024-04-02 21:10:53 +02:00
parent 473838dc24
commit 2f63f93942
49 changed files with 644 additions and 44 deletions

View File

@ -19,4 +19,4 @@ I font utilizzati sono "Hidayatullah" per il titolo, e ["Heal The Web"](https://
## Link esterni
Qui link a siti esterni che magari vi voglio far conoscere.
- {{< linkedpic src="/media/l-88-2.png" link="https://leprd.minty.nu" >}}
Ainna, di [minty.nu](minty.nu) mi ha aggiunto alla lista di siti hostati su [leprd.space](leprd.space). Sul bottoncino potete raggiungere la lista e guardarvi qualche altro sito sulla lista. (Attenzione, contenuti in inglese) (Thank you Ainna! ❤️)
Ainna, di [minty.nu](https://minty.nu) mi ha aggiunto alla lista di siti hostati su [leprd.space](https://leprd.space). Sul bottoncino potete raggiungere la lista e guardarvi qualche altro sito sulla lista. (Attenzione, contenuti in inglese) (Thank you Ainna! ❤️)

View File

@ -1,5 +1,5 @@
<a {{ with .Get "link" }} href="{{ . }}"{{ end }}>
<picture>
<img {{ with .Get "src" }} src="{{ . }}"{{ end }}>
<img {{ with .Get "src" }}src="{{ . }}"{{ end }}>
</picture>
</a>

View File

@ -59,13 +59,30 @@
<p>Prima questa sezione era molto più piena. Prima o poi scriverò qualcosina in più qui.</p>
<hr>
<p>I font utilizzati sono &ldquo;Hidayatullah&rdquo; per il titolo, e <a href="https://healtheweb.site">&ldquo;Heal The Web&rdquo;</a> per il corpo ed i pulsanti. Le grafiche sono fatte da me a partire da immagini di pubblico dominio.</p>
<hr>
<h2 id="link-esterni">Link esterni</h2>
<p>Qui link a siti esterni che magari vi voglio far conoscere.</p>
<ul>
<li><a href="https://leprd.minty.nu">
<picture>
<img src="/media/l-88-2.png">
</picture>
</a>
Ainna, di <a href="https://minty.nu">minty.nu</a> mi ha aggiunto alla lista di siti hostati su <a href="https://leprd.space">leprd.space</a>. Sul bottoncino potete raggiungere la lista e guardarvi qualche altro sito sulla lista. (Attenzione, contenuti in inglese) (Thank you Ainna! ❤️)</li>
</ul>
</span>
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

57
public/css/slider.css Normal file
View File

@ -0,0 +1,57 @@
.switch {
--input-focus: var(--link);
--font-color: #191102;
--bg-color: #fff;
--main-color: #191102;
--offset: 10px;
position: fixed;
display: flex;
left: calc(200px + var(--offset));
bottom: calc(32px + var(--offset));
align-items: center;
gap: 30px;
width: 50px;
height: 20px;
}
.toggle {
opacity: 0;
width: 0;
height: 0;
}
.slider {
box-sizing: border-box;
border: 1px solid var(--main-color);
box-shadow: 0px 4px var(--main-color);
position: absolute;
cursor: var(--pointercur), pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: var(--bg-color);
transition: 0.3s;
}
.slider:before {
box-sizing: border-box;
position: absolute;
content: "";
height: 20px;
width: 20px;
border: 1px solid var(--main-color);
left: -1px;
bottom: 2px;
background-color: var(--bg-color);
box-shadow: 0 3px 0 var(--main-color);
transition: 0.3s;
}
.toggle:checked + .slider {
background-color: var(--input-focus);
}
.toggle:checked + .slider:before {
transform: translateX(30px);
}

View File

@ -1,4 +1,5 @@
@import url("button.css");
@import url("slider.css");
@import url("../fonts/hidayatullah/hidayatullah-demo.css");
@import url("../fonts/heal-the-web-a/heal-the-web-a.css");
@ -7,7 +8,7 @@
:root {
--textcolor: #191102;
--link: #A81ADB;
--defcurdark: url("../curdark/cursor-pointer-1-dark.png");
--defcur: url("../curdark/cursor-pointer-1-dark.png");
--pointercur: url("../curdark/cursor-pointer-18-dark.png");
--desertbg: url("../pix/desertile_03.png");
--sand: url("../pix/sand.png");
@ -20,13 +21,19 @@
--selcolor: #f13946;
--blockfont: a;
--font-main: Heal The Web A;
}
:root:has(#toggle:checked){
--font-main: Heal The Web B;
}
@media (prefers-color-scheme: dark) {
:root {
--textcolor: #F7F3E3;
--link: #47E8AD;
--defcurdark: url("../cur/cursor-pointer-1.png");
--defcur: url("../cur/cursor-pointer-1.png");
--pointercur: url("../cur/cursor-pointer-18.png");
--desertbg: url("../pix/deserttile_night.png");
--sand: url("../pix/sand_night.png");
@ -45,12 +52,12 @@
}
html {
cursor: var(--defcurdark), auto;
cursor: var(--defcur), auto;
min-height: 100%;
}
main {
font-family: Heal The Web A;
font-family: var(--font-main);
font-feature-settings: "ss02", "ss05";
font-size: 14pt;
-webkit-font-smoothing: none;

View File

@ -0,0 +1,9 @@
/* heal-the-web-a-regular */
@font-face {
font-family: Heal The Web A;
font-style: normal;
font-weight: 400;
src: local("Heal The Web A Regular"), local("HealTheWebA-Regular"), url(heal-the-web-a-regular.woff2) format("woff2");
font-display: swap;
}

View File

@ -0,0 +1,9 @@
/* heal-the-web-b-regular */
@font-face {
font-family: Heal The Web B;
font-style: normal;
font-weight: 400;
src: local("Heal The Web B Regular"), local("HealTheWebB-Regular"), url(heal-the-web-b-regular.woff2) format("woff2");
font-display: swap;
}

View File

@ -79,7 +79,12 @@ Da qui anche il nome del sito: <em>&ldquo;Obelisco Digitale&rdquo;</em>; che que
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

BIN
public/media/l-88-2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

View File

@ -79,7 +79,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -0,0 +1,105 @@
<!DOCTYPE html>
<html lang="it-IT">
<head><title>Obelisco Digitale - Come Va? - 10/01/24</title>
<link href="/favicon-day.ico" rel="icon" media="(prefers-color-scheme: light)">
<link href="/favicon-night.ico" rel="icon" media="(prefers-color-scheme: dark)">
<meta charset="UTF-8"/>
<link rel="stylesheet" href="/css/style.css" type="text/css">
</head>
<body><div class="nav">
<div class="topleftpic">
<a href="/">
<picture>
<source srcset="/pix/logo_night.png" media="(prefers-color-scheme: dark)">
<img src="/pix/logo.png">
</picture>
</a>
</div>
<div class="buttcontainer">
<form method="POST" action="/posts">
<button class="btn">Post</button>
</form>
</div>
<div class="buttcontainer">
<form method="POST" action="/about">
<button class="btn">About</button>
</form>
</div>
<div class="buttcontainer">
<form method="POST" action="mailto:webmaster@obeliscodigitale.online">
<button class="btn">Scrivimi</button>
</form>
</div>
</div>
<header class="maintitle content-dist">
Obelisco Digitale
</header>
<div id="clouds">
</div><main class="content-dist">
<span class="spanclass-textcur">
<section class="section">
<article>
<div class="blog__container">
<h1 class="blog__title">Come Va? - 10/01/24</h1>
<div class="blog__details">
<div class="blog__info">
<p><time style="text-transform: capitalize">mercoledì 10 gennaio 2024</time> |
3 minuti
</p>
</div>
</div>
<div class="content">
<p>Scrivo questo post un po' di tempo dall&rsquo;ultimo. Attualmente mi trovo sul treno mentre torno alla mia &ldquo;casa non casa&rdquo;. Avevo pianificato di scrivere un altro post mentre scendevo in madrepatria prima di natale, ma la mia guallera ha avuto il sopravvento e quindi, niente post.</p>
<p>Il ritorno in sé è stato blando, sorprendentemente. Per quanto l&rsquo;accoglienza dei miei parenti mi abbia fatto relativamente piacere, non ho sentito queste emozioni fortissime mentre tornavo. Sicuramente sono stato molto felice di rivedere i miei amici, soprattutto considerando la solitudine provata lontana da casa. Ho cercato di rivedere quante più persone potevo, anche se non sono riuscito a vedere tutti, considerando anche che la prima settimana del ritorno l&rsquo;ho passata ammalato. Certe volte sono una merda per come tratto chi mi sta attorno.</p>
<p>Natale l&rsquo;ho passato solo con mamma e papà. Questo significa che sia per cenone che per pranzo di Natale era tutto finito in <em>t = 1 h</em>. Con gli amici ho tenuto viva la tradizione di rigiocarmi Grezzo 2; Inseme, la piccola aggiunta di giocare il da poco uscito Grezzo 2 Due&hellip; aggiunta che ha avuto scarso successo, data l&rsquo;età del mio PC e la scarsa ottimizzazione di quel gioco. Prima o poi lo riprenderò.</p>
<p>La permanenza a casa non è stata delle migliori, ed ovviamente gli appiccichi con mia madre si sono sprecati, al livello che le ultime 3-4 notti ho dormito veramente veramente poco. Mal di testa stratosferici. Non andrò troppo nel dettaglio, dato che altrimenti direi sempre le stesse cose.</p>
<h2 id="eventi-importanti-del-periodo">Eventi importanti del periodo</h2>
<p>Due gli eventi &ldquo;importanti&rdquo;:</p>
<ol>
<li>
<p>Il 30 dicembre, mentre aprivo Steam, mi rendo conto di poter votare per i GOTY organizzati da Steam stesso. Mi metto a votare per i miei giochi preferiti nelle diverse categorie e nella categoria &ldquo;Storia più profonda&rdquo; trovo un gioco che è completamente diverso rispetto agli altri. Investigo un poco ed alla fine decido di comprarlo. Quindi, al modico prezzo di ~8 ricchissimi euro, ho acquistato su Steam il gioco cinese &ldquo;Love is all around&rdquo;, una Visual Novel Dating Sim; La cosa che mi ha principalmente attirato era il fatto che il gioco fosse <em>completamente</em> girato in Live Action, con attori ed attrici veri. Fatto sta che insieme ad i miei amici, ci siamo mangiati questo gioco, e lo abbiamo anche platinato. Spiegherò meglio in un altro post perché questo gioco mi sia piaciuto così tanto, ma due sono le lezioni importanti che ho imparato:</p>
<ol>
<li>Le storie d&rsquo;amore possono prendermi più di quanto pensassi, soprattutto se ti fanno immedesimare particolarmente;</li>
<li>Necessito di intimità.</li>
</ol>
</li>
<li>
<p>Ho constatato che quando qualcuno dell&rsquo;altro sesso mi scrive qualcosa di particolarmente gentile e/o carino, sento sempre una valanga di sentimenti arrivare, ma che non <em>dovrebbe</em> essere giustificata dalle poche parole che mi sono state dette. Do la colpa di questo al fatto che, appunto, necessito di più intimità ed in generale, forse dovrei condividere di più/meglio i miei sentimenti.</p>
</li>
</ol>
<p>Credo che oltre a questo non ci siano altri eventi degni di essere ricordati. Spero che la sessione di esami da fuorisede vada bene, anche se per ora ho fatto la bella vita. Dovrei mettermi veramente al lavoro.</p>
</div>
</div>
</article>
</section>
</span>
</main>
</body>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -0,0 +1,98 @@
<!DOCTYPE html>
<html lang="it-IT">
<head><title>Obelisco Digitale - Come Va? - 11/10/23</title>
<link href="/favicon-day.ico" rel="icon" media="(prefers-color-scheme: light)">
<link href="/favicon-night.ico" rel="icon" media="(prefers-color-scheme: dark)">
<meta charset="UTF-8"/>
<link rel="stylesheet" href="/css/style.css" type="text/css">
</head>
<body><div class="nav">
<div class="topleftpic">
<a href="/">
<picture>
<source srcset="/pix/logo_night.png" media="(prefers-color-scheme: dark)">
<img src="/pix/logo.png">
</picture>
</a>
</div>
<div class="buttcontainer">
<form method="POST" action="/posts">
<button class="btn">Post</button>
</form>
</div>
<div class="buttcontainer">
<form method="POST" action="/about">
<button class="btn">About</button>
</form>
</div>
<div class="buttcontainer">
<form method="POST" action="mailto:webmaster@obeliscodigitale.online">
<button class="btn">Scrivimi</button>
</form>
</div>
</div>
<header class="maintitle content-dist">
Obelisco Digitale
</header>
<div id="clouds">
</div><main class="content-dist">
<span class="spanclass-textcur">
<section class="section">
<article>
<div class="blog__container">
<h1 class="blog__title">Come Va? - 11/10/23</h1>
<div class="blog__details">
<div class="blog__info">
<p><time style="text-transform: capitalize">mercoledì 11 ottobre 2023</time> |
3 minuti
</p>
</div>
</div>
<div class="content">
<p>Meglio, sicuramente.</p>
<p>Finalmente sono riuscito a trasferirmi, e devo dire che dopo aver fatto quasi due settimane di vita da solo, posso dire di aver fatto una buona scelta. Mi sento più a mio agio, più calmo, non devo svegliarmi con l&rsquo;ansia la mattina col rischio di essere svegliato da mio nonno e con i limiti arbitrari imposti da mia madre. Si, ancora sto più o meno ancora sotto il pacchero, ma <em>moooooolto</em> di meno rispetto a prima.</p>
<p>Ho lasciato tutti i problemi a casa&hellip; mia nonna al telefono ha detto: &ldquo;Tǝ nǝ si &lsquo;ghiut&hellip; &lsquo;e fatt&rsquo; proprij&rsquo; buon'!&rdquo;. Si, la mia mentalità da fuggitivo ritorna. Me lo ha rinfacciato pure mia madre in un appiccico la sera prima di andarcene&hellip; uno dei peggiori appiccichi che ho mai fatto con lei, mi ha rinfacciato cose davvero brutte&hellip; non mi ha chiesto manco scusa.</p>
<p>La vita da solo si sta rivelando più facile di quanto pensassi, anche se forse con dieci giorni sotto la cintura non ho troppo modo di parlare. Insomma, ho fatto la lavatrice, mi sto cucinando, spazzo, lavo a terra, pare stia sopravvivendo. Soprattutto con la cucina, mi sto sbizzarrendo e sto facendo tutto quello che non sono riuscito a fare perché mi trovavo sotto l&rsquo;occhio vigile di mia madre.</p>
<p>L&rsquo;università inizia ad ingranare, nonostante tutti i casini burocratici dati dal trasferimento alla fine pare ce l&rsquo;abbia fatta ad iscrivermi. Sto avendo ancora difficoltà con i corsi [Quando iniziano? (Spoiler: sono già iniziati), quali devo fare?, quale prof li fa?], ma me ne sto tirando fuori tramite un sapiente uso delle mail, che nonostante io scriva a ripetizione continuo ad avere dubbi nel formularne &ndash; Reinterpretata questa frase potrebbe essere un verso di un pezzo indie &ndash; Mi hanno convalidato molti esami e pare non ne debba fare troppi.</p>
<p>Amici qui ancora devo conoscerne. Approcciare in un mondo completamente nuovo è più difficile di quanto pensassi ed i colleghi lì sono difficilini da approcciare. Inoltre devo ancora trovare modi alternativi per conoscere gente. Cosa posso fare? Riprendere a giocare a Magic o a D&amp;D? Preferirei evitare, ma se proprio devo&hellip; Potrei trovare qualche corsetto da fare ma non voglio spendere ulteriori soldi per fare qualcosa&hellip; sto cercando di andare al risparmio (Questo si applica anche al discorso Magic). Unirmi di nuovo agli scout? È un buco nero, ti prego. Non so. Insomma, se hai qualche suggerimento&hellip;</p>
<p>Prima di andare ho organizzato un festone pre-partenza. Ho invitato tutti, e la stragrande maggioranza delle persone sono venute. L&rsquo;organizzazione non è stata il massimo, e il giorno che ho organizzato ha piovuto come poche cose&hellip; Però sono stato impossibilitato nell&rsquo;organizzare un altro giorno. Ovviamente come addestrato dai miei genitori ho preso fin troppa roba per quanti eravamo ed inoltre come uno scemo non ho fatto una foto con nessuno, però alla fine son venuti in tanti e sono felice di ciò.<br>
La realizzazione di dover salutare tutti i miei amici e conoscenti prima di partire si è abbattuta su di me come un&rsquo;onda del mare che si abbatte sugli scogli. È stato improvviso, me ne sono reso conto di notte. Il bello è che comunque secondo me me ne devo ancora rendere conto al 100%. Questo ha reso i saluti un po' più difficili.<br>
Ogni sera mi sento su Discord con i ragazzi&hellip; non è lo stesso che a casa, ma almeno ne sento un po' meno la mancanza. Gli abbracci sono un&rsquo;altra cosa.</p>
<p>Il cd ormai è in uno stato di stop indefinito. Non so quando lo finirò, qui non lo posso manco più masterizzare. Lo devo chiudere però. Prima o poi.</p>
<p>Poi si, per il resto il solito. Va tutto bene.</p>
<p>A te invece?</p>
</div>
</div>
</article>
</section>
</span>
</main>
</body>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -0,0 +1,95 @@
<!DOCTYPE html>
<html lang="it-IT">
<head><title>Obelisco Digitale - Come Va? - 20/03/23</title>
<link href="/favicon-day.ico" rel="icon" media="(prefers-color-scheme: light)">
<link href="/favicon-night.ico" rel="icon" media="(prefers-color-scheme: dark)">
<meta charset="UTF-8"/>
<link rel="stylesheet" href="/css/style.css" type="text/css">
</head>
<body><div class="nav">
<div class="topleftpic">
<a href="/">
<picture>
<source srcset="/pix/logo_night.png" media="(prefers-color-scheme: dark)">
<img src="/pix/logo.png">
</picture>
</a>
</div>
<div class="buttcontainer">
<form method="POST" action="/posts">
<button class="btn">Post</button>
</form>
</div>
<div class="buttcontainer">
<form method="POST" action="/about">
<button class="btn">About</button>
</form>
</div>
<div class="buttcontainer">
<form method="POST" action="mailto:webmaster@obeliscodigitale.online">
<button class="btn">Scrivimi</button>
</form>
</div>
</div>
<header class="maintitle content-dist">
Obelisco Digitale
</header>
<div id="clouds">
</div><main class="content-dist">
<span class="spanclass-textcur">
<section class="section">
<article>
<div class="blog__container">
<h1 class="blog__title">Come Va? - 20/03/23</h1>
<div class="blog__details">
<div class="blog__info">
<p><time style="text-transform: capitalize">lunedì 20 marzo 2023</time> |
2 minuti
</p>
</div>
</div>
<div class="content">
<p>Non troppo bene.</p>
<p>Dal punto di vista dello studio sto andando <em>incredibilmente</em> a rilento, purtroppo. È una combinazione di vari fattori, primo tra tutti il fatto che questo esame è una vera e propria <em>palla</em>. Fa parte di una di quelle cose che sono carine da guardare quando <strong>non</strong> le devi studiare, ma diventa tutto più pessimo quando ti ci devi approcciare per l&rsquo;università. Inoltre devo fare un progetto con cose che non ho mai toccato prima d&rsquo;ora&hellip; e sono da solo.</p>
<p>Devo solo tirare avanti per questo semestre.</p>
<p>La situazione &ldquo;nonno&rdquo; a casa sicuramente non è delle migliori, la mia paura è come sempre quella di essere svegliato la mattina dal nonno e che in generale accadano situazioni a casa che non riuscirei a gestire. Mi sento anche un pochino inutile: da un lato vorrei aiutare, ma dall&rsquo;altro lato mi sento anche impreparato. Mio nonno viene principalmente gestito da mia nonna, il che (in maniera molto egoista) ovviamente mi fa comodo, ma dall&rsquo;altro lato ovviamente mi fa male vedere mia nonna così. Cerco di trovare un egoistico escapismo ogni tanto fuggendo la mattina ed andando da qualche parte, anche se non devo fare niente. Intanto purtroppo questa è la situazione, e devo abbracciarmi la croce. Quando poi andrò a studiare fuori potrò almeno temporaneamente allontanarmi da questa realtà.</p>
<p>Devo solo tirare avanti per questo semestre.</p>
<p>Il corso di ceramica sta andando bene incredibilmente, ed agisce decentemente da sfogo creativo. Ovviamente sono abbastanza scarso, però si va avanti a piccoli step.</p>
<p>Il cd che sto facendo? Dovrei montare le tracce audio, ma non me ne tiene. Non voglio mentire e dire che non ho tempo, alla fine procrastino fin troppo. Prima o poi lo finirò questo CD, mi ero ripromesso di farlo con tutti i crismi.</p>
<p>Poi si, per il resto il solito. Ma spero che prima o poi passerà.</p>
<p>A te invece?</p>
</div>
</div>
</article>
</section>
</span>
</main>
</body>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -95,7 +95,12 @@ Normalmente girare così sul web mi dà l&rsquo;idea di essere un esploratore in
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -123,7 +123,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -85,7 +85,12 @@ In questo caso la torta di arance che ha preparato ricade proprio in quest&rsquo
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -111,7 +111,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -96,7 +96,12 @@ A una festa data da un miliardario a Shelter Island, Kurt Vonnegut informa il su
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -97,7 +97,12 @@ Almeno a breve tornerò a casa e potrò recuperare.</p>
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -105,7 +105,12 @@ E pure auspicando di sopravvivere ad un buco nero, non c&rsquo;è fuga dal <a hr
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -91,7 +91,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -90,7 +90,12 @@ Ci siamo avventurati nel parco (che è in uno stato pietoso, ma questo è un alt
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -112,7 +112,12 @@ Meta prevista: <strong>Bracciano</strong>.</p>
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -118,7 +118,12 @@ In alcune canzoni poi, come <em>&ldquo;A wonderful world&rdquo;</em> la chitarra
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

View File

@ -213,7 +213,12 @@
</main>
</body>
<footer><div id="desert"></div>
<footer><label class="switch">
<input class="toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>
<div id="desert"></div>
</footer>
</html>

BIN
static/media/l-88-2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.5 KiB

View File

@ -9,9 +9,7 @@
{{- partial "header.html" . -}}
<main class="content-dist">
<span class="spanclass-textcur">
{{- block "main" . }}{{- end }}
</span>
</main>
</body>

View File

@ -1,5 +1,5 @@
<label class="switch">
<input class="toggle" type="checkbox" checked>
<input class="font-toggle" type="checkbox" checked>
<span class="slider"></span>
<span class="card-side"></span>
</label>

View File

@ -14,7 +14,8 @@ button.btn {
color: black;
background: #8f66d3;
border: 1px solid #000;
font-family: Heal The Web A;
font-family: var(--font-main);
font-feature-settings: var(--font-features);
font-size: 14pt;
display: inline-block;
width: 100%;

View File

@ -0,0 +1,65 @@
.switch {
--input-focus: var(--link);
--font-color: #191102;
--bg-color: #F7F3E3;
--main-color: #191102;
--offset: 10px;
position: fixed;
display: flex;
left: calc(200px + var(--offset));
bottom: calc(32px + var(--offset));
align-items: center;
gap: 30px;
width: 50px;
height: 20px;
}
.font-toggle {
opacity: 0;
width: 0;
height: 0;
}
.slider {
box-sizing: border-box;
border: 1px solid var(--main-color);
box-shadow: 0px 4px var(--main-color);
position: absolute;
cursor: var(--pointercur), pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: color-mix(
in hsl longer hue,
var(--input-focus) 50%,
black
);;
transition: 0.2s;
}
.slider:before {
box-sizing: border-box;
position: absolute;
content: "A";
text-align: center;
font-family: Heal The Web A;
height: 20px;
width: 20px;
border: 1px solid var(--main-color);
left: -1px;
bottom: 2px;
background-color: var(--bg-color);
box-shadow: 0 3px 0 var(--main-color);
transition: 0.2s;
}
.font-toggle:checked + .slider {
background-color: var(--input-focus);
}
.font-toggle:checked + .slider:before {
transform: translateX(30px);
font-family: Heal The Web B;
}

View File

@ -3,7 +3,7 @@
@import url("../fonts/hidayatullah/hidayatullah-demo.css");
@import url("../fonts/heal-the-web-a/heal-the-web-a.css");
/*@import url("../fonts/heal-the-web-b/heal-the-web-b.css");*/
@import url("../fonts/heal-the-web-b/heal-the-web-b.css");
:root {
--textcolor: #191102;
@ -20,12 +20,10 @@
--space: none;
--selcolor: #f13946;
--blockfont: a;
--font-main: Heal The Web A;
}
:root:has(#toggle:checked){
:root:has(input[type="checkbox"]:checked){
--font-main: Heal The Web B;
}
@ -58,7 +56,6 @@ html {
main {
font-family: var(--font-main);
font-feature-settings: "ss02", "ss05";
font-size: 14pt;
-webkit-font-smoothing: none;
-moz-osx-font-smoothing: grayscale;

View File

@ -5,5 +5,6 @@
font-weight: 400;
src: local("Heal The Web A Regular"), local("HealTheWebA-Regular"), url(heal-the-web-a-regular.woff2) format("woff2");
font-display: swap;
font-feature-settings: "ss02", "ss05";
}

View File

@ -5,5 +5,6 @@
font-weight: 400;
src: local("Heal The Web B Regular"), local("HealTheWebB-Regular"), url(heal-the-web-b-regular.woff2) format("woff2");
font-display: swap;
font-feature-settings: "ss01";
}