Spearhead
/
joyent-portal
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

use more variables in Radio css

This commit is contained in:
Sérgio Ramos 2016-10-27 10:38:33 +01:00
parent 114d6a04f4
commit 0835d1c0df
1 changed files with 5 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
ui/src/components/radio/style.css
View File

@ -1,5 +1,7 @@
:root { :root {
--radio-radius: 20px; --radio-radius: 20px;
--dot-color: #646464;
--border-color: #cfd1d1;
} }
.radio { .radio {
@ -18,7 +20,7 @@
content: ''; content: '';
border : calc( var(--radio-radius) / 4 ) solid white; border : calc( var(--radio-radius) / 4 ) solid white;
border-radius: 50%; border-radius: 50%;
box-shadow: 0 0 0 1px #cfd1d1; box-shadow: 0 0 0 1px var(--border-color);
display: inline-block; display: inline-block;
height: var(--radio-radius); height: var(--radio-radius);
left: -30px; left: -30px;
@ -35,10 +37,10 @@
&:checked { &:checked {
& ~ span:before { & ~ span:before {
background: #D8D8D8; background: var(--dot-color);
border : calc( var(--radio-radius) / 4 ) solid white; border : calc( var(--radio-radius) / 4 ) solid white;
border-radius: 50%; border-radius: 50%;
box-shadow: 0 0 0 1px #cfd1d1; box-shadow: 0 0 0 1px var(--border-color);
height: var(--radio-radius); height: var(--radio-radius);
position: absolute; position: absolute;
width: var(--radio-radius); width: var(--radio-radius);