ui-theme-igc-effect 1.0.0

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+import { presetIgcEffectDark } from './themes/igcEffect/presets/presetIgcEffectDark';
+import { presetIgcEffectDefault } from './themes/igcEffect/presets/presetIgcEffectDefault';
+export { presetIgcEffectDark, presetIgcEffectDefault };

package/dist/index.js

@@ -0,0 +1,3 @@
+import { presetIgcEffectDark } from './themes/igcEffect/presets/presetIgcEffectDark';
+import { presetIgcEffectDefault } from './themes/igcEffect/presets/presetIgcEffectDefault';
+export { presetIgcEffectDark, presetIgcEffectDefault };

package/dist/themes/igcEffect/Theme.css

@@ -0,0 +1,32 @@
+.Theme {
+    --graphics-size-xs: 12px;
+    --graphics-size-s: 16px;
+    --graphics-size-m: 24px;
+    --graphics-size-l: 32px;
+    --graphics-size-xl: 40px;
+    --graphics-size-2xl: 60px;
+    --graphics-size-3xl: 80px;
+    --graphics-size-4xl: 120px;
+
+    *::-webkit-scrollbar {
+        width: 8px;
+        height: 8px;
+    }
+
+    *::-webkit-scrollbar-track {
+        background-color: var(--color-scroll-bg);
+    }
+
+    *::-webkit-scrollbar-corner {
+        background-color: var(--color-scroll-bg);
+    }
+
+    *::-webkit-scrollbar-thumb {
+        background-color: var(--color-scroll-thumb);
+        border-radius: 0px;
+    }
+
+    *::-webkit-scrollbar-thumb:hover {
+        background-color: var(--color-scroll-thumb-hover);
+    }
+}

package/dist/themes/igcEffect/_color/Theme_color_igcEffectCustom.css

@@ -0,0 +1,11 @@
+.Theme_color_igcEffectDefault,
+.Theme_color_igcEffectDark {
+    --color-royal-blue-50: rgba(242, 243, 255, 1);
+    --color-royal-blue-300: rgba(177, 169, 255, 1);
+    --color-gray-100: rgba(233, 234, 242, 1);
+    --color-gray-200: rgba(209, 210, 222, 1);
+    --color-gray-600: rgba(96, 99, 115, 1);
+    --color-red-400: rgba(241, 60, 79, 1);
+    --color-aquamarine-50: rgb(242, 254, 255, 1);
+    --color-aquamarine-300: rgba(107, 245, 207, 1);
+}

package/dist/themes/igcEffect/_color/Theme_color_igcEffectDark.css

