fleet/frontend/components/forms/fields/Checkbox/_styles.scss
Mike Stone f099b2ae22 Create packs (#516)
* Creates new PackComposerPage at /packs/new

* Creates PackForm component

* Adds PackForm to PackComposerPage

* Creates QueriesListItem

* Creates QueriesList

* Creates QueriesListWrapper

* Get all queries when the Packs Composer Page loads

* Form HOC handles updates to formData prop

* Creates form to configure scheduled queries

* QueriesListWrapper renders ConfigurePackQueryForm

* search queries input filters queries list

* Empty state text

* create pack when user submits the new pack form

* Adds Edit pack page to /packs/:pack_id/edit

* API client - get scheduled queries for a pack

* API client - create scheduled query

* Redux config for scheduled queries

* Remove scheduled queries from packs

* Add labels to pack on create

* Add disabled state to the select targets dropdown

* Adds edit route and pushes to new route on edit click

* Adds cancel button to edit pack form

* Adds Checkbox that selects all scheduled queries in table
2016-12-21 12:25:54 -05:00

69 lines
1.4 KiB
SCSS

.kolide-checkbox {
@include clearfix;
@include size(20px);
position: relative;
display: block;
&__input {
visibility: hidden;
margin: 0;
position: absolute;
&:checked + .kolide-checkbox__tick {
&::after {
background-color: $brand;
border: solid 2px $brand;
}
&::before {
@include transform(rotate(45deg));
@include position(absolute, 50% null null 50%);
box-sizing: border-box;
display: table;
width: 7px;
height: 13px;
margin: -8px 0 0 -4px;
border: 2px solid $white;
border-top: 0;
border-left: 0;
content: '';
}
}
}
&__tick {
@include size(20px);
position: absolute;
left: 0;
display: inline-block;
&::after {
@include transition(border 75ms ease-in-out, background 75ms ease-in-out);
@include size(20px);
border-radius: 2px;
border: solid 2px $border-medium;
content: '';
box-sizing: border-box;
display: block;
background-color: $white;
visibility: visible;
}
&--disabled {
&::after {
background-color: $border-medium;
}
}
}
&__label {
font-size: 13px;
font-weight: $normal;
line-height: 20px;
letter-spacing: 0.5px;
color: $text-medium;
display: inline-block;
padding-left: 15px;
float: left;
}
}