More readable tables and lists: Alternate row background colors #4230
Conversation
…rdless of theme A few CSS selectors affecting table and list row coloring were moved the dark theme stylesheet (theme-dark.css) to the common stylesheet (bisq.css). These selectors are theme-independent, since they re-use variables defined in each theme stylesheet (like -bs-background-color). Therefore a more appropriate place for them is in the common stylesheet. This move means that alternating row background colors are now available for all tables and lists, in all views, in both dark and light themes.
The same styling as for a selected row, is applied for a hovered row. This makes the UI more intuitive, helping users better navigate through and focus on specific rows, especially in large tables.
cd2357
changed the title
cd2357
changed the title
|
Here are some screenshots. Before:
After:
|
|
For "not full tables" it look in my opinion little bit akward
Maybe not to use stripes for empty rows? |
| @@ -867,6 +891,32 @@ textfield */ | |||
| * Table * | |||
| * * | |||
| ******************************************************************************/ | |||
| .table-view .table-row-cell:even .table-cell { | |||
| -fx-background-color: derive(-bs-background-color, 5%); | |||
| -fx-border-color: derive(-bs-background-color,5%); | |||
There was a problem hiding this comment.
Maybe nitpicky, but there is whitespace inconsistency :)
There was a problem hiding this comment.
I agree, just run some auto formatter on the code to get spacing uniform. It's a small thing but someone will do it later and there will be changes in an unrelated PR.
Apart from that I'm good to merge this PR.
|
I would personally make it less "sharp" by lowering Here is how it looks like with
|
|
Concept ACK |
Would potentially make sense, but it's not related to my change. To achieve that, table model logic would have to be changed to remove specific CSS classes from rows if they are empty. That' most likely custom java logic that has to be done for every table. This PR is only about bringing a dark-theme behavior (showing odd/even rows as having different colors) also into the light-theme. So I would say, to keep PRs conceptually separated, that change should be covered in a different PR (especially since it affects both dark and light themes -- this PR only fixes some CSS tags in the light theme). |
Yes, would be worth exploring. But perhaps in a separate PR (see comment above). I tried to keep this PR specifically about bringing a dark-theme-only behavior (alterate row colors) to both dark and light themes. |
|
In that case it would have been great to get @pedromvpg's feedback before merging, as he did this by intent as far as I remember. Anyways I'll leave it in for this release and we might make an adaption in the next release. |
Alternate row background colors are now available, regardless of theme.
A few CSS selectors affecting table and list row coloring were moved the dark theme stylesheet (theme-dark.css) to the common stylesheet (bisq.css).
These selectors are theme-independent, since they re-use variables defined in each theme stylesheet (like -bs-background-color). Therefore a more appropriate place for them is in the common stylesheet.
This move means that alternating row background colors are now available for all tables and lists, in all views, in both dark and light themes.