mirror of
https://github.com/fleetdm/fleet
synced 2026-05-24 09:28:54 +00:00
51cfb07f64
The goal of this PR was to insert new colors, remove legacy colors, and update only the styles accordingly. The Nunito Sans Italic font was also added. Later PRs will include layout, copy, and style change to individual components. These later changes will more exactly resemble the current mockups.
67 lines
1.4 KiB
SCSS
67 lines
1.4 KiB
SCSS
.kolide-checkbox {
|
|
@include clearfix;
|
|
position: relative;
|
|
display: inline-block;
|
|
|
|
&__input {
|
|
visibility: hidden;
|
|
margin: 0;
|
|
position: absolute;
|
|
z-index: -1;
|
|
|
|
&:checked + .kolide-checkbox__tick {
|
|
&::after {
|
|
background-color: $core-blue;
|
|
border: solid 2px $core-blue;
|
|
}
|
|
|
|
&::before {
|
|
@include position(absolute, 50% null null 50%);
|
|
transform: rotate(45deg);
|
|
box-sizing: border-box;
|
|
display: block;
|
|
width: 7px;
|
|
height: 13px;
|
|
margin: -8px 0 0 -3px;
|
|
border: 2px solid $white;
|
|
border-top: 0;
|
|
border-left: 0;
|
|
content: '';
|
|
}
|
|
}
|
|
}
|
|
|
|
&__tick {
|
|
@include size(20px);
|
|
@include position(absolute, 50% null null 0);
|
|
transform: translateY(-10px);
|
|
display: inline-block;
|
|
|
|
&::after {
|
|
@include size(20px);
|
|
transition: border 75ms ease-in-out, background 75ms ease-in-out;
|
|
border-radius: 2px;
|
|
border: solid 2px $ui-borders;
|
|
content: '';
|
|
box-sizing: border-box;
|
|
display: block;
|
|
background-color: $white;
|
|
visibility: visible;
|
|
}
|
|
|
|
&--disabled {
|
|
&::after {
|
|
background-color: $ui-borders;
|
|
}
|
|
}
|
|
}
|
|
|
|
&__label {
|
|
font-size: 13px;
|
|
font-weight: $regular;
|
|
line-height: 20px;
|
|
letter-spacing: 0.5px;
|
|
color: $core-dark-blue-grey;
|
|
padding-left: 25px;
|
|
}
|
|
}
|