javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-11-08 23:58:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(button): update focus ring to avoid additional API (#29223)

Browse Source
This commit is contained in:
Liam DeBeasi
2024-03-26 13:40:11 -04:00
committed by GitHub
parent 4cf1b9737d
commit 7eae6ec591
15 changed files with 3 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
core/src/components/button/button.ionic.scss
View File

@ -156,26 +156,9 @@
// -------------------------------------------------------------------------------
// Only show the focus ring when the button is focused
:host(.ion-focused) {
--overflow: visible;
.button-native::after {
@include border-radius(inherit);
}
}
.button-focus-ring {
@include position(-4px, -4px, -4px, -4px);
@include border-radius(inherit);
position: absolute;
transition: border-color 0.3s;
border: var(--focus-ring-width) solid var(--focus-ring-color);
content: "";
box-sizing: border-box;
:host(.ion-focused) .button-native {
outline: var(--focus-ring-width) solid var(--focus-ring-color);
outline-offset: 2px;
}
// Fill Solid Button