ADOFAIEditorForum/ComponentTest
2
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix Level Card Buttons Selection Outline

Browse Source
This commit is contained in:
copecone committed 2026-05-04 13:44:41 +09:00
1 parent 912bd0d755
commit 2f5e79e300
1 file changed
+11 -3
Download Patch File Download Diff File Expand all files Collapse all files
src/app/components/level-card/level-card.scss
+11 -3
View File
@@ -19,7 +19,7 @@ $default_animation_duration: 0.2s;
border-radius: 8px; border-radius: 8px;
outline: light-dark(oklch(0 0 0 / 20%), oklch(1 0 0 / 20%)) 2px solid; outline: light-dark(oklch(0 0 0 / 20%), oklch(1 0 0 / 20%)) 2px solid;
overflow: hidden; // overflow: hidden;
&:focus-visible { &:focus-visible {
outline-offset: 0; outline-offset: 0;
@@ -35,7 +35,9 @@ $default_animation_duration: 0.2s;
z-index: 1; z-index: 1;
background-color: light-dark(white, black); background-color: light-dark(white, black);
outline: light-dark(oklch(0 0 0 / 20%), oklch(1 0 0 / 20%)) 1px solid; border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
// outline: light-dark(oklch(0 0 0 / 20%), oklch(1 0 0 / 20%)) 1px solid;
.soundtrack { .soundtrack {
display: flex; display: flex;
@@ -113,6 +115,7 @@ $default_animation_duration: 0.2s;
flex-direction: row; flex-direction: row;
justify-content: flex-end; justify-content: flex-end;
align-items: center; align-items: center;
z-index: 10;
width: 100%; width: 100%;
height: 50%; height: 50%;
@@ -130,8 +133,13 @@ $default_animation_duration: 0.2s;
--hover-state: 1; --hover-state: 1;
} }
&:not(:focus-visible) {
box-shadow: -1px 0 0 0 light-dark(oklch(0 0 0 / 20%), oklch(1 0 0 / 20%));
}
&:focus-visible { &:focus-visible {
outline-offset: -2px; z-index: 11;
outline-offset: 0;
} }
div.button-icon { div.button-icon {