BenDMyers / showmy.chat

On-demand themed Twitch chat overlay generator

Home Page:https://showmy.chat

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

A "kitchen-sink" page for themes

NickyMeuleman opened this issue · comments

While developing the advent-of-code theme, I used the DEMO query param.
While that flow is fine, tweaking styles for specific parts was kind of a chore and involved waiting until the type of chatmessage I was currently tweaking appeared randomly (like an @ mention, an emote use, a VIP chat, ...). Repeating this cycle every time I saved a change in my editor, as the page would reload.

Would a type of "kitchen-sink" page be useful?
I'm imagining a page where every/(most) type of DOM element that needs to be styled exists.
It might also be (optionally) static, as the messages I was tweaking scrolling off screen was also a point of annoyance (lessened by opening the devtools and entering debugger once the message I wanted showed up. Then making CSS in browser to prevent the page from reloading).

As an added benefit, this might also serve as a cool meta image if that page is shared on social platforms.

I love this idea! +1 from me!

Naming things is hard, but what would we say to calling this page /sandbox?

Alternatively, we could do something like: /themes/animalese, /themes/advent-of-code. Hmmm... stuff to think about.

How should this page look?

The idea I had was exactly like the DEMO page, but static, and with a bunch of different messages.
For URL, not sure, naming is indeed hard 😅 Maybe /showcase?theme=default ? Or your /themes/default suggestion.

I was coming at this from a theme development perspective, and in that case, some tools like Storybook might also be used. Not sure how the vanillaJS story is there.

edit: #69 addresses this, but not quite how it was worded here.
It allows the DEMO query parameter to be "static" so the page doesn't move, but still respects all other query parameters.
The shown messages are still random, so they change on each page refresh.

This is useful (I'm very biased since I made that PR :D), yet I still think a way to see a bunch of different message possibilities would be very useful.
I'm not linking this issue to that PR, and hope a contributer (new or existing!) wants to work on making this happen!