UX: better customize emoji layout on mobile (#9319)

UX: better customize emoji layout on mobile (#9319)

diff --git a/app/assets/stylesheets/common/admin/admin_emojis.scss b/app/assets/stylesheets/common/admin/admin_emojis.scss
index c6cf4c2..fd2cfdd 100644
--- a/app/assets/stylesheets/common/admin/admin_emojis.scss
+++ b/app/assets/stylesheets/common/admin/admin_emojis.scss
@@ -4,47 +4,22 @@
       width: 220px;
     }
   }
-}
-
-.emoji-uploader {
-  display: flex;
-  align-items: flex-end;
-
-  input,
-  .select-kit {
-    width: 220px;
-    margin: 0 1em 0 0;
-  }
 
-  .upload-container {
+  .emoji-uploader {
     display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-direction: column;
-  }
-}
+    align-items: flex-end;
 
-.mobile-view {
-  .admin-emojis {
-    .emoji-uploader {
-      flex-direction: column;
-
-      .fields {
-        input,
-        .select-kit {
-          width: 100%;
-        }
-      }
-
-      .upload-container {
-        margin: 1em 0 0 0;
-      }
+    input,
+    .select-kit {
+      width: 220px;
+      margin: 0 1em 0 0;
     }
 
-    #custom_emoji {
-      .select-kit {
-        display: none;
-      }
+    .upload-container {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-direction: column;
     }
   }
 }
diff --git a/app/assets/stylesheets/mobile.scss b/app/assets/stylesheets/mobile.scss
index 567a051..ee9c3ed 100644
--- a/app/assets/stylesheets/mobile.scss
+++ b/app/assets/stylesheets/mobile.scss
@@ -29,6 +29,7 @@
 @import "mobile/admin_report";
 @import "mobile/admin_report_table";
 @import "mobile/admin_report_counters";
+@import "mobile/admin_emojis";
 @import "mobile/menu-panel";
 @import "mobile/reviewables";
 
diff --git a/app/assets/stylesheets/mobile/admin_emojis.scss b/app/assets/stylesheets/mobile/admin_emojis.scss
new file mode 100644
index 0000000..2014a51
--- /dev/null
+++ b/app/assets/stylesheets/mobile/admin_emojis.scss
@@ -0,0 +1,35 @@
+.admin-emojis {
+  #custom_emoji {
+    .select-kit {
+      display: none;
+    }
+
+    tbody tr th {
+      @include ellipsis;
+
+      &:nth-child(2) {
+        max-width: 80px;
+      }
+    }
+  }
+
+  .emoji-uploader {
+    flex-direction: column;
+    align-items: flex-start;
+    justify-content: center;
+
+    .control {
+      margin-bottom: 1em;
+      width: 100%;
+
+      input,
+      .select-kit {
+        width: 100%;
+      }
+    }
+
+    .upload-container {
+      margin: 0;
+    }
+  }
+}

GitHub sha: 9bbaaea1

This commit appears in #9319 which was merged by jjaffeux.