소스 검색

refactor: .o-icon--active to .has-active

Casper Dai 3 년 전
부모
커밋
59ca493564

+ 1 - 1
src/components/Schedule/ScheduleCalendar/EventItemWeek.vue

@@ -9,7 +9,7 @@
         {{ item.event.origin.target.name }}
         <i
           v-if="editable"
-          class="o-icon--active el-icon-delete u-pointer"
+          class="el-icon-delete has-active u-pointer"
           @click="onRemove"
         />
       </div>

+ 1 - 1
src/components/Schedule/ScheduleSwiper/index.vue

@@ -66,7 +66,7 @@
               step-strictly
             />
             <i
-              class="l-flex__none c-schedule-swiper__del o-icon--active el-icon-delete u-pointer"
+              class="l-flex__none c-schedule-swiper__del el-icon-delete has-active u-pointer"
               @click="onDel(program, index)"
             />
           </div>

+ 2 - 2
src/components/external/DevicePlayer/index.vue

@@ -62,12 +62,12 @@
               原画
             </div>
           </div>
-          <div class="u-pointer">
+          <div class="has-active u-pointer">
             {{ qualityValue }}
           </div>
         </div>
         <i
-          class="o-icon--active el-icon-full-screen u-pointer"
+          class="el-icon-full-screen has-active u-pointer"
           @click="onFullScreen"
         />
       </template>

+ 3 - 3
src/components/external/camera/CameraDetail/index.vue

@@ -61,17 +61,17 @@
           />
           <i
             v-else
-            class="c-video-controls__btn o-icon--active u-pointer"
+            class="c-video-controls__btn has-active u-pointer"
             :class="iconClass"
             @click="onPlayOrPause"
           />
         </div>
         <i
-          class="c-video-controls__btn settings o-icon--active el-icon-setting u-pointer"
+          class="c-video-controls__btn settings el-icon-setting has-active u-pointer"
           @click.stop="onSettings"
         />
         <i
-          class="c-video-controls__btn o-icon--active el-icon-refresh u-pointer"
+          class="c-video-controls__btn el-icon-refresh has-active u-pointer"
           @click="onRefresh"
         />
       </div>

+ 1 - 1
src/components/external/camera/CameraPlayer/index.vue

@@ -37,7 +37,7 @@
       <slot />
       <i
         v-if="online"
-        class="o-icon--active el-icon-full-screen u-pointer"
+        class="el-icon-full-screen has-active u-pointer"
         @click="onFullScreen"
       />
     </div>

+ 1 - 1
src/components/external/player.js

@@ -29,7 +29,7 @@ export default {
       if (this.needReset) {
         return 'el-icon-refresh'
       }
-      return this.paused ? 'o-icon--active el-icon-video-play' : 'o-icon--active el-icon-video-pause'
+      return this.paused ? 'el-icon-video-play has-active' : 'el-icon-video-pause has-active'
     },
     isPlaying () {
       return !(this.loading || this.needReset || this.controls && this.paused)

+ 1 - 1
src/scss/bem/_component.scss

@@ -535,7 +535,7 @@
       rgba(#000, 0) 0%,
       rgba(#000, 0.6) 100%);
 
-  .o-icon--active {
+  .has-active {
     margin-left: $spacing;
     font-size: 18px;
   }

+ 10 - 0
src/scss/bem/_ishas.scss

@@ -41,6 +41,16 @@
   }
 }
 
+.has-active {
+  &:hover {
+    color: $primary  !important;
+  }
+
+  &:active {
+    color: $blue  !important;
+  }
+}
+
 .is-rotate {
   transform: rotate(180deg);
 }

+ 0 - 10
src/scss/bem/_object.scss

@@ -249,16 +249,6 @@
   }
 }
 
-.o-icon--active {
-  &:hover {
-    color: $primary  !important;
-  }
-
-  &:active {
-    color: $blue  !important;
-  }
-}
-
 .o-link {
   color: $gray;
   font-size: 12px;

+ 2 - 2
src/views/bigscreen/ast/Designer.vue

@@ -244,7 +244,7 @@
             class="c-card__tag"
           >{{ source.tag }}</div>
           <i
-            class="c-card__icon el-icon-delete o-icon--active"
+            class="c-card__icon el-icon-delete has-active"
             @mousedown.stop
             @pointerdown.stop
             @click.stop="onDelAsset(index)"
@@ -312,7 +312,7 @@
                 class="c-card__checkbox"
               />
               <i
-                class="c-card__type el-icon-video-play o-icon--active u-pointer"
+                class="c-card__type el-icon-video-play has-active u-pointer"
                 @click.stop="onView(item)"
               />
             </card>

+ 1 - 1
src/views/dashboard/Dashboard.vue

@@ -38,7 +38,7 @@
         <div v-else>{{ monitor.inactive }}</div>
       </div>
       <i
-        class="c-count__refresh o-icon--active el-icon-refresh u-pointer"
+        class="c-count__refresh el-icon-refresh has-active u-pointer"
         @click.stop="onRefresh"
       />
     </div>

+ 2 - 2
src/views/device/detail/components/DeviceMap.vue

@@ -5,7 +5,7 @@
   >
     <i
       v-if="center"
-      class="o-icon--active el-icon-place u-pointer"
+      class="o-place el-icon-place u-pointer"
       @click="onPlace"
     />
   </div>
@@ -80,7 +80,7 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.o-icon--active {
+.o-place {
   display: inline-flex;
   justify-content: center;
   align-items: center;

+ 1 - 1
src/views/device/detail/components/external/Camera/index.vue

@@ -56,7 +56,7 @@
         >
           <template v-if="editable">
             <i
-              class="o-icon--active el-icon-delete u-pointer"
+              class="el-icon-delete has-active u-pointer"
               @click.stop="onDel(item)"
             />
           </template>

+ 1 - 1
src/views/device/detail/index.vue

@@ -9,7 +9,7 @@
         <div class="l-flex--row has-padding">
           <i
             v-if="useDashboard"
-            class="c-sibling-item c-detail__dashboard o-icon--active el-icon-full-screen u-pointer"
+            class="c-sibling-item c-detail__dashboard el-icon-full-screen has-active u-pointer"
             @click="onDashboard"
           />
           <span

+ 2 - 2
src/views/external/camera/index.vue

@@ -50,11 +50,11 @@
           @fullscreen="onFullScreen(item)"
         >
           <i
-            class="o-icon--active el-icon-edit u-pointer"
+            class="el-icon-edit has-active u-pointer"
             @click.stop="onEdit(item)"
           />
           <i
-            class="o-icon--active el-icon-delete u-pointer"
+            class="el-icon-delete has-active u-pointer"
             @click.stop="onDel(item)"
           />
         </camera-player>