diff options
| author | delta <darkussdelta@gmail.com> | 2025-02-13 20:56:51 +0100 |
|---|---|---|
| committer | delta <darkussdelta@gmail.com> | 2025-02-13 20:56:51 +0100 |
| commit | 5a91b2d5b74f02791a4e426bebcf8917a29f341e (patch) | |
| tree | 4a49882c1e2c4bcb20cfa0c321da80f6ccd475a3 | |
| parent | 83842b743cdd8e4dae122ef39b5ddf77a55bb9b7 (diff) | |
| -rw-r--r-- | .zs/layout.html | 2 | ||||
| -rw-r--r-- | assets/css/main.css | 14 | ||||
| -rw-r--r-- | assets/triangle.svg | 44 |
3 files changed, 50 insertions, 10 deletions
diff --git a/.zs/layout.html b/.zs/layout.html index 1c83ff0..a686192 100644 --- a/.zs/layout.html +++ b/.zs/layout.html @@ -26,7 +26,7 @@ <body> <div id="deco"> <div id="rainbow"></div> - <div id="features"></div> + <div id="triangles"></div> </div> <div id="upper"> <nav> diff --git a/assets/css/main.css b/assets/css/main.css index c1954f0..62d2eae 100644 --- a/assets/css/main.css +++ b/assets/css/main.css @@ -60,7 +60,7 @@ body { z-index: -1; } -#features { +#triangles { content: ""; width: 200%; height: 200%; @@ -70,6 +70,13 @@ body { left: 50%; top: 50%; z-index: -2; + animation: scroll 12s linear infinite; +} + +@keyframes scroll { + to { + background-position: -96px 0; /* svg size */ + } } #rainbow { @@ -110,8 +117,11 @@ body { * failsafe for when the viewport is too small and the rainbow overlaps the text */ main > div, -footer > span { +footer, +nav > ul { background-color: var(--bg); + box-shadow: var(--bg) 0 0 32px 8px; + border-radius: var(--border-radius); } #upper { diff --git a/assets/triangle.svg b/assets/triangle.svg index 87439fc..7e960f6 100644 --- a/assets/triangle.svg +++ b/assets/triangle.svg @@ -2,9 +2,9 @@ <!-- Created with Inkscape (http://www.inkscape.org/) --> <svg - width="48" - height="48" - viewBox="0 0 12.7 12.7" + width="96" + height="96" + viewBox="0 0 25.4 25.4" version="1.1" id="svg1" xmlns="http://www.w3.org/2000/svg" @@ -12,11 +12,41 @@ <defs id="defs1" /> <g - id="layer1"> + id="layer1" + transform="matrix(0.33333334,0,0,0.33333332,4.2333331,4.2333329)" + style="fill:#0c1116;fill-opacity:1"> <path - style="fill:#0c1116;fill-opacity:1;stroke:none;stroke-width:0.661458;stroke-linecap:round;stroke-miterlimit:16;stroke-opacity:1" + style="fill:#0c1116;fill-opacity:1;stroke-width:0.661458;stroke-linecap:round;stroke-miterlimit:16" id="path1" - d="m 5.6178411,3.720292 -3.8741438,0 1.9370719,-3.35510698 z" - transform="matrix(0.81953592,0,0,0.94631856,3.3334774,4.4169186)" /> + d="M 5.6178411,3.720292 H 1.7436973 L 3.6807692,0.36518502 Z" + transform="matrix(1.6390718,0,0,1.8926372,0.3169551,2.4838372)" /> + </g> + <g + id="layer1-5" + transform="matrix(0.33333334,0,0,-0.33333332,15.08125,8.9958329)" + style="fill:#171c22;fill-opacity:1"> + <path + style="fill:#171c22;fill-opacity:1;stroke-width:1.16502;stroke-linecap:round;stroke-miterlimit:16" + id="path1-3" + d="M 15.08125,11.1125 H 8.7312506 L 11.906251,4.7624993 Z" /> + </g> + <g + id="layer1-3" + transform="matrix(0.33333334,0,0,0.33333332,16.933333,16.933335)" + style="fill:#0c1116;fill-opacity:1"> + <path + style="fill:#0c1116;fill-opacity:1;stroke-width:0.661458;stroke-linecap:round;stroke-miterlimit:16" + id="path1-7" + d="M 5.6178411,3.720292 H 1.7436973 L 3.6807692,0.36518502 Z" + transform="matrix(1.6390718,0,0,1.8926372,0.3169551,2.4838372)" /> + </g> + <g + id="layer1-5-5" + transform="matrix(0.33333334,0,0,-0.33333332,2.3812497,21.695833)" + style="fill:#171c22;fill-opacity:1"> + <path + style="fill:#171c22;fill-opacity:1;stroke-width:1.16502;stroke-linecap:round;stroke-miterlimit:16" + id="path1-3-9" + d="M 15.08125,11.1125 H 8.7312506 L 11.906251,4.7624993 Z" /> </g> </svg> |
