#customElement

Michael G

@g12n.de

6 days ago

Check out this very simple code example over on @codepen.io

#html #customElement #webComponent #invokerCommands
powered by #zumerlab / #snapdom

codepen.io/g12n/pen/vEX...

Danny Engelman 🌷🏍️🛥️

@engelman.nl

1 year ago

<event-count> Web Component, displaying a countdown to 2029-1-20

A year older, and wiser

Had to update the <event-count> Web Component today

Couldn't resist to add an extra default counter: event="48"

added the FlagMeister Web Component for flag effect

event-count.github.io

flagmeister.github.io

#webcomponents #webcomponent #customelement #customelements

​John

@sheek.org

1 year ago

More Web Component sleuthing 👀

looked at

-Shoelace / Webawesome
-IBM's Carbon
-Adobe's Spectrum

Things just work™

I see a path forward

With support for all vanilla JS libs + Web components, We have a rich "ecosystem" from day 1

#javascript #CustomElement #frontend #webdev #buildinpublic #UI

catapart

@catapart.bsky.social

1 year ago

Demo of a custom element that shows a mockup of a browser window

Demo of a custom element that shows a mockup of a browser, zoomed close on its tabs and address bar. The tabs are labelled "Custom" and "Tabs". The mockup also shows a custom url: "https://www.custom-urls-too.com"

Demo of a custom element that shows a mockup of a browser with additional browser mockups nested within it. One of these nested browsers shows the "minimize, maximize, and close" action buttons from the Windows operating system. The other nested browser shows the same action buttons rendered as if they were on the MacOS operating system.

Here's a little custom element I just released that looks like a web browser: github.com/catapart/mag...

Handy for things like screenshots and marketing pages.

Single js file
Available vanilla or on npm
Licensed CC0

#js #customElement #webComponent #mockup #browser

JauntyWunderKind

@jauntywk.bsky.social

1 year ago

I forgot the old dream of building a Babylon #webcomponent / #customelement, but that's there.