diff --git a/css/style.css b/css/style.css
index 96ddbe1..a9bfe56 100644
--- a/css/style.css
+++ b/css/style.css
@@ -1,11 +1,11 @@
-* { margin: 0; padding: 0; box-sizing: border-box;
-
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
/* Color scheme */
-
--textcolor: #dadada;
--bgcolor: #141414;
--highlight: #ffc400;
-
}
body {
@@ -20,7 +20,6 @@ body {
}
/* ------- Sections ------- */
-
section {
padding: calc(6em + 5vw) 5vw 8vw 5vw;
/* ! Everything below is needed ! */
@@ -41,7 +40,6 @@ section#home { /* Show #home by default */
}
/* ------- Header ------- */
-
header {
padding: 5vw 5vw 0 5vw;
display: flex;
@@ -63,7 +61,6 @@ nav a:not(:last-of-type) {
}
/* ------- General ------- */
-
a {
text-decoration: none;
color: var(--highlight);
@@ -181,7 +178,6 @@ pre, textarea { /* for code samples */
}
/* Inline footnotes */
-
label {
cursor: pointer;
vertical-align: super;
@@ -220,7 +216,6 @@ figure figcaption {
}
/* Responsive video embeds */
-
figure.video {
position: relative;
padding-bottom: 56.25%; /* 16:9 */
@@ -243,7 +238,6 @@ section:target iframe {
}
/* External links */
-
a[href*="//"]:after {
font-weight: 300;
font-size: .85em;
@@ -259,6 +253,7 @@ a[href^="mailto:"]:after {
color: var(--textcolor);
opacity: .25;
}
+
a[href^="xmpp:"]:after {
font-weight: 300;
font-size: .85em;
@@ -275,7 +270,6 @@ a[href*="//"]:hover:after {
}
/* File links */
-
a:before {
font-size: .7em;
margin-right: .4em;
@@ -283,7 +277,6 @@ a:before {
}
/* Add more filetypes here if you want */
-
a[href$=".pdf"]:before { content: "pdf"; }
a[href$=".txt"]:before { content: "txt"; }
a[href$=".mp3"]:before { content: "mp3"; }
@@ -296,7 +289,6 @@ a[href$=".png"]:before { content: "img"; }
a[href$=".asc"]:before { content: "asc"; }
/* ------- News ------- */
-
article + article {
margin-top: 4.5em;
}
@@ -314,7 +306,6 @@ article time {
}
/* ------- Images Grid ------- */
-
.grid {
display: grid;
grid-gap: 5vmin;
@@ -348,7 +339,6 @@ article time {
}
/* ------- Slideshow ------- */
-
.slides {
position: fixed;
top: 0;
@@ -387,7 +377,6 @@ article time {
}
/* ------- Lightbox ------- */
-
.lightbox {
display: none;
color: var(--textcolor);
@@ -443,7 +432,6 @@ article time {
}
/* ------- Smaller screens ------- */
-
@media only screen and (max-width: 680px) {
body { font-size: 16px; }
}
@@ -453,9 +441,7 @@ article time {
}
/* ------- Print ------- */
-
@media print {
-
nav, .lightbox:target:after { display: none; }
article, figure, img {
@@ -464,13 +450,11 @@ article time {
}
/* Inline footnotes */
-
label + input + small { display: inline; }
label + input + small:before { content: "["; }
label + input + small:after { content: "]"; }
/* Slides */
-
.slides, .slides figure {
position: relative;
height: auto;
@@ -485,5 +469,4 @@ article time {
height: 100vh;
object-fit: contain;
}
-
}
diff --git a/css/style.min.css b/css/style.min.css
new file mode 100644
index 0000000..8113043
--- /dev/null
+++ b/css/style.min.css
@@ -0,0 +1 @@
+*{margin:0;padding:0;box-sizing:border-box;--textcolor:#dadada;--bgcolor:#141414;--highlight:#ffc400}body{font-size:18px;font-family:'JetBrains Mono','Input Mono',monospace;line-height:1.4;color:var(--textcolor);background:var(--bgcolor);position:relative;max-width:64em;margin:0 auto}section{padding:calc(6em + 5vw) 5vw 8vw 5vw;display:none;position:absolute;top:0;min-height:100vh;width:100%;background:var(--bgcolor)}section:target{display:block}section#home{display:block}header{padding:5vw 5vw 0 5vw;display:flex;flex-wrap:wrap;position:absolute;width:100%;z-index:2}header h1{font-size:1em;flex:1;white-space:nowrap;padding:0 5vw .5em 0}nav a:not(:last-of-type){margin-right:1.5vw}a{text-decoration:none;color:var(--highlight)}a:hover{border-bottom:1px solid}section h1{font-size:1em;margin:0 0 1em 0}h2,h3,h4{font-size:1em;font-weight:600;margin:1.6em 0 .6em 0}article,ol,p,ul{max-width:60ch;margin-bottom:.6em}ul{list-style-type:none}ul li::marker{content:"\2022 "}li{margin-bottom:.2em}ol,ul{padding-left:2ch}b,strong{font-weight:600}small{font-size:.85em}hr{height:1px;border:0;background:currentColor;opacity:.1;margin:1.2em 0}abbr{text-decoration:none}abbr[title]:hover{opacity:.7;cursor:help}blockquote{padding-left:2ch;opacity:.7;margin-bottom:.6em;position:relative}blockquote:before{content:"";position:absolute;left:0;top:.3em;bottom:.3em;background:currentColor;width:1px;opacity:.2}audio,img,svg,video{display:block;max-width:100%;height:auto;fill:currentColor}code,textarea{font-size:1em;opacity:.7}a code{opacity:1}pre,textarea{font-size:.9em;color:inherit;line-height:inherit;padding:.6em .9em;margin:.8em 0 1em 0;position:relative;display:block;width:100%;white-space:pre;border:0;border-radius:4px;background:rgba(255,255,100,.075);box-shadow:inset 1px 1px 0 rgba(0,0,0,.2),inset -1px -1px 0 rgba(0,0,0,.04)}label{cursor:pointer;vertical-align:super;line-height:1;font-size:.75em;padding-left:.1em}label:hover{color:var(--highlight)}label:before{content:"["}label:after{content:"]"}label+input,label+input+small{display:none}input:checked+small{display:block;padding:.8em 0 1em 2.5vw}figure{margin:2em 0 1.5em 0}figure figcaption{margin:.8em 0 0 0;font-size:.85em;opacity:.7}figure.video{position:relative;padding-bottom:56.25%;height:0;overflow:hidden}figure.video embed,figure.video iframe,figure.video object{position:absolute;top:0;left:0;width:100%;height:100%;border:0;visibility:hidden}section:target iframe{visibility:visible}a[href*="//"]:after{font-weight:300;font-size:.85em;content:"\2197";color:var(--textcolor);opacity:.25}a[href^="mailto:"]:after{font-weight:300;font-size:.85em;content:"\2709";color:var(--textcolor);opacity:.25}a[href^="xmpp:"]:after{font-weight:300;font-size:.85em;content:"\1F5EA";color:var(--textcolor);opacity:.25}a[href*="//"]:hover:after,a[href^="mailto:"]:hover:after,a[href^="xmpp:"]:hover:after{color:var(--highlight);opacity:1}a:before{font-size:.7em;margin-right:.4em;opacity:.75}a[href$=".pdf"]:before{content:"pdf"}a[href$=".txt"]:before{content:"txt"}a[href$=".mp3"]:before{content:"mp3"}a[href$=".zip"]:before{content:"zip"}a[href$=".rar"]:before{content:"rar"}a[href$=".gif"]:before,a[href$=".jpeg"]:before,a[href$=".jpg"]:before,a[href$=".png"]:before{content:"img"}a[href$=".asc"]:before{content:"asc"}article+article{margin-top:4.5em}article h2{font-weight:700;margin:0 0 1em 0}article time{margin-left:.6em;font-size:.8em;font-weight:400;opacity:.7}.grid{display:grid;grid-gap:5vmin;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));grid-auto-flow:dense;padding:2em 0}.grid a{position:relative;border:0}.grid a:hover{transform:scale(.975)}.grid a:before{content:"";display:block;padding-top:100%}.grid a img{position:absolute;top:0;width:100%;height:100%;object-fit:contain}.slides{position:fixed;top:0;left:0;right:0;height:100vh;overflow-y:scroll;scroll-snap-type:y mandatory}.slides figure{height:100vh;padding:0 5vw;margin:0;display:grid;place-items:center;align-content:center;scroll-snap-align:center}.slides figure img{max-height:88vh}.slides figure.cover{padding:0}.slides figure.cover img{max-height:none;position:absolute;z-index:-1;width:100vw;height:100vh;object-fit:cover}.lightbox{display:none;color:var(--textcolor)}.lightbox:target{position:fixed;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;align-content:center;background:var(--bgcolor);border:0;z-index:3}.lightbox img{max-height:100vh;z-index:4}.lightbox:target:before{content:"";height:2em;width:2em;animation:spin .8s infinite linear;border:1px solid;border-right-color:transparent;border-radius:50%;display:block;position:absolute;transform:translateX(-50%);opacity:.25}@keyframes spin{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}.lightbox:target:after{content:"\00D7";position:fixed;font-size:2em;font-weight:200;line-height:0;top:.75em;right:.5em;z-index:4}@media only screen and (max-width:680px){body{font-size:16px}}@media only screen and (max-width:540px){nav{width:100%}}@media print{.lightbox:target:after,nav{display:none}article,figure,img{page-break-inside:avoid;break-inside:avoid}label+input+small{display:inline}label+input+small:before{content:"["}label+input+small:after{content:"]"}.slides,.slides figure{position:relative;height:auto;padding:0}.slides figure img,.slides figure.cover img{max-height:auto;position:relative;z-index:1;width:auto;height:100vh;object-fit:contain}}
\ No newline at end of file
diff --git a/index.html b/index.html
index a823c5d..b6bcc10 100644
--- a/index.html
+++ b/index.html
@@ -21,7 +21,7 @@
@@ -100,6 +100,7 @@
hashbang
some random projects on my tildegit account
also github but i don't publish everything there
+ this site. you can find the source code here.