fleet/frontend/components/LiveQuery/TargetChipSelector/_styles.scss
2025-09-29 12:10:41 -05:00

54 lines
1.1 KiB
SCSS

.target-chip-selector {
padding: $pad-small;
background-color: $core-fleet-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-off-white;
box-shadow: inset 0 0 0 1px $ui-fleet-black-75;
}
&:hover {
background-color: $ui-off-white;
box-shadow: inset 0 0 0 1px $core-fleet-black;
color: $core-fleet-black;
}
&:active {
background-color: $ui-off-white;
box-shadow: inset 0 0 0 1px $core-fleet-black;
color: $core-fleet-black;
}
// When tabbing
&:focus-visible {
outline: 1px solid $core-focused-outline;
outline-offset: 1px;
border-radius: $border-radius;
}
}