moon
/
pleroma-fe
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make interaction buttons use focused-style

This commit is contained in:
tusooa 2023-03-02 21:39:39 -05:00
parent 090f4b854e
commit 3a8de1e449
No known key found for this signature in database
GPG Key ID: 7B467EDE43A08224
5 changed files with 26 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/extra_buttons/extra_buttons.vue
View File

@ -192,11 +192,6 @@
position: static; position: static;
padding: 10px; padding: 10px;
margin: -10px; margin: -10px;
&:hover .svg-inline--fa {
color: $fallback--text;
color: var(--text, $fallback--text);
}
} }
.popover-trigger-button { .popover-trigger-button {
@ -213,6 +208,11 @@
.focus-marker { .focus-marker {
visibility: visible; visibility: visible;
} }
.svg-inline--fa {
color: $fallback--text;
color: var(--text, $fallback--text);
}
} }
} }
} }

6
src/components/favorite_button/favorite_button.vue
View File

@ -86,7 +86,6 @@
animation-duration: 0.6s; animation-duration: 0.6s;
} }
&:hover .svg-inline--fa,
&.-favorited .svg-inline--fa { &.-favorited .svg-inline--fa {
color: $fallback--cOrange; color: $fallback--cOrange;
color: var(--cOrange, $fallback--cOrange); color: var(--cOrange, $fallback--cOrange);
@ -103,6 +102,11 @@
} }
@include focused-style { @include focused-style {
.svg-inline--fa {
color: $fallback--cOrange;
color: var(--cOrange, $fallback--cOrange);
}
.focus-marker { .focus-marker {
visibility: visible; visibility: visible;
} }

12
src/components/react_button/react_button.vue
View File

@ -121,7 +121,7 @@
line-height: 1.5; line-height: 1.5;
align-content: center; align-content: center;
&:hover { @include focused-style {
transform: scale(1.25); transform: scale(1.25);
} }
} }
@ -130,11 +130,6 @@
.popover-trigger { .popover-trigger {
padding: 10px; padding: 10px;
margin: -10px; margin: -10px;
&:hover .svg-inline--fa {
color: $fallback--text;
color: var(--text, $fallback--text);
}
} }
.popover-trigger-button { .popover-trigger-button {
@ -151,6 +146,11 @@
.focus-marker { .focus-marker {
visibility: visible; visibility: visible;
} }
.svg-inline--fa {
color: $fallback--text;
color: var(--text, $fallback--text);
}
} }
} }
} }

6
src/components/reply_button/reply_button.vue
View File

@ -76,7 +76,6 @@
} }
.interactive { .interactive {
&:hover .svg-inline--fa,
&.-active .svg-inline--fa { &.-active .svg-inline--fa {
color: $fallback--cBlue; color: $fallback--cBlue;
color: var(--cBlue, $fallback--cBlue); color: var(--cBlue, $fallback--cBlue);
@ -89,6 +88,11 @@
} }
@include focused-style { @include focused-style {
.svg-inline--fa {
color: $fallback--cBlue;
color: var(--cBlue, $fallback--cBlue);
}
.focus-marker { .focus-marker {
visibility: visible; visibility: visible;
} }

6
src/components/retweet_button/retweet_button.vue
View File

@ -105,7 +105,6 @@
animation-duration: 0.6s; animation-duration: 0.6s;
} }
&:hover .svg-inline--fa,
&.-repeated .svg-inline--fa { &.-repeated .svg-inline--fa {
color: $fallback--cGreen; color: $fallback--cGreen;
color: var(--cGreen, $fallback--cGreen); color: var(--cGreen, $fallback--cGreen);
@ -122,6 +121,11 @@
} }
@include focused-style { @include focused-style {
.svg-inline--fa {
color: $fallback--cGreen;
color: var(--cGreen, $fallback--cGreen);
}
.focus-marker { .focus-marker {
visibility: visible; visibility: visible;
} }