Fleet UI: Clickable elements include cursor hover state (#17688)

This commit is contained in:
RachelElysia
2024-03-22 15:26:09 -04:00
committed by GitHub
parent 644dddce4f
commit d5df23964b
5 changed files with 31 additions and 0 deletions
+1
View File
@@ -0,0 +1 @@
Fleet UI: Add hover states to clickable elements
@@ -22,6 +22,13 @@
border: solid 2px $core-vibrant-blue;
}
&:hover {
&::after {
background-color: $core-vibrant-blue-over;
border: solid 2px $core-vibrant-blue-over;
}
}
&::before {
@include position(absolute, 50% null null 50%);
transform: rotate(45deg);
@@ -42,6 +49,7 @@
@include size(20px);
@include position(absolute, 0 null null 0);
display: inline-block;
cursor: pointer;
&::after {
@include size(20px);
@@ -54,11 +62,17 @@
background-color: $core-white;
visibility: visible;
}
&:hover {
&::after {
border: solid 2px $core-vibrant-blue-over;
}
}
&--disabled {
&::after {
background-color: $ui-fleet-black-25;
}
cursor: default;
}
&--indeterminate {
@@ -67,6 +81,15 @@
border: solid 1px $core-vibrant-blue;
}
&:hover {
&::after {
&::after {
background-color: $core-vibrant-blue-over;
border: solid 1px $core-vibrant-blue-over;
}
}
}
&::before {
@include position(absolute, 50% null null 50%);
box-sizing: border-box;
@@ -75,6 +75,8 @@
background-color: $ui-light-grey;
border: 0;
border-radius: $border-radius;
cursor: pointer;
.Select-value {
font-size: $small;
background-color: $ui-light-grey;
@@ -166,6 +166,7 @@ const Mdm = ({
isAllPagesSelected={false}
disableCount
disablePagination
disableMultiRowSelect
onClickRow={handleSolutionRowClick}
/>
)}
@@ -26,6 +26,10 @@
border-radius: $border-radius;
height: 40px;
:hover {
cursor: pointer;
}
&--is-focused,
&--menu-is-open,
&:hover {