@@ -0,0 +1,112 @@
+.Theme_color_igcEffectDark {
+    --color-bg-default: rgb(34, 39, 43);
+    --color-bg-secondary: rgb(22, 26, 29);
+
+    --color-bg-brand: rgb(0, 113, 178);
+
+    --color-bg-link: rgb(0, 120, 210);
+    --color-bg-border: rgba(255, 255, 255, 0.2);
+    --color-bg-stripe: rgba(246, 251, 253, 0.06);
+
+    --color-bg-ghost: rgba(246, 251, 253, 0.1);
+    --color-bg-tone: rgba(6, 20, 25, 0.85);
+
+    --color-bg-soft: rgba(255, 255, 255, 0.9);
+
+    --color-bg-system: rgb(77, 82, 91);
+
+    --color-bg-normal: rgb(10, 165, 255);
+
+    --color-bg-success: rgb(34, 195, 142);
+    --color-bg-caution: rgb(242, 201, 76);
+
+    --color-bg-warning: rgb(243, 139, 0);
+
+    --color-bg-alert: rgb(254, 67, 67);
+    --color-bg-critical: rgb(51, 0, 15);
+    --color-typo-primary: rgb(250, 250, 250);
+
+    --color-typo-secondary: rgba(255, 255, 255, 0.6);
+
+    --color-typo-ghost: rgba(255, 255, 255, 0.3);
+
+    --color-typo-brand: rgb(0, 113, 178);
+
+    --color-typo-system: rgb(99, 110, 131);
+
+    --color-typo-normal: rgb(0, 155, 245);
+
+    --color-typo-success: rgb(15, 174, 121);
+
+    --color-typo-caution: rgb(248, 199, 53);
+
+    --color-typo-warning: rgb(230, 130, 0);
+
+    --color-typo-alert: rgb(247, 59, 59);
+
+    --color-typo-critical: rgb(97, 0, 29);
+
+    --color-typo-link: rgb(15, 159, 255);
+
+    --color-typo-link-minor: rgb(111, 165, 200);
+
+    --color-typo-link-hover: rgb(87, 188, 255);
+    --color-scroll-bg: rgba(246, 251, 253, 0.06);
+    --color-scroll-thumb: rgba(246, 251, 253, 0.24);
+    --color-scroll-thumb-hover: rgba(246, 251, 253, 0.32);
+    --color-control-bg-default: rgb(34, 39, 43);
+
+    --color-control-typo-default: rgba(255, 255, 255, 0.8);
+
+    --color-control-typo-placeholder: rgba(255, 255, 255, 0.35);
+
+    --color-control-bg-border-default: rgba(246, 251, 253, 0.28);
+
+    --color-control-bg-border-default-hover: rgba(246, 251, 253, 0.52);
+
+    --color-control-bg-border-focus: rgb(5, 147, 255);
+    --color-control-bg-focus: rgba(0, 120, 210, 0.4);
+
+    --color-control-bg-active: rgba(0, 120, 210, 0.7);
+    --color-control-bg-primary: rgb(53, 33, 255);
+
+    --color-control-bg-primary-hover: rgb(23, 0, 254);
+
+    --color-control-typo-primary: rgb(255, 255, 255);
+
+    --color-control-typo-primary-hover: rgb(255, 255, 255);
+    --color-control-bg-secondary: rgba(34, 39, 43, 0);
+
+    --color-control-bg-border-secondary: rgb(0, 120, 210);
+
+    --color-control-bg-border-secondary-hover: rgb(0, 145, 255);
+
+    --color-control-typo-secondary: rgb(15, 159, 255);
+
+    --color-control-typo-secondary-hover: rgb(87, 188, 255);
+    --color-control-bg-ghost: rgba(250, 250, 250, 0.16);
+
+    --color-control-bg-ghost-hover: rgba(250, 250, 250, 0.23);
+
+    --color-control-typo-ghost: rgba(255, 255, 255, 0.75);
+
+    --color-control-typo-ghost-hover: rgba(255, 255, 255, 0.9);
+    --color-control-bg-clear: rgba(250, 250, 250, 0);
+
+    --color-control-bg-clear-hover: rgba(250, 250, 250, 0.23);
+
+    --color-control-typo-clear: rgba(255, 255, 255, 0.75);
+
+    --color-control-typo-clear-hover: rgba(255, 255, 255, 0.9);
+    --color-control-bg-disable: rgba(250, 250, 250, 0.16);
+
+    --color-control-bg-border-disable: rgba(250, 250, 250, 0);
+
+    --color-control-typo-disable: rgba(255, 255, 255, 0.24);
+    --color-shadow-group-1: rgba(0, 0, 0, 0.08);
+    --color-shadow-group-2: rgba(0, 0, 0, 0.32);
+    --color-shadow-layer-1: rgba(0, 0, 0, 0.08);
+    --color-shadow-layer-2: rgba(0, 0, 0, 0.32);
+    --color-shadow-modal-1: rgba(0, 0, 0, 0.08);
+    --color-shadow-modal-2: rgba(0, 0, 0, 0.32);
+}

package/dist/themes/igcEffect/_color/Theme_color_igcEffectDefault.css

