73 lines
1.4 KiB
CSS
73 lines
1.4 KiB
CSS
/* Dropdown utilities */
|
|
.dropdown-surface {
|
|
@apply absolute w-full rounded-md shadow-lg z-50;
|
|
background-color: var(--surface-base);
|
|
border: 1px solid var(--border-base);
|
|
}
|
|
|
|
.dropdown-header {
|
|
@apply px-3 py-2 border-b;
|
|
border-color: var(--border-base);
|
|
background-color: var(--surface-secondary);
|
|
}
|
|
|
|
.dropdown-header-title {
|
|
@apply text-xs font-medium;
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
.dropdown-section-header {
|
|
@apply px-3 py-1.5 text-xs font-semibold;
|
|
color: var(--text-muted);
|
|
background-color: var(--surface-secondary);
|
|
}
|
|
|
|
.dropdown-content {
|
|
@apply overflow-y-auto;
|
|
}
|
|
|
|
.dropdown-item {
|
|
@apply cursor-pointer px-3 py-2 transition-colors;
|
|
color: var(--text-primary);
|
|
}
|
|
|
|
.dropdown-item:hover {
|
|
background-color: var(--surface-hover);
|
|
}
|
|
|
|
.dropdown-item-highlight {
|
|
background-color: var(--dropdown-highlight-bg);
|
|
color: var(--dropdown-highlight-text);
|
|
}
|
|
|
|
.dropdown-empty {
|
|
@apply px-3 py-4 text-center text-sm;
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
.dropdown-loading {
|
|
@apply p-4 text-center text-sm;
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
.dropdown-footer {
|
|
@apply border-t px-3 py-2 text-xs;
|
|
border-color: var(--border-base);
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
.dropdown-badge {
|
|
@apply rounded px-1.5 py-0.5 text-xs font-normal;
|
|
background-color: var(--accent-primary);
|
|
color: var(--text-inverted);
|
|
}
|
|
|
|
.dropdown-icon {
|
|
@apply flex-shrink-0;
|
|
color: var(--text-muted);
|
|
}
|
|
|
|
.dropdown-icon-accent {
|
|
color: var(--accent-primary);
|
|
}
|