fix: dark

src/components/search-engine/search-engine.component.html

@@ -20,14 +20,14 @@
     <i class="search-icon iconfont iconsousuo dark-text" (click)="triggerSearch()"></i>
   </div>
 
-  <div class="engine-main" *ngIf="showEngine">
+  <div class="engine-main dark-bg dark-border-color" *ngIf="showEngine">
     <div
-      class="item"
+      class="item dark-bg-gary dark-item-hover"
       *ngFor="let item of SEARCH_ENGINE_LIST; let i=index"
       (click)="clickEngineItem(i)"
     >
       <img class="icon" [src]="item.icon" alt="" />
-      <span class="name">{{ item.name }}</span>
+      <span class="name dark-text">{{ item.name }}</span>
     </div>
   </div>
 </div>

src/components/search-engine/search-engine.component.scss

@@ -30,7 +30,7 @@ $width: 500px;
       }
 
       &:focus {
-        border-color: #40a9ff !important;
+        border-color: #388bfd !important;
         box-shadow: 0 0 0 2px rgba(24, 144, 255, 0.2);
       }
     }
@@ -91,6 +91,9 @@ $width: 500px;
       cursor: pointer;
       margin-bottom: 15px;
       border-radius: 3px;
+      transition: .1s linear;
+      box-sizing: border-box;
+      border: 1px solid transparent;
 
       &:not(:nth-child(3n)) {
         margin-right: 15px;

src/dark.scss

 .dark-container {
   .dark {
-
     &-primary {
       color: #58a6ff !important;
       font-weight: 600;
@@ -28,6 +27,10 @@
       background-color: #0d1117 !important;
     }
 
+    &-bg-gary {
+      background-color: #21262d !important;
+    }
+
     &-text {
       color: #6e7681 !important;
     }
@@ -39,6 +42,10 @@
   
     &-border-color {
       border-color: #30363d !important;
+
+      &:after,&:before {
+        border-color: transparent !important;
+      }
     }
   
     &-item-active {
@@ -53,6 +60,11 @@
         background-color: #0d1117 !important;
       }
     }
+
+    &-item-hover:hover {
+      background-color: #30363d !important;
+      border: 1px solid #8b949e !important;
+    }
   
     // fix-bar
     &-action-hover:hover {

src/view/index/light/index.component.html

@@ -75,7 +75,7 @@
                       class="icon dark-border-color"
                       (error)="onImgError($event)"
                     >
-                    <em class="name dark-primary" [innerHtml]="el.name" [title]="el.name"></em>
+                    <em class="name dark-title" [innerHtml]="el.name" [title]="el.name"></em>
                   </div>
                   <div class="desc dark-border-color dark-text" [innerHtml]="el.desc"></div>
                 </a>

src/view/index/sim/index.component.html

@@ -68,7 +68,7 @@
                     >
                   </div>
   
-                  <div class="right dark-primary" [innerHtml]="ele.name" [title]="ele.name"></div>
+                  <div class="right dark-title" [innerHtml]="ele.name" [title]="ele.name"></div>
                 </div>
 
                 <div class="desc dark-text" [innerHtml]="ele.desc"></div>