nvrl/narlblog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

added redraw to other sigils

Browse Source
This commit is contained in:
Nils Pukropp
2026-05-16 18:45:49 +02:00
parent 9c82e7226c
commit ed0edc4c99
1 changed files with 8 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/styles/global.css
+8 -16
View File
@@ -2085,7 +2085,8 @@ html.cybersigil body::after {
} }
/* Corner growths: swap the static mask box for the live SVG, keep the box's /* Corner growths: swap the static mask box for the live SVG, keep the box's
* size / placement / flicker opacity. Carves itself on page load. */ * size / placement / flicker opacity. Strokes carve in and wipe out forever
* (same perpetual self-redraw as the background sigil). */
.cybersigil .cs-fx-corner--sig { .cybersigil .cs-fx-corner--sig {
background: none; background: none;
-webkit-mask: none; -webkit-mask: none;
@@ -2093,8 +2094,8 @@ html.cybersigil body::after {
} }
.cybersigil .cs-fx-corner--sig .cs-sigil path, .cybersigil .cs-fx-corner--sig .cs-sigil path,
.cybersigil .cs-fx-corner--sig .cs-sigil line { .cybersigil .cs-fx-corner--sig .cs-sigil line {
animation: cs-carve 1100ms ease-out forwards; animation: cs-redraw 5.5s ease-in-out infinite;
animation-delay: calc(var(--i, 0) * 90ms); animation-delay: calc(var(--i, 0) * -0.34s);
} }
/* Selection — magenta block, bone glyph, cyan bleed. */ /* Selection — magenta block, bone glyph, cyan bleed. */
@@ -2531,16 +2532,6 @@ html.cybersigil body::after {
box-shadow: 3px 3px 0 0 var(--mauve); box-shadow: 3px 3px 0 0 var(--mauve);
text-shadow: 0 0 6px color-mix(in srgb, var(--sky) 50%, transparent); text-shadow: 0 0 6px color-mix(in srgb, var(--sky) 50%, transparent);
} }
.cybersigil .back-link::before {
content: "";
width: 1.5em;
height: 0.95em;
flex: none;
background-color: currentColor;
-webkit-mask: var(--cs-barb) center / contain no-repeat;
mask: var(--cs-barb) center / contain no-repeat;
transform: scaleX(-1);
}
.cybersigil .back-link::after { .cybersigil .back-link::after {
content: "_"; content: "_";
margin-left: -0.1em; margin-left: -0.1em;
@@ -3052,9 +3043,10 @@ html.cybersigil body::after {
transition-duration: 0.001ms !important; transition-duration: 0.001ms !important;
scroll-behavior: auto !important; scroll-behavior: auto !important;
} }
/* The looping background sigil would otherwise collapse to its hidden /* The looping sigils would otherwise collapse to their hidden end-state —
* end-state — pin it fully drawn instead so it stays visible, just still. */ * pin them fully drawn instead so they stay visible, just still. */
.cybersigil .cs-fx-wire .cs-sigil path { .cybersigil .cs-fx-wire .cs-sigil path,
.cybersigil .cs-fx-corner--sig .cs-sigil path {
animation: none !important; animation: none !important;
stroke-dashoffset: 0 !important; stroke-dashoffset: 0 !important;
} }