From d8d2dc950a0512cc53885afbd1da26ea38fdf1e1 Mon Sep 17 00:00:00 2001
From: Jordan Vidrine <30537603+jordanvidrine@users.noreply.github.com>
Date: Wed, 23 Mar 2022 10:42:55 -0500
Subject: [PATCH] UX: Additional refactor for topic-list prep (#310)

---
 .../discourse/templates/components/assigned-topic-list.hbs | 4 ++--
 .../mobile/components/basic-assigned-topic-list.hbs        | 4 ++--
 assets/stylesheets/assigns.scss                            | 2 +-
 assets/stylesheets/mobile/assigns.scss                     | 7 +++++++
 4 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/assets/javascripts/discourse/templates/components/assigned-topic-list.hbs b/assets/javascripts/discourse/templates/components/assigned-topic-list.hbs
index 2ecf6ce..fce0a53 100644
--- a/assets/javascripts/discourse/templates/components/assigned-topic-list.hbs
+++ b/assets/javascripts/discourse/templates/components/assigned-topic-list.hbs
@@ -1,5 +1,5 @@
 {{#unless skipHeader}}
-  <thead class="topic-list-header">
+  <thead class="topic-list-header assigned-topic-list-header">
     {{raw "topic-list-header"
       canBulkSelect=canBulkSelect
       canDoBulkActions=canDoBulkActions
@@ -17,7 +17,7 @@
   </thead>
 {{/unless}}
 
-<tbody class="topic-list-body">
+<tbody class="topic-list-body assigned-topic-list-body">
   {{#each filteredTopics as |topic|}}
     {{assigned-topic-list-item
       topic=topic
diff --git a/assets/javascripts/discourse/templates/mobile/components/basic-assigned-topic-list.hbs b/assets/javascripts/discourse/templates/mobile/components/basic-assigned-topic-list.hbs
index 17e6cbf..99a51af 100644
--- a/assets/javascripts/discourse/templates/mobile/components/basic-assigned-topic-list.hbs
+++ b/assets/javascripts/discourse/templates/mobile/components/basic-assigned-topic-list.hbs
@@ -8,8 +8,8 @@
   {{/if}}
 
   {{#if topics}}
-    <table class="topic-list">
-      <tbody class="topic-list-body">
+    <table class="topic-list assigned-topic-list">
+      <tbody class="topic-list-body assigned-topic-list-body">
         {{#each topics as |t|}}
           {{assigned-topic-list-item
             topic=t
diff --git a/assets/stylesheets/assigns.scss b/assets/stylesheets/assigns.scss
index a25bfd8..b9d8b86 100644
--- a/assets/stylesheets/assigns.scss
+++ b/assets/stylesheets/assigns.scss
@@ -188,7 +188,7 @@
   color: var(--primary-medium);
 }
 
-.topic-list-header .topic-list-data.num:last-of-type {
+.assigned-topic-list-header .topic-list-data.num:last-of-type {
   margin-right: 50px; // account for button in topic-list-items in topic-list-refactor
 }
 
diff --git a/assets/stylesheets/mobile/assigns.scss b/assets/stylesheets/mobile/assigns.scss
index 25f7742..168598e 100644
--- a/assets/stylesheets/mobile/assigns.scss
+++ b/assets/stylesheets/mobile/assigns.scss
@@ -19,6 +19,8 @@
     grid-template-areas:
       "left-top right-top"
       "left-bottom right-bottom";
+    grid-column-start: 1;
+    grid-column-end: 3;
     .discourse-tags {
       grid-area: left-top;
       max-width: unset;
@@ -34,6 +36,11 @@
   }
 }
 
+.assigned-topic-list-item .topic-list-data {
+  display: grid;
+  grid-template-columns: 1fr 37px; // 37px is size of button
+}
+
 .select-kit-row[data-value="unassign-mobile-header"] {
   background: rgba(var(--primary-low-rgb), 0.5);
   pointer-events: none;