search pills: Prevent overflow for very long pills.

This commit is contained in:
evykassirer
2024-07-10 15:26:58 -07:00
committed by Tim Abbott
parent dc1fb85cf0
commit 7cb00d171e
2 changed files with 9 additions and 2 deletions

View File

@@ -35,6 +35,7 @@
.pill-image {
height: var(--length-input-pill-image);
width: var(--length-input-pill-image);
min-width: var(--length-input-pill-image);
border-radius: 4px 0 0 4px;
}

View File

@@ -223,7 +223,7 @@
var(--search-box-height),
auto
)
/ auto minmax(0, 1fr) auto;
/ auto minmax(0, 1fr) 28px;
align-items: start;
cursor: pointer;
@@ -244,7 +244,6 @@
}
.user-pill-container {
min-width: fit-content;
gap: 5px;
> .pill-label {
@@ -259,6 +258,9 @@
height: var(--height-input-pill);
border: none;
border-radius: 3px;
max-width: none;
display: grid;
grid-template-columns: auto 1fr auto;
&:not(.deactivated-pill) {
background-color: var(--color-background-user-pill);
@@ -267,6 +269,10 @@
}
}
.pill-label {
min-width: 30px;
}
@media (width >= $md_min) {
.navbar-search {
background: var(--color-background-search);