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.
64 lines
1.2 KiB
SCSS
64 lines
1.2 KiB
SCSS
.kolide-slider {
|
|
transition: background-color 150ms ease-in-out;
|
|
background-color: $core-dark-blue-grey;
|
|
border-radius: 12px;
|
|
border: 1px solid #eaeaea;
|
|
cursor: pointer;
|
|
display: inline-block;
|
|
height: 22px;
|
|
min-width: 40px;
|
|
position: relative;
|
|
width: 40px;
|
|
box-shadow: inset 0 1px 6px 0 rgba(0, 0, 0, 0.2);
|
|
|
|
&:hover {
|
|
background-color: $core-dark-blue-grey;
|
|
box-shadow: inset 0 1px 6px 0 rgba(0, 0, 0, 0.2);
|
|
}
|
|
|
|
&--active {
|
|
background-color: $core-blue;
|
|
|
|
&:hover {
|
|
background-color: $core-blue;
|
|
}
|
|
|
|
}
|
|
|
|
&__wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
height: 40px;
|
|
}
|
|
|
|
&__dot {
|
|
@include size(14px);
|
|
@include position(absolute, 0 null null 5px);
|
|
transition: left 150ms ease-in-out;
|
|
margin-top: 3px;
|
|
border-radius: 50%;
|
|
background-color: $white;
|
|
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.25);
|
|
|
|
&--active {
|
|
left: 21px;
|
|
}
|
|
}
|
|
|
|
&__label {
|
|
font-size: 18px;
|
|
font-weight: $regular;
|
|
letter-spacing: 1.3px;
|
|
text-align: left;
|
|
vertical-align: text-bottom;
|
|
text-transform: uppercase;
|
|
margin-right: 10px;
|
|
color: $core-medium-blue-grey;
|
|
|
|
&--active {
|
|
color: $core-blue;
|
|
margin-right: 0;
|
|
margin-left: 10px;
|
|
}
|
|
}
|
|
}
|