mazey
    Preparing search index...

    Function addStyle

    • Add a <style> element to the document <head>.

      Usage:

      Example 1: Add the <style> with id, and repeated invoking will update the content instead of adding a new one.

      import { addStyle } from "mazey";

      addStyle(
        "body { background-color: #333; }",
        { id: "test" }
      );

      Output:

      <style id="test">body { background-color: #333; }</style>

      Example 2: Add the <style> without id, and repeated invoking will add a new one.

      import { addStyle } from "mazey";

      addStyle("body { background-color: #444; }");

      Output:

      <style>body { background-color: #444; }</style>

      Example 3: Combine genStyleString and addStyle to add multiple styles at once.

      import { genStyleString, addStyle } from "mazey";

      const xStyle = genStyleString(
        ".footer>.x-wish>a:first-child" +
        ",div.wish-flex>a[href^='https://github.com/chengchuu']" +
        ",.m-hide",
        [ "display: none" ]
      );
      const yStyle = genStyleString(
        ".footer>.y-wish:before",
        [
          `content: 'Copyright (c) chengchuu'`,
          "color: inherit",
          "padding-inline-start: var(--y-wish-1_5)",
          "padding-inline-end: var(--y-wish-1_5)",
          "padding-top: var(--y-wish-1)",
          "padding-bottom: var(--y-wish-1)",
        ]
      );
      addStyle(xStyle + yStyle, { id: "z-style" });

      Output:

      <style id="z-style">.footer>.x-wish>a:first-child,div.wish-flex>a[href^='https://github.com/chengchuu'],.m-hide{display: none;}.footer>.y-wish:before{content: 'Copyright (c) chengchuu';color: inherit;padding-inline-start: var(--y-wish-1_5);padding-inline-end: var(--y-wish-1_5);padding-top: var(--y-wish-1);padding-bottom: var(--y-wish-1);}</style>

      Parameters

      • style: string

        CSS text to add to the document.

      • options: { id?: string } = ...

        • Optionalid?: string

          Optional <style> element ID. An existing element with the same ID is updated instead of duplicated.

      Returns boolean

      Whether non-empty CSS text was added or updated.

    Settings
    Member Visibility

    Theme