@@ -0,0 +1,110 @@
+.Theme_color_igcEffectDefault {
+    --color-bg-default: rgb(255, 255, 255);
+    --color-bg-secondary: rgb(244, 246, 251);
+
+    --color-bg-brand: rgb(0, 113, 178);
+
+    --color-bg-link: rgb(53, 33, 255);
+    --color-bg-border: rgba(0, 65, 102, 0.2);
+    --color-bg-stripe: rgba(0, 32, 51, 0.05);
+
+    --color-bg-ghost: rgba(0, 32, 51, 0.08);
+
+    --color-bg-tone: rgba(71, 74, 89, 0.3);
+    --color-bg-soft: rgba(255, 255, 255, 0.9);
+    --color-bg-system: rgb(222, 228, 232);
+
+    --color-bg-normal: rgb(86, 185, 242);
+
+    --color-bg-success: rgb(223, 250, 242);
+    --color-bg-caution: rgb(242, 201, 76);
+
+    --color-bg-warning: rgb(255, 246, 214);
+
+    --color-bg-alert: rgb(255, 236, 238);
+    --color-bg-critical: rgb(51, 0, 15);
+    --color-typo-primary: rgb(26, 27, 38);
+
+    --color-typo-secondary: rgb(126, 128, 143);
+
+    --color-typo-ghost: rgba(26, 27, 38, 0.3);
+
+    --color-typo-brand: rgb(0, 113, 178);
+
+    --color-typo-system: rgb(53, 33, 255);
+
+    --color-typo-normal: rgb(51, 180, 255);
+
+    --color-typo-success: rgb(11, 201, 148);
+
+    --color-typo-caution: rgb(255, 161, 10);
+
+    --color-typo-warning: rgb(255, 122, 0);
+
+    --color-typo-alert: rgb(243, 92, 108);
+
+    --color-typo-critical: rgb(51, 0, 15);
+
+    --color-typo-link: rgb(80, 102, 255);
+    --color-typo-link-minor: rgb(70, 89, 216);
+
+    --color-typo-link-hover: rgb(122, 140, 255);
+    --color-scroll-bg: rgba(0, 66, 105, 0.06);
+    --color-scroll-thumb: rgba(0, 66, 105, 0.24);
+    --color-scroll-thumb-hover: rgba(0, 66, 105, 0.32);
+    --color-control-bg-default: rgb(255, 255, 255);
+
+    --color-control-typo-default: rgb(26, 27, 38);
+
+    --color-control-typo-placeholder: rgba(26, 27, 38, 0.35);
+
+    --color-control-bg-border-default: rgb(183, 185, 199);
+
+    --color-control-bg-border-default-hover: rgba(0, 66, 105, 0.52);
+
+    --color-control-bg-border-focus: rgb(128, 144, 255);
+    --color-control-bg-focus: rgba(80, 102, 255, 0.3);
+
+    --color-control-bg-active: rgba(80, 102, 255, 0.5);
+    --color-control-bg-primary: rgb(53, 33, 255);
+
+    --color-control-bg-primary-hover: rgb(23, 0, 254);
+
+    --color-control-typo-primary: rgb(255, 255, 255);
+
+    --color-control-typo-primary-hover: rgb(255, 255, 255);
+    --color-control-bg-secondary: rgba(255, 255, 255, 0);
+
+    --color-control-bg-border-secondary: rgb(80, 102, 255);
+
+    --color-control-bg-border-secondary-hover: rgb(23, 0, 254);
+
+    --color-control-typo-secondary: rgb(53, 33, 255);
+
+    --color-control-typo-secondary-hover: rgb(23, 0, 254);
+    --color-control-bg-ghost: rgba(0, 66, 105, 0.07);
+
+    --color-control-bg-ghost-hover: rgba(0, 66, 105, 0.05);
+
+    --color-control-typo-ghost: rgba(43, 45, 64, 0.8);
+
+    --color-control-typo-ghost-hover: rgba(43, 45, 64, 0.75);
+    --color-control-bg-clear: rgba(0, 66, 105, 0);
+
+    --color-control-bg-clear-hover: rgba(0, 66, 105, 0.05);
+
+    --color-control-typo-clear: rgba(53, 33, 255);
+
+    --color-control-typo-clear-hover: rgba(23, 0, 254);
+    --color-control-bg-disable: rgba(0, 66, 105, 0.07);
+
+    --color-control-bg-border-disable: rgba(0, 65, 102, 0.2);
+
+    --color-control-typo-disable: rgb(26, 27, 38);
+    --color-shadow-group-1: rgba(0, 32, 51, 0.02);
+    --color-shadow-group-2: rgba(0, 32, 51, 0.16);
+    --color-shadow-layer-1: rgba(0, 32, 51, 0.04);
+    --color-shadow-layer-2: rgba(0, 32, 51, 0.12);
+    --color-shadow-modal-1: rgba(0, 0, 0, 0.08);
+    --color-shadow-modal-2: rgba(0, 0, 0, 0.08);
+}

