Files
overleaf-cep/services/web/modules/reference-picker/frontend/styles/reference-picker.scss
T
yu-i-i a547af1de3 Reference picker: improve usability
- show tags for nonexistent references
- click a badge to find the corresponding reference
2026-07-17 18:07:22 +02:00

51 lines
1.2 KiB
SCSS

.references-search-modal {
.selected-key-tags {
position: relative;
display: flex;
flex-wrap: wrap;
gap: var(--spacing-02);
align-items: center;
min-height: 30px;
max-height: 58px;
overflow-y: auto;
font-size: var(--font-size-02);
margin-top: -10px;
margin-bottom: 8px;
box-shadow: 0 1px 0 var(--ds-color-neutral-100);
padding-bottom: 6px;
}
.selected-key-tags .existing-key-tag .badge-tag {
background-color: var(--ds-color-green-50) !important;
}
.selected-key-tags .nonexistent-key-tag .badge-tag {
background-color: var(--ds-color-red-50) !important;
}
.existing-key-tag .badge-tag-content-btn:hover {
background-color: var(--ds-color-green-100);
}
.nonexistent-key-tag .badge-tag-content-btn:hover {
background-color: transparent;
}
.badge-close:hover,
.badge-close:focus {
background-color: var(--ds-color-neutral-100);
}
.search-results {
.search-results-scroll-container {
max-height: calc(100vh - 330px);
overflow-y: auto;
}
.search-result-hit {
&:focus {
background: var(--ds-color-yellow-50);
outline: none;
}
}
.found-token {
color: var(--ds-color-red-600);
font-weight: bold;
}
}
}