Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[client] Clean up and standardize client CSS #859

Open
3 of 11 tasks
ix5 opened this issue May 4, 2022 · 0 comments
Open
3 of 11 tasks

[client] Clean up and standardize client CSS #859

ix5 opened this issue May 4, 2022 · 0 comments
Labels
client (Javascript) client code and CSS improvement Not a new feature, but makes Isso more pleasant to use needs-contributor Someone needs to implement this. Help wanted! needs-decision Architectural/Behavioral decision by maintainers needed
Milestone

Comments

@ix5
Copy link
Member

ix5 commented May 4, 2022

Since we're throwing all user-supplied style overrides overboard with the addition of isso- prefixes in #816 anyway, the upcoming 0.13 release might be a great opportunity to review and rewrite some of the CSS that's shipped on the client side.

As a reference point: This is the current CSS: isso/css/isso.css

What I see as issues:

  • Inconsistent colors (seemingly arbitrarily chosen instead of defining and using a palette)
  • Inconsistent color syntax (for instance written as either #eee, #EEE, #eeeeee, or rgba(0, 0, 0, 0.1))
  • Usage of important!
  • Way too specific selectors. They should not be necessary any more since everything is now isso--namespaced
  • Mixing of px and em units (use rem instead, see caniuse: rem), also no notion of a grid
  • Usage of calc() (bad browser support, see caniuse: calc)
  • Current preview gradient is kind of ugly (but has okay browser support, see caniuse: repeating-linear-gradient)
  • font-weight given as either numerical (700) or text (bold) value
  • No structure to stylesheet and no section headers/explanations
  • No resets (which might be a good thing to fit in better with the "host" site)

Related: #842 (comment), usage of Tailwind's color palette.

Wishlist:

  • Dark theme via media queries (or at least make dark overrides easier)
@ix5 ix5 added needs-contributor Someone needs to implement this. Help wanted! client (Javascript) client code and CSS needs-decision Architectural/Behavioral decision by maintainers needed improvement Not a new feature, but makes Isso more pleasant to use labels May 4, 2022
@ix5 ix5 added this to the 0.13 milestone May 4, 2022
@ix5 ix5 modified the milestones: 0.13, 0.14 May 24, 2022
@ix5 ix5 mentioned this issue Jun 5, 2022
5 tasks
@ix5 ix5 modified the milestones: 0.14, 0.13.1 May 9, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
client (Javascript) client code and CSS improvement Not a new feature, but makes Isso more pleasant to use needs-contributor Someone needs to implement this. Help wanted! needs-decision Architectural/Behavioral decision by maintainers needed
Projects
None yet
Development

No branches or pull requests

1 participant