workflow: add stylelint

src/layout/components/AppMain.vue

@@ -47,6 +47,7 @@ export default defineComponent({
   position: relative;
   overflow-x: hidden;
 }
+
 .fixed-header + .app-main {
   padding-top: 50px;
 }

src/layout/components/Navbar.vue

@@ -194,20 +194,24 @@ export default defineComponent({
     align-items: center;
     height: 48px;
     line-height: 48px;
+
     .inter {
       width: 40px;
       height: 48px;
       display: flex;
       align-items: center;
       justify-content: space-around;
+
       &:hover {
         cursor: pointer;
         background: #f0f0f0;
       }
+
       img {
         width: 25px;
       }
     }
+
     .hsset {
       width: 40px;
       height: 48px;
@@ -215,11 +219,13 @@ export default defineComponent({
       align-items: center;
       justify-content: space-around;
       margin-right: 5px;
+
       &:hover {
         cursor: pointer;
         background: #f0f0f0;
       }
     }
+
     .el-dropdown-link {
       width: 70px;
       display: flex;
@@ -227,9 +233,11 @@ export default defineComponent({
       justify-content: space-around;
       margin-right: 10px;
       cursor: pointer;
+
       p {
         font-size: 14px;
       }
+
       img {
         width: 22px;
         height: 22px;
@@ -241,9 +249,11 @@ export default defineComponent({
 .el-dropdown-menu__item {
   padding: 0 10px;
 }
+
 .el-dropdown-menu {
   padding: 6px 0;
 }
+
 .el-dropdown-menu__item:focus,
 .el-dropdown-menu__item:not(.is-disabled):hover {
   color: #606266;

src/layout/components/panel/index.vue

@@ -81,7 +81,7 @@ export default {
   position: fixed;
   top: 0;
   right: 0;
-  box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
+  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.05);
   transition: all 0.25s cubic-bezier(0.7, 0.3, 0.1, 1);
   transform: translate(100%);
   background: #fff;
@@ -118,6 +118,7 @@ export default {
   line-height: 48px;
   top: 45%;
   background: rgb(24, 144, 255);
+
   i {
     font-size: 24px;
     line-height: 48px;
@@ -139,9 +140,11 @@ export default {
   align-items: center;
   top: 15px;
   margin-left: 10px;
+
   i {
     font-size: 20px;
     margin-right: 20px;
+
     &:hover {
       cursor: pointer;
       color: red;

src/layout/components/screenfull/index.vue

@@ -39,6 +39,7 @@ export default defineComponent({
   display: flex;
   align-items: center;
   justify-content: space-around;
+
   &:hover {
     cursor: pointer;
     background: #f0f0f0;

src/layout/components/setting/index.vue

@@ -246,6 +246,7 @@ export default {
 <style lang="scss" scoped>
 .setting {
   width: 100%;
+
   li {
     display: flex;
     justify-content: space-between;
@@ -253,16 +254,19 @@ export default {
     margin: 25px;
   }
 }
+
 :deep(.el-divider__text) {
   font-size: 16px;
   font-weight: 700;
 }
+
 .theme-stley {
   margin-top: 25px;
   width: 100%;
   height: 60px;
   display: flex;
   justify-content: space-around;
+
   li {
     width: 30%;
     height: 100%;
@@ -273,6 +277,7 @@ export default {
     background-color: #f0f2f5;
     border-radius: 4px;
     box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 18%);
+
     &:nth-child(1) {
       div {
         &:nth-child(1) {
@@ -280,13 +285,14 @@ export default {
           height: 100%;
           background: #1b2a47;
         }
+
         &:nth-child(2) {
           width: 70%;
           height: 30%;
           top: 0;
           right: 0;
           background-color: #fff;
-          box-shadow: 0 0 1px #888888;
+          box-shadow: 0 0 1px #888;
           position: absolute;
         }
       }
@@ -297,17 +303,18 @@ export default {
         &:nth-child(1) {
           width: 30%;
           height: 100%;
-          box-shadow: 0 0 1px #888888;
+          box-shadow: 0 0 1px #888;
           background-color: #fff;
           border-radius: 4px 0 0 4px;
         }
+
         &:nth-child(2) {
           width: 70%;
           height: 30%;
           top: 0;
           right: 0;
           background-color: #fff;
-          box-shadow: 0 0 1px #888888;
+          box-shadow: 0 0 1px #888;
           position: absolute;
         }
       }

src/layout/components/sidebar/Logo.vue

@@ -74,7 +74,7 @@ export default defineComponent({
 
   .collapse {
     .sidebar-logo {
-      margin-right: 0px;
+      margin-right: 0;
     }
   }
 }

src/layout/components/tag/index.vue

@@ -565,11 +565,66 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+@keyframes scheduleInWidth {
+  from {
+    width: 0;
+  }
+
+  to {
+    width: 100%;
+  }
+}
+@keyframes scheduleOutWidth {
+  from {
+    width: 100%;
+  }
+
+  to {
+    width: 0;
+  }
+}
+@-webkit-keyframes rotate {
+  from {
+    -webkit-transform: rotate(0deg);
+  }
+
+  to {
+    -webkit-transform: rotate(360deg);
+  }
+}
+@-moz-keyframes rotate {
+  from {
+    -moz-transform: rotate(0deg);
+  }
+
+  to {
+    -moz-transform: rotate(360deg);
+  }
+}
+@-o-keyframes rotate {
+  from {
+    -o-transform: rotate(0deg);
+  }
+
+  to {
+    -o-transform: rotate(360deg);
+  }
+}
+@keyframes rotate {
+  from {
+    transform: rotate(0deg);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}
+
 .tags-view {
   width: 100%;
   font-size: 14px;
   display: flex;
-  box-shadow: 0 0 1px #888888;
+  box-shadow: 0 0 1px #888;
 
   .scroll-item {
     border-radius: 3px 3px 0 0;
@@ -585,6 +640,7 @@ export default {
       font-size: 10px;
       color: #1890ff;
       cursor: pointer;
+
       &:hover {
         border-radius: 50%;
         color: #fff;
@@ -612,6 +668,7 @@ export default {
     position: relative;
     width: 100%;
     background: #fff;
+
     .scroll-item {
       &:nth-child(1) {
         margin-left: 5px;
@@ -640,6 +697,7 @@ export default {
     white-space: nowrap;
     outline: 0;
     box-shadow: 0 2px 8px rgb(0 0 0 / 15%);
+
     li {
       width: 100%;
       margin: 0;
@@ -665,6 +723,7 @@ export default {
   align-items: center;
   background: #fff;
   font-size: 16px;
+
   li {
     width: 40px;
     height: 38px;
@@ -692,15 +751,17 @@ export default {
     }
   }
 }
+
 .el-dropdown-menu__item:not(.is-disabled):hover {
   color: #606266;
   background: #f0f0f0;
 }
+
 :deep(.el-dropdown-menu__item) i {
   margin-right: 10px;
 }
 
-.el-dropdown-menu__item--divided:before {
+.el-dropdown-menu__item--divided::before {
   margin: 0;
 }
 
@@ -712,6 +773,7 @@ export default {
   background-color: #eaf4fe;
   position: relative;
   color: #fff;
+
   a {
     color: #1890ff;
   }
@@ -725,6 +787,7 @@ export default {
 .card-in {
   border: 1px solid #1890ff;
   color: #1890ff;
+
   a {
     color: #1890ff;
   }
@@ -733,6 +796,7 @@ export default {
 .card-out {
   border: none;
   color: #666;
+
   a {
     color: #666;
   }
@@ -757,14 +821,6 @@ export default {
   background: #1890ff;
   animation: scheduleInWidth 400ms ease-in;
 }
-@keyframes scheduleInWidth {
-  from {
-    width: 0px;
-  }
-  to {
-    width: 100%;
-  }
-}
 // 灵动模式下鼠标移出隐藏蓝色进度条
 .schedule-out {
   width: 0;
@@ -775,14 +831,6 @@ export default {
   background: #1890ff;
   animation: scheduleOutWidth 400ms ease-in;
 }
-@keyframes scheduleOutWidth {
-  from {
-    width: 100%;
-  }
-  to {
-    width: 0;
-  }
-}
 // 刷新按钮动画效果
 .refresh-button {
   -webkit-animation: rotate 600ms linear infinite;
@@ -790,36 +838,4 @@ export default {
   -o-animation: rotate 600ms linear infinite;
   animation: rotate 600ms linear infinite;
 }
-@-webkit-keyframes rotate {
-  from {
-    -webkit-transform: rotate(0deg);
-  }
-  to {
-    -webkit-transform: rotate(360deg);
-  }
-}
-@-moz-keyframes rotate {
-  from {
-    -moz-transform: rotate(0deg);
-  }
-  to {
-    -moz-transform: rotate(360deg);
-  }
-}
-@-o-keyframes rotate {
-  from {
-    -o-transform: rotate(0deg);
-  }
-  to {
-    -o-transform: rotate(360deg);
-  }
-}
-@keyframes rotate {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
 </style>

src/layout/index.vue

@@ -175,25 +175,28 @@ export default {
 </style>
 
 <style lang="scss" scoped>
+$sideBarWidth: 210px;
 @mixin clearfix {
-  &:after {
+  &::after {
     content: "";
     display: table;
     clear: both;
   }
 }
-$sideBarWidth: 210px;
 
 .app-wrapper {
   @include clearfix;
+
   position: relative;
   height: 100%;
   width: 100%;
+
   &.mobile.openSidebar {
     position: fixed;
     top: 0;
   }
 }
+
 .drawer-bg {
   background: #000;
   opacity: 0.3;