fix: paper-icon-button-light hover on focus

This commit is contained in:
Adam Perkowski
2025-03-01 22:47:05 +01:00
parent 30e34913f6
commit e56da53c57
3 changed files with 30 additions and 36 deletions
+1
View File
@@ -18,4 +18,5 @@ indent_size = 2
# documentation, utils # documentation, utils
[*.{md,mdx,diff}] [*.{md,mdx,diff}]
indent_size = 4
trim_trailing_whitespace = false trim_trailing_whitespace = false
+29 -35
View File
@@ -1,37 +1,37 @@
<h3 align="center"> <h3 align="center">
<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/logos/exports/1544x1544_circle.png" width="100" alt="Logo"/><br/> <img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/logos/exports/1544x1544_circle.png" width="100" alt="Logo"/><br/>
<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/misc/transparent.png" height="30" width="0px"/> <img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/misc/transparent.png" height="30" width="0px"/>
Catppuccin for <a href="https://jellyfin.org">Jellyfin</a> Catppuccin for <a href="https://jellyfin.org">Jellyfin</a>
<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/misc/transparent.png" height="30" width="0px"/> <img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/misc/transparent.png" height="30" width="0px"/>
</h3> </h3>
<p align="center"> <p align="center">
<a href="https://github.com/adamperkowski/jellyfin/stargazers"><img src="https://img.shields.io/github/stars/adamperkowski/jellyfin?colorA=363a4f&colorB=b7bdf8&style=for-the-badge"></a> <a href="https://github.com/adamperkowski/jellyfin/stargazers"><img src="https://img.shields.io/github/stars/adamperkowski/jellyfin?colorA=363a4f&colorB=b7bdf8&style=for-the-badge"></a>
<a href="https://github.com/catppuccin/template/issues"><img src="https://img.shields.io/github/issues/adamperkowski/jellyfin?colorA=363a4f&colorB=f5a97f&style=for-the-badge"></a> <a href="https://github.com/catppuccin/template/issues"><img src="https://img.shields.io/github/issues/adamperkowski/jellyfin?colorA=363a4f&colorB=f5a97f&style=for-the-badge"></a>
<a href="https://github.com/adamperkowski/jellyfin/contributors"><img src="https://img.shields.io/github/contributors/adamperkowski/jellyfin?colorA=363a4f&colorB=a6da95&style=for-the-badge"></a> <a href="https://github.com/adamperkowski/jellyfin/contributors"><img src="https://img.shields.io/github/contributors/adamperkowski/jellyfin?colorA=363a4f&colorB=a6da95&style=for-the-badge"></a>
</p> </p>
<p align="center"> <p align="center">
<img src="/assets/preview.webp"/> <img src="/assets/preview.webp"/>
</p> </p>
## Previews ## Previews
<details> <details>
<summary>🌻 Latte</summary> <summary>🌻 Latte</summary>
<img src="/assets/latte.webp"/> <img src="/assets/latte.webp"/>
</details> </details>
<details> <details>
<summary>🪴 Frappé</summary> <summary>🪴 Frappé</summary>
<img src="/assets/frappe.webp"/> <img src="/assets/frappe.webp"/>
</details> </details>
<details> <details>
<summary>🌺 Macchiato</summary> <summary>🌺 Macchiato</summary>
<img src="/assets/macchiato.webp"/> <img src="/assets/macchiato.webp"/>
</details> </details>
<details> <details>
<summary>🌿 Mocha</summary> <summary>🌿 Mocha</summary>
<img src="/assets/mocha.webp"/> <img src="/assets/mocha.webp"/>
</details> </details>
## Usage ## Usage
@@ -42,20 +42,14 @@
``` ```
2. Open settings, navigate to Display and paste the CSS into the section called "Custom CSS code" 2. Open settings, navigate to Display and paste the CSS into the section called "Custom CSS code"
3. Copy your preferred flavor's import rule and paste it **after** the theme import: 3. Copy your preferred flavor's import rule and paste it **after** the theme import:
- 🌻 Latte
```css ```css
/* 🌻 Latte */
@import url('https://adamperkowski.github.io/jellyfin/latte.css'); @import url('https://adamperkowski.github.io/jellyfin/latte.css');
``` /* 🪴 Frappé */
- 🪴 Frappé
```css
@import url('https://adamperkowski.github.io/jellyfin/frappe.css'); @import url('https://adamperkowski.github.io/jellyfin/frappe.css');
``` /* 🌺 Macchiato */
- 🌺 Macchiato
```css
@import url('https://adamperkowski.github.io/jellyfin/macchiato.css'); @import url('https://adamperkowski.github.io/jellyfin/macchiato.css');
``` /* 🌿 Mocha */
- 🌿 Mocha
```css
@import url('https://adamperkowski.github.io/jellyfin/mocha.css'); @import url('https://adamperkowski.github.io/jellyfin/mocha.css');
``` ```
4. Press save and you're done! 4. Press save and you're done!
@@ -65,13 +59,13 @@
The accent color can be overrided by adding the following **after** the imports: The accent color can be overrided by adding the following **after** the imports:
```css ```css
:root { :root {
--main-color: var(--mauve); --main-color: var(--mauve);
} }
``` ```
<details> <details>
<summary>Preview</summary> <summary>Preview</summary>
<img src="/assets/mauve.webp"/> <img src="/assets/mauve.webp"/>
</details> </details>
There is also an everything-rounded extension available: There is also an everything-rounded extension available:
@@ -79,9 +73,9 @@ There is also an everything-rounded extension available:
@import url('https://adamperkowski.github.io/jellyfin/rounding.css'); @import url('https://adamperkowski.github.io/jellyfin/rounding.css');
``` ```
<details> <details>
<summary>Preview</summary> <summary>Preview</summary>
<img src="/assets/rounding0.webp"/> <img src="/assets/rounding0.webp"/>
<img src="/assets/rounding1.webp"/> <img src="/assets/rounding1.webp"/>
</details> </details>
## 💝 Thanks to ## 💝 Thanks to
@@ -92,13 +86,13 @@ There is also an everything-rounded extension available:
&nbsp; &nbsp;
<p align="center"> <p align="center">
<img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/footers/gray0_ctp_on_line.svg?sanitize=true" /> <img src="https://raw.githubusercontent.com/catppuccin/catppuccin/main/assets/footers/gray0_ctp_on_line.svg?sanitize=true" />
</p> </p>
<p align="center"> <p align="center">
Copyright &copy; 2021-present <a href="https://github.com/catppuccin" target="_blank">Catppuccin Org</a> Copyright &copy; 2021-present <a href="https://github.com/catppuccin" target="_blank">Catppuccin Org</a>
</p> </p>
<p align="center"> <p align="center">
<a href="https://github.com/catppuccin/catppuccin/blob/main/LICENSE"><img src="https://img.shields.io/static/v1.svg?style=for-the-badge&label=License&message=MIT&logoColor=d9e0ee&colorA=363a4f&colorB=b7bdf8"/></a> <a href="https://github.com/catppuccin/catppuccin/blob/main/LICENSE"><img src="https://img.shields.io/static/v1.svg?style=for-the-badge&label=License&message=MIT&logoColor=d9e0ee&colorA=363a4f&colorB=b7bdf8"/></a>
</p> </p>
-1
View File
@@ -100,7 +100,6 @@ html {
} }
.paper-icon-button-light:hover:not(:disabled), .paper-icon-button-light:hover:not(:disabled),
.paper-icon-button-light:focus,
.listItem:hover, .listItem:hover,
.listItem:focus, .listItem:focus,
.navMenuOption:hover, .navMenuOption:hover,