Screenshots of the themes

[sindresorhus]

Themes are visual and it's hard to get a feel for them from just a short description, so people would usually end up having to visit them all. Would be nice if the list of themes included a screenshot of each theme. Even better if they were made by scripting HyperTerm programmatically so all screenshots had the same dimensions and content.

For inspiration of how it could look, see https://github.com/sindresorhus/quick-look-plugins

[matheuss]

I like the idea, especially because sometimes is hard to describe the theme with just a few words. My only concern is that the list would get too big 😰 What do you think @bnb?

[sindresorhus]

@matheuss Could have the 5 most popular themes in the main readme and add everything else to a separate Markdown file.

[lholznagel]

How about a separate Markdown file, where all screenshots of the themes are available and in the main Markdown file a link to this file is created, so you only need to open this file when you want to see the screenshots.

[bnb]

I like the idea of a separate markdown file, with every awesome-item in README.md with an anchor to the correct theme image in the new file.

@sindresorhus Stars would be the only way I can think of to judge "most popular". Do you have other ideas?

[sindresorhus]

I like the idea of a separate markdown file, with every awesome-item in README.md with an anchor to the correct theme image in the new file.

There's going to be hundreds of themes in a year and that will not scale if everything is listed in the main readme. That's why I suggested showing the most popular ones or the prettiest ones (very subjective though) and then more in a separate file.

Stars would be the only way I can think of to judge "most popular". Do you have other ideas?

You want usage popularity, not star popularity. Look at the npm download numbers instead.

[bnb]

@sindresorhus Sorry, I don't think I communicated effectively - I was agreeing.

I was thinking along these lines:

[hyperterm-theme](https://www.npmjs.com/package/hyperterm-theme) - [View Theme](./THEME-IMAGES.md) - Dark - Awesome description

hyperterm-theme - View Theme - Dark - Awesome description

Where every theme has a hyperlink (View Theme) to the theme images file, with an anchor to the correct theme.

[sindresorhus]

I think I'm the one that didn't communicate effectively ;) I got what you meant, but I don't think it will scale even with just text links, when it grows to hundreds of themes.

[matheuss]

I like the idea of having a "Top 5" or something in the main readme, but I don't think that a separate file is necessary since one of the guidelines is:

There is a visual representation of what my plugin does in the repo

Because of that, the View Theme link could lead you to the npm/repo of the theme 😊

[bnb]

@sindresorhus Yes, as @matheuss said there is a guideline that there's a visual representation - I always check themes for embedded images and frequently use a Saved Reply when the image doesn't work correctly.

Putting a comment at the top of themes might work saying that you can follow the link to see a screenshot might work (in addition to 5 best/most popular/top themes)?

[sindresorhus]

Because of that, the View Theme link could lead you to the npm/repo of the theme

But then we're back to the user having to follow every single link to view all the themes.

To be completely clear, here's what I'm proposing in the main readme.md:

---

Themes

Showing top 5. View all.

Snazzy

Another

Yet Another

Unicorn

Rainbow

See all themes

[bnb]

Ah, okay. That looks and sounds 👍 to me.

[keplersj]

bump?

[bnb]

@keplersj Feel free to submit a PR! Would be happy to implement this 🤗 I'm just not 100% sure what the best way to do this is - pull the images from the npm repos is probably an easy bet.

Additionally, what's our best bet on determining which have the most downloads quickly, and updating when that changes? I don't want to take an instant snapshot of the best right now and then update every so often if there's a better way to do it.

[keplersj]

@bnb If I have some time this weekend I'll give it a shot

[bnb]

@keplersj Awesome - looking forward to it, if you can! 🙏

[keplersj]

@sindresorhus How did you show to color scheme at the top like you did in your screenshots?

[sindresorhus]

See: sindresorhus/hyper-snazzy#4

[iamstarkov]

is there any hyper-switch plugin to find out which themes works the best way with your code?

[iamstarkov]

smth like vs code has