- #$gray-300 → $gray-300

- #eee; →$gray-100;

src/client/styles/scss/_editor-attachment.scss

@@ -51,7 +51,7 @@
       // accepted
       &.dropzone-accepted:not(.dropzone-rejected) {
         .overlay.overlay-dropzone-active {
-          border: 4px dashed #$gray-300;
+          border: 4px dashed $gray-300;
 
           .overlay-content {
             // insert content
@@ -106,7 +106,7 @@
     padding-bottom: 3px;
     font-size: small;
     border: none;
-    border-top: 1px dotted #$gray-300;
+    border-top: 1px dotted $gray-300;
     border-bottom: none;
 
     &:active {

src/client/styles/scss/_hljs.scss

@@ -16,7 +16,7 @@ pre.hljs {
     font-style: normal;
     font-weight: bold;
     color: #333;
-    background: #$gray-300;
+    background: $gray-300;
     opacity: 0.6;
   }
 }
@@ -24,12 +24,12 @@ pre.hljs {
 // styles for highlightjs-line-numbers
 .hljs-ln td.hljs-ln-numbers {
   padding-right: 5px;
-  color: #$gray-300;
+  color: $gray-300;
 
   text-align: center;
   vertical-align: top;
   user-select: none;
-  border-right: 1px solid #$gray-300;
+  border-right: 1px solid $gray-300;
 }
 
 .hljs-ln td.hljs-ln-code {

src/client/styles/scss/_on-edit.scss

@@ -313,10 +313,10 @@ body.on-edit {
   .tooltip-inner {
     color: #000;
     background-color: #fff;
-    border: 1px solid #$gray-300;
+    border: 1px solid $gray-300;
   }
 
   .tooltip-arrow {
-    border-bottom: 5px solid #$gray-300;
+    border-bottom: 5px solid $gray-300;
   }
 }

src/client/styles/scss/_page.scss

@@ -17,7 +17,7 @@
 
     // crowi layout only
     a.last-path {
-      color: #$gray-300;
+      color: $gray-300;
 
       &:hover {
         color: inherit;

src/client/styles/scss/_page_list.scss

@@ -67,8 +67,8 @@ body .page-list {
 }
 
 .card-timeline {
-  border: 1px solid #$gray-300;
+  border: 1px solid $gray-300;
   > .card-header {
-    background-color: #$gray-300;
+    background-color: $gray-300;
   }
 }

src/client/styles/scss/_search.scss

@@ -11,7 +11,7 @@
   height: 22px;
   padding: 8px;
   font-size: 0.6em;
-  color: #$gray-300;
+  color: $gray-300;
 }
 
 .search-typeahead {
@@ -213,7 +213,7 @@
       .wiki {
         padding: 16px;
         font-size: 13px;
-        border: solid 1px #$gray-300;
+        border: solid 1px $gray-300;
       }
     }
   }

src/client/styles/scss/theme/_apply-colors-dark.scss

@@ -141,7 +141,7 @@ ul.pagination {
 
   .btn-fill {
     .btn-label {
-      color: #$gray-300;
+      color: $gray-300;
     }
     .btn-label-text {
       color: #aaa;

src/client/styles/scss/theme/christmas.scss

@@ -90,7 +90,7 @@ html[dark] {
   $color-editor-icons: $color-global;
 
   // Border colors
-  $border-color-theme: #$gray-300; // former: `$navbar-border: #$gray-300;`
+  $border-color-theme: $gray-300; // former: `$navbar-border: $gray-300;`
   $bordercolor-inline-code: #ccc8c8; // optional
 
   // Dropdown colors

src/client/styles/scss/theme/halloween.scss

@@ -93,7 +93,7 @@ html[dark] {
   $color-editor-icons: $color-global;
 
   // Border colors
-  $border-color-theme: #$gray-300; // former: `$navbar-border: #$gray-300;`
+  $border-color-theme: $gray-300; // former: `$navbar-border: $gray-300;`
   $bordercolor-inline-code: #4d4d4d; // optional
 
   // Dropdown colors

src/client/styles/scss/theme/island.scss

@@ -64,13 +64,13 @@ html[dark] {
   $bgcolor-sidebar-list-group: #eff8f7; // optional
 
   // Tabs
-  $bordercolor-nav-tabs: #$gray-300; // optional
+  $bordercolor-nav-tabs: $gray-300; // optional
 
   // Icon colors
   $color-editor-icons: $color-global;
 
   // Border colors
-  $border-color-theme: #$gray-300;
+  $border-color-theme: $gray-300;
   $bordercolor-inline-code: #ccc8c8; // optional
 
   // Dropdown colors

src/client/styles/scss/theme/mono-blue.scss

@@ -62,7 +62,7 @@ html[light] {
   $color-editor-icons: $color-global;
 
   // Border colors
-  $border-color-theme: #$gray-300;
+  $border-color-theme: $gray-300;
   $bordercolor-inline-code: #ccc8c8; // optional
 
   // Dropdown colors

src/client/styles/scss/theme/nature.scss

@@ -79,7 +79,7 @@ html[dark] {
   $color-editor-icons: $color-global;
 
   // Border colors
-  $border-color-theme: #$gray-300;
+  $border-color-theme: $gray-300;
   $bordercolor-inline-code: #ccc8c8; // optional
 
   // Dropdown colors

src/client/styles/scss/theme/spring.scss

@@ -79,7 +79,7 @@ html[dark] {
   $color-editor-icons: $color-global;
 
   // Border colors
-  $border-color-theme: #$gray-300; // former: `$navbar-border: #$gray-300;`
+  $border-color-theme: $gray-300; // former: `$navbar-border: $gray-300;`
   $bordercolor-inline-code: #ccc8c8; // optional
 
   // Dropdown colors

src/client/styles/scss/theme/wood.scss

@@ -97,7 +97,7 @@ html[dark] {
   $bgcolor-resize-button: $themecolor;
 
   // Border colors
-  $border-color-theme: #$gray-300; // former: `$navbar-border: #$gray-300;`
+  $border-color-theme: $gray-300; // former: `$navbar-border: $gray-300;`
   $bordercolor-inline-code: #ccc8c8; // optional
 
   // Dropdown colors

src/server/views/admin/customize.html

@@ -7,7 +7,7 @@
 {{ cdnStyleTag('jquery-ui') }}
 <style>
   .CodeMirror {
-    border: 1px solid #eee;
+    border: 1px solid $gray-100;
   }
 </style>
 {% endblock %}