js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 12:09:26 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve native radio alignment (#904)

Browse Source 
* show initial checks (feels less broken now)

* improve native radio dot alignment

* Update src/styles/native/radio.css

Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>

* Update src/styles/native/radio.css

Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>

* Update src/styles/native/radio.css

Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>

---------

Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com>
This commit is contained in:
Cory LaViska
2025-05-07 12:43:11 -04:00
committed by GitHub
parent aed28adbe4
commit 61e65ffcb9
3 changed files with 28 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/styles/native/radio.css
View File

@@ -10,7 +10,7 @@ label:has(input[type='radio']),
--box-shadow: none;
--checked-icon-color: var(--wa-form-control-activated-color);
--checked-icon-scale: 0.75;
--toggle-size: 1lh;
--toggle-size: round(1lh, 1px);
color: var(--wa-form-control-value-color);
display: inline-flex;
@@ -34,10 +34,8 @@ input[type='radio'] {
background-color: var(--checked-icon-color);
border-radius: 50%;
content: '';
position: absolute;
width: calc(var(--toggle-size) - var(--border-width));
height: calc(var(--toggle-size) - var(--border-width));
scale: var(--checked-icon-scale);
width: round(calc(100% * var(--checked-icon-scale)), 1px);
aspect-ratio: 1;
}
}