-
Notifications
You must be signed in to change notification settings - Fork 840
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
Fix issues around component classes / (text) opacity #3415
Conversation
The invalid CSS will throw off the TCSS VS Code extension and the whole file ends up looking very odd.
This fixes #3413.
Now that text opacity is taken into account in the calculation of rich_style, the text color of disabled tabs became too light. To compensate for it, the text opacity in Tab:disabled could be set to 71% and that would match the previous value. However, 71% feels like a terrible value to have in CSS so I opted to go with 70% (which looks ALMOST EXACTLY THE SAME) and then I updated the snapshot test.
de6a479 introduces a snapshot test app that you can run with The “empty boxes” are a good thing because I'm using component classes to set colours to transparent. The screenshot shows that the previous commits fix #3304. |
The reason the (directory) tree and toggle button labels are still white is because they use partial rich styles to enable markup to be used in the labels, which don't currently take into account text opacity. To know how to resolve this, we need to know what should happen if a widget has mark up and conflicting TCSS. Checkbox > .toggle--label {
color: blue;
text-opacity: 50%;
}
After I have the answer to this question, I can get to fixing the code so that it complies with what we decide. |
The component classes themselves are applied on top of successive widgets that have non-opaque backgrounds, we need to use the computed final background color after taking into account the transparency of the ancestors.
text-opacity: 50%; | ||
text-opacity: 70%; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This accounts for the now-correct calculation of the final text color when opacity is present.
I have an alternative solution in mind for |
This PR will fix #3413, #3342, and #3304.
This started out as a PR that intended to fix an issue with the option list and kept growing in size as I kept uncovering more issues with component classes & styles, (partial) rich styles, and interactions with (text-)opacity styles.
I've stopped digging because there's some things with component classes we'd like to iron out and those will probably help with what's not handled in this PR yet.
Some things that were left to be done/fixed/considered: