update themes

surveyjs · Dec 25, 2024 · a86d81c · a86d81c
1 parent cd45322
commit a86d81c
Show file tree

Hide file tree

Showing 4 changed files with 34 additions and 22 deletions.
diff --git a/packages/survey-creator-core/src/themes/predefined-themes/default/contrast.css b/packages/survey-creator-core/src/themes/predefined-themes/default/contrast.css
@@ -35,14 +35,14 @@
   --sjs-semantic-yellow-background-10: #FF710B1A;
   --sjs-semantic-yellow-foreground-100: #FFFFFFFF;
   --sjs-semantic-white-background-500: #FFFFFFFF;
-  --sjs-code-gray-700: #B6B6B6FF;
-  --sjs-code-blue-500: #326FCAFF;
-  --sjs-code-gray-300: #505050FF;
-  --sjs-code-green-500: #08997CFF;
-  --sjs-code-red-500: #F41B50FF;
-  --sjs-code-purple-500: #C22FA2FF;
-  --sjs-code-yellow-500: #F58D06FF;
-  --sjs-code-gray-500: #8A8A8AFF;
+  --sjs-code-gray-700: #A4A4A4FF;
+  --sjs-code-blue-500: #1E5AB3FF;
+  --sjs-code-gray-300: #1C1C1CFF;
+  --sjs-code-green-500: #127D60FF;
+  --sjs-code-red-500: #D30739FF;
+  --sjs-code-purple-500: #AB228DFF;
+  --sjs-code-yellow-500: #CC6001FF;
+  --sjs-code-gray-500: #686868FF;
   --sjs-special-background: #F4F2FBFF;
   --sjs-layer-1-foreground-75: #000000FF;
   --sjs-layer-3-background-400: #D7D7D7FF;

diff --git a/packages/survey-creator-core/src/themes/predefined-themes/default/dark.css b/packages/survey-creator-core/src/themes/predefined-themes/default/dark.css
@@ -22,8 +22,8 @@
   --sjs-secondary-background-10: #19B3941A;
   --sjs-secondary-foreground-100: #0C0C0CFF;
   --sjs-secondary-forecolor-25: #0C0C0C40;
-  --sjs-semantic-red-background-500: #FF3B6AFF;
-  --sjs-semantic-red-background-10: #FF3B6A1A;
+  --sjs-semantic-red-background-500: #FF6D9AFF;
+  --sjs-semantic-red-background-10: #FF6D9A1A;
   --sjs-semantic-red-foreground-100: #0C0C0CFF;
   --sjs-semantic-green-background-500: #15CDABFF;
   --sjs-semantic-green-background-10: #15CDAB1A;
@@ -35,14 +35,14 @@
   --sjs-semantic-yellow-background-10: #EDA9251A;
   --sjs-semantic-yellow-foreground-100: #0C0C0CFF;
   --sjs-semantic-white-background-500: #FFFFFFFF;
-  --sjs-code-gray-700: #B6B6B6FF;
-  --sjs-code-blue-500: #326FCAFF;
-  --sjs-code-gray-300: #505050FF;
-  --sjs-code-green-500: #08997CFF;
-  --sjs-code-red-500: #F41B50FF;
-  --sjs-code-purple-500: #C22FA2FF;
-  --sjs-code-yellow-500: #F58D06FF;
-  --sjs-code-gray-500: #8A8A8AFF;
+  --sjs-code-gray-700: #5E5E5EFF;
+  --sjs-code-blue-500: #53B3F0FF;
+  --sjs-code-gray-300: #D1D1D1FF;
+  --sjs-code-green-500: #37C7AAFF;
+  --sjs-code-red-500: #FD6E89FF;
+  --sjs-code-purple-500: #F888DFFF;
+  --sjs-code-yellow-500: #FCC669FF;
+  --sjs-code-gray-500: #909090FF;
   --sjs-special-background: #121212FF;
   --sjs-layer-1-foreground-75: #FFFFFFB3;
   --sjs-layer-3-background-400: #303030FF;

diff --git a/packages/survey-creator-core/src/themes/predefined-themes/v2-20.css b/packages/survey-creator-core/src/themes/predefined-themes/v2-20.css
@@ -829,8 +829,8 @@
   --ctr-string-table-row-border-width-bottom: var(--sjs-stroke-x1);
   --ctr-string-table-row-text-color-placeholder: var(--sjs-layer-1-foreground-50);
   --ctr-string-table-row-text-color-title: var(--sjs-layer-1-foreground-100);
-  --ctr-string-table-row-expand-button-icon-width: var(--sjs-font-size-x3);
-  --ctr-string-table-row-expand-button-icon-height: var(--sjs-font-size-x3);
+  --ctr-string-table-row-expand-button-icon-width: var(--sjs-font-size-x2);
+  --ctr-string-table-row-expand-button-icon-height: var(--sjs-font-size-x2);
   --ctr-string-table-row-expand-button-margin-right: var(--sjs-spacing-x1);
   --ctr-string-table-row-expand-button-icon-color-default: var(--sjs-layer-1-foreground-50);
   --ctr-string-table-header-background-color: var(--sjs-layer-3-background-500);
@@ -3375,5 +3375,11 @@
   --ctr-actionbar-button-border-width-highlighed: var(--sjs-stroke-x2);
   --ctr-survey-question-panel-toolbar-item-text-color-selected: var(--sjs-layer-1-foreground-100);
   --ctr-survey-question-panel-toolbar-item-icon-color-selected: var(--sjs-secondary-background-500);
+  --ctr-actionbar-button-background-color-hovered-colorful: var(--sjs-primary-background-10);
+  --ctr-actionbar-button-background-color-hovered-negative: var(--sjs-semantic-red-background-10);
+  --ctr-actionbar-button-text-color-negative: var(--sjs-semantic-red-background-500);
+  --ctr-actionbar-button-icon-color-negative: var(--sjs-semantic-red-background-500);
+  --ctr-actionbar-button-icon-color-with-text-hovered-negative: var(--sjs-semantic-red-background-500);
+  --ctr-actionbar-button-icon-color-with-text-negative: var(--sjs-semantic-red-background-500);
 }
 
diff --git a/packages/survey-creator-core/src/themes/predefined-themes/v2-24.css b/packages/survey-creator-core/src/themes/predefined-themes/v2-24.css
@@ -821,8 +821,8 @@
   --ctr-string-table-row-border-width-bottom: var(--sjs-stroke-x1);
   --ctr-string-table-row-text-color-placeholder: var(--sjs-layer-1-foreground-50);
   --ctr-string-table-row-text-color-title: var(--sjs-layer-1-foreground-100);
-  --ctr-string-table-row-expand-button-icon-width: var(--sjs-font-size-x3);
-  --ctr-string-table-row-expand-button-icon-height: var(--sjs-font-size-x3);
+  --ctr-string-table-row-expand-button-icon-width: var(--sjs-font-size-x2);
+  --ctr-string-table-row-expand-button-icon-height: var(--sjs-font-size-x2);
   --ctr-string-table-row-expand-button-margin-right: var(--sjs-spacing-x1);
   --ctr-string-table-row-expand-button-icon-color-default: var(--sjs-layer-1-foreground-75);
   --ctr-string-table-header-background-color: var(--sjs-layer-3-background-500);
@@ -3375,5 +3375,11 @@
   --ctr-actionbar-button-border-width-highlighed: var(--sjs-stroke-x2);
   --ctr-survey-question-panel-toolbar-item-text-color-selected: var(--sjs-secondary-background-400);
   --ctr-survey-question-panel-toolbar-item-icon-color-selected: var(--sjs-secondary-background-500);
+  --ctr-actionbar-button-background-color-hovered-colorful: var(--sjs-primary-background-10);
+  --ctr-actionbar-button-background-color-hovered-negative: var(--sjs-semantic-red-background-10);
+  --ctr-actionbar-button-text-color-negative: var(--sjs-semantic-red-background-500);
+  --ctr-actionbar-button-icon-color-negative: var(--sjs-semantic-red-background-500);
+  --ctr-actionbar-button-icon-color-with-text-hovered-negative: var(--sjs-semantic-red-background-500);
+  --ctr-actionbar-button-icon-color-with-text-negative: var(--sjs-semantic-red-background-500);
 }