this repo has no description
Lower contrast for shiny pill, higher contrast for toasts
Maybe shouldn't call it shiny pill anymore lol
+17
-16
+17
-16
src/app.css
+17
-16
src/app.css
···
1737
1737
1738
1738
:is(.shiny-pill, :root .toastify.shiny-pill) {
1739
1739
pointer-events: auto;
1740
-
color: var(--button-text-color);
1741
-
text-shadow: 0 calc(var(--hairline-width) * -1) var(--drop-shadow-color);
1742
-
background-color: var(--button-bg-color);
1743
-
background-image: linear-gradient(
1744
-
160deg,
1745
-
rgba(255, 255, 255, 0.5),
1746
-
rgba(0, 0, 0, 0.1)
1747
-
);
1748
-
box-shadow: 0 3px 8px -1px var(--drop-shadow-color),
1749
-
0 10px 36px -4px var(--button-bg-blur-color),
1750
-
inset var(--hairline-width) var(--hairline-width) rgba(255, 255, 255, 0.5);
1751
-
transition: filter 0.3s;
1740
+
color: var(--link-text-color);
1741
+
font-weight: 500;
1742
+
text-shadow: 0 1px var(--bg-color);
1743
+
background-color: var(--bg-color);
1744
+
border: 1px solid var(--outline-color);
1745
+
box-shadow: 0 0 0 1px var(--bg-blur-color),
1746
+
0 3px 16px var(--drop-shadow-color),
1747
+
0 6px 16px -3px var(--drop-shadow-color);
1752
1748
}
1753
1749
:is(.shiny-pill, :root .toastify.shiny-pill):hover {
1754
-
filter: brightness(1.2);
1750
+
color: var(--text-color);
1751
+
border-color: var(--link-color);
1752
+
filter: none;
1753
+
box-shadow: 0 0 0 1px var(--link-color), 0 3px 16px var(--drop-shadow-color),
1754
+
0 6px 16px -3px var(--drop-shadow-color);
1755
1755
}
1756
1756
:is(.shiny-pill, :root .toastify.shiny-pill):active {
1757
1757
transition: none;
1758
-
filter: brightness(0.9);
1758
+
filter: brightness(0.975);
1759
1759
}
1760
1760
1761
1761
/* TOAST */
···
1767
1767
pointer-events: none;
1768
1768
color: var(--button-text-color);
1769
1769
text-shadow: 0 calc(var(--hairline-width) * -1) var(--drop-shadow-color);
1770
-
background-color: var(--button-bg-blur-color);
1770
+
background-color: var(--button-bg-color);
1771
1771
background-image: none;
1772
-
backdrop-filter: blur(16px);
1772
+
box-shadow: 0 3px 8px -1px var(--drop-shadow-color),
1773
+
0 10px 36px -4px var(--button-bg-blur-color);
1773
1774
}
1774
1775
.toastify-bottom {
1775
1776
margin-bottom: env(safe-area-inset-bottom);