From b63d476ee9af68bf67d13fc84c5d0b8664039ceb Mon Sep 17 00:00:00 2001
From: Arpit Jalan <arpit@techapj.com>
Date: Thu, 29 Aug 2019 22:22:38 +0530
Subject: [PATCH] UX: convert embedded topic list HTML structure from table to
 div

---
 app/assets/stylesheets/embed.scss | 24 +++++++++++++++---------
 app/views/embed/topics.html.erb   | 10 +++++-----
 2 files changed, 20 insertions(+), 14 deletions(-)

diff --git a/app/assets/stylesheets/embed.scss b/app/assets/stylesheets/embed.scss
index 6caaa12a9d7..de79cd20b5a 100644
--- a/app/assets/stylesheets/embed.scss
+++ b/app/assets/stylesheets/embed.scss
@@ -178,16 +178,22 @@ div.lightbox-wrapper {
 
 .topics-list {
   width: 100%;
-  .topic-list-item {
-    td {
-      padding: 0.5rem;
-    }
 
-    .main-link a {
-      color: $primary;
-    }
-    .main-link a:visited {
-      color: $primary-medium;
+  .topic-list-item {
+    clear: both;
+
+    .main-link {
+      border-bottom: 1px solid #e9e9e9;
+      padding: 0.5rem;
+      width: 100%;
+
+      a {
+        color: $primary;
+      }
+
+      a:visited {
+        color: $primary-medium;
+      }
     }
   }
 }
diff --git a/app/views/embed/topics.html.erb b/app/views/embed/topics.html.erb
index 6f478eeb9e7..629577dc9f0 100644
--- a/app/views/embed/topics.html.erb
+++ b/app/views/embed/topics.html.erb
@@ -1,11 +1,11 @@
 <%- if @list && @list.topics.present? %>
-  <table class='topics-list' data-embed-state='loaded' <%- if @embed_id %>data-embed-id="<%= @embed_id %>"<%- end %>>
+  <div class='topics-list' data-embed-state='loaded' <%- if @embed_id %>data-embed-id="<%= @embed_id %>"<%- end %>>
     <%- @list.topics.each do |t| %>
-      <tr class='topic-list-item'>
-        <td class='main-link'>
+      <div class='topic-list-item'>
+        <div class='main-link'>
           <a target="_parent" href="<%= t.url %>" class="title raw-link raw-topic-link" data-topic-id="<%= t.id %>"><%= t.title %></a>
-        </td>
+        </div>
       </div>
     <%- end %>
-  </table>
+  </div>
 <%- end %>