mpana/copilot
1
0
Fork 0
mirror of https://github.com/yldio/copilot.git synced 2024-11-28 14:10:04 +02:00
Code Issues Releases Wiki Activity

Radio Input - Refactoring CSS

Browse Source
This commit is contained in:
Alex Windett 2016-10-27 10:12:04 +01:00
parent 3a983b10a5
commit e76ca342c6
3 changed files with 14 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
ui/.postcss.js Normal file
View File

@ -0,0 +1,11 @@
var calc = require('postcss-calc');
module.exports = function (postcss) {
return postcss([
require('postcss-at-rules-variables')(),
require('postcss-modules-values'),
require('postcss-mixins')(),
require('postcss-for'),
require('postcss-cssnext')(),
])
}

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

@ -1,5 +1,6 @@
:root {
--radio-radius: 20px;
--radio-border-size: calc( var(--radio-radius) / 4 );
--dot-color: #646464;
--border-color: #cfd1d1;
}
@ -18,7 +19,7 @@
&:before {
content: '';
border : calc( var(--radio-radius) / 4 ) solid white;
border : var(--radio-border-size) solid white;
border-radius: 50%;
box-shadow: 0 0 0 1px var(--border-color);
display: inline-block;
@ -38,12 +39,6 @@
&:checked {
& ~ span:before {
background: var(--dot-color);
border : calc( var(--radio-radius) / 4 ) solid white;
border-radius: 50%;
box-shadow: 0 0 0 1px var(--border-color);
height: var(--radio-radius);
position: absolute;
width: var(--radio-radius);
}
}
}