Fix secondary color

surveyjs · Jan 20, 2025 · 28be305 · 28be305
1 parent 862145a
commit 28be305
Show file tree

Hide file tree

Showing 9 changed files with 11 additions and 12 deletions.
diff --git a/packages/survey-creator-core/src/components/creator.scss b/packages/survey-creator-core/src/components/creator.scss
@@ -190,7 +190,7 @@ survey-creator,
   top: calcSize(0.75);
   width: 100%;
   height: calcSize(0.5);
-  background: $secondary;
+  background: var(--sjs-secondary-background-500, #19B394FF);
   position: absolute;
 }
 

diff --git a/packages/survey-creator-core/src/components/matrix-cell.scss b/packages/survey-creator-core/src/components/matrix-cell.scss
@@ -29,7 +29,7 @@
 
 .svc-matrix-cell--selected {
   position: absolute;
-  border: calcSize(0.25) solid $secondary;
+  border: calcSize(0.25) solid var(--sjs-secondary-background-500, #19B394FF);
   border-radius: calcSize(0.5);
   top: calcSize(0);
   left: calcSize(0);

diff --git a/packages/survey-creator-core/src/components/page.scss b/packages/survey-creator-core/src/components/page.scss
@@ -129,7 +129,7 @@ svc-page {
       color: var(--ctr-survey-page-toolbar-item-text-color-selected, $foreground);
     }
     use {
-      fill: var(--ctr-survey-page-toolbar-item-icon-color-selected, $secondary);
+      fill: var(--ctr-survey-page-toolbar-item-icon-color-selected, var(--sjs-secondary-background-500, #19B394FF));
     }
   }
 
@@ -273,7 +273,7 @@ svc-page {
   &.svc-creator .svc-page .svc-page__content--selected:focus,
   .svc-hovered.svc-page__content {
     &.svc-page__content--selected {
-      box-shadow: 0 0 0 2px inset $secondary;
+      box-shadow: 0 0 0 2px inset var(--sjs-secondary-background-500, #19B394FF);
 
       box-shadow: 0 0 0 2px inset var(--ctr-survey-page-border-color-selected, var(--sjs-secondary-background-500, #19b394ff));
       background: var(--ctr-survey-page-background-color-selected, var(--sjs-special-background, #edf9f7ff));
@@ -371,7 +371,7 @@ svc-page {
 .svc-page--drag-over-empty .svc-page__footer:after {
   content: " ";
   position: absolute;
-  background: $secondary;
+  background: var(--sjs-secondary-background-500, #19B394FF);
   left: calcSize(3);
   bottom: calcSize(11.5);
   width: 100%;

diff --git a/packages/survey-creator-core/src/components/question.scss b/packages/survey-creator-core/src/components/question.scss
@@ -442,7 +442,7 @@ svc-question {
 
   .svc-list__item:hover > .svc-list__item-body .sv-svg-icon use,
   .sv-svg-icon use {
-    fill: $secondary;
+    fill: var(--sjs-secondary-background-500, #19B394FF);
   }
 }
 
@@ -642,7 +642,7 @@ svc-question {
 
 .svc-question__drop-indicator {
   position: absolute;
-  background: $secondary;
+  background: var(--sjs-secondary-background-500, #19B394FF);
   opacity: 0;
   transition: opacity $creator-transition-duration;
 }

diff --git a/packages/survey-creator-core/src/components/row.scss b/packages/survey-creator-core/src/components/row.scss
@@ -78,7 +78,7 @@
 
 .svc-row__drop-indicator {
   position: absolute;
-  background: $secondary;
+  background: var(--sjs-secondary-background-500, #19B394FF);
   opacity: 0;
   transition: opacity $creator-transition-duration;
 }

diff --git a/packages/survey-creator-core/src/components/tabs/logic.scss b/packages/survey-creator-core/src/components/tabs/logic.scss
@@ -85,7 +85,7 @@
 }
 
 .sl-table__row.sl-table__row--additional .sl-table__cell .svc-action-button {
-  color: $secondary;
+  color: var(--sjs-secondary-background-500, #19B394FF);
 }
 .sl-table .svc-action-button {
   padding: var(--ctr-survey-page-header-padding-vertical-with-button, var(--sjs-spacing-x05)) 0px;

diff --git a/packages/survey-creator-core/src/property-grid-theme/blocks/spg-matrixdynamic.scss b/packages/survey-creator-core/src/property-grid-theme/blocks/spg-matrixdynamic.scss
@@ -40,7 +40,7 @@
   content: "";
   width: 100%;
   height: calcSize(0.5);
-  background-color: $secondary;
+  background-color: var(--sjs-secondary-background-500, #19B394FF);
   position: absolute;
   left: 0;
 }

diff --git a/packages/survey-creator-core/src/variables-layer.scss b/packages/survey-creator-core/src/variables-layer.scss
@@ -6,7 +6,7 @@ $primary-background-10: var(--sjs-primary-background-10, #{$primary-light});
 $primary-foreground-100: var(--sjs-primary-foreground-100, #{$primary-foreground});
 $primary-foreground-25: var(--sjs-primary-foreground-25, #{$primary-foreground-disabled});
 
-$secondary-background-500: var(--sjs-secondary-background-500, #{$secondary});
+$secondary-background-500: var(--sjs-secondary-background-500, #19B394FF);
 $secondary-background-25: var(--sjs-secondary-background-25, #{$secondary-backcolor-semi-light});
 $secondary-background-10: var(--sjs-secondary-background-10, #{$secondary-light});
 $secondary-foreground-100: var(--sjs-secondary-foreground-100, #{$secondary-forecolor});

diff --git a/packages/survey-creator-core/src/variables.scss b/packages/survey-creator-core/src/variables.scss
@@ -7,7 +7,6 @@ $primary-background-dark: var(--sjs-primary-backcolor-dark, rgb(20, 164, 139));
 $primary-foreground: var(--sjs-primary-forecolor, var(--primary-foreground, #fff));
 $primary-foreground-disabled: var(--sjs-primary-forecolor-light, var(--primary-foreground-disabled, rgba(#fff, 0.25)));
 
-$secondary: var(--sjs-secondary-backcolor, var(--secondary, #ff9814));
 $secondary-light: var(--sjs-secondary-backcolor-light, var(--secondary-light, rgba(255, 152, 20, 0.25)));
 $secondary-backcolor-semi-light: var(--sjs-secondary-backcolor-semi-light, rgba(255, 152, 20, 0.1));
 $secondary-forecolor: var(--sjs-secondary-forecolor, #fff);