this repo has no description
More granular hover/focus state for status actions
+11
-3
+11
-3
src/components/status.css
+11
-3
src/components/status.css
···
1966
1966
border-color: var(--outline-hover-color);
1967
1967
}
1968
1968
1969
-
&:hover,
1970
-
.status:hover &:not(:hover),
1971
1969
&.open {
1972
1970
opacity: 1;
1973
1971
pointer-events: auto;
···
1976
1974
@media (pointer: coarse) {
1977
1975
& {
1978
1976
border-color: var(--outline-hover-color);
1977
+
}
1978
+
.status:has(&):focus & {
1979
+
opacity: 1;
1980
+
pointer-events: auto;
1981
+
transform: translateX(0);
1979
1982
}
1980
1983
.status-focus:has(&):has(.status:focus) {
1981
1984
transition: background-color 0.1s ease-out 0.3s;
1982
1985
background-color: var(--bg-faded-blur-color);
1983
1986
}
1984
1987
}
1985
-
@media (pointer: fine) and (hover: hover) {
1988
+
@media (pointer: fine), (hover: hover) {
1989
+
.status:has(&):hover & {
1990
+
opacity: 1;
1991
+
pointer-events: auto;
1992
+
transform: translateX(0);
1993
+
}
1986
1994
.status:has(&):hover {
1987
1995
/* background-color: var(--bg-faded-blur-color); */
1988
1996
background-image: linear-gradient(