mumble-voip / mumble-theme

A simple and modern Mumble theme.
The Unlicense
32 stars 20 forks source link

Sass variable usage #22

Open Chi-Yu opened 4 years ago

Chi-Yu commented 4 years ago

While trying to use this theme as the basis for my own variant, I came across a rather annoying issue: abuse of variables.

Example:

QCheckBox::indicator:focus:hover,
QTreeView::indicator:focus:hover,
QRadioButton::indicator:focus:hover,
QComboBox:focus:hover
{
    background-color:$button-focus-hover-bg;
    border-color:$button-focus-hover-border;
}

The naming suggests that $button-* variables are used for buttons, but they are used for many other components as well.

This leads to a situation where changing the appearance of buttons affects a dozen other elements in not predictable ways and I have to override a ton of style definitions if I follow the suggestion to not modify Base Theme.scss.

This is especially annoying since the design I'm trying to build uses a highlight color for buttons and that highlight color pops up in a dozen other places which are not supposed to be highlighted.

I'd suggest to stop using $button-* variables for anything other than buttons and introduce corresponding $input-* variables instead so the design is basically split into "buttons" and "all other input elements" just like many of today's CSS frameworks do.

xpoke commented 4 years ago

I absolutely agree - This theme was made as a personal project and not all (and many) parts of it were done incorrectly - and this is one of them. Sorry for the confusion and I hope a future version can fix it (though it might break current variants).