'admin-21.03.05:更新最新依赖、增加图标选择器、样式优化等'

src/theme/element.scss

@@ -956,45 +956,4 @@
   width: 100%;
   height: 100%;
   overflow: auto;
-}
-
-/* Popover 弹出框
-------------------------------- */
-.icon-selector-popper {
-  padding: 0 !important;
-  .icon-selector-warp-title {
-    height: 40px;
-    line-height: 40px;
-    padding: 0 15px;
-  }
-  .icon-selector-warp {
-    .icon-selector-warp-row {
-      border-top: 1px solid #ebeef5;
-      border-left: 1px solid #ebeef5;
-      max-height: 260px;
-      overflow-y: auto;
-      .icon-selector-warp-item {
-        display: flex;
-        border-right: 1px solid #ebeef5;
-        border-bottom: 1px solid #ebeef5;
-        padding: 10px;
-        .icon-selector-warp-item-value {
-          transition: all 0.3s ease;
-          i {
-            font-size: 20px;
-            color: #606266;
-          }
-        }
-        &:hover {
-          cursor: pointer;
-          .icon-selector-warp-item-value {
-            i {
-              color: var(--color-primary);
-              transition: all 0.3s ease;
-            }
-          }
-        }
-      }
-    }
-  }
-}
+}

src/theme/iconSelector.scss

@@ -0,0 +1,87 @@
+/* Popover 弹出框(图标选择器)
+------------------------------- */
+.icon-selector-popper {
+  padding: 0 !important;
+  .icon-selector-warp {
+    .icon-selector-warp-title {
+      height: 40px;
+      line-height: 40px;
+      padding: 0 15px;
+    }
+    .icon-selector-warp-row {
+      max-height: 260px;
+      overflow-y: auto;
+      padding: 15px 15px 5px;
+      border-top: 1px solid #ebeef5;
+      .ele-col:nth-last-child(1),
+      .ele-col:nth-last-child(2) {
+        display: none;
+      }
+      .awe-col:nth-child(-n + 24) {
+        display: none;
+      }
+      .icon-selector-warp-item {
+        display: flex;
+        border: 1px solid #ebeef5;
+        padding: 10px;
+        border-radius: 5px;
+        margin-bottom: 10px;
+        transition: all 0.3s ease;
+        .icon-selector-warp-item-value {
+          transition: all 0.3s ease;
+          i {
+            font-size: 20px;
+            color: #606266;
+          }
+        }
+        &:hover {
+          border: 1px solid var(--color-primary);
+          cursor: pointer;
+          transition: all 0.3s ease;
+          .icon-selector-warp-item-value {
+            i {
+              color: var(--color-primary);
+              transition: all 0.3s ease;
+            }
+          }
+        }
+      }
+      .icon-selector-active {
+        border: 1px solid var(--color-primary);
+        .icon-selector-warp-item-value {
+          i {
+            color: var(--color-primary);
+          }
+        }
+      }
+    }
+    .icon-selector-all {
+      .el-input {
+        padding: 0 15px;
+        margin-bottom: 10px;
+      }
+      &-tabs {
+        display: flex;
+        height: 30px;
+        line-height: 30px;
+        padding: 0 15px;
+        margin-bottom: 5px;
+        &-item {
+          flex: 1;
+          text-align: center;
+          cursor: pointer;
+          &:hover {
+            color: var(--color-primary);
+          }
+        }
+        &-active {
+          background: var(--color-primary);
+          border-radius: 5px;
+          .label {
+            color: #ffffff;
+          }
+        }
+      }
+    }
+  }
+}

src/theme/index.scss

@@ -1,4 +1,5 @@
 @import './app.scss';
 @import './base.scss';
 @import './element.scss';
+@import './iconSelector.scss';
 @import './media/media.scss';