@vue-material/core
Version:
Yet another 'Material Design Components' library for Vue3.
22 lines (21 loc) • 2.77 kB
JavaScript
let lastStyleTag = null;
export default function injectCSS(css, hash) {
if (typeof window !== "undefined") {
const style = document.querySelector("style#css-" + hash) ?? document.createElement("style");
style.id = "css-" + hash;
style.textContent = css;
const head = document.head;
if (lastStyleTag) {
lastStyleTag.after(style);
return;
}
const styleTags = head.querySelectorAll("style[id^=css-]");
if (styleTags.length > 0) {
lastStyleTag = styleTags[styleTags.length - 1];
lastStyleTag.after(style);
} else {
head.prepend(style);
}
}
}
injectCSS(":root{--xxs:4px;--padding-xxs:4px;--xs:8px;--padding-xs:8px;--sm:12px;--padding-sm:12px;--md:16px;--padding-md:16px;--lg:20px;--padding-lg:20px;--xl:24px;--padding-xl:24px;--xxl:28px;--padding-xxl:28px;--component-xxs:24px;--component-xs:32px;--component-sm:40px;--component-md:48px;--component-lg:56px;--component-xl:64px;--component-xxl:72px;--size-xxs:48px;--size-xs:56px;--size-sm:64px;--size-md:72px;--size-lg:80px;--size-xl:88px;--size-xxl:96px;--font-xxs:10px;--font-xs:12px;--font-sm:14px;--font-md:16px;--font-lg:18px;--font-xl:20px;--font-xxl:22px;--icon-xxs:8px;--icon-xs:12px;--icon-sm:16px;--icon-md:24px;--icon-lg:28px;--icon-xl:32px;--icon-xxl:36px;--header-size: var(--size-sm);--navbar-size: var(--size-lg);--fab-size: var(--size-xs);--primary:#369649;--secondary:#53795a;--tertiary:#963683;--error:#cc0700;--on-primary:#ffffff;--on-secondary:#ffffff;--on-tertiary:#ffffff;--on-error:#ffffff;--primary-container:#d6f5de;--secondary-container:#dfece2;--tertiary-container:#f5d6ee;--error-container:#ffd0cc;--on-primary-container:#257435;--on-secondary-container:#3c5d43;--on-tertiary-container:#742566;--on-error-container:#990500;--primary-fixed:#eafaee;--secondary-fixed:#eff6f1;--tertiary-fixed:#faeaf6;--primary-fixed-dim:#c9e8d1;--secondary-fixed-dim:#d6dbd8;--tertiary-fixed-dim:#e8c9e1;--on-primary-fixed:#103c18;--on-secondary-fixed:#1d2f20;--on-tertiary-fixed:#3c1034;--on-primary-fixed-variant:#257435;--on-secondary-fixed-variant:#3c5d43;--on-tertiary-fixed-variant:#742566;--surface:#fafafa;--surface-dim:#eff0f0;--surface-bright:#fafafa;--surface-container-lowest:#fafafa;--surface-container-low:#f4f5f5;--surface-container:#eff0f0;--surface-container-high:#eaebea;--surface-container-highest:#e5e6e5;--on-surface:#191a19;--on-surface-variant:#4b4e4c;--inverse-surface:#313532;--inverse-on-surface:#e5e6e5;--inverse-primary:#afe9bd;--outline:#7d827e;--outline-variant:#e5e6e5;--scrim:#000000;--shadow:#000000;--shadow-1: 0 1px 2px #0004, 0 1px 3px 1px #0002;--shadow-2: 0 1px 2px #0004, 0 2px 6px 2px #0002;--shadow-3: 0 1px 3px #0004, 0 3px 8px 3px #0002;--timing-standard: cubic-bezier(0.4, 0, 0.2, 1);}", "global");