fix _apply-colors.scss

packages/app/src/styles/theme/_apply-colors.scss

@@ -47,7 +47,7 @@ $theme-colors: map-merge($theme-colors, ( primary: $primary ));
 @import 'reboot-toastr-colors';
 
 // determine variables with　bootstrap function (These variables can be used after importing bootstrap above)
-$color-modal-header: var(--color-modal-header,contrast(var(--primary)));
+$color-modal-header: var(--color-modal-header,#{hsl.contrast(var(--primary))});
 
 code:not([class^='language-']) {
   @include code.code-inline-color(var(--color-inline-code), var(--bgcolor-inline-code), var(--bordercolor-inline-code));
@@ -186,7 +186,7 @@ ul.pagination {
 
   // for https://youtrack.weseek.co.jp/issue/GW-2603
   .search-typeahead {
-    background-color: var(--bgcolor-global); opacity:0.9;
+    background-color: hsla(var(--bgcolor-global-hs),var(--bgcolor-global-l),90%);
   }
 }
 
@@ -332,8 +332,7 @@ ul.pagination {
       color: var(--color-modal-header);
     }
     .close {
-      color: var(--color-modal-header);
-      opacity: 0.5;
+      color: hsla(var(--color-modal-header),50%);
       &:hover {
         opacity: 0.9;
       }
@@ -353,7 +352,7 @@ ul.pagination {
   .nav-item {
     &:hover,
     &:focus {
-      background-color: var(--color-link); opacity:0.9;
+      background-color: hsla(var(--color-link),90%);
     }
     .nav-link {
       -webkit-appearance: none;

packages/preset-themes/src/styles/default.scss

@@ -52,6 +52,7 @@
   --color-link-wiki-hover: #{hsl.lighten(var(--color-link-wiki),20%)};
   --color-link-nabvar: #{$gray-500};
   --color-inline-code: #{darken($red, 15%)}; // optional
+  --color-modal-header: #{hsl.contrast(var(--primary))};
 
   // List Group colors
   --color-list: var(--color-global); // optional
@@ -90,8 +91,8 @@
   // Sidebar resize button
   --color-resize-button: var(--color-reversal);
   --bgcolor-resize-button: var(--accent);
-  --bgcolor-resize-button-hs: var(var(--accent-hs));
-  --bgcolor-resize-button-l: var(var(--accent-l));
+  --bgcolor-resize-button-hs: var(--accent-hs);
+  --bgcolor-resize-button-l: var(--accent-l);
   --color-resize-button-hover: var(--color-reversal);
   --bgcolor-resize-button-hover: #{hsl.lighten(var(--bgcolor-resize-button), 5%)};
   // Sidebar contents
@@ -127,7 +128,6 @@
 
   @import './theme/apply-colors';
   // @import './theme/apply-colors-light';
-  // @import '/packages/app/src/styles/theme/apply-colors-light-new';
 
   // Button
   .btn-group.grw-page-editor-mode-manager {

packages/preset-themes/src/styles/theme/_apply-colors.scss

@@ -41,7 +41,7 @@
 // nav-tabs-link-active-border-color: var(--bordercolor-nav-tabs-active);
 // theme-colors: map-merge($theme-colors, ( primary: $primary ));
 
-@import 'reboot-bootstrap-nav';
+// @import 'reboot-bootstrap-nav';
 
 // determine variables with　bootstrap function (These variables can be used after importing bootstrap above)
 // $color-modal-header: var(--color-modal-header,contrast(var(--primary)));