mirror of
https://github.com/fleetdm/fleet
synced 2026-05-06 14:58:33 +00:00
50 lines
1,001 B
SCSS
50 lines
1,001 B
SCSS
.target-chip-selector {
|
|
padding: $pad-small;
|
|
background-color: $core-white;
|
|
border: none;
|
|
box-shadow: inset 0 0 0 1px $ui-fleet-black-25;
|
|
border-radius: $border-radius-medium;
|
|
cursor: pointer;
|
|
display: flex;
|
|
align-items: center;
|
|
margin-bottom: $pad-small;
|
|
|
|
&:not(:last-of-type) {
|
|
margin-right: $pad-small;
|
|
}
|
|
img {
|
|
max-width: 12px;
|
|
}
|
|
.plus-icon {
|
|
padding-right: 3px;
|
|
}
|
|
.selector-name {
|
|
margin-left: 8px;
|
|
font-size: $x-small;
|
|
flex: 1;
|
|
}
|
|
.selector-count {
|
|
margin-left: 8px;
|
|
font-size: $xxx-small;
|
|
font-weight: $bold;
|
|
}
|
|
&[data-selected="true"] {
|
|
background-color: $ui-vibrant-blue-10;
|
|
box-shadow: inset 0 0 0 1px $core-vibrant-blue;
|
|
}
|
|
|
|
&:hover {
|
|
background-color: $ui-vibrant-blue-10;
|
|
}
|
|
|
|
&:active {
|
|
box-shadow: inset 0 0 0 1px $core-vibrant-blue-down;
|
|
}
|
|
|
|
// When tabbing
|
|
&:focus-visible {
|
|
outline: 2px solid $ui-vibrant-blue-25;
|
|
outline-offset: 1px;
|
|
border-radius: $border-radius;
|
|
}
|
|
}
|