how to share html/css versions of the logo?

[argyleink]

gotta be some good ways to distribute these as native css/html. the repo currently hosts files, should we host html/css/js files, or link out, or?

[raymondsowden]

css version would be nice :)

[argyleink]

here's the CSS version, awaiting a good sharing mechanism https://codepen.io/argyleink/pen/qBegwRB

[Que-tin]

If me move them into the folders introduced by the new asset build we need to adjust the build to not recursively remove the whole folder.

[Que-tin]

Opinions on a web component?

[romainmenke]

Opinions on a web component

I think it would be unfortunate if we need JavaScript to render a logo for CSS.
So I'd rather not have it be a web component :)

[argyleink]

https://codepen.io/argyleink/pen/qBegwRB

should remove all the other logo junk and try to reduce to the smallest amount possible. also change the element name to <css-logo>

Opinions on a web component?

the codepen is a custom element, no js required, but decently self contained. we could provide an example where the CSS is in a tag inside the custom element so it's like a single file?

[itsjavi]

what about adding html and css files here (a simplified version of the codepen), and publish that as Github Pages as well? that can be easily shared.

In the HTML I would also preview the code needed to recreate the logo.

[villepreux]

Looking at the codepen (and this is very subjective), it seems to me that, at small sizes (let say for a favicon for example), the bottom-right padding could benefit from a bit more space between the logo border and the "css" text.

Would'nt it be an opportunity for a responsive logo ?
Aren't we talking about CSS after all ?

(Even quick'n'dirty mini "hacks to the Pen like margin-block-end: calc(min(2px, 10%) - .2ex); margin-inline-end: calc(min(2px, 5%) - .05ch); make it more readable to me at small sizes while nearly unaffecting the logo at bigger scales (also maybe some alteration on font weight or letter spacing would be cool))

--
My non-professional 2 cents ;)