UX: fix user profile button wrap, clean up styles (#28255)

This commit is contained in:
Kris 2024-08-06 17:47:51 -04:00 committed by GitHub
parent 8aff94dadb
commit 76b28ed836
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 16 additions and 49 deletions

View File

@ -197,10 +197,12 @@
}
.controls {
margin-left: auto;
ul {
display: flex;
flex-wrap: wrap;
gap: 0.5em;
list-style-type: none;
margin-top: 0;
margin: 0 0 0.5em 0;
}
}
@ -860,6 +862,7 @@
.primary-textual {
flex: 1 1 auto;
min-width: 0;
margin-right: auto;
}
.primary-textual .staged,

View File

@ -132,6 +132,7 @@ table.user-invite-list {
}
.primary-textual {
flex: 0 1 auto;
padding: 0 0 0.5em;
}
@ -154,14 +155,10 @@ table.user-invite-list {
.controls {
max-width: 13.5em;
margin-left: 0.5em;
li {
margin-bottom: 0.5em;
}
li > .select-kit-header, // select-kit
.btn {
min-width: 9.5em;
min-width: 9em;
width: 100%;
}
}
@ -171,19 +168,14 @@ table.user-invite-list {
display: none;
}
.controls {
width: auto;
display: flex;
max-width: unset;
flex: 1 2 min-content;
> ul {
display: inline-flex;
> li {
display: inline-flex;
margin-left: 0.75em;
}
a {
width: auto;
}
flex-wrap: wrap;
margin-left: auto;
justify-content: end;
}
}

View File

@ -202,50 +202,20 @@
.controls {
flex: 1 1 25%;
.btn {
margin-bottom: 0.5rem;
}
ul {
margin: 0;
display: flex;
flex: 1 1 auto;
flex-wrap: wrap;
li,
> span {
display: flex;
flex: 1 1 45%;
margin-left: 1em;
button,
a {
width: 100%;
}
.select-kit.dropdown-select-box.user-notifications-dropdown {
width: 100%;
align-self: flex-start;
li {
flex: 1 1 100%;
margin-left: 0;
}
}
}
}
> ul {
margin-left: -1em; // negates left button margin, for alignment
}
.user-profile-controls-outlet {
margin: 0 0 0 1em;
li {
margin: 0;
}
}
a {
flex: 1 1 auto;
min-width: 120px;
}
}
}

View File

@ -13,7 +13,6 @@
.user-summary-page .details .controls ul,
.user-main .details .controls ul {
display: flex;
flex-direction: column;
li:first-child {
@ -22,6 +21,9 @@
li.user-profile-controls-outlet.chat-button {
order: -1;
&:empty {
display: none;
}
}
}