@inspark/inspark-components 19.0.49 → 19.0.51

package/src/scss/patchPrimeng/button/_primeng.components.button.theme-bms-dark.scss

@@ -0,0 +1,109 @@
+@use "@inspark/components-web/src/inspark" as *;;
+
+.p-button {
+  background-color: var(--bglevel8);
+  color: $btn-default-color;
+  border-radius: 20px;
+
+  &:hover {
+    background-color: $btn-default-background--hover;
+  }
+
+  &:active {
+    background-color: $btn-default-background--pressed;
+  }
+
+  &:disabled {
+    cursor: default;
+    color: $btn-disabled-color;
+    background-color: $btn-default-background;
+  }
+}
+
+.p-button.p-state-active {
+  border-color: $ids-theme-status-active;
+  background-color: $ids-theme-status-active;
+  color: $color-base-black;
+}
+
+.p-button-primary {
+  border-color: $btn-primary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-primary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-primary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-primary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-primary-background--pressed;
+  }
+
+  &:disabled {
+    background-color: $btn-primary-background--disabled;
+    color: $btn-primary-color--disabled;
+  }
+}
+
+.p-button-secondary {
+  border-color: $btn-secondary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-secondary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-secondary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-secondary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-secondary-background--pressed;
+  }
+}
+
+.p-button-tertiary {
+  border-color: $btn-tertiary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-tertiary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-tertiary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--pressed;
+  }
+}
+
+.p-button-dashed {
+  border: 4px dashed $text-color;
+  border: 4px dashed var(--ids-theme-text-color, $text-color);
+}

package/src/scss/patchPrimeng/button/_primeng.components.button.theme-bms-light.scss

@@ -0,0 +1,114 @@
+@use "@inspark/components-web/src/inspark" as *;;
+
+.p-button {
+  border: $btn-default-border;
+  border: var(--ids-theme-btn-default-border, $btn-default-border);
+  color: $btn-default-color;
+  color: var(--ids-theme-btn-default-color, $btn-default-color);
+  background-color: var(--colorBg);
+  border-radius: 20px;
+
+  &:hover {
+    background-color: $btn-default-background--hover;
+  }
+
+  &:active {
+    background-color: $btn-default-background--pressed;
+  }
+
+  &:disabled {
+    cursor: default;
+    color: $btn-disabled-color;
+    background-color: $btn-default-background;
+  }
+}
+
+.p-button.p-state-active {
+  border-color: $ids-theme-status-active;
+  background-color: $ids-theme-status-active;
+  color: $color-base-white;
+}
+
+.p-button-primary {
+  border-color: $btn-primary-border-color;
+  border-color: var(--ids-theme-btn-primary-border-color, $btn-primary-border-color);
+  box-shadow: $btn-shadow;
+  background-color: $btn-primary-background;
+  background-color: var(--ids-theme-btn-primary-background, $btn-primary-background);
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-primary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-primary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-primary-background--pressed;
+  }
+
+  &:disabled {
+    background-color: $btn-primary-background--disabled;
+    color: $btn-primary-color--disabled;
+  }
+}
+
+.p-button-secondary {
+  border-color: $btn-secondary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-secondary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-secondary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-secondary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-secondary-background--pressed;
+  }
+}
+
+.p-button-tertiary {
+  border-color: $btn-tertiary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-tertiary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-tertiary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--pressed;
+  }
+}
+
+.p-button-dashed {
+  border: 4px dashed $text-color;
+  border: 4px dashed var(--ids-theme-text-color, $text-color);
+}

package/src/scss/patchPrimeng/button/_primeng.components.button.theme-contrast.scss

@@ -0,0 +1,109 @@
+@use "@inspark/components-web/src/inspark" as *;
+
+.p-button {
+  border: $btn-default-border;
+  color: $btn-default-color;
+  background-color: var(--colorBg);
+
+  &:hover {
+    background-color: $btn-default-background--hover;
+  }
+
+  &:active {
+    background-color: $btn-default-background--pressed;
+  }
+
+  &:disabled {
+    cursor: default;
+    color: $btn-disabled-color;
+    background-color: $btn-default-background;
+  }
+}
+
+.p-button.p-state-active {
+  border-color: $ids-theme-status-active;
+  background-color: $ids-theme-status-active;
+  color: $color-base-white;
+}
+
+.p-button-primary {
+  border-color: $btn-primary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-primary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-primary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-primary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-primary-background--pressed;
+  }
+
+  &:disabled {
+    background-color: $btn-primary-background--disabled;
+    color: $btn-primary-color--disabled;
+  }
+}
+
+.p-button-secondary {
+  border-color: $btn-secondary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-secondary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-secondary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-secondary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-secondary-background--pressed;
+  }
+}
+
+.p-button-tertiary {
+  border-color: $btn-tertiary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-tertiary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-tertiary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--pressed;
+  }
+}
+
+.p-button-dashed {
+  border: 4px dashed $text-color;
+  border: 4px dashed var(--ids-theme-text-color, $text-color);
+}