package/dist/themes/igcEffect/_component/Theme_component_igcEffectButton.css

@@ -0,0 +1,15 @@
+.Theme_control_igcEffect .Button_disabled {
+    background-color: var(--color-bg-secondary);
+    opacity: 0.3;
+    border-color: var(--color-control-typo-secondary);
+    color: var(--color-control-typo-secondary);
+}
+
+.Theme_control_igcEffect .Button_view_secondary:hover,
+.Theme_control_igcEffect .Button_view_clear:hover {
+    --button-bg-color-hover: var(--color-royal-blue-50);
+}
+.Theme_control_igcEffect .Button_view_secondary:hover,
+.Theme_control_igcEffect .Button_view_primary:hover {
+    box-shadow: 0px 0px 0px 4px var(--color-royal-blue-50);
+}

package/dist/themes/igcEffect/_component/Theme_component_igcEffectCheckbox.css

@@ -0,0 +1,35 @@
+.Theme_control_igcEffect .Checkbox_size_l {
+    --checkbox-size: 24px;
+    --control-radius: 2px;
+}
+
+.Theme_control_igcEffect .Checkbox-Input::before {
+    content: '';
+    width: var(--checkbox-size);
+    height: var(--checkbox-size);
+    background-size: var(--checkbox-size) var(--checkbox-size);
+    border: 0;
+    transition: none;
+}
+
+.Theme_control_igcEffect .Checkbox-Input:checked:before {
+    background-image: url('../../../assets/Checkbox.svg');
+}
+
+.Theme_control_igcEffect .Checkbox-Input:checked:before {
+    transform: none;
+}
+
+.Theme_control_igcEffect .Checkbox-Input:before {
+    top: -1px;
+    left: -1.2px;
+}
+
+.Theme_control_igcEffect .Checkbox_intermediate .Checkbox-Input:before {
+    top: calc(var(--checkbox-size) / 2 - 0.5px);
+    left: calc(var(--checkbox-size) / 5 - 1.5px);
+}
+
+.Theme_control_igcEffect .Checkbox_disabled .Checkbox-Input:disabled:before {
+    background-image: url('../../../assets/CheckboxDisabled.svg');
+}

package/dist/themes/igcEffect/_component/Theme_component_igcEffectCommon.css

@@ -0,0 +1,11 @@
+.Theme_control_igcEffect * {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-weight: 500;
+}
+
+.Theme_control_igcEffect .MixFocus:not(.MixFocus_before):focus,
+.Theme_control_igcEffect .MixFocus:not(.MixFocus_before):focus:hover {
+    box-shadow: none;
+}

package/dist/themes/igcEffect/_component/Theme_component_igcEffectRctable.css

@@ -0,0 +1,50 @@
+.Theme_control_igcEffect .rcta--RcTable-cell {
+    font-weight: 500;
+    padding: 8px;
+}
+
+.Theme_control_igcEffect .rcta--RcTable-thead .rcta--RcTable-cell {
+    padding: 4px 8px;
+}
+
+.Theme_control_igcEffect .rcta--RcTable thead > tr:last-child > * {
+    border-bottom: 0px;
+}
+
+.Theme_control_igcEffect
+    .rcta--RcTable
+    tbody
+    > tr:not(.rcta--RcTable-placeholder):hover {
+    background-color: var(--color-bg-default);
+}
+
+.Theme_control_igcEffect
+    .rcta--RcTable
+    tbody
+    > tr:not(.rcta--RcTable-placeholder):hover
+    .rcta--RcTable-cell-fix-left:before,
+.Theme_control_igcEffect
+    .rcta--RcTable
+    tbody
+    > tr:not(.rcta--RcTable-placeholder):hover
+    .rcta--RcTable-cell-fix-right:before {
+    background-color: var(--color-bg-default);
+}
+
+.Theme_control_igcEffect .rcta--RcTable *::-webkit-scrollbar {
+    width: 16px;
+}
+
+.Theme_control_igcEffect .rcta--RcTable *::-webkit-scrollbar-track {
+    background: var(--color-gray-100);
+    border-left: 8px var(--color-bg-default) solid;
+}
+
+.Theme_control_igcEffect .rcta--RcTable *::-webkit-scrollbar-thumb {
+    background: var(--color-gray-200);
+    border-left: 8px var(--color-bg-default) solid;
+}
+
+.Theme_control_igcEffect .rcta--RcTable *::-webkit-scrollbar-thumb:hover {
+    background-color: var(--color-gray-200);
+}

