mirror of
https://github.com/cheeaun/phanpy.git
synced 2025-01-23 09:06:23 +01:00
Fine-tuning status actions styles
This commit is contained in:
parent
92f4371041
commit
3c31c56306
1 changed files with 23 additions and 18 deletions
|
@ -1927,6 +1927,10 @@ a.card:is(:hover, :focus):visited {
|
|||
transform-origin: right center;
|
||||
transition: all 0.15s ease-out 0.3s, border-color 0.3s ease-out;
|
||||
|
||||
.timeline.contextual .replies[data-comments-level='4'] & {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
@media (hover: hover) {
|
||||
transition: border-color 0.3s ease-out;
|
||||
}
|
||||
|
@ -1966,6 +1970,7 @@ a.card:is(:hover, :focus):visited {
|
|||
border-color: var(--outline-hover-color);
|
||||
}
|
||||
|
||||
.status:focus &,
|
||||
&.open {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
|
@ -1975,30 +1980,13 @@ a.card:is(:hover, :focus):visited {
|
|||
& {
|
||||
border-color: var(--outline-hover-color);
|
||||
}
|
||||
.status:has(&):focus & {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
transform: translateX(0);
|
||||
}
|
||||
.status-focus:has(&):has(.status:focus) {
|
||||
transition: background-color 0.1s ease-out 0.3s;
|
||||
background-color: var(--bg-faded-blur-color);
|
||||
}
|
||||
}
|
||||
@media (pointer: fine), (hover: hover) {
|
||||
.status:has(&):hover & {
|
||||
.status:hover & {
|
||||
opacity: 1;
|
||||
pointer-events: auto;
|
||||
transform: translateX(0);
|
||||
}
|
||||
.status:has(&):hover {
|
||||
/* background-color: var(--bg-faded-blur-color); */
|
||||
background-image: linear-gradient(
|
||||
-140deg,
|
||||
var(--bg-faded-color),
|
||||
transparent 75%
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
&.open {
|
||||
|
@ -2013,6 +2001,23 @@ a.card:is(:hover, :focus):visited {
|
|||
}
|
||||
}
|
||||
}
|
||||
.timeline.contextual .descendant .status {
|
||||
--bg-gradient: linear-gradient(
|
||||
-140deg,
|
||||
var(--bg-faded-color),
|
||||
transparent 75%
|
||||
);
|
||||
|
||||
&:focus {
|
||||
background-image: var(--bg-gradient);
|
||||
}
|
||||
|
||||
@media (pointer: fine), (hover: hover) {
|
||||
&:hover {
|
||||
background-image: var(--bg-gradient);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* BADGE */
|
||||
|
||||
|
|
Loading…
Reference in a new issue