Add a button style for being used on primary like in the header #2871
Conversation
Signed-off-by: Joas Schilling <coding@schilljs.com>
nickvergessen
added
bug
|
And yes, the action menu is following the wrong color there as it is not using the vue component yet |
| @@ -595,6 +600,18 @@ export default { | |||
| } | |||
| } | |||
|
|
|||
| // Tertiary on primary color (like the header) | |||
| &--vue-tertiary-on-primary { | |||
There was a problem hiding this comment.
Should we just call it "inverted colours" or something like that? I can imagine we could use something similar in talk's call view
There was a problem hiding this comment.
No that's not how it works. In Talk we would always need white or something alike, not depening on the primary color nor the background.
| @@ -535,6 +535,11 @@ export default { | |||
| &.button-vue--vue-tertiary-no-background { | |||
| opacity: 1; | |||
| } | |||
| &.button-vue--vue-tertiary-on-primary { | |||
| border-radius: var(--border-radius); | |||
There was a problem hiding this comment.
| border-radius: var(--border-radius); | |
| border-radius: var(--border-radius-large); |
There was a problem hiding this comment.
Could we do this via a separate prop square? I'm using this for the input too. Sometimes it's needed
There was a problem hiding this comment.
This is what all the icons in the top bar use:
https://github.com/nextcloud/server/blob/87320cba99229e065747d699461b1dddc54326f8/core/css/header.scss#L24-L28
There was a problem hiding this comment.
Yes but we need this kind of buttons elsewhere too
There was a problem hiding this comment.
I think the square (if we introduce it) should work on all buttons, so I would like to have that done in a seperate PR
There was a problem hiding this comment.
Reported at #2873
For reference: nextcloud/server#33229 Independently of that, I have noticed that in the :active state (which can be triggered by pressing on the button and then moving the cursor away so it no longer hovers it, which overrides :active) a round background is shown for the button, even if the box shadow is (almost) square when focused. Is it known / expected? Or should I open an issue? |
|
Not expected, please raise an issue |
|
/backport to stable5 |
Fix #2869