package/dist/themes/igcEffect/_component/Theme_component_igcEffectSelect.css

@@ -0,0 +1,63 @@
+.Theme_control_igcEffect.SelectDropdown *::-webkit-scrollbar {
+    width: 24px;
+}
+
+.Theme_control_igcEffect.SelectDropdown *::-webkit-scrollbar-track {
+    background: var(--color-bg-secondary);
+    border-left: 8px var(--color-bg-default) solid;
+    border-right: 8px var(--color-bg-default) solid;
+    margin: 8px;
+}
+
+.Theme_control_igcEffect.SelectDropdown *::-webkit-scrollbar-thumb {
+    background: var(--color-gray-100);
+    border-left: 8px var(--color-bg-default) solid;
+    border-right: 8px var(--color-bg-default) solid;
+}
+
+.Theme_control_igcEffect.SelectDropdown *::-webkit-scrollbar-thumb:hover {
+    background-color: var(--color-gray-100);
+}
+
+.Theme_control_igcEffect.SelectDropdown {
+    min-width: 178px;
+    border-radius: 0px;
+    border: none;
+}
+
+.Theme_control_igcEffect .SelectDropdown-List {
+    padding-top: 0px;
+}
+
+.Theme_control_igcEffect .SelectDropdown-List .ListItem {
+    padding-top: 8px;
+    padding-bottom: 8px;
+    padding-left: 16px;
+    padding-right: 16px;
+    line-height: var(--line-height-text-m);
+}
+
+.Theme_control_igcEffect.SelectDropdown-List .ListItemGrid-Slot {
+    line-height: var(--line-height-text-m);
+}
+
+.Theme_control_igcEffect .Select .Select-IndicatorsDropdown {
+    color: var(--color-control-bg-primary);
+}
+
+.Theme_control_igcEffect .Select-SelectContainer_status_alert {
+    --container-border-color: var(--color-typo-alert);
+}
+
+.Theme_control_igcEffect .Select-SelectContainer_status_warning {
+    --container-border-color: var(--color-typo-warning);
+}
+
+.Theme_control_igcEffect .Select-Delimiter {
+    display: none;
+}
+
+.Theme_control_igcEffect .Select-SelectContainer_view_default .Select-Control {
+    padding-left: 8px;
+    padding-right: 8px;
+}

package/dist/themes/igcEffect/_component/Theme_component_igcEffectSwitch.css

@@ -0,0 +1,10 @@
+.Theme_control_igcEffect .Switch_disabled .Switch-Input:disabled:checked {
+    --background-color: var(--color-control-bg-primary);
+    opacity: 0.4;
+    --content-color: var(--color-control-typo-primary);
+}
+
+.Theme_control_igcEffect .Switch_disabled .Switch-Input:disabled:not(:checked) {
+    --background-color: var(--color-control-bg-disable);
+    --content-color: var(--color-control-typo-primary);
+}

package/dist/themes/igcEffect/_component/Theme_component_igcEffectTextField.css

