Function globalCss

Parameters

• ...styles: (
      { "@font-face"?: unknown; "@import"?: unknown } & {
          [K in string | number | symbol]: K extends "@import"
              ? string
              | string[]
              : K extends "@font-face"
                  ? FontFace
                  | FontFace[]
                  : K extends `@keyframes ${string}`
                      ? {
                          [key: string]: CSS<
                              {},
                              {
                                  colors: {
                                      activeBg: "#e7e7e7";
                                      background: "white";
                                      blue1: "#038bf4";
                                      blue2: "#b7d6f5";
                                      blue3: "#dbe6ff";
                                      blue4: "#33b4ff";
                                      blue5: "#30a2e6";
                                      border: "#d5d5d5";
                                      buttonBorder: "#bababa";
                                      choiceActiveBg: "#f3f3f3";
                                      choiceActiveText: "#313131";
                                      choiceBg: "#ffffff";
                                      choiceBorder: "#cfcfcf";
                                      choiceText: "#999999";
                                      focusColor: "#dcaf00";
                                      green1: "#3ec234";
                                      green1Darker: "#38af2f";
                                      grey1: "#737373";
                                      headerBg: "#efeff0";
                                      headerBorder: "#c8c8c9";
                                      headerText: "#484848";
                                      icon: "#636363";
                                      inactiveBg: "#d3d3de";
                                      inactiveDarkBg: "#999";
                                      inputDisabledBg: "#f3f3f3";
                                      inputDisabledText: "#959595";
                                      mainColor: "#008ad2";
                                      mainColorAlt: "#006AA9";
                                      modalBg: "#f7f7f7";
                                      modalButtonBg: "#f8f8f8";
                                      modalButtonBorder: "#c2c2c2";
                                      orange1: "#ff7200";
                                      orange1Darker: "#cc5b00";
                                      pink1: "#ff388f";
                                      pinky1: "#f5c0b7";
                                      pinky2: "#e07b67";
                                      pinky3: "#ffe1db";
                                      popText: "#666";
                                      purple1: "#7357e8";
                                      red1: "#ea2700";
                                      scrollbarsBg: "transparent";
                                      scrollbarsThumb: "#737373";
                                      selectorActive: "#008ad2";
                                      selectorText: "#606060";
                                      sub: "#959595";
                                      tableStripedBg: "#fafafa";
                                      text: "#323232";
                                      text2: "#181818";
                                      text3: "#000000";
                                      toggleBgDisabled: "#f0f0f0";
                                      toggleHandleBg: "#e0e0e0";
                                      toggleHandleBgDisabled: "#deae84";
                                      toggleHandleBorder: "#cdcdcd";
                                      toggleHandleBorderDisabled: "#c29f7d";
                                      toolbarBg: "#f8f8f8";
                                      toolbarBorder: "#ababab";
                                      toolButtonText: "#666e80";
                                      yellow1: "#ffde9d";
                                      yellow2: "#e4a429";
                                      yellow3: "#fff5db";
                                  };
                              },
                              DefaultThemeMap,
                              {
                                  mx: (
                                      value: (...) | (...),
                                  ) => { marginLeft: ...; marginRight: ... };
                                  my: (value: (...) | (...)) => { marginBottom: ...; marginTop: ... };
                                  px: (
                                      value: (...) | (...),
                                  ) => { paddingLeft: ...; paddingRight: ... };
                                  py: (
                                      value: (...) | (...),
                                  ) => { paddingBottom: ...; paddingTop: ... };
                                  size: (value: (...) | (...)) => { height: ...; width: ... };
                              },
                          >;
                      }
                      : K extends `@property ${string}`
                          ? Property
                          : CSS<
                              {},
                              {
                                  colors: {
                                      activeBg: "#e7e7e7";
                                      background: "white";
                                      blue1: "#038bf4";
                                      blue2: "#b7d6f5";
                                      blue3: "#dbe6ff";
                                      blue4: "#33b4ff";
                                      blue5: "#30a2e6";
                                      border: "#d5d5d5";
                                      buttonBorder: "#bababa";
                                      choiceActiveBg: "#f3f3f3";
                                      choiceActiveText: "#313131";
                                      choiceBg: "#ffffff";
                                      choiceBorder: "#cfcfcf";
                                      choiceText: "#999999";
                                      focusColor: "#dcaf00";
                                      green1: "#3ec234";
                                      green1Darker: "#38af2f";
                                      grey1: "#737373";
                                      headerBg: "#efeff0";
                                      headerBorder: "#c8c8c9";
                                      headerText: "#484848";
                                      icon: "#636363";
                                      inactiveBg: "#d3d3de";
                                      inactiveDarkBg: "#999";
                                      inputDisabledBg: "#f3f3f3";
                                      inputDisabledText: "#959595";
                                      mainColor: "#008ad2";
                                      mainColorAlt: "#006AA9";
                                      modalBg: "#f7f7f7";
                                      modalButtonBg: "#f8f8f8";
                                      modalButtonBorder: "#c2c2c2";
                                      orange1: "#ff7200";
                                      orange1Darker: "#cc5b00";
                                      pink1: "#ff388f";
                                      pinky1: "#f5c0b7";
                                      pinky2: "#e07b67";
                                      pinky3: "#ffe1db";
                                      popText: "#666";
                                      purple1: "#7357e8";
                                      red1: "#ea2700";
                                      scrollbarsBg: "transparent";
                                      scrollbarsThumb: "#737373";
                                      selectorActive: "#008ad2";
                                      selectorText: "#606060";
                                      sub: "#959595";
                                      tableStripedBg: "#fafafa";
                                      text: "#323232";
                                      text2: "#181818";
                                      text3: "#000000";
                                      toggleBgDisabled: "#f0f0f0";
                                      toggleHandleBg: "#e0e0e0";
                                      toggleHandleBgDisabled: "#deae84";
                                      toggleHandleBorder: "#cdcdcd";
                                      toggleHandleBorderDisabled: "#c29f7d";
                                      toolbarBg: "#f8f8f8";
                                      toolbarBorder: "#ababab";
                                      toolButtonText: "#666e80";
                                      yellow1: "#ffde9d";
                                      yellow2: "#e4a429";
                                      yellow3: "#fff5db";
                                  };
                              },
                              DefaultThemeMap,
                              {
                                  mx: (
                                      value: (...) | (...),
                                  ) => { marginLeft: ...; marginRight: ... };
                                  my: (value: (...) | (...)) => { marginBottom: ...; marginTop: ... };
                                  px: (
                                      value: (...) | (...),
                                  ) => { paddingLeft: ...; paddingRight: ... };
                                  py: (
                                      value: (...) | (...),
                                  ) => { paddingBottom: ...; paddingTop: ... };
                                  size: (value: (...) | (...)) => { height: ...; width: ... };
                              },
                          >
      }
  )[]

  • Optional@font-face?: unknown

    The @font-face CSS at-rule specifies a custom font with which to display text.

  • Optional@import?: unknown

    The @import CSS at-rule imports style rules from other style sheets.