User management: Fix header text alignment and new user "confirm" button #11523
Conversation
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
Signed-off-by: Jan-Christoph Borchardt <hey@jancborchardt.net>
jancborchardt
added
bug
design
jancborchardt
requested review from
juliusknorr,
kevgathuku,
weeman1337 and
skjnldsv
|
@jancborchardt Could you backport this to stable14? |
| @@ -1448,6 +1448,17 @@ doesnotexist:-o-prefocus, .strengthify-wrapper { | |||
| &#grid-header { | |||
| color: var(--color-text-maxcontrast); | |||
| z-index: 60; /* above new-user */ | |||
|
|
|||
| #headerDisplayName, | |||
There was a problem hiding this comment.
all of these elements also have dedicated classnames, so why use their IDs?
| #headerQuota, | ||
| #headerLanguages { | ||
| /* Line up header text with column content for when there’s inputs */ | ||
| padding-left: 7px; |
There was a problem hiding this comment.
This should be padding: 7px, or at the very least, `padding: 0 7px;
Reasoning: long titles should crop at the same point as the text in the rows bellow; in case we make these titles clickable at some point in the future (for example, to make the table sortable), it would be worth having padding all around the text for easier pointing.
| @@ -1529,6 +1540,9 @@ doesnotexist:-o-prefocus, .strengthify-wrapper { | |||
| } | |||
| } | |||
| &.userActions { | |||
| #newsubmit { | |||
| width: 100%; | |||
There was a problem hiding this comment.
this can make the button very very long. I think it should be the normal icon-button size -> 44*44px
There was a problem hiding this comment.
also, as a general rule, classes should be used in CSS wherever possible.
|
Please review my comments before backporting this, @jancborchardt @MorrisJobke |
|
@pixelipo Thanks for the feedback 👍 |
|
This is not something for backporting, but will look into your comments @pixelipo – good stuff as always! ❤️ |
Before:
After:
Please review @nextcloud/designers @R0maNNN