@@ -0,0 +1,18 @@
+.Theme_control_igcEffect .TextField-Input::placeholder {
+    color: var(--color-control-typo-placeholder);
+}
+
+.Theme_control_igcEffect
+    .TextField-InputContainer.TextField-InputContainer_status_alert {
+    --container-border-color: var(--color-typo-alert);
+}
+
+.Theme_control_igcEffect
+    .TextField-InputContainer.TextField-InputContainer_status_warning {
+    --container-border-color: var(--color-typo-warning);
+}
+
+.Theme_control_igcEffect .TextField-InputContainer_view_default {
+    padding-left: 16px;
+    padding-right: 16px;
+}

package/dist/themes/igcEffect/_control/Theme_control_igcEffect.css

@@ -0,0 +1,19 @@
+.Theme_control_igcEffect {
+    --control-radius: 4px;
+    --control-border-width: 1px;
+    --control-height-l: var(--space-4xl);
+    --control-height-m: var(--space-3xl);
+    --control-height-s: var(--space-2xl);
+    --control-height-xs: var(--space-xl);
+    --control-box-size-s: var(--space-s);
+    --control-box-size-m: var(--space-m);
+    --control-box-size-l: var(--space-l);
+    --control-space-l: var(--space-xl);
+    --control-space-m: var(--space-l);
+    --control-space-s: var(--space-m);
+    --control-space-xs: var(--space-s);
+    --control-text-size-l: var(--size-text-l);
+    --control-text-size-m: var(--size-text-m);
+    --control-text-size-s: var(--size-text-s);
+    --control-text-size-xs: var(--size-text-xs);
+}

package/dist/themes/igcEffect/_font/Theme_font_igcEffect.css

@@ -0,0 +1,107 @@
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_vf.woff2') format('woff2'),
+        url('pt-root-ui_vf.woff') format('woff');
+    font-weight: 100;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_vf.woff2') format('woff2'),
+        url('pt-root-ui_vf.woff') format('woff');
+    font-weight: 200;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_light.woff2') format('woff2'),
+        url('pt-root-ui_light.woff') format('woff');
+    font-weight: 300;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_regular.woff2') format('woff2'),
+        url('pt-root-ui_regular.woff') format('woff');
+    font-weight: normal;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_regular.woff2') format('woff2'),
+        url('pt-root-ui_regular.woff') format('woff');
+    font-weight: 400;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_medium.woff2') format('woff2'),
+        url('pt-root-ui_medium.woff') format('woff');
+    font-weight: 500;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_vf.woff2') format('woff2'),
+        url('pt-root-ui_vf.woff') format('woff');
+    font-weight: 600;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_bold.woff2') format('woff2'),
+        url('pt-root-ui_bold.woff') format('woff');
+    font-weight: 700;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_bold.woff2') format('woff2'),
+        url('pt-root-ui_bold.woff') format('woff');
+    font-weight: bold;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_vf.woff2') format('woff2'),
+        url('pt-root-ui_vf.woff') format('woff');
+    font-weight: 800;
+    font-style: normal;
+}
+
+@font-face {
+    font-family: 'PT Root UI';
+    src:
+        url('pt-root-ui_vf.woff2') format('woff2'),
+        url('pt-root-ui_vf.woff') format('woff');
+    font-weight: 900;
+    font-style: normal;
+}
+
+.Theme_font_igcEffect {
+    --font-primary: 'PT Root UI', -apple-system, BlinkMacSystemFont, 'Roboto',
+        'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans',
+        'Helvetica Neue', sans-serif;
+    --font-mono: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
+        monospace;
+    font-family: var(--font-primary);
+}

package/dist/themes/igcEffect/_shadow/Theme_shadow_igcEffect.css

@@ -0,0 +1,8 @@
+.Theme_shadow_igcEffect {
+    --shadow-group: 0px 2px 2px var(--color-shadow-group-1),
+        0px 2px 2px var(--color-shadow-group-2);
+    --shadow-layer: 0px 4px 4px var(--color-shadow-layer-1),
+        0px 4px 4px var(--color-shadow-layer-2);
+    --shadow-modal: 0px 4px 8px 0px var(--color-shadow-modal-1),
+        0px 0px 1px 0px var(--color-shadow-modal-2);
+}

package/dist/themes/igcEffect/_size/Theme_size_igcEffect.css

