From 8e0414dc7c5fd6d86d6f94958fa94e24f33b08c4 Mon Sep 17 00:00:00 2001
From: Shpuld Shpuldson <shp@cock.li>
Date: Thu, 16 Jul 2020 17:45:07 +0300
Subject: [PATCH] change class names to not have reacts in them

---
 .../user_list_popover/user_list_popover.vue   | 47 +++++++++----------
 1 file changed, 22 insertions(+), 25 deletions(-)

diff --git a/src/components/user_list_popover/user_list_popover.vue b/src/components/user_list_popover/user_list_popover.vue
index b6b7ab95..6bd786b3 100644
--- a/src/components/user_list_popover/user_list_popover.vue
+++ b/src/components/user_list_popover/user_list_popover.vue
@@ -9,27 +9,24 @@
     </template>
     <div
       slot="content"
-      class="reacted-users"
+      class="user-list-popover"
     >
       <div v-if="users.length">
         <div
           v-for="(user) in users"
           :key="user.id"
-          class="reacted-user"
+          class="user-list-row"
         >
           <UserAvatar
             :user="user"
             class="avatar-small"
             :compact="true"
           />
-          <div class="reacted-user-names">
+          <div class="user-list-names">
             <!-- eslint-disable vue/no-v-html -->
-            <span
-              class="reacted-user-name"
-              v-html="user.name_html"
-            />
+            <span v-html="user.name_html" />
             <!-- eslint-enable vue/no-v-html -->
-            <span class="reacted-user-screen-name">{{ user.screen_name }}</span>
+            <span class="user-list-screen-name">{{ user.screen_name }}</span>
           </div>
         </div>
       </div>
@@ -45,29 +42,29 @@
 <style lang="scss">
 @import '../../_variables.scss';
 
-.reacted-users {
+.user-list-popover {
   padding: 0.5em;
-}
 
-.reacted-user {
-  padding: 0.25em;
-  display: flex;
-  flex-direction: row;
-
-  .reacted-user-names {
+  .user-list-row {
+    padding: 0.25em;
     display: flex;
-    flex-direction: column;
-    margin-left: 0.5em;
-    min-width: 5em;
+    flex-direction: row;
 
-    img {
-      width: 1em;
-      height: 1em;
+    .user-list-names {
+      display: flex;
+      flex-direction: column;
+      margin-left: 0.5em;
+      min-width: 5em;
+
+      img {
+        width: 1em;
+        height: 1em;
+      }
     }
-  }
 
-  .reacted-user-screen-name {
-    font-size: 9px;
+    .user-list-screen-name {
+      font-size: 9px;
+    }
   }
 }