/* ==========================================================================
Icon library.
========================================================================== */
.icon {
--icon-size: 16px;
width: var(--icon-size);
height: var(--icon-size);
&:before {
content: "";
display: inline-block;
width: inherit;
height: inherit;
mask-repeat: no-repeat;
mask-position: center;
mask-size: var(--icon-size);
background: var(--color-fg);
transition: var(--transition);
}
}
/* Variables.
========================================================================== */
:root {
--icon-default: url("data:image/svg+xml,");
--icon-default1: url("data:image/svg+xml,");
--icon-env: url("data:image/svg+xml,");
--icon-fbp: url("data:image/svg+xml,");
--icon-lab: url("data:image/svg+xml,");
--icon-line: url("data:image/svg+xml,");
--icon-overall: url("data:image/svg+xml,<%3Fxml version='1.0' encoding='UTF-8' standalone='no'%3F>%0A");
--icon-phone: url("data:image/svg+xml,");
--icon-sup: url("data:image/svg+xml,");
--icon-z_handle_e: url("data:image/svg+xml,");
--icon-z_handle_w: url("data:image/svg+xml,");
}
/* Classes.
========================================================================== */
.icon--default:before {
mask-image: var(--icon-default);
}
.icon--default1:before {
mask-image: var(--icon-default1);
}
.icon--env:before {
mask-image: var(--icon-env);
}
.icon--fbp:before {
mask-image: var(--icon-fbp);
}
.icon--lab:before {
mask-image: var(--icon-lab);
}
.icon--line:before {
mask-image: var(--icon-line);
}
.icon--overall:before {
mask-image: var(--icon-overall);
}
.icon--phone:before {
mask-image: var(--icon-phone);
}
.icon--sup:before {
mask-image: var(--icon-sup);
}
.icon--z_handle_e:before {
mask-image: var(--icon-z_handle_e);
}
.icon--z_handle_w:before {
mask-image: var(--icon-z_handle_w);
}