@@ -0,0 +1,27 @@
+.Theme_size_igcEffect {
+    --size-text-2xs: 10px;
+    --size-text-xs: 12px;
+    --size-text-s: 14px;
+    --size-text-m: 16px;
+    --size-text-l: 18px;
+    --size-text-xl: 20px;
+    --size-text-2xl: 24px;
+    --size-text-3xl: 32px;
+    --size-text-4xl: 48px;
+    --size-text-5xl: 72px;
+    --size-text-6xl: 96px;
+    --line-height-text-2xs: 1.1em;
+    --line-height-text-xs: 1.2em;
+    --line-height-text-s: 1.4em;
+    --line-height-text-m: 18px;
+    --line-height-text-l: 1.6em;
+    --font-weight-text-thin: 100;
+    --font-weight-text-extralight: 100;
+    --font-weight-text-light: 300;
+    --font-weight-text-regular: normal;
+    --font-weight-text-medium: 500;
+    --font-weight-text-semibold: 600;
+    --font-weight-text-bold: bold;
+    --font-weight-text-extrabold: 800;
+    --font-weight-text-black: 900;
+}

package/dist/themes/igcEffect/_space/Theme_space_igcEffect.css

@@ -0,0 +1,14 @@
+.Theme_space_igcEffect {
+    --space-3xs: 2px;
+    --space-2xs: 4px;
+    --space-xs: 8px;
+    --space-s: 12px;
+    --space-m: 16px;
+    --space-l: 20px;
+    --space-xl: 24px;
+    --space-2xl: 32px;
+    --space-3xl: 40px;
+    --space-4xl: 48px;
+    --space-5xl: 72px;
+    --space-6xl: 96px;
+}

package/dist/themes/igcEffect/presets/presetIgcEffectDark.d.ts

@@ -0,0 +1,18 @@
+import '../Theme.css';
+import '../_color/Theme_color_igcEffectDefault.css';
+import '../_color/Theme_color_igcEffectDark.css';
+import '../_color/Theme_color_igcEffectCustom.css';
+import '../_control/Theme_control_igcEffect.css';
+import '../_font/Theme_font_igcEffect.css';
+import '../_size/Theme_size_igcEffect.css';
+import '../_space/Theme_space_igcEffect.css';
+import '../_shadow/Theme_shadow_igcEffect.css';
+import '../_component/Theme_component_igcEffectRctable.css';
+import '../_component/Theme_component_igcEffectCheckbox.css';
+import '../_component/Theme_component_igcEffectSelect.css';
+import '../_component/Theme_component_igcEffectTextField.css';
+import '../_component/Theme_component_igcEffectSwitch.css';
+import '../_component/Theme_component_igcEffectButton.css';
+import '../_component/Theme_component_igcEffectCommon.css';
+import { ThemePreset } from '@consta/uikit/Theme';
+export declare const presetIgcEffectDark: ThemePreset;

package/dist/themes/igcEffect/presets/presetIgcEffectDark.js

@@ -0,0 +1,28 @@
+import '../Theme.css';
+import '../_color/Theme_color_igcEffectDefault.css';
+import '../_color/Theme_color_igcEffectDark.css';
+import '../_color/Theme_color_igcEffectCustom.css';
+import '../_control/Theme_control_igcEffect.css';
+import '../_font/Theme_font_igcEffect.css';
+import '../_size/Theme_size_igcEffect.css';
+import '../_space/Theme_space_igcEffect.css';
+import '../_shadow/Theme_shadow_igcEffect.css';
+import '../_component/Theme_component_igcEffectRctable.css';
+import '../_component/Theme_component_igcEffectCheckbox.css';
+import '../_component/Theme_component_igcEffectSelect.css';
+import '../_component/Theme_component_igcEffectTextField.css';
+import '../_component/Theme_component_igcEffectSwitch.css';
+import '../_component/Theme_component_igcEffectButton.css';
+import '../_component/Theme_component_igcEffectCommon.css';
+export var presetIgcEffectDark = {
+    color: {
+        primary: 'igcEffectDark',
+        accent: 'igcEffectDefault',
+        invert: 'igcEffectDefault',
+    },
+    control: 'igcEffect',
+    font: 'igcEffect',
+    size: 'igcEffect',
+    space: 'igcEffect',
+    shadow: 'igcEffect',
+};

