Return some -webkit- prefixes for wider compatibility

It was too good to be true
This commit is contained in:
daudix
2024-10-02 04:20:10 +03:00
parent eae48b3762
commit 1e47460527
14 changed files with 126 additions and 38 deletions

View File

@ -33,11 +33,13 @@
}
a::after {
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='m5.707 1.293 6 6a1 1 0 0 1 0 1.414l-6 6a1 1 0 1 1-1.414-1.414L9.586 8 4.293 2.707a1 1 0 1 1 1.414-1.414m0 0'/%3E%3C/svg%3E");
-webkit-mask-image: var(--icon);
display: inline-block;
vertical-align: -0.0625em;
transform: translateX(-0.25rem);
opacity: 0;
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='m5.707 1.293 6 6a1 1 0 0 1 0 1.414l-6 6a1 1 0 1 1-1.414-1.414L9.586 8 4.293 2.707a1 1 0 1 1 1.414-1.414m0 0'/%3E%3C/svg%3E");
mask-image: var(--icon);
transition: var(--transition);
margin-inline-start: 0.25rem;
background-color: currentColor;
@ -99,6 +101,7 @@
background-color: var(--fg-muted-1);
&::before {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
background-color: var(--fg-muted-1);
}
@ -128,6 +131,7 @@
background-color: var(--purple-bg);
&::before {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
background-color: var(--purple-bg);
}
@ -156,6 +160,7 @@
background-color: var(--yellow-bg);
&::before {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
background-color: var(--yellow-bg);
}
@ -192,6 +197,7 @@
background-color: var(--red-bg);
&::before {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
background-color: var(--red-bg);
}
@ -220,6 +226,7 @@
background-color: var(--brown-bg);
&::before {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
background-color: var(--brown-bg);
}
@ -269,6 +276,7 @@
color: var(--fg-muted-5);
.icon {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
}
}
@ -278,6 +286,7 @@
color: var(--purple-fg);
.icon {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
}
}
@ -287,6 +296,7 @@
color: var(--yellow-fg);
.icon {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
}
}
@ -296,6 +306,7 @@
color: var(--red-fg);
.icon {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
}
}
@ -305,6 +316,7 @@
color: var(--brown-fg);
.icon {
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
}
}
@ -400,19 +412,27 @@
}
#paginator-first .icon {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M3 2v12h2V8.414l5.293 5.293a1 1 0 1 0 1.414-1.414L7.414 8l4.293-4.293a1 1 0 1 0-1.414-1.414L5 7.586V2zm0 0'/%3E%3C/svg%3E");
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M3 2v12h2V8.414l5.293 5.293a1 1 0 1 0 1.414-1.414L7.414 8l4.293-4.293a1 1 0 1 0-1.414-1.414L5 7.586V2zm0 0'/%3E%3C/svg%3E");
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
}
#paginator-previous .icon {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='m9.293 13.707-5-5a1 1 0 0 1 0-1.414l5-5a1 1 0 1 1 1.414 1.414L6.414 8l4.293 4.293a1 1 0 1 1-1.414 1.414m0 0'/%3E%3C/svg%3E");
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='m9.293 13.707-5-5a1 1 0 0 1 0-1.414l5-5a1 1 0 1 1 1.414 1.414L6.414 8l4.293 4.293a1 1 0 1 1-1.414 1.414m0 0'/%3E%3C/svg%3E");
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
}
#paginator-next .icon {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='m6.707 13.707 5-5a1 1 0 0 0 0-1.414l-5-5a1 1 0 1 0-1.414 1.414L9.586 8l-4.293 4.293a1 1 0 1 0 1.414 1.414m0 0'/%3E%3C/svg%3E");
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='m6.707 13.707 5-5a1 1 0 0 0 0-1.414l-5-5a1 1 0 1 0-1.414 1.414L9.586 8l-4.293 4.293a1 1 0 1 0 1.414 1.414m0 0'/%3E%3C/svg%3E");
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
}
#paginator-last .icon {
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M11 2v5.586L5.707 2.293a1 1 0 1 0-1.414 1.414L8.586 8l-4.293 4.293a1 1 0 1 0 1.414 1.414L11 8.414V14h2V2zm0 0'/%3E%3C/svg%3E");
--icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3E%3Cpath d='M11 2v5.586L5.707 2.293a1 1 0 1 0-1.414 1.414L8.586 8l-4.293 4.293a1 1 0 1 0 1.414 1.414L11 8.414V14h2V2zm0 0'/%3E%3C/svg%3E");
-webkit-mask-image: var(--icon);
mask-image: var(--icon);
}
#paginator-counter {