ui: Icon related fixups (#13183)

* ui: Use new icon-size and icon-color for popover-menus

* Remove the default currentColor plus add some more defaults

* Undo transparency overwrites now we don't need them

* Fixup discochain icons

* Undo a default icon rule for vert align

* Fixup expanded icon for meatball popovers

* Fixup intention permission labels/badges/icons

* Remove different res icon

* Remove icon resolutions
This commit is contained in:
John Cowen 2022-05-25 14:28:42 +01:00 committed by GitHub
parent 90d1300480
commit af460dcd97
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
621 changed files with 1115 additions and 4651 deletions

3
.changelog/13183.txt Normal file
View File

@ -0,0 +1,3 @@
```release-note:bug
ui: Re-instate '...' icon for row actions
```

View File

@ -8,7 +8,6 @@
}
%crumbs::before {
text-decoration: none;
background-color: var(--transparent);
}
%breadcrumb-milestone::before {
@extend %with-chevron-left-mask, %as-pseudo;

View File

@ -118,11 +118,8 @@
flex-wrap: wrap;
list-style-type: none;
}
%resolver-card ol li:not(:last-child)::after {
display: inline-block;
content: ',';
margin-right: 0.2em;
margin-left: -0.3em;
%resolver-card ol {
@extend %csv-list;
}
/**/
%with-chain-outlet {

View File

@ -16,9 +16,7 @@
<dd>
<ol>
{{#each @item.Failover.Targets as |item|}}
<li>
<span>{{item}}</span>
</li>
<li><span>{{item}}</span></li>
{{/each}}
</ol>
</dd>

View File

@ -91,13 +91,16 @@
}
%resolver-card dt {
font-size: 0;
background-size: 80% 80%;
}
%resolver-card dl.failover dt {
@extend %with-cloud-cross-icon;
%resolver-card dt::before {
content: '';
--icon-size: icon-999;
}
%resolver-card dl.redirect dt {
@extend %with-redirect-icon;
%resolver-card dl.failover dt::before {
--icon-name: icon-cloud-cross;
}
%resolver-card dl.redirect dt::before {
--icon-name: icon-redirect;
}
/**/
%with-chain-outlet::before {

View File

@ -14,5 +14,4 @@
content: var(--csv-list-separator);
vertical-align: initial;
margin-right: 0.3em;
background-color: var(--transparent);
}

View File

@ -3,6 +3,10 @@
@extend %main-nav-vertical-hoisted;
left: 100px;
}
nav .dcs li.is-primary span,
nav .dcs li.is-local span {
@extend %menu-panel-badge;
}
nav li.partitions,
nav li.nspaces {
@extend %main-nav-vertical-popover-menu;

View File

@ -47,7 +47,6 @@
display: block;
margin-top: -0.5rem;
margin-bottom: 0.5rem;
background-color: var(--transparent);
}
%main-nav-vertical-popover-menu-trigger {
border: var(--decor-border-100);

View File

@ -11,9 +11,6 @@
%menu-panel {
@extend %panel;
}
%menu-panel-item span {
@extend %menu-panel-badge;
}
%menu-panel [role='separator'] {
@extend %panel-separator;
@extend %menu-panel-separator;

View File

@ -21,10 +21,10 @@
font-size: 0;
}
%more-popover-menu-trigger > *::after {
@extend %with-more-horizontal-mask, %as-pseudo;
background-color: rgb(var(--tone-gray-900));
width: 16px;
height: 16px;
--icon-name: icon-more-horizontal;
--icon-color: rgb(var(--tone-gray-900));
--icon-size: icon-300;
content: '';
position: absolute;
top: 50%;
left: 50%;

View File

@ -10,9 +10,7 @@ span.policy-node-identity,
}
span.policy-service-identity::before,
span.policy-node-identity::before {
width: auto;
align-self: start;
font-size: inherit;
vertical-align: unset;
}
span.policy-node-identity::before {
content: 'Node Identity: ';

View File

@ -17,7 +17,6 @@
display: inline;
visibility: visible;
content: '■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■';
background-color: var(--transparent);
}
%secret-button input:checked ~ em::before {
display: none;

View File

@ -45,7 +45,6 @@
&::before {
border-color: var(--transparent);
border-style: solid;
background-color: var(--transparent);
}
}
@ -53,27 +52,23 @@
&::before {
border-width: var(--size) var(--size) 0;
border-top-color: initial;
background-color: var(--transparent);
}
}
%tooltip-tail-bottom {
&::before {
border-width: 0 var(--size) var(--size);
border-bottom-color: initial;
background-color: var(--transparent);
}
}
%tooltip-tail-left {
&::before {
border-width: var(--size) 0 var(--size) var(--size);
border-left-color: initial;
background-color: var(--transparent);
}
}
%tooltip-tail-right {
&::before {
border-width: var(--size) var(--size) var(--size) 0;
border-right-color: initial;
background-color: var(--transparent);
}
}

View File

@ -1,19 +1,24 @@
*::before, *::after {
display: inline-block;
animation-play-state: paused;
animation-fill-mode: forwards;
animation-iteration-count: var(--icon-resolution, 1);
vertical-align: text-top;
background-repeat: no-repeat;
background-position: center;
mask-repeat: no-repeat;
-webkit-mask-repeat: no-repeat;
mask-position: center;
-webkit-mask-position: center;
}
*::before {
animation-name: var(--icon-name-start, var(--icon-name)),
var(--icon-size-start, var(--icon-size, icon-000));
background-color: var(--icon-color-start, var(--icon-color, currentColor));
background-color: var(--icon-color-start, var(--icon-color));
}
*::after {
animation-name: var(--icon-name-end, var(--icon-name)),
var(--icon-size-end, var(--icon-size, icon-000));
background-color: var(--icon-color-end, var(--icon-color, currentColor));
background-color: var(--icon-color-end, var(--icon-color));
}
[style*='--icon-color-start']::before {
@ -87,3 +92,9 @@
height: 1.750rem; /* 28px */
}
}
@keyframes icon-999 {
100% {
width: 100%;
height: 100%;
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-activity {
50% {
background-color: var(--icon-color, var(--color-activity-500, currentColor));
-webkit-mask-image: var(--icon-activity-24);
mask-image: var(--icon-activity-24);
}
100% {
background-color: var(--icon-color, var(--color-activity-500, currentColor));
-webkit-mask-image: var(--icon-activity-16);
mask-image: var(--icon-activity-16);
background-color: var(--icon-color, var(--color-activity-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-alert-circle-fill {
50% {
background-color: var(--icon-color, var(--color-alert-circle-fill-500, currentColor));
-webkit-mask-image: var(--icon-alert-circle-fill-24);
mask-image: var(--icon-alert-circle-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-alert-circle-fill-500, currentColor));
-webkit-mask-image: var(--icon-alert-circle-fill-16);
mask-image: var(--icon-alert-circle-fill-16);
background-color: var(--icon-color, var(--color-alert-circle-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-alert-circle-outline {
50% {
background-color: var(--icon-color, var(--color-alert-circle-outline-500, currentColor));
-webkit-mask-image: var(--icon-alert-circle-24);
mask-image: var(--icon-alert-circle-24);
}
100% {
background-color: var(--icon-color, var(--color-alert-circle-outline-500, currentColor));
-webkit-mask-image: var(--icon-alert-circle-16);
mask-image: var(--icon-alert-circle-16);
background-color: var(--icon-color, var(--color-alert-circle-outline-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-alert-circle {
50% {
background-color: var(--icon-color, var(--color-alert-circle-500, currentColor));
-webkit-mask-image: var(--icon-alert-circle-24);
mask-image: var(--icon-alert-circle-24);
}
100% {
background-color: var(--icon-color, var(--color-alert-circle-500, currentColor));
-webkit-mask-image: var(--icon-alert-circle-16);
mask-image: var(--icon-alert-circle-16);
background-color: var(--icon-color, var(--color-alert-circle-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-alert-octagon-fill {
50% {
background-color: var(--icon-color, var(--color-alert-octagon-fill-500, currentColor));
-webkit-mask-image: var(--icon-alert-octagon-fill-24);
mask-image: var(--icon-alert-octagon-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-alert-octagon-fill-500, currentColor));
-webkit-mask-image: var(--icon-alert-octagon-fill-16);
mask-image: var(--icon-alert-octagon-fill-16);
background-color: var(--icon-color, var(--color-alert-octagon-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-alert-octagon {
50% {
background-color: var(--icon-color, var(--color-alert-octagon-500, currentColor));
-webkit-mask-image: var(--icon-alert-octagon-24);
mask-image: var(--icon-alert-octagon-24);
}
100% {
background-color: var(--icon-color, var(--color-alert-octagon-500, currentColor));
-webkit-mask-image: var(--icon-alert-octagon-16);
mask-image: var(--icon-alert-octagon-16);
background-color: var(--icon-color, var(--color-alert-octagon-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-alert-triangle-fill {
50% {
background-color: var(--icon-color, var(--color-alert-triangle-fill-500, currentColor));
-webkit-mask-image: var(--icon-alert-triangle-fill-24);
mask-image: var(--icon-alert-triangle-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-alert-triangle-fill-500, currentColor));
-webkit-mask-image: var(--icon-alert-triangle-fill-16);
mask-image: var(--icon-alert-triangle-fill-16);
background-color: var(--icon-color, var(--color-alert-triangle-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-alert-triangle {
50% {
background-color: var(--icon-color, var(--color-alert-triangle-500, currentColor));
-webkit-mask-image: var(--icon-alert-triangle-24);
mask-image: var(--icon-alert-triangle-24);
}
100% {
background-color: var(--icon-color, var(--color-alert-triangle-500, currentColor));
-webkit-mask-image: var(--icon-alert-triangle-16);
mask-image: var(--icon-alert-triangle-16);
background-color: var(--icon-color, var(--color-alert-triangle-500, currentColor));
}
}

View File

@ -1,8 +1,4 @@
@keyframes icon-alibaba-color {
50% {
background-image: var(--icon-alibaba-color-24);
}
100% {
background-image: var(--icon-alibaba-color-16);
}

View File

@ -1,15 +1,9 @@
@keyframes icon-alibaba {
50% {
background-color: var(--icon-color, var(--color-alibaba-500, currentColor));
-webkit-mask-image: var(--icon-alibaba-color-24);
mask-image: var(--icon-alibaba-color-24);
}
100% {
background-color: var(--icon-color, var(--color-alibaba-500, currentColor));
-webkit-mask-image: var(--icon-alibaba-color-16);
mask-image: var(--icon-alibaba-color-16);
background-color: var(--icon-color, var(--color-alibaba-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-align-center {
50% {
background-color: var(--icon-color, var(--color-align-center-500, currentColor));
-webkit-mask-image: var(--icon-align-center-24);
mask-image: var(--icon-align-center-24);
}
100% {
background-color: var(--icon-color, var(--color-align-center-500, currentColor));
-webkit-mask-image: var(--icon-align-center-16);
mask-image: var(--icon-align-center-16);
background-color: var(--icon-color, var(--color-align-center-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-align-justify {
50% {
background-color: var(--icon-color, var(--color-align-justify-500, currentColor));
-webkit-mask-image: var(--icon-align-justify-24);
mask-image: var(--icon-align-justify-24);
}
100% {
background-color: var(--icon-color, var(--color-align-justify-500, currentColor));
-webkit-mask-image: var(--icon-align-justify-16);
mask-image: var(--icon-align-justify-16);
background-color: var(--icon-color, var(--color-align-justify-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-align-left {
50% {
background-color: var(--icon-color, var(--color-align-left-500, currentColor));
-webkit-mask-image: var(--icon-align-left-24);
mask-image: var(--icon-align-left-24);
}
100% {
background-color: var(--icon-color, var(--color-align-left-500, currentColor));
-webkit-mask-image: var(--icon-align-left-16);
mask-image: var(--icon-align-left-16);
background-color: var(--icon-color, var(--color-align-left-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-align-right {
50% {
background-color: var(--icon-color, var(--color-align-right-500, currentColor));
-webkit-mask-image: var(--icon-align-right-24);
mask-image: var(--icon-align-right-24);
}
100% {
background-color: var(--icon-color, var(--color-align-right-500, currentColor));
-webkit-mask-image: var(--icon-align-right-16);
mask-image: var(--icon-align-right-16);
background-color: var(--icon-color, var(--color-align-right-500, currentColor));
}
}

View File

@ -1,8 +1,4 @@
@keyframes icon-amazon-eks-color {
50% {
background-image: var(--icon-amazon-eks-color-24);
}
100% {
background-image: var(--icon-amazon-eks-color-16);
}

View File

@ -1,15 +1,9 @@
@keyframes icon-amazon-eks {
50% {
background-color: var(--icon-color, var(--color-amazon-eks-500, currentColor));
-webkit-mask-image: var(--icon-amazon-eks-color-24);
mask-image: var(--icon-amazon-eks-color-24);
}
100% {
background-color: var(--icon-color, var(--color-amazon-eks-500, currentColor));
-webkit-mask-image: var(--icon-amazon-eks-color-16);
mask-image: var(--icon-amazon-eks-color-16);
background-color: var(--icon-color, var(--color-amazon-eks-500, currentColor));
}
}

View File

@ -1,8 +1,4 @@
@keyframes icon-apple-color {
50% {
background-image: var(--icon-apple-color-24);
}
100% {
background-image: var(--icon-apple-color-16);
}

View File

@ -1,15 +1,9 @@
@keyframes icon-apple {
50% {
background-color: var(--icon-color, var(--color-apple-500, currentColor));
-webkit-mask-image: var(--icon-apple-color-24);
mask-image: var(--icon-apple-color-24);
}
100% {
background-color: var(--icon-color, var(--color-apple-500, currentColor));
-webkit-mask-image: var(--icon-apple-color-16);
mask-image: var(--icon-apple-color-16);
background-color: var(--icon-color, var(--color-apple-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-archive {
50% {
background-color: var(--icon-color, var(--color-archive-500, currentColor));
-webkit-mask-image: var(--icon-archive-24);
mask-image: var(--icon-archive-24);
}
100% {
background-color: var(--icon-color, var(--color-archive-500, currentColor));
-webkit-mask-image: var(--icon-archive-16);
mask-image: var(--icon-archive-16);
background-color: var(--icon-color, var(--color-archive-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-down-circle {
50% {
background-color: var(--icon-color, var(--color-arrow-down-circle-500, currentColor));
-webkit-mask-image: var(--icon-arrow-down-circle-24);
mask-image: var(--icon-arrow-down-circle-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-down-circle-500, currentColor));
-webkit-mask-image: var(--icon-arrow-down-circle-16);
mask-image: var(--icon-arrow-down-circle-16);
background-color: var(--icon-color, var(--color-arrow-down-circle-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-down-left {
50% {
background-color: var(--icon-color, var(--color-arrow-down-left-500, currentColor));
-webkit-mask-image: var(--icon-arrow-down-left-24);
mask-image: var(--icon-arrow-down-left-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-down-left-500, currentColor));
-webkit-mask-image: var(--icon-arrow-down-left-16);
mask-image: var(--icon-arrow-down-left-16);
background-color: var(--icon-color, var(--color-arrow-down-left-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-down-right {
50% {
background-color: var(--icon-color, var(--color-arrow-down-right-500, currentColor));
-webkit-mask-image: var(--icon-arrow-down-right-24);
mask-image: var(--icon-arrow-down-right-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-down-right-500, currentColor));
-webkit-mask-image: var(--icon-arrow-down-right-16);
mask-image: var(--icon-arrow-down-right-16);
background-color: var(--icon-color, var(--color-arrow-down-right-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-down {
50% {
background-color: var(--icon-color, var(--color-arrow-down-500, currentColor));
-webkit-mask-image: var(--icon-arrow-down-24);
mask-image: var(--icon-arrow-down-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-down-500, currentColor));
-webkit-mask-image: var(--icon-arrow-down-16);
mask-image: var(--icon-arrow-down-16);
background-color: var(--icon-color, var(--color-arrow-down-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-left-circle {
50% {
background-color: var(--icon-color, var(--color-arrow-left-circle-500, currentColor));
-webkit-mask-image: var(--icon-arrow-left-circle-24);
mask-image: var(--icon-arrow-left-circle-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-left-circle-500, currentColor));
-webkit-mask-image: var(--icon-arrow-left-circle-16);
mask-image: var(--icon-arrow-left-circle-16);
background-color: var(--icon-color, var(--color-arrow-left-circle-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-left {
50% {
background-color: var(--icon-color, var(--color-arrow-left-500, currentColor));
-webkit-mask-image: var(--icon-arrow-left-24);
mask-image: var(--icon-arrow-left-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-left-500, currentColor));
-webkit-mask-image: var(--icon-arrow-left-16);
mask-image: var(--icon-arrow-left-16);
background-color: var(--icon-color, var(--color-arrow-left-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-right-circle {
50% {
background-color: var(--icon-color, var(--color-arrow-right-circle-500, currentColor));
-webkit-mask-image: var(--icon-arrow-right-circle-24);
mask-image: var(--icon-arrow-right-circle-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-right-circle-500, currentColor));
-webkit-mask-image: var(--icon-arrow-right-circle-16);
mask-image: var(--icon-arrow-right-circle-16);
background-color: var(--icon-color, var(--color-arrow-right-circle-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-right {
50% {
background-color: var(--icon-color, var(--color-arrow-right-500, currentColor));
-webkit-mask-image: var(--icon-arrow-right-24);
mask-image: var(--icon-arrow-right-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-right-500, currentColor));
-webkit-mask-image: var(--icon-arrow-right-16);
mask-image: var(--icon-arrow-right-16);
background-color: var(--icon-color, var(--color-arrow-right-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-up-circle {
50% {
background-color: var(--icon-color, var(--color-arrow-up-circle-500, currentColor));
-webkit-mask-image: var(--icon-arrow-up-circle-24);
mask-image: var(--icon-arrow-up-circle-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-up-circle-500, currentColor));
-webkit-mask-image: var(--icon-arrow-up-circle-16);
mask-image: var(--icon-arrow-up-circle-16);
background-color: var(--icon-color, var(--color-arrow-up-circle-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-up-left {
50% {
background-color: var(--icon-color, var(--color-arrow-up-left-500, currentColor));
-webkit-mask-image: var(--icon-arrow-up-left-24);
mask-image: var(--icon-arrow-up-left-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-up-left-500, currentColor));
-webkit-mask-image: var(--icon-arrow-up-left-16);
mask-image: var(--icon-arrow-up-left-16);
background-color: var(--icon-color, var(--color-arrow-up-left-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-up-right {
50% {
background-color: var(--icon-color, var(--color-arrow-up-right-500, currentColor));
-webkit-mask-image: var(--icon-arrow-up-right-24);
mask-image: var(--icon-arrow-up-right-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-up-right-500, currentColor));
-webkit-mask-image: var(--icon-arrow-up-right-16);
mask-image: var(--icon-arrow-up-right-16);
background-color: var(--icon-color, var(--color-arrow-up-right-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-arrow-up {
50% {
background-color: var(--icon-color, var(--color-arrow-up-500, currentColor));
-webkit-mask-image: var(--icon-arrow-up-24);
mask-image: var(--icon-arrow-up-24);
}
100% {
background-color: var(--icon-color, var(--color-arrow-up-500, currentColor));
-webkit-mask-image: var(--icon-arrow-up-16);
mask-image: var(--icon-arrow-up-16);
background-color: var(--icon-color, var(--color-arrow-up-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-at-sign {
50% {
background-color: var(--icon-color, var(--color-at-sign-500, currentColor));
-webkit-mask-image: var(--icon-at-sign-24);
mask-image: var(--icon-at-sign-24);
}
100% {
background-color: var(--icon-color, var(--color-at-sign-500, currentColor));
-webkit-mask-image: var(--icon-at-sign-16);
mask-image: var(--icon-at-sign-16);
background-color: var(--icon-color, var(--color-at-sign-500, currentColor));
}
}

View File

@ -1,8 +1,4 @@
@keyframes icon-auth0-color {
50% {
background-image: var(--icon-auth0-color-24);
}
100% {
background-image: var(--icon-auth0-color-16);
}

View File

@ -1,15 +1,9 @@
@keyframes icon-auth0 {
50% {
background-color: var(--icon-color, var(--color-auth0-500, currentColor));
-webkit-mask-image: var(--icon-auth0-color-24);
mask-image: var(--icon-auth0-color-24);
}
100% {
background-color: var(--icon-color, var(--color-auth0-500, currentColor));
-webkit-mask-image: var(--icon-auth0-color-16);
mask-image: var(--icon-auth0-color-16);
background-color: var(--icon-color, var(--color-auth0-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-auto-apply {
50% {
background-color: var(--icon-color, var(--color-auto-apply-500, currentColor));
-webkit-mask-image: var(--icon-auto-apply-24);
mask-image: var(--icon-auto-apply-24);
}
100% {
background-color: var(--icon-color, var(--color-auto-apply-500, currentColor));
-webkit-mask-image: var(--icon-auto-apply-16);
mask-image: var(--icon-auto-apply-16);
background-color: var(--icon-color, var(--color-auto-apply-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-award {
50% {
background-color: var(--icon-color, var(--color-award-500, currentColor));
-webkit-mask-image: var(--icon-award-24);
mask-image: var(--icon-award-24);
}
100% {
background-color: var(--icon-color, var(--color-award-500, currentColor));
-webkit-mask-image: var(--icon-award-16);
mask-image: var(--icon-award-16);
background-color: var(--icon-color, var(--color-award-500, currentColor));
}
}

View File

@ -1,8 +1,4 @@
@keyframes icon-aws-color {
50% {
background-image: var(--icon-aws-color-24);
}
100% {
background-image: var(--icon-aws-color-16);
}

View File

@ -1,8 +1,4 @@
@keyframes icon-aws-ec2-color {
50% {
background-image: var(--icon-aws-ec2-color-24);
}
100% {
background-image: var(--icon-aws-ec2-color-16);
}

View File

@ -1,15 +1,9 @@
@keyframes icon-aws-ec2 {
50% {
background-color: var(--icon-color, var(--color-aws-ec2-500, currentColor));
-webkit-mask-image: var(--icon-aws-ec2-color-24);
mask-image: var(--icon-aws-ec2-color-24);
}
100% {
background-color: var(--icon-color, var(--color-aws-ec2-500, currentColor));
-webkit-mask-image: var(--icon-aws-ec2-color-16);
mask-image: var(--icon-aws-ec2-color-16);
background-color: var(--icon-color, var(--color-aws-ec2-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-aws {
50% {
background-color: var(--icon-color, var(--color-aws-500, currentColor));
-webkit-mask-image: var(--icon-aws-color-24);
mask-image: var(--icon-aws-color-24);
}
100% {
background-color: var(--icon-color, var(--color-aws-500, currentColor));
-webkit-mask-image: var(--icon-aws-color-16);
mask-image: var(--icon-aws-color-16);
background-color: var(--icon-color, var(--color-aws-500, currentColor));
}
}

View File

@ -1,8 +1,4 @@
@keyframes icon-azure-color {
50% {
background-image: var(--icon-azure-color-24);
}
100% {
background-image: var(--icon-azure-color-16);
}

View File

@ -1,8 +1,4 @@
@keyframes icon-azure-devops-color {
50% {
background-image: var(--icon-azure-devops-color-24);
}
100% {
background-image: var(--icon-azure-devops-color-16);
}

View File

@ -1,15 +1,9 @@
@keyframes icon-azure-devops {
50% {
background-color: var(--icon-color, var(--color-azure-devops-500, currentColor));
-webkit-mask-image: var(--icon-azure-devops-color-24);
mask-image: var(--icon-azure-devops-color-24);
}
100% {
background-color: var(--icon-color, var(--color-azure-devops-500, currentColor));
-webkit-mask-image: var(--icon-azure-devops-color-16);
mask-image: var(--icon-azure-devops-color-16);
background-color: var(--icon-color, var(--color-azure-devops-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-azure {
50% {
background-color: var(--icon-color, var(--color-azure-500, currentColor));
-webkit-mask-image: var(--icon-azure-color-24);
mask-image: var(--icon-azure-color-24);
}
100% {
background-color: var(--icon-color, var(--color-azure-500, currentColor));
-webkit-mask-image: var(--icon-azure-color-16);
mask-image: var(--icon-azure-color-16);
background-color: var(--icon-color, var(--color-azure-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bank-vault {
50% {
background-color: var(--icon-color, var(--color-bank-vault-500, currentColor));
-webkit-mask-image: var(--icon-bank-vault-24);
mask-image: var(--icon-bank-vault-24);
}
100% {
background-color: var(--icon-color, var(--color-bank-vault-500, currentColor));
-webkit-mask-image: var(--icon-bank-vault-16);
mask-image: var(--icon-bank-vault-16);
background-color: var(--icon-color, var(--color-bank-vault-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bar-chart-alt {
50% {
background-color: var(--icon-color, var(--color-bar-chart-alt-500, currentColor));
-webkit-mask-image: var(--icon-bar-chart-alt-24);
mask-image: var(--icon-bar-chart-alt-24);
}
100% {
background-color: var(--icon-color, var(--color-bar-chart-alt-500, currentColor));
-webkit-mask-image: var(--icon-bar-chart-alt-16);
mask-image: var(--icon-bar-chart-alt-16);
background-color: var(--icon-color, var(--color-bar-chart-alt-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bar-chart {
50% {
background-color: var(--icon-color, var(--color-bar-chart-500, currentColor));
-webkit-mask-image: var(--icon-bar-chart-24);
mask-image: var(--icon-bar-chart-24);
}
100% {
background-color: var(--icon-color, var(--color-bar-chart-500, currentColor));
-webkit-mask-image: var(--icon-bar-chart-16);
mask-image: var(--icon-bar-chart-16);
background-color: var(--icon-color, var(--color-bar-chart-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-battery-charging {
50% {
background-color: var(--icon-color, var(--color-battery-charging-500, currentColor));
-webkit-mask-image: var(--icon-battery-charging-24);
mask-image: var(--icon-battery-charging-24);
}
100% {
background-color: var(--icon-color, var(--color-battery-charging-500, currentColor));
-webkit-mask-image: var(--icon-battery-charging-16);
mask-image: var(--icon-battery-charging-16);
background-color: var(--icon-color, var(--color-battery-charging-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-battery {
50% {
background-color: var(--icon-color, var(--color-battery-500, currentColor));
-webkit-mask-image: var(--icon-battery-24);
mask-image: var(--icon-battery-24);
}
100% {
background-color: var(--icon-color, var(--color-battery-500, currentColor));
-webkit-mask-image: var(--icon-battery-16);
mask-image: var(--icon-battery-16);
background-color: var(--icon-color, var(--color-battery-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-beaker {
50% {
background-color: var(--icon-color, var(--color-beaker-500, currentColor));
-webkit-mask-image: var(--icon-beaker-24);
mask-image: var(--icon-beaker-24);
}
100% {
background-color: var(--icon-color, var(--color-beaker-500, currentColor));
-webkit-mask-image: var(--icon-beaker-16);
mask-image: var(--icon-beaker-16);
background-color: var(--icon-color, var(--color-beaker-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bell-active-fill {
50% {
background-color: var(--icon-color, var(--color-bell-active-fill-500, currentColor));
-webkit-mask-image: var(--icon-bell-active-fill-24);
mask-image: var(--icon-bell-active-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-bell-active-fill-500, currentColor));
-webkit-mask-image: var(--icon-bell-active-fill-16);
mask-image: var(--icon-bell-active-fill-16);
background-color: var(--icon-color, var(--color-bell-active-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bell-active {
50% {
background-color: var(--icon-color, var(--color-bell-active-500, currentColor));
-webkit-mask-image: var(--icon-bell-active-24);
mask-image: var(--icon-bell-active-24);
}
100% {
background-color: var(--icon-color, var(--color-bell-active-500, currentColor));
-webkit-mask-image: var(--icon-bell-active-16);
mask-image: var(--icon-bell-active-16);
background-color: var(--icon-color, var(--color-bell-active-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bell-off {
50% {
background-color: var(--icon-color, var(--color-bell-off-500, currentColor));
-webkit-mask-image: var(--icon-bell-off-24);
mask-image: var(--icon-bell-off-24);
}
100% {
background-color: var(--icon-color, var(--color-bell-off-500, currentColor));
-webkit-mask-image: var(--icon-bell-off-16);
mask-image: var(--icon-bell-off-16);
background-color: var(--icon-color, var(--color-bell-off-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bell {
50% {
background-color: var(--icon-color, var(--color-bell-500, currentColor));
-webkit-mask-image: var(--icon-bell-24);
mask-image: var(--icon-bell-24);
}
100% {
background-color: var(--icon-color, var(--color-bell-500, currentColor));
-webkit-mask-image: var(--icon-bell-16);
mask-image: var(--icon-bell-16);
background-color: var(--icon-color, var(--color-bell-500, currentColor));
}
}

View File

@ -1,8 +1,4 @@
@keyframes icon-bitbucket-color {
50% {
background-image: var(--icon-bitbucket-color-24);
}
100% {
background-image: var(--icon-bitbucket-color-16);
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bitbucket {
50% {
background-color: var(--icon-color, var(--color-bitbucket-500, currentColor));
-webkit-mask-image: var(--icon-bitbucket-color-24);
mask-image: var(--icon-bitbucket-color-24);
}
100% {
background-color: var(--icon-color, var(--color-bitbucket-500, currentColor));
-webkit-mask-image: var(--icon-bitbucket-color-16);
mask-image: var(--icon-bitbucket-color-16);
background-color: var(--icon-color, var(--color-bitbucket-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bolt {
50% {
background-color: var(--icon-color, var(--color-bolt-500, currentColor));
-webkit-mask-image: var(--icon-zap-24);
mask-image: var(--icon-zap-24);
}
100% {
background-color: var(--icon-color, var(--color-bolt-500, currentColor));
-webkit-mask-image: var(--icon-zap-16);
mask-image: var(--icon-zap-16);
background-color: var(--icon-color, var(--color-bolt-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bookmark-add-fill {
50% {
background-color: var(--icon-color, var(--color-bookmark-add-fill-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-add-fill-24);
mask-image: var(--icon-bookmark-add-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-bookmark-add-fill-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-add-fill-16);
mask-image: var(--icon-bookmark-add-fill-16);
background-color: var(--icon-color, var(--color-bookmark-add-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bookmark-add {
50% {
background-color: var(--icon-color, var(--color-bookmark-add-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-add-24);
mask-image: var(--icon-bookmark-add-24);
}
100% {
background-color: var(--icon-color, var(--color-bookmark-add-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-add-16);
mask-image: var(--icon-bookmark-add-16);
background-color: var(--icon-color, var(--color-bookmark-add-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bookmark-fill {
50% {
background-color: var(--icon-color, var(--color-bookmark-fill-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-fill-24);
mask-image: var(--icon-bookmark-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-bookmark-fill-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-fill-16);
mask-image: var(--icon-bookmark-fill-16);
background-color: var(--icon-color, var(--color-bookmark-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bookmark-remove-fill {
50% {
background-color: var(--icon-color, var(--color-bookmark-remove-fill-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-remove-fill-24);
mask-image: var(--icon-bookmark-remove-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-bookmark-remove-fill-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-remove-fill-16);
mask-image: var(--icon-bookmark-remove-fill-16);
background-color: var(--icon-color, var(--color-bookmark-remove-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bookmark-remove {
50% {
background-color: var(--icon-color, var(--color-bookmark-remove-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-remove-24);
mask-image: var(--icon-bookmark-remove-24);
}
100% {
background-color: var(--icon-color, var(--color-bookmark-remove-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-remove-16);
mask-image: var(--icon-bookmark-remove-16);
background-color: var(--icon-color, var(--color-bookmark-remove-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bookmark {
50% {
background-color: var(--icon-color, var(--color-bookmark-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-24);
mask-image: var(--icon-bookmark-24);
}
100% {
background-color: var(--icon-color, var(--color-bookmark-500, currentColor));
-webkit-mask-image: var(--icon-bookmark-16);
mask-image: var(--icon-bookmark-16);
background-color: var(--icon-color, var(--color-bookmark-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bottom {
50% {
background-color: var(--icon-color, var(--color-bottom-500, currentColor));
-webkit-mask-image: var(--icon-bottom-24);
mask-image: var(--icon-bottom-24);
}
100% {
background-color: var(--icon-color, var(--color-bottom-500, currentColor));
-webkit-mask-image: var(--icon-bottom-16);
mask-image: var(--icon-bottom-16);
background-color: var(--icon-color, var(--color-bottom-500, currentColor));
}
}

View File

@ -1,8 +1,4 @@
@keyframes icon-boundary-color {
50% {
background-image: var(--icon-boundary-color-24);
}
100% {
background-image: var(--icon-boundary-color-16);
}

View File

@ -1,15 +1,9 @@
@keyframes icon-boundary {
50% {
background-color: var(--icon-color, var(--color-boundary-500, currentColor));
-webkit-mask-image: var(--icon-boundary-color-24);
mask-image: var(--icon-boundary-color-24);
}
100% {
background-color: var(--icon-color, var(--color-boundary-500, currentColor));
-webkit-mask-image: var(--icon-boundary-color-16);
mask-image: var(--icon-boundary-color-16);
background-color: var(--icon-color, var(--color-boundary-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-box-check-fill {
50% {
background-color: var(--icon-color, var(--color-box-check-fill-500, currentColor));
-webkit-mask-image: var(--icon-check-square-fill-24);
mask-image: var(--icon-check-square-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-box-check-fill-500, currentColor));
-webkit-mask-image: var(--icon-check-square-fill-16);
mask-image: var(--icon-check-square-fill-16);
background-color: var(--icon-color, var(--color-box-check-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-box-outline {
50% {
background-color: var(--icon-color, var(--color-box-outline-500, currentColor));
-webkit-mask-image: var(--icon-square-24);
mask-image: var(--icon-square-24);
}
100% {
background-color: var(--icon-color, var(--color-box-outline-500, currentColor));
-webkit-mask-image: var(--icon-square-16);
mask-image: var(--icon-square-16);
background-color: var(--icon-color, var(--color-box-outline-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-box {
50% {
background-color: var(--icon-color, var(--color-box-500, currentColor));
-webkit-mask-image: var(--icon-box-24);
mask-image: var(--icon-box-24);
}
100% {
background-color: var(--icon-color, var(--color-box-500, currentColor));
-webkit-mask-image: var(--icon-box-16);
mask-image: var(--icon-box-16);
background-color: var(--icon-color, var(--color-box-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-briefcase {
50% {
background-color: var(--icon-color, var(--color-briefcase-500, currentColor));
-webkit-mask-image: var(--icon-briefcase-24);
mask-image: var(--icon-briefcase-24);
}
100% {
background-color: var(--icon-color, var(--color-briefcase-500, currentColor));
-webkit-mask-image: var(--icon-briefcase-16);
mask-image: var(--icon-briefcase-16);
background-color: var(--icon-color, var(--color-briefcase-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-broadcast {
50% {
background-color: var(--icon-color, var(--color-broadcast-500, currentColor));
-webkit-mask-image: var(--icon-radio-24);
mask-image: var(--icon-radio-24);
}
100% {
background-color: var(--icon-color, var(--color-broadcast-500, currentColor));
-webkit-mask-image: var(--icon-radio-16);
mask-image: var(--icon-radio-16);
background-color: var(--icon-color, var(--color-broadcast-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bug {
50% {
background-color: var(--icon-color, var(--color-bug-500, currentColor));
-webkit-mask-image: var(--icon-bug-24);
mask-image: var(--icon-bug-24);
}
100% {
background-color: var(--icon-color, var(--color-bug-500, currentColor));
-webkit-mask-image: var(--icon-bug-16);
mask-image: var(--icon-bug-16);
background-color: var(--icon-color, var(--color-bug-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-build {
50% {
background-color: var(--icon-color, var(--color-build-500, currentColor));
-webkit-mask-image: var(--icon-build-24);
mask-image: var(--icon-build-24);
}
100% {
background-color: var(--icon-color, var(--color-build-500, currentColor));
-webkit-mask-image: var(--icon-build-16);
mask-image: var(--icon-build-16);
background-color: var(--icon-color, var(--color-build-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-bulb {
50% {
background-color: var(--icon-color, var(--color-bulb-500, currentColor));
-webkit-mask-image: var(--icon-bulb-24);
mask-image: var(--icon-bulb-24);
}
100% {
background-color: var(--icon-color, var(--color-bulb-500, currentColor));
-webkit-mask-image: var(--icon-bulb-16);
mask-image: var(--icon-bulb-16);
background-color: var(--icon-color, var(--color-bulb-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-calendar {
50% {
background-color: var(--icon-color, var(--color-calendar-500, currentColor));
-webkit-mask-image: var(--icon-calendar-24);
mask-image: var(--icon-calendar-24);
}
100% {
background-color: var(--icon-color, var(--color-calendar-500, currentColor));
-webkit-mask-image: var(--icon-calendar-16);
mask-image: var(--icon-calendar-16);
background-color: var(--icon-color, var(--color-calendar-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-camera-off {
50% {
background-color: var(--icon-color, var(--color-camera-off-500, currentColor));
-webkit-mask-image: var(--icon-camera-off-24);
mask-image: var(--icon-camera-off-24);
}
100% {
background-color: var(--icon-color, var(--color-camera-off-500, currentColor));
-webkit-mask-image: var(--icon-camera-off-16);
mask-image: var(--icon-camera-off-16);
background-color: var(--icon-color, var(--color-camera-off-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-camera {
50% {
background-color: var(--icon-color, var(--color-camera-500, currentColor));
-webkit-mask-image: var(--icon-camera-24);
mask-image: var(--icon-camera-24);
}
100% {
background-color: var(--icon-color, var(--color-camera-500, currentColor));
-webkit-mask-image: var(--icon-camera-16);
mask-image: var(--icon-camera-16);
background-color: var(--icon-color, var(--color-camera-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-cancel-circle-fill {
50% {
background-color: var(--icon-color, var(--color-cancel-circle-fill-500, currentColor));
-webkit-mask-image: var(--icon-x-circle-fill-24);
mask-image: var(--icon-x-circle-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-cancel-circle-fill-500, currentColor));
-webkit-mask-image: var(--icon-x-circle-fill-16);
mask-image: var(--icon-x-circle-fill-16);
background-color: var(--icon-color, var(--color-cancel-circle-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-cancel-circle-outline {
50% {
background-color: var(--icon-color, var(--color-cancel-circle-outline-500, currentColor));
-webkit-mask-image: var(--icon-x-circle-24);
mask-image: var(--icon-x-circle-24);
}
100% {
background-color: var(--icon-color, var(--color-cancel-circle-outline-500, currentColor));
-webkit-mask-image: var(--icon-x-circle-16);
mask-image: var(--icon-x-circle-16);
background-color: var(--icon-color, var(--color-cancel-circle-outline-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-cancel-plain {
50% {
background-color: var(--icon-color, var(--color-cancel-plain-500, currentColor));
-webkit-mask-image: var(--icon-x-24);
mask-image: var(--icon-x-24);
}
100% {
background-color: var(--icon-color, var(--color-cancel-plain-500, currentColor));
-webkit-mask-image: var(--icon-x-16);
mask-image: var(--icon-x-16);
background-color: var(--icon-color, var(--color-cancel-plain-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-cancel-square-fill {
50% {
background-color: var(--icon-color, var(--color-cancel-square-fill-500, currentColor));
-webkit-mask-image: var(--icon-x-square-fill-24);
mask-image: var(--icon-x-square-fill-24);
}
100% {
background-color: var(--icon-color, var(--color-cancel-square-fill-500, currentColor));
-webkit-mask-image: var(--icon-x-square-fill-16);
mask-image: var(--icon-x-square-fill-16);
background-color: var(--icon-color, var(--color-cancel-square-fill-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-cancel-square-outline {
50% {
background-color: var(--icon-color, var(--color-cancel-square-outline-500, currentColor));
-webkit-mask-image: var(--icon-x-square-24);
mask-image: var(--icon-x-square-24);
}
100% {
background-color: var(--icon-color, var(--color-cancel-square-outline-500, currentColor));
-webkit-mask-image: var(--icon-x-square-16);
mask-image: var(--icon-x-square-16);
background-color: var(--icon-color, var(--color-cancel-square-outline-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-caret-down {
50% {
background-color: var(--icon-color, var(--color-caret-down-500, currentColor));
-webkit-mask-image: var(--icon-caret-24);
mask-image: var(--icon-caret-24);
}
100% {
background-color: var(--icon-color, var(--color-caret-down-500, currentColor));
-webkit-mask-image: var(--icon-caret-16);
mask-image: var(--icon-caret-16);
background-color: var(--icon-color, var(--color-caret-down-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-caret-up {
50% {
background-color: var(--icon-color, var(--color-caret-up-500, currentColor));
-webkit-mask-image: var(--icon-chevron-up-24);
mask-image: var(--icon-chevron-up-24);
}
100% {
background-color: var(--icon-color, var(--color-caret-up-500, currentColor));
-webkit-mask-image: var(--icon-chevron-up-16);
mask-image: var(--icon-chevron-up-16);
background-color: var(--icon-color, var(--color-caret-up-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-caret {
50% {
background-color: var(--icon-color, var(--color-caret-500, currentColor));
-webkit-mask-image: var(--icon-caret-24);
mask-image: var(--icon-caret-24);
}
100% {
background-color: var(--icon-color, var(--color-caret-500, currentColor));
-webkit-mask-image: var(--icon-caret-16);
mask-image: var(--icon-caret-16);
background-color: var(--icon-color, var(--color-caret-500, currentColor));
}
}

View File

@ -1,15 +1,9 @@
@keyframes icon-cast {
50% {
background-color: var(--icon-color, var(--color-cast-500, currentColor));
-webkit-mask-image: var(--icon-cast-24);
mask-image: var(--icon-cast-24);
}
100% {
background-color: var(--icon-color, var(--color-cast-500, currentColor));
-webkit-mask-image: var(--icon-cast-16);
mask-image: var(--icon-cast-16);
background-color: var(--icon-color, var(--color-cast-500, currentColor));
}
}

Some files were not shown because too many files have changed in this diff Show More