package/dist/themes/igcEffect/presets/presetIgcEffectDefault.d.ts

@@ -0,0 +1,18 @@
+import '../Theme.css';
+import '../_color/Theme_color_igcEffectDefault.css';
+import '../_color/Theme_color_igcEffectDark.css';
+import '../_color/Theme_color_igcEffectCustom.css';
+import '../_control/Theme_control_igcEffect.css';
+import '../_font/Theme_font_igcEffect.css';
+import '../_size/Theme_size_igcEffect.css';
+import '../_space/Theme_space_igcEffect.css';
+import '../_shadow/Theme_shadow_igcEffect.css';
+import '../_component/Theme_component_igcEffectRctable.css';
+import '../_component/Theme_component_igcEffectCheckbox.css';
+import '../_component/Theme_component_igcEffectSelect.css';
+import '../_component/Theme_component_igcEffectTextField.css';
+import '../_component/Theme_component_igcEffectSwitch.css';
+import '../_component/Theme_component_igcEffectButton.css';
+import '../_component/Theme_component_igcEffectCommon.css';
+import { ThemePreset } from '@consta/uikit/Theme';
+export declare const presetIgcEffectDefault: ThemePreset;

package/dist/themes/igcEffect/presets/presetIgcEffectDefault.js

@@ -0,0 +1,28 @@
+import '../Theme.css';
+import '../_color/Theme_color_igcEffectDefault.css';
+import '../_color/Theme_color_igcEffectDark.css';
+import '../_color/Theme_color_igcEffectCustom.css';
+import '../_control/Theme_control_igcEffect.css';
+import '../_font/Theme_font_igcEffect.css';
+import '../_size/Theme_size_igcEffect.css';
+import '../_space/Theme_space_igcEffect.css';
+import '../_shadow/Theme_shadow_igcEffect.css';
+import '../_component/Theme_component_igcEffectRctable.css';
+import '../_component/Theme_component_igcEffectCheckbox.css';
+import '../_component/Theme_component_igcEffectSelect.css';
+import '../_component/Theme_component_igcEffectTextField.css';
+import '../_component/Theme_component_igcEffectSwitch.css';
+import '../_component/Theme_component_igcEffectButton.css';
+import '../_component/Theme_component_igcEffectCommon.css';
+export var presetIgcEffectDefault = {
+    color: {
+        primary: 'igcEffectDefault',
+        accent: 'igcEffectDark',
+        invert: 'igcEffectDark',
+    },
+    control: 'igcEffect',
+    font: 'igcEffect',
+    size: 'igcEffect',
+    space: 'igcEffect',
+    shadow: 'igcEffect',
+};

package/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "ui-theme-igc-effect",
+  "private": false,
+  "version": "1.0.0",
+  "type": "module",
+  "license": "MIT",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.js",
+  "exports": {
+    ".": {
+      "import": "./dist/index.js"
+    }
+  },
+  "scripts": {
+    "build:css": "npx postcss dist/**/*.css --replace",
+    "build:copy": "node --loader ts-node/esm ./scripts/copyToDist.ts",
+    "build:rmAssets": "node --loader ts-node/esm ./scripts/rmAssets.ts",
+    "build": "tsc --build && npm run build:copy && npm run build:css && npm run build:rmAssets && npm run prettier:dist",
+    "prettier:dist": "prettier --write dist --ignore-path ''"
+  },
+  "peerDependencies": {
+    "@consta/uikit": "4 - 5"
+  },
+  "devDependencies": {
+    "@types/node": "^20.11.5",
+    "postcss": "^8.4.33",
+    "postcss-cli": "^11.0.0",
+    "postcss-discard-comments": "^6.0.1",
+    "postcss-url": "^10.1.3",
+    "prettier": "^3.2.4",
+    "ts-node": "^10.9.2",
+    "typescript": "^5.2.2"
+  }
+}