In response to blip #133866

dba_afish said:
hmm...

uhh... one more thing you could try, I'd be very surprised if this worked; it's a really jank way of doing it:

svg, .nav-logo a.nav-logo-link { font-size: .67px; filter: drop-shadow(var(--color-section) -1em -1em 0) drop-shadow(var(--color-section) -1em 1em 0) drop-shadow(var(--color-section) 1em -1em 0) drop-shadow(var(--color-section) 1em 1em 0); }

the only other thing I can think of is trying to use transform: scale() or something but-- I dunno.

it's very strange to me that sub-pixel values would work for text-shadow but not this...

Font size for >=1 works, fractional doesn't
Font size has no effect

Responses

In response to blip #133867

SNPtheCat said:
Font size for >=1 works, fractional doesn't
Font size has no effect

transform:scale(2) doesn't have any effect besides resizing the icons, or none at all. But then i haven't tried very hard with it

If there is a way to duplicate an element and interact with it (we can already scale svg), it would be nice

There's feOffset, but it seems inextricably linked with feBlend and is complicated

In response to blip #133867

SNPtheCat said:
Font size for >=1 works, fractional doesn't
Font size has no effect

have you messed around with the feather/blur radius of filter:drop-shadow()? that's...

....................this value -v
{ filter: drop-shadow(black 0 0 1px) }

stacking a few of those looks alright. if you only can only use whole pixel values for that as well, you can do something like this:

svg, .nav-logo a.nav-logo-link { filter: drop-shadow(var(--color-section) 0 0 1px) drop-shadow(var(--color-section) 0 0 1px) drop-shadow(var(--color-section) 0 0 1px); }

with smaller values and more stacked shadows it looks slightly more like a clean stroke. (but again, multiple filters tends to cause lag, especially with complex SVG)