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:
parent
ce8b11ae13
commit
eda10cc2bb
13 changed files with 246 additions and 205 deletions
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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;
|
||||
}
|
||||
|
|
|
@ -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 */
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue