mirror of
https://github.com/l0ng-ai/openidea.git
synced 2026-11-06 08:07:49 +00:00
fix(ui): Hide the focus outline around dropdown popups
The global :focus-visible rule loads after the module CSS and has the same specificity, so it overrode `outline: none` on the focused listbox wrapper and drew a square blue frame inside the Select popup. Claude-Session: https://claude.ai/code/session_01B65qLEKnkeYTGdbwhLpjCu
This commit is contained in:
@@ -1,9 +1,11 @@
|
|||||||
.popup {
|
.popup {
|
||||||
z-index: var(--z-popup);
|
z-index: var(--z-popup);
|
||||||
outline: none;
|
|
||||||
overflow: auto;
|
overflow: auto;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
}
|
}
|
||||||
|
.popup:focus-visible {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
.popup[data-positioned] {
|
.popup[data-positioned] {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
animation: popIn var(--dur-fast) var(--ease);
|
animation: popIn var(--dur-fast) var(--ease);
|
||||||
|
|||||||
@@ -57,10 +57,13 @@
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
.popupInner {
|
.popupInner {
|
||||||
outline: none;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
/* Focus only carries keystrokes; the active row is the indicator. */
|
||||||
|
.popupInner:focus-visible {
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
.list {
|
.list {
|
||||||
max-height: 320px;
|
max-height: 320px;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user