Not necessarily a problem, it's more of a few small suggestions
SoaringGecko opened this issue · 1 comments
Please note these suggestions all have to do with accessibility/color contrast. Also I look forward to using blueberry-css in my future projects. You've done a really nice job with this especially considering it's just one person working on it.
Dark Theme
In the dark theme instead of using the color #665eba
for the .btn
text you could use #ac9eff
or #867bdb
and then switch it to #bbadff
or #9387e8
while hovering.
For the hd's #8885ad
is perfect, though for the bodies text #b8b5df
or #918eb7
could work a little better.
I have also found that putting the background color of ::selection
to either #00445b
or #00273c
also helps a little bit with the contrast between the highlight and text, though I'm not quite so sure on this one do to it's contrast with the background color of the body and .btn
elements.
Light Theme
In the light theme using the color #665eba
for the .btn
text is actually not bad, though if you wanted it to be little better you could use #524da6
, then #434098
or #645cb8
can be used while hovering (though what you are currently using also isn't too bad of a color for this one either).
Thank you for suggestions. As of now, my implementation of dark theme is really poor. But for light theme, it is possible to override defaults by using sass/scss styles: you can set variables from _variables.scss in your own sass/scss stylesheet and importing main style (@import "@rensatsu/blueberry-css/scss/blueberry";
).
For example:
@charset "utf-8";
$color-background: #fcfcfe;
$font-family-sans: "Public SansVariable";
$font-family-mono: "IBM Plex Mono", monospace;
@import "@rensatsu/blueberry-css/scss/blueberry";