package/src/scss/patchPrimeng/button/_primeng.components.button.theme-dark.scss

@@ -0,0 +1,108 @@
+@use "@inspark/components-web/src/inspark" as *;;
+
+.p-button {
+  background-color: var(--colorBgLevel4);
+  color: $btn-default-color;
+
+  &:hover {
+    background-color: $btn-default-background--hover;
+  }
+
+  &:active {
+    background-color: $btn-default-background--pressed;
+  }
+
+  &:disabled {
+    cursor: default;
+    color: $btn-disabled-color;
+    background-color: $btn-default-background;
+  }
+}
+
+.p-button.p-state-active {
+  border-color: $ids-theme-status-active;
+  background-color: $ids-theme-status-active;
+  color: $color-base-black;
+}
+
+.p-button-primary {
+  border-color: $btn-primary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-primary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-primary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-primary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-primary-background--pressed;
+  }
+
+  &:disabled {
+    background-color: $btn-primary-background--disabled;
+    color: $btn-primary-color--disabled;
+  }
+}
+
+.p-button-secondary {
+  border-color: $btn-secondary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-secondary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-secondary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-secondary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-secondary-background--pressed;
+  }
+}
+
+.p-button-tertiary {
+  border-color: $btn-tertiary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-tertiary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-tertiary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--pressed;
+  }
+}
+
+.p-button-dashed {
+  border: 4px dashed $text-color;
+  border: 4px dashed var(--ids-theme-text-color, $text-color);
+}

package/src/scss/patchPrimeng/button/_primeng.components.button.theme-light.scss

@@ -0,0 +1,113 @@
+@use "@inspark/components-web/src/inspark" as *;;
+
+.p-button {
+  border: $btn-default-border;
+  border: var(--ids-theme-btn-default-border, $btn-default-border);
+  color: $btn-default-color;
+  color: var(--ids-theme-btn-default-color, $btn-default-color);
+  background-color: var(--colorBg);
+
+  &:hover {
+    background-color: $btn-default-background--hover;
+  }
+
+  &:active {
+    background-color: $btn-default-background--pressed;
+  }
+
+  &:disabled {
+    cursor: default;
+    color: $btn-disabled-color;
+    background-color: $btn-default-background;
+  }
+}
+
+.p-button.p-state-active {
+  border-color: $ids-theme-status-active;
+  background-color: $ids-theme-status-active;
+  color: $color-base-white;
+}
+
+.p-button-primary {
+  border-color: $btn-primary-border-color;
+  border-color: var(--ids-theme-btn-primary-border-color, $btn-primary-border-color);
+  box-shadow: $btn-shadow;
+  background-color: $btn-primary-background;
+  background-color: var(--ids-theme-btn-primary-background, $btn-primary-background);
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-primary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-primary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-primary-background--pressed;
+  }
+
+  &:disabled {
+    background-color: $btn-primary-background--disabled;
+    color: $btn-primary-color--disabled;
+  }
+}
+
+.p-button-secondary {
+  border-color: $btn-secondary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-secondary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-secondary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-secondary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-secondary-background--pressed;
+  }
+}
+
+.p-button-tertiary {
+  border-color: $btn-tertiary-border-color;
+  box-shadow: $btn-shadow;
+  background-color: $btn-tertiary-background;
+
+  &,
+  &:link,
+  &:visited,
+  &:hover,
+  &:active {
+    color: $btn-tertiary-color;
+  }
+
+  &:hover {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--hover;
+  }
+
+  &:active {
+    border-color: transparent;
+    background-color: $btn-tertiary-background--pressed;
+  }
+}
+
+.p-button-dashed {
+  border: 4px dashed $text-color;
+  border: 4px dashed var(--ids-theme-text-color, $text-color);
+}