dbohdan / classless-css

A list of classless CSS themes/frameworks with screenshots
1.95k stars 53 forks source link

Barrel.css? #33

Closed EternityForest closed 7 months ago

EternityForest commented 11 months ago

Working on a class-light CSS theme, would this be a good fit for inclusion? It can technically be used drop-in with OK results, but it does require a small number of simple classes for the best look.

Link:https://eternityforest.github.io/barrel.css/

image

Hacking together a quick test on the standard page looks OK if kind of dated, mostly becayse the framework expects that content goes in a .window class element for the nice background, as it's designed for apps, where you might have multiple separate windows within a main tag.

image

dbohdan commented 8 months ago

This is fit for inclusion. Requiring to add a class on a container tag is fine according to the repository's definition of "class-light". The default theme looks okay with <section id="content" container class="window paper"> (screenshot). However, other themes like Banderole look wrong (not centered or limited in width; screenshot). That's with the following HTML: screenshot-page.html. Could you debug this?

I would also suggest an addition to https://eternityforest.github.io/barrel.css/: it would help if underneath the theme-selection buttons it had a text field that showed the current theme URL that the user could copy.

EternityForest commented 8 months ago

Thank you for the feedback! I will look into debugging these test cases, they definitely seem to be important.

On Tue, Feb 6, 2024, 5:19 AM D. Bohdan @.***> wrote:

This is fit for inclusion. Requiring to add a class on a container tag is fine according to the repository's definition of "class-light". The default theme looks okay with

(screenshot https://github.com/dbohdan/classless-css/assets/3179832/25d2fbe7-ed18-4b75-b1bc-e268b73fe375). However, other themes like Banderole look wrong (not centered or limited in width; screenshot https://github.com/dbohdan/classless-css/assets/3179832/fc142770-8ef9-4551-ab50-fe036b0c06ae). That's with the following HTML: screenshot-page.html https://github.com/dbohdan/classless-css/files/14179377/screenshot-page.html.txt. Could you debug this?

I would also suggest an addition to https://eternityforest.github.io/barrel.css/: it would help if underneath the theme-selection buttons it had a text field that showed the current theme URL that the user could copy.

— Reply to this email directly, view it on GitHub https://github.com/dbohdan/classless-css/issues/33#issuecomment-1929405598, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAFZCH2HTVJCNAJLYVVHBS3YSINWNAVCNFSM6AAAAAA7FJGWJWVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTSMRZGQYDKNJZHA . You are receiving this because you authored the thread.Message ID: @.***>

EternityForest commented 7 months ago

Found the issue! The test HTML only includes the banderole theme, but not barrel.css itself. The theme CSS files are mostly variable overides. Including barrel.css and banderole in the linked test image gives the following:

Screenshot from 2024-02-13 00-56-49

dbohdan commented 7 months ago

Great. Thanks for finding the issue. I am getting proper screenshots now. I think there should be a note reminding the user to include both.

I'll add the theme soon.