Mirrors/phanpy
1
0
Fork 0
mirror of https://github.com/cheeaun/phanpy.git synced 2025-01-23 09:06:23 +01:00
Code Issues Projects Releases Packages Wiki Activity

More granular hover/focus state for status actions

Browse source
This commit is contained in:
Lim Chee Aun 2024-02-11 22:46:21 +08:00
parent a9d0100087
commit 92f4371041
1 changed files with 11 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/components/status.css
View file

@ -1966,8 +1966,6 @@ a.card:is(:hover, :focus):visited {
border-color: var(--outline-hover-color); border-color: var(--outline-hover-color);
} }
&:hover,
.status:hover &:not(:hover),
&.open { &.open {
opacity: 1; opacity: 1;
pointer-events: auto; pointer-events: auto;
@ -1977,12 +1975,22 @@ a.card:is(:hover, :focus):visited {
& { & {
border-color: var(--outline-hover-color); border-color: var(--outline-hover-color);
} }
.status:has(&):focus & {
opacity: 1;
pointer-events: auto;
transform: translateX(0);
}
.status-focus:has(&):has(.status:focus) { .status-focus:has(&):has(.status:focus) {
transition: background-color 0.1s ease-out 0.3s; transition: background-color 0.1s ease-out 0.3s;
background-color: var(--bg-faded-blur-color); background-color: var(--bg-faded-blur-color);
} }
} }
@media (pointer: fine) and (hover: hover) { @media (pointer: fine), (hover: hover) {
.status:has(&):hover & {
opacity: 1;
pointer-events: auto;
transform: translateX(0);
}
.status:has(&):hover { .status:has(&):hover {
/* background-color: var(--bg-faded-blur-color); */ /* background-color: var(--bg-faded-blur-color); */
background-image: linear-gradient( background-image: linear-gradient(