New: Allow users to bring back extra card buttons on hover on desktop

This commit is contained in:
lscambo13 committed 2025-05-28 08:56:57 -07:00
1 parent fb078c99f7
commit 0f0d8bc1fa
2 files changed
+29 -1

No files matched your search

+13
View File
@@ -103,6 +103,19 @@ https://github.com/user-attachments/assets/7a492f89-9c82-4038-a07a-a9a59e4f8eef
</details> </details>
<details>
<summary><i>4. Enable extra buttons when hovering over cards on desktop</i></summary>
- To enable watched and favorite buttons at the bottom right corner of cards, copy and paste the following code at the end in Custom CSS box, click save and finally refresh your app/webpage.
```
:root{
--extraCardButtonsVisibility: block;
}
```
- To disable them again, simply remove this code block or replace `block` with `none`.
</details>
<hr> <hr>
### 🆗 Tested on ### 🆗 Tested on
+16 -1
View File
@@ -78,6 +78,8 @@
/* to revert to old icons, use 'Material Icons'*/ /* to revert to old icons, use 'Material Icons'*/
--iconPack: 'Material Icons Round'; --iconPack: 'Material Icons Round';
--extraCardButtonsVisibility: none;
} }
html { html {
@@ -322,10 +324,23 @@ html {
color: white; color: white;
} }
.layout-desktop .cardOverlayButton-br { .layout-desktop .cardOverlayButton-br button[data-action="menu"] {
display: none; display: none;
} }
.layout-desktop .cardOverlayButton-br,
[dir=ltr].layout-desktop .cardOverlayButton-br {
bottom: .5em;
right: .5em;
display: var(--extraCardButtonsVisibility);
text-shadow: 0 0 4px #000000cf;
}
.layout-desktop .cardOverlayButton-br button {
color: var(--textColor);
text-shadow: 0 0 4px #000000cf;
}
.layout-mobile .cardOverlayButton { .layout-mobile .cardOverlayButton {
padding: 1em; padding: 1em;
font-size: 75%; font-size: 75%;