DEV: better class names for Flexbox

discourse · Sep 9, 2019 · 972c1ac · 972c1ac
1 parent 9b10a78
commit 972c1ac
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 6 deletions.
diff --git a/app/assets/stylesheets/embed.scss b/app/assets/stylesheets/embed.scss
@@ -196,10 +196,10 @@ div.lightbox-wrapper {
       }
     }
 
-    .topic-details-flex {
+    .topic-column-wrapper {
       display: flex;
 
-      .topic-details-column-1 {
+      .topic-column.details-column {
         flex-direction: column;
         width: 80%;
 
@@ -225,7 +225,7 @@ div.lightbox-wrapper {
         }
       }
 
-      .topic-details-column-2 {
+      .topic-column.featured-image-column {
         .topic-featured-image img {
           max-width: 200px;
           max-height: 100px;

diff --git a/app/views/embed/topics.html.erb b/app/views/embed/topics.html.erb
@@ -4,8 +4,8 @@
       <div class='topic-list-item'>
         <%- if @template == "complete" %>
           <div class='main-link'>
-            <div class="topic-details-flex">
-              <div class='topic-details-column-1'>
+            <div class="topic-column-wrapper">
+              <div class='topic-column details-column'>
                 <div class='topic-title-link'>
                   <a target="_parent" href="<%= t.url %>" class="title raw-link raw-topic-link" data-topic-id="<%= t.id %>"><%= t.title %></a>
                 </div>
@@ -38,7 +38,7 @@
                 </div>
               </div>
 
-              <div class='topic-details-column-2'>
+              <div class='topic-column featured-image-column'>
                 <%- if t.image_url.present? %>
                   <div class='topic-featured-image'>
                     <img src="<%= t.image_url %>">