Convert all icons to CSS variables, add feed button next to tags heading
This commit is contained in:
@ -3,50 +3,4 @@
|
||||
margin-block-start: 0;
|
||||
margin-block-end: 0;
|
||||
}
|
||||
|
||||
a[href*="#fr-"] {
|
||||
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M5 14a1 1 0 0 1-.707-.293l-4-4a1 1 0 0 1 0-1.414l4-4a1 1 0 1 1 1.414 1.414L3.414 8H12c1.117 0 2-.883 2-2s-.883-2-2-2c-.55 0-1-.45-1-1s.45-1 1-1c2.2 0 4 1.8 4 4s-1.8 4-4 4H3.414l2.293 2.293A1 1 0 0 1 5 14m0 0'/%3E%3C/svg%3E");
|
||||
-webkit-user-select: none;
|
||||
-webkit-mask-image: var(--icon);
|
||||
display: inline-block;
|
||||
vertical-align: -0.3125em;
|
||||
mask-image: var(--icon);
|
||||
mask-size: cover;
|
||||
transition: var(--transition);
|
||||
background-color: var(--fg-muted-4);
|
||||
width: 1rem;
|
||||
height: 1rem;
|
||||
color: transparent;
|
||||
user-select: none;
|
||||
|
||||
:root[dir*="rtl"] & {
|
||||
transform: scaleX(-1);
|
||||
|
||||
&:active {
|
||||
transform: scaleX(-1) var(--active);
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--accent-color);
|
||||
}
|
||||
|
||||
&:active {
|
||||
transform: var(--active);
|
||||
}
|
||||
}
|
||||
|
||||
a + a[href*="#fr-"],
|
||||
li:target a[href*="#fr-"] {
|
||||
opacity: var(--dim-opacity);
|
||||
background-color: var(--accent-color);
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
li:target a[href*="#fr-"] {
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
Reference in New Issue
Block a user