Create root

nntrn · Apr 16, 2024 · b885666 · b885666
1 parent fef49da
commit b885666
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 29 deletions.
diff --git a/_includes/root.css b/_includes/root.css
@@ -0,0 +1,24 @@
+:root {
+  --px-size: 2.5%;
+  --sans-serif: Helvetica Neue, Helvetica, Arial, sans-serif;
+  --bull-margin: 4px;
+  --bull-symbol: "•";
+  --underline-rgb: 53, 224, 71;
+  --underline-color: rgb(var(--underline-rgb));
+  --meta-rgb: 134, 25, 143;
+  --body-rgb: 34, 34, 34;
+  --link-rgb: 51, 102, 203;
+  --meta-color: rgb(var(--meta-rgb));
+  --body-color: rgb(var(--body-rgb));
+  --h: 126;
+  --s: 73.4%;
+  --l: 54%;
+  --hsl: var(--h), var(--s), var(--l);
+  --darker: hsl(var(--h), 89%, 20%);
+  --accent-color: hsl(var(--h), var(--s), var(--l));
+  --gray: hsl(0, 0%, var(--l, 80%));
+  --heart: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M13.35 20.13c-.76.69-1.93.69-2.69-.01l-.11-.1C5.3 15.27 1.87 12.16 2 8.28c.06-1.7.93-3.33 2.34-4.29c2.64-1.8 5.9-.96 7.66 1.1c1.76-2.06 5.02-2.91 7.66-1.1c1.41.96 2.28 2.59 2.34 4.29c.14 3.88-3.3 6.99-8.55 11.76z"/></svg>');
+  --svg-size: 10px;
+  --heart: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M3.25 9.75c3 3.5 4.75 4.5 4.75 4.5s1.75-1 4.75-4.5s1-7-1.5-7s-3.25 3-3.25 3s-.75-3-3.25-3s-4.5 3.5-1.5 7"/></svg>');
+  --star: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m12 17.75l-6.172 3.245l1.179-6.873l-5-4.867l6.9-1l3.086-6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z"/></svg>')
+}
diff --git a/_includes/style.css b/_includes/style.css
@@ -1,31 +1,3 @@
-:root {
-  --px-size: 2.5%;
-  --sans-serif: Helvetica Neue, Helvetica, Arial, sans-serif;
-  --bull-margin: 4px;
-  --bull-symbol: "•";
-  --underline-rgb: 53, 224, 71;
-  --underline-color: rgb(var(--underline-rgb));
-  --meta-rgb: 134, 25, 143;
-  --body-rgb: 34, 34, 34;
-  --link-rgb: 51, 102, 203;
-  --meta-color: rgb(var(--meta-rgb));
-  --body-color: rgb(var(--body-rgb));
-  --h: 126;
-  --s: 73.4%;
-  --l: 54%;
-  --hsl: var(--h), var(--s), var(--l);
-  --darker: hsl(var(--h), 89%, 20%);
-  --accent-color: hsl(var(--h), var(--s), var(--l));
-  --gray: hsl(0, 0%, var(--l, 80%));
-  --heart: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M13.35 20.13c-.76.69-1.93.69-2.69-.01l-.11-.1C5.3 15.27 1.87 12.16 2 8.28c.06-1.7.93-3.33 2.34-4.29c2.64-1.8 5.9-.96 7.66 1.1c1.76-2.06 5.02-2.91 7.66-1.1c1.41.96 2.28 2.59 2.34 4.29c.14 3.88-3.3 6.99-8.55 11.76z"/></svg>');
-  --svg-size: 10px;
-  --heart: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M3.25 9.75c3 3.5 4.75 4.5 4.75 4.5s1.75-1 4.75-4.5s1-7-1.5-7s-3.25 3-3.25 3s-.75-3-3.25-3s-4.5 3.5-1.5 7"/></svg>');
-  --star: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m12 17.75l-6.172 3.245l1.179-6.873l-5-4.867l6.9-1l3.086-6.253l3.086 6.253l6.9 1l-5 4.867l1.179 6.873z"/></svg>')
-}
-.heart{--svg:var(--heart);--svg-color:#f43f5e}
-.star{--svg:var(--star);--svg-color:#eab308}
-i{all:unset;display:inline-flex;align-items:center;font-style:normal}
-i:before{background-color:var(--svg-color);width:var(--svg-size);height:var(--svg-size);-webkit-mask:var(--svg);mask:var(--svg);margin-right:1px;content:''}
 *{box-sizing:border-box}
 .hidden,[hidden]{display:none!important}
 html{font-size:13px}
@@ -97,7 +69,7 @@ strong{--darker:#222;color:var(--darker)}
 .postlist ul{display:inline-flex;gap:.4rem;position:relative;position:sticky;top:0;line-height:1.3;font-size:.925rem}
 .chapters{display:flex;flex-direction:column;gap:4rem;margin:2.5rem 0;margin-bottom:1rem}
 .chapters ul{position:relative;margin:0 0}
-.chapters ul[data-label]:before{font-size:1.3rem;content:attr(data-label);margin:0 0;padding:0 0;position:absolute;left:0;margin-top:-2.5rem;font-family:times;font-weight:700}
+.chapters ul[data-label]:before{font-size:1.2rem;content:attr(data-label);margin:0 0;padding:0 0;/*! position:absolute; *//*! left:0; */margin-top:-2.5rem;font-family:times;font-weight:700;margin-left:-1.25rem}
 .chapters{flex:1}
 .right{text-align:right}
 .subtitle{font-family:var(--sans-serif);font-weight:400}
@@ -109,6 +81,10 @@ strong{--darker:#222;color:var(--darker)}
 .site-title a:hover{text-decoration-color:var(--accent-color)}
 .up{text-transform:uppercase}
 [id]>a:hover:after{content:"#";color:#aaa}
+.heart{--svg:var(--heart);--svg-color:#f43f5e}
+.star{--svg:var(--star);--svg-color:#eab308}
+i{all:unset;display:inline-flex;align-items:center;font-style:normal}
+i:before{background-color:var(--svg-color);width:var(--svg-size);height:var(--svg-size);-webkit-mask:var(--svg);mask:var(--svg);margin-right:1px;content:''}
 @media (max-width:600px){
 .container{flex-direction:column}
 .sm-col{flex-direction:column}

diff --git a/_layouts/default.html b/_layouts/default.html
@@ -25,6 +25,7 @@
   <meta name="twitter:title" content="{{ page.title | default: site.title }}">
   <meta name="twitter:description" content="{{ page.description | default: site.description }}">
   <style>
+  {% include root.css %}
   {% include style.css %}
   </style>
 </head>