new dark theme and other fancy css things :3
This commit is contained in:
parent
40079b00e1
commit
83ae258545
GPG key ID:
CF99829C92678188
2
.gitignore
vendored
Normal file
2
.gitignore
vendored
Normal file
|
|
@ -0,0 +1,2 @@
|
||||||
|
**/.DS_Store
|
||||||
|
docker-compose.yml
|
||||||
BIN
public/img/favicon.png
Normal file
BIN
public/img/favicon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 15 KiB |
35
public/img/icon-dark.svg
Normal file
35
public/img/icon-dark.svg
Normal file
|
|
@ -0,0 +1,35 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg width="100%" height="100%" viewBox="0 0 1000 1000" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
||||||
|
<g transform="matrix(1,0,0,1,-1200,-1200)">
|
||||||
|
<g id="bliss-town-logo--favicon-" serif:id="bliss town logo (favicon)" transform="matrix(1.95312,0,0,1.95312,1200,1200)">
|
||||||
|
<rect x="0" y="0" width="512" height="512" style="fill:none;"/>
|
||||||
|
<g id="dark-tent" serif:id="dark tent" transform="matrix(1.18542,0,0,1.18542,-37.5683,-13.3362)">
|
||||||
|
<g transform="matrix(-0.512,0,0,0.512,496.93,0)">
|
||||||
|
<path d="M680.488,403.19C687.352,403.19 693.531,407.347 696.117,413.705C717.314,465.82 811.533,697.461 847.668,786.3C850.842,794.103 849.925,802.973 845.223,809.962C840.52,816.951 832.649,821.142 824.225,821.142L450.351,821.142C443.488,821.142 437.309,816.985 434.723,810.628C416.587,766.039 344.999,590.036 302.068,484.489C294.663,466.283 296.801,445.585 307.773,429.277C318.745,412.969 337.112,403.19 356.767,403.19C463.491,403.19 635.036,403.19 680.488,403.19Z" style="fill:rgb(56,34,102);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(-0.512,0,0,0.512,496.93,0)">
|
||||||
|
<path d="M668.83,503.824L797.897,821.142L492.566,821.142L668.83,503.824Z" style="fill:url(#_Linear1);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.512,0,0,0.512,-4.19671,0)">
|
||||||
|
<path d="M646.434,403.19C673.887,403.19 698.604,419.82 708.947,445.25C744.396,532.401 824.857,730.218 852.392,797.914C854.508,803.116 853.897,809.03 850.762,813.689C847.627,818.348 842.379,821.142 836.763,821.142L484.406,821.142C456.953,821.142 432.236,804.513 421.892,779.083C386.735,692.646 307.3,497.352 279.136,428.11C276.866,422.529 277.522,416.185 280.885,411.186C284.248,406.188 289.878,403.19 295.903,403.19L646.434,403.19Z" style="fill:rgb(129,95,226);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.190522,0,0,0.190522,177.573,186.558)">
|
||||||
|
<path d="M569.819,403.19C643.594,403.19 710.017,447.88 737.814,516.219C769.514,594.156 810.465,694.836 836.45,758.72C842.136,772.699 840.493,788.591 832.069,801.112C823.645,813.634 809.542,821.142 794.451,821.142C731.798,821.142 636.975,821.142 561.021,821.142C487.246,821.142 420.822,776.452 393.026,708.113C361.325,630.176 320.375,529.497 294.39,465.613C288.704,451.633 290.346,435.741 298.771,423.22C307.195,410.699 321.297,403.19 336.389,403.19C399.042,403.19 493.865,403.19 569.819,403.19Z" style="fill:rgb(253,220,120);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.362039,0.362039,-0.362039,0.362039,278.932,-108.178)">
|
||||||
|
<path d="M518,551L518,580C518,583.863 514.863,587 511,587C507.137,587 504,583.863 504,580L504,551C504,547.137 507.137,544 511,544C514.863,544 518,547.137 518,551ZM549.968,547.039L549.968,576.039C549.968,579.903 546.832,583.039 542.968,583.039C539.105,583.039 535.968,579.903 535.968,576.039L535.968,547.039C535.968,543.176 539.105,540.039 542.968,540.039C546.832,540.039 549.968,543.176 549.968,547.039Z" style="fill:rgb(133,108,55);"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.336714,-0.1285,0.1285,0.336714,-56.0946,-40.8209)">
|
||||||
|
<path d="M521.094,757.571C479.419,798.251 422.449,823.332 359.668,823.332C232.084,823.332 128.502,719.75 128.502,592.166C128.502,464.582 232.084,361 359.668,361C401.161,361 440.115,371.956 473.794,391.13C376.69,396.808 299.585,477.459 299.585,575.976C299.585,678.172 382.555,761.142 484.751,761.142C497.188,761.142 509.341,759.914 521.094,757.571Z" style="fill:rgb(225,222,227);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.373608,0,0,0.373608,-57.9461,-34.9014)">
|
||||||
|
<path d="M815.5,213L835.082,265.918L888,285.5L835.082,305.082L815.5,358L795.918,305.082L743,285.5L795.918,265.918L815.5,213ZM1311.4,268.114L1327.07,310.448L1369.4,326.114L1327.07,341.779L1311.4,384.114L1295.74,341.779L1253.4,326.114L1295.74,310.448L1311.4,268.114ZM1053.3,358L1076.8,421.502L1140.3,445L1076.8,468.498L1053.3,532L1029.8,468.498L966.3,445L1029.8,421.502L1053.3,358Z" style="fill:rgb(225,222,227);"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<defs>
|
||||||
|
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-259.563,112.523,-116.94,-269.753,752.129,708.619)"><stop offset="0" style="stop-color:rgb(37,22,66);stop-opacity:1"/><stop offset="0.44" style="stop-color:rgb(102,81,82);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(253,220,120);stop-opacity:1"/></linearGradient>
|
||||||
|
</defs>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 4.8 KiB |
29
public/img/icon-light.svg
Normal file
29
public/img/icon-light.svg
Normal file
|
|
@ -0,0 +1,29 @@
|
||||||
|
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||||
|
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
|
||||||
|
<svg width="100%" height="100%" viewBox="0 0 1000 1000" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
|
||||||
|
<g transform="matrix(1,0,0,1,-1200,0)">
|
||||||
|
<g id="bliss-town-logo--favicon-" serif:id="bliss town logo (favicon)" transform="matrix(1.95312,0,0,1.95312,1200,0)">
|
||||||
|
<rect x="0" y="0" width="512" height="512" style="fill:none;"/>
|
||||||
|
<g id="light-tent" serif:id="light tent" transform="matrix(1.18542,0,0,1.18542,-37.5683,-13.3362)">
|
||||||
|
<g transform="matrix(-0.512,0,0,0.512,496.93,0)">
|
||||||
|
<path d="M680.488,403.19C687.352,403.19 693.531,407.347 696.117,413.705C717.314,465.82 811.533,697.461 847.668,786.3C850.842,794.103 849.925,802.973 845.223,809.962C840.52,816.951 832.649,821.142 824.225,821.142L450.351,821.142C443.488,821.142 437.309,816.985 434.723,810.628C416.587,766.039 344.999,590.036 302.068,484.489C294.663,466.283 296.801,445.585 307.773,429.277C318.745,412.969 337.112,403.19 356.767,403.19C463.491,403.19 635.036,403.19 680.488,403.19Z" style="fill:rgb(96,105,44);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(-0.512,0,0,0.512,496.93,0)">
|
||||||
|
<path d="M668.83,503.824L797.897,821.142L492.566,821.142L668.83,503.824Z" style="fill:rgb(66,72,29);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.512,0,0,0.512,-4.19671,0)">
|
||||||
|
<path d="M646.434,403.19C673.887,403.19 698.604,419.82 708.947,445.25C744.396,532.401 824.857,730.218 852.392,797.914C854.508,803.116 853.897,809.03 850.762,813.689C847.627,818.348 842.379,821.142 836.763,821.142L484.406,821.142C456.953,821.142 432.236,804.513 421.892,779.083C387.175,693.727 309.281,502.222 280.217,430.768C277.705,424.592 278.431,417.571 282.152,412.039C285.874,406.507 292.105,403.19 298.772,403.19L646.434,403.19Z" style="fill:rgb(143,154,75);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.190522,0,0,0.190522,177.573,186.558)">
|
||||||
|
<path d="M569.819,403.19C643.594,403.19 710.017,447.88 737.814,516.219C769.514,594.156 810.465,694.836 836.45,758.72C842.136,772.699 840.493,788.591 832.069,801.112C823.645,813.634 809.542,821.142 794.451,821.142C731.798,821.142 636.975,821.142 561.021,821.142C487.246,821.142 420.822,776.452 393.026,708.113C361.325,630.176 320.375,529.497 294.39,465.613C288.704,451.633 290.346,435.741 298.771,423.22C307.195,410.699 321.297,403.19 336.389,403.19C399.042,403.19 493.865,403.19 569.819,403.19Z" style="fill:rgb(244,255,174);"/>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.362039,0.362039,-0.362039,0.362039,278.932,-108.178)">
|
||||||
|
<path d="M518,551L518,580C518,583.863 514.863,587 511,587C507.137,587 504,583.863 504,580L504,551C504,547.137 507.137,544 511,544C514.863,544 518,547.137 518,551ZM549.968,547.039L549.968,576.039C549.968,579.903 546.832,583.039 542.968,583.039C539.105,583.039 535.968,579.903 535.968,576.039L535.968,547.039C535.968,543.176 539.105,540.039 542.968,540.039C546.832,540.039 549.968,543.176 549.968,547.039Z" style="fill:rgb(158,170,85);"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
<g transform="matrix(0.520285,-0.520285,0.520285,0.520285,-132.858,246.484)">
|
||||||
|
<path d="M407.051,178.103C407.051,133.978 442.875,98.154 487,98.154C531.125,98.154 566.949,133.978 566.949,178.103C611.073,178.103 646.897,213.927 646.897,258.051C646.897,302.176 611.073,338 566.949,338L407.051,338L407.051,178.103Z" style="fill:rgb(50,46,31);"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 3.8 KiB |
|
|
@ -3,10 +3,11 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" value="width=device-width, initial-scale=1">
|
<meta name="viewport" value="width=device-width, initial-scale=1">
|
||||||
<title>🏕️ bliss.town</title>
|
<title>bliss town</title>
|
||||||
|
<link rel="icon" type="image/x-icon" href="/img/favicon.png">
|
||||||
|
|
||||||
<meta property="og:site_name" content="🏕️ bliss.town" />
|
<meta property="og:site_name" content="🏕️ bliss town" />
|
||||||
<meta property="og:title" content="welcome to bliss.town!" />
|
<meta property="og:title" content="welcome to bliss town!" />
|
||||||
<meta property="og:type" content="website" />
|
<meta property="og:type" content="website" />
|
||||||
<meta property="og:url" content="https://bliss.town" />
|
<meta property="og:url" content="https://bliss.town" />
|
||||||
|
|
||||||
|
|
@ -18,12 +19,20 @@
|
||||||
<header>
|
<header>
|
||||||
<nav>
|
<nav>
|
||||||
<a href="/">home</a>
|
<a href="/">home</a>
|
||||||
|
<span aria-hidden="true">-</span>
|
||||||
<a href="/links">links</a>
|
<a href="/links">links</a>
|
||||||
|
<span aria-hidden="true">-</span>
|
||||||
<a href="/paste">paste</a>
|
<a href="/paste">paste</a>
|
||||||
|
<span aria-hidden="true">-</span>
|
||||||
|
<a href="https://git.arimelody.me/ari/bliss.town" target="_blank">source</a>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<h1><span aria-hidden="true">🏕️</span><br>welcome to bliss.town!</h1>
|
<div class="title-icon">
|
||||||
|
<img src="/img/icon-light.svg" class="icon-light" width=64 height=64 />
|
||||||
|
<img src="/img/icon-dark.svg" class="icon-dark" width=64 height=64 />
|
||||||
|
</div>
|
||||||
|
<h1>welcome to bliss<span class="col-primary-bg">.</span>town!</h1>
|
||||||
<hr>
|
<hr>
|
||||||
<p>
|
<p>
|
||||||
we're not hosting much at this domain just yet.
|
we're not hosting much at this domain just yet.
|
||||||
|
|
@ -32,10 +41,9 @@
|
||||||
</p>
|
</p>
|
||||||
</main>
|
</main>
|
||||||
<footer>
|
<footer>
|
||||||
<p>made with <span role="img" aria-label="love">♥ by <a href="https://arimelody.me">ari</a>, 2024</p>
|
<p>
|
||||||
<div id="footer-links">
|
made with <span role="img" aria-label="love">♥</span> by <a href="https://arimelody.me">ari</a>, 2024.
|
||||||
<a href="https://git.arimelody.me/ari/bliss.town">source</a>
|
</p>
|
||||||
</div>
|
|
||||||
</footer>
|
</footer>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -3,10 +3,11 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" value="width=device-width, initial-scale=1">
|
<meta name="viewport" value="width=device-width, initial-scale=1">
|
||||||
<title>🔗 bliss.town shortlinks</title>
|
<title>shortlinks - bliss town</title>
|
||||||
|
<link rel="icon" type="image/x-icon" href="/img/favicon.png">
|
||||||
|
|
||||||
<meta property="og:site_name" content="🏕️ bliss.town" />
|
<meta property="og:site_name" content="bliss town" />
|
||||||
<meta property="og:title" content="bliss.town shortlinks" />
|
<meta property="og:title" content="bliss town shortlinks" />
|
||||||
<meta property="og:type" content="website" />
|
<meta property="og:type" content="website" />
|
||||||
<meta property="og:url" content="https://bliss.town/links" />
|
<meta property="og:url" content="https://bliss.town/links" />
|
||||||
|
|
||||||
|
|
@ -18,12 +19,16 @@
|
||||||
<header>
|
<header>
|
||||||
<nav>
|
<nav>
|
||||||
<a href="/">home</a>
|
<a href="/">home</a>
|
||||||
|
<span aria-hidden="true">-</span>
|
||||||
<a href="/links">links</a>
|
<a href="/links">links</a>
|
||||||
|
<span aria-hidden="true">-</span>
|
||||||
<a href="/paste">paste</a>
|
<a href="/paste">paste</a>
|
||||||
|
<span aria-hidden="true">-</span>
|
||||||
|
<a href="https://git.arimelody.me/ari/bliss.town" target="_blank">source</a>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<h1><span aria-hidden="true">🔗</span><br>bliss.town shortlinks</h1>
|
<h1><span aria-hidden="true">🔗</span><br>bliss<span class="col-primary-bg">.</span>town shortlinks</h1>
|
||||||
<hr>
|
<hr>
|
||||||
<p>
|
<p>
|
||||||
we run an invite-only shortlink service, <code>link.bliss.town</code>,
|
we run an invite-only shortlink service, <code>link.bliss.town</code>,
|
||||||
|
|
@ -32,10 +37,9 @@
|
||||||
</p>
|
</p>
|
||||||
</main>
|
</main>
|
||||||
<footer>
|
<footer>
|
||||||
<p>made with <span role="img" aria-label="love">♥ by <a href="https://arimelody.me">ari</a>, 2024</p>
|
<p>
|
||||||
<div id="footer-links">
|
made with <span role="img" aria-label="love">♥</span> by <a href="https://arimelody.me">ari</a>, 2024.
|
||||||
<a href="https://git.arimelody.me/ari/bliss.town">source</a>
|
</p>
|
||||||
</div>
|
|
||||||
</footer>
|
</footer>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -3,10 +3,11 @@
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" value="width=device-width, initial-scale=1">
|
<meta name="viewport" value="width=device-width, initial-scale=1">
|
||||||
<title>📝 bliss.town pastebin</title>
|
<title>pastebin - bliss town</title>
|
||||||
|
<link rel="icon" type="image/x-icon" href="/img/favicon.png">
|
||||||
|
|
||||||
<meta property="og:site_name" content="🏕️ bliss.town" />
|
<meta property="og:site_name" content="bliss town" />
|
||||||
<meta property="og:title" content="bliss.town pastebin" />
|
<meta property="og:title" content="bliss town pastebin" />
|
||||||
<meta property="og:type" content="website" />
|
<meta property="og:type" content="website" />
|
||||||
<meta property="og:url" content="https://bliss.town/paste" />
|
<meta property="og:url" content="https://bliss.town/paste" />
|
||||||
|
|
||||||
|
|
@ -18,12 +19,16 @@
|
||||||
<header>
|
<header>
|
||||||
<nav>
|
<nav>
|
||||||
<a href="/">home</a>
|
<a href="/">home</a>
|
||||||
|
<span aria-hidden="true">-</span>
|
||||||
<a href="/links">links</a>
|
<a href="/links">links</a>
|
||||||
|
<span aria-hidden="true">-</span>
|
||||||
<a href="/paste">paste</a>
|
<a href="/paste">paste</a>
|
||||||
|
<span aria-hidden="true">-</span>
|
||||||
|
<a href="https://git.arimelody.me/ari/bliss.town" target="_blank">source</a>
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<h1><span aria-hidden="true">📝</span><br>bliss.town pastebin</h1>
|
<h1><span aria-hidden="true">📝</span><br>bliss<span class="col-primary-bg">.</span>town pastebin</h1>
|
||||||
<hr>
|
<hr>
|
||||||
<p>
|
<p>
|
||||||
we run a public pastebin instance, <a href="https://paste.bliss.town"><code>paste.bliss.town</code></a>,
|
we run a public pastebin instance, <a href="https://paste.bliss.town"><code>paste.bliss.town</code></a>,
|
||||||
|
|
@ -32,10 +37,9 @@
|
||||||
</p>
|
</p>
|
||||||
</main>
|
</main>
|
||||||
<footer>
|
<footer>
|
||||||
<p>made with <span role="img" aria-label="love">♥ by <a href="https://arimelody.me">ari</a>, 2024</p>
|
<p>
|
||||||
<div id="footer-links">
|
made with <span role="img" aria-label="love">♥</span> by <a href="https://arimelody.me">ari</a>, 2024.
|
||||||
<a href="https://git.arimelody.me/ari/bliss.town">source</a>
|
</p>
|
||||||
</div>
|
|
||||||
</footer>
|
</footer>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -1,16 +1,18 @@
|
||||||
@import url("/font/lora/lora-font.css");
|
@import url("/font/lora/lora-font.css");
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
--foreground: #28261f;
|
--foreground: #322e1f;
|
||||||
--background: #f9f1db;
|
--background: #f9f1db;
|
||||||
--primary: #92a40a;
|
--primary-fg: #92a40a;
|
||||||
|
--primary-bg: #c4ce7e;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (prefers-color-scheme: dark) {
|
@media screen and (prefers-color-scheme: dark) {
|
||||||
:root {
|
:root {
|
||||||
--foreground: #f9f1db;
|
--foreground: #e2dfe3;
|
||||||
--background: #28261f;
|
--background: #1b141e;
|
||||||
--primary: #d9e679;
|
--primary-fg: #cda1ec;
|
||||||
|
--primary-bg: #513d60;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -24,9 +26,9 @@ header nav {
|
||||||
font-size: .8em;
|
font-size: .8em;
|
||||||
}
|
}
|
||||||
|
|
||||||
header nav a:not(:first-child)::before {
|
header nav span {
|
||||||
content: '-';
|
margin: 0 .8em;
|
||||||
margin: 0 .8em 0 .5em;
|
color: var(--primary-fg);
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
|
|
@ -48,6 +50,8 @@ body {
|
||||||
|
|
||||||
color: var(--foreground);
|
color: var(--foreground);
|
||||||
background-color: var(--background);
|
background-color: var(--background);
|
||||||
|
|
||||||
|
transition: color .2s linear, background-color .2s linear;
|
||||||
}
|
}
|
||||||
|
|
||||||
main {
|
main {
|
||||||
|
|
@ -55,6 +59,31 @@ main {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.title-icon {
|
||||||
|
width: 64px;
|
||||||
|
margin: 1em auto -1em auto;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title-icon img {
|
||||||
|
transition: opacity .2s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title-icon img.icon-dark {
|
||||||
|
position: relative;
|
||||||
|
left: -64px;
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (prefers-color-scheme: dark) {
|
||||||
|
.title-icon img.icon-light {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
.title-icon img.icon-dark {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
hr {
|
hr {
|
||||||
margin: 2rem 0;
|
margin: 2rem 0;
|
||||||
border-width: 1px 0 0 0;
|
border-width: 1px 0 0 0;
|
||||||
|
|
@ -62,24 +91,88 @@ hr {
|
||||||
hr::after {
|
hr::after {
|
||||||
content: "✦";
|
content: "✦";
|
||||||
position: absolute;
|
position: absolute;
|
||||||
transform: translate(-50%, -50%);
|
transform: translate(-50%, -54.5%);
|
||||||
background: var(--background);
|
|
||||||
color: var(--foreground);
|
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
|
color: var(--foreground);
|
||||||
|
background: var(--background);
|
||||||
|
transition: color .2s linear, background-color .2s linear;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
color: var(--primary);
|
color: var(--primary-fg);
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
|
transition: color .2s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
padding: .5em 1.2em;
|
||||||
|
font-size: .8em;
|
||||||
|
font-family: inherit;
|
||||||
|
font-weight: bold;
|
||||||
|
color: var(--foreground);
|
||||||
|
background-color: var(--primary-bg);
|
||||||
|
border: none;
|
||||||
|
border-radius: 2em;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: color .2s linear, background-color .2s linear, transform .1s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
button:hover {
|
||||||
|
transform: scale(1.05);
|
||||||
|
}
|
||||||
|
|
||||||
|
button:active {
|
||||||
|
transform: scale(0.95);
|
||||||
}
|
}
|
||||||
|
|
||||||
footer {
|
footer {
|
||||||
width: min(900px, calc(100vw - 4rem));
|
width: min(900px, calc(100vw - 4rem));
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
opacity: .5;
|
||||||
|
transition: opacity .1s ease-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
footer:hover {
|
||||||
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
#footer-links {
|
#footer-links {
|
||||||
font-size: .8em;
|
font-size: .8em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
[class^="col-"] {
|
||||||
|
transition: color .2s linear;
|
||||||
|
}
|
||||||
|
[class^="bg-"] {
|
||||||
|
transition: background-color .2s linear;
|
||||||
|
}
|
||||||
|
.col-fg {
|
||||||
|
color: var(--foreground);
|
||||||
|
}
|
||||||
|
.bg-fg {
|
||||||
|
background-color: var(--foreground);
|
||||||
|
}
|
||||||
|
.col-bg {
|
||||||
|
color: var(--background);
|
||||||
|
}
|
||||||
|
.bg-bg {
|
||||||
|
background-color: var(--background);
|
||||||
|
}
|
||||||
|
.col-primary-fg {
|
||||||
|
color: var(--primary-fg);
|
||||||
|
}
|
||||||
|
.bg-primary-fg {
|
||||||
|
background-color: var(--primary-fg);
|
||||||
|
}
|
||||||
|
.col-primary-bg {
|
||||||
|
color: var(--primary-bg);
|
||||||
|
}
|
||||||
|
.bg-primary-bg {
|
||||||
|
background-color: var(--primary-bg);
|
||||||
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue