Fix some UI problems (dropdown/container) (#30849)

Follow #30345
Follow #30547

`ellipsis` / `white-space` shouldn't be put on the general dropdown components.
This commit is contained in:
wxiaoguang 2024-05-06 15:17:22 +08:00 committed by GitHub
parent ce8b11ae13
commit eda10cc2bb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
13 changed files with 246 additions and 205 deletions

View file

@ -342,8 +342,6 @@ a.label,
.ui.dropdown .menu > .item {
color: var(--color-text);
overflow: hidden;
text-overflow: ellipsis;
}
.ui.dropdown .menu > .item:hover {
@ -374,7 +372,6 @@ a.label,
.ui.selection.dropdown .menu > .item {
border-color: var(--color-secondary);
white-space: nowrap;
}
.ui.selection.visible.dropdown > .text:not(.default) {
@ -1342,7 +1339,11 @@ table th[data-sortt-desc] .svg {
align-items: center;
gap: .25rem;
vertical-align: middle;
min-width: 0;
min-width: 0; /* make ellipsis work */
}
.ui.ui.dropdown.selection {
min-width: 14em; /* match the default min width */
}
.ui.dropdown .ui.label .svg {
@ -1369,3 +1370,16 @@ table th[data-sortt-desc] .svg {
gap: .5rem;
min-width: 0;
}
.ui.dropdown.ellipsis-items-nowrap > .text {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.ellipsis-items-nowrap > .item,
.ui.dropdown.ellipsis-items-nowrap .menu > .item {
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}

View file

@ -448,6 +448,10 @@ textarea:focus,
}
}
.ui.form .field > .selection.dropdown {
min-width: 14em; /* matches the default min width */
}
.new.webhook form .help {
margin-left: 25px;
}

View file

@ -2,26 +2,20 @@
unused rules here after refactoring, please remove them. */
.ui.container {
display: block;
max-width: 100%;
}
.ui.fluid.container {
width: 100%;
}
.ui[class*="center aligned"].container {
text-align: center;
}
/* overwrite width of containers inside the main page content div (div with class "page-content") */
.page-content .ui.ui.ui.container:not(.fluid) {
width: 1280px;
max-width: calc(100% - calc(2 * var(--page-margin-x)));
margin-left: auto;
margin-right: auto;
}
.ui.fluid.container {
width: 100%;
}
.ui.container.fluid.padded {
padding: 0 var(--page-margin-x);
}
.ui[class*="center aligned"].container {
text-align: center;
}

View file

@ -2860,6 +2860,10 @@ tbody.commit-list {
margin-top: 4px;
}
.ui.dropdown.branch-selector-dropdown .scrolling.menu {
max-width: min(400px, 90vw);
}
.branch-selector-dropdown .branch-dropdown-button {
margin: 0;
max-width: 340px;
@ -2909,6 +2913,8 @@ tbody.commit-list {
}
.branch-selector-dropdown .menu .item .rss-icon {
position: absolute;
right: 4px;
visibility: hidden; /* only show RSS icon on hover */
}