Fix recent questions on shadow page

publiclab · Sep 27, 2019 · cd3a7ed · cd3a7ed
1 parent 7e2ebf0
commit cd3a7ed
Show file tree

Hide file tree

Showing 2 changed files with 48 additions and 42 deletions.
diff --git a/app/views/questions/_recent_questions_shadow.html.erb b/app/views/questions/_recent_questions_shadow.html.erb
@@ -1,49 +1,53 @@
-<div class = "recent-card">
-  <% @questions.limit(3).each_with_index do |node,i| %>
-  <div class="row">
-      <div class="image">
-        <img src="<%= node.author.profile_image %>" width="25" height="25"/>
-      </div>
-      <div class= "recent-questions">
-        <h5><a class = "questions"<% if @widget %>target="_blank"<% end %> href="<%= node.path(:question) %>"><%= node.title %></a></h5>
-      </div>
-      <div class="by-author">
-        by <a href="/profile/<%= node.author.name %>">@<%= node.author.name %></a>
-      </div>
+<div class="row justify-content-center">
+  <div class = "card col-md-9" style="padding:1em;">
+    <% @questions.limit(3).each_with_index do |node,i| %>
+      <span class="parent">
+        <span class="image mr-md-3 child">
+          <img class="img" src="<%= node.author.profile_image %>" width="25" height="25"/>
+        </span>
+        <span class= "recent-questions child">
+          <h5><a class = "questions"<% if @widget %>target="_blank"<% end %> href="<%= node.path(:question) %>"><%= node.title %></a></h5>
+        </span>
+        <span class="ml-md-3 by-author child">
+          by <a href="/profile/<%= node.author.name %>">@<%= node.author.name %></a>
+        </span>
+      </span>
+    <% end %>
   </div>
-  <% end %>
 </div>
 <style>
-  .recent-card{
-      background-color: #fff;
-      border: 1px solid;
-      border-color: #D3D3D3;
-      border-radius: 6px;
-      width : 70%;
-      margin-left: 10em;
-      align-items: center;
-      padding: 20px;
-    }
 
-    .questions{
-      font-size: 15px;
-      color: black;
-      margin-left: 6px;
-    }
+.card {
+  background-color: #fff;
+  border: 1px solid;
+  border-color: #D3D3D3;
+  border-radius: 6px;
+}
 
-    .image{
-      border-radius: 50%;
-      margin-left: 10px;
-    }
+.parent {
+  overflow-x: auto;
+  padding: 0.4em;
+}
 
-    .by-author{
-      color: #A9A9A9;
-      font-size: 13px;
-      margin-left: 6px;
-      margin-top: 4px;
-    }
+.child {
+  display: inline-block; 
+}
+
+.questions{
+  font-size: 15px;
+  color: black;
+}
+.img{
+  border-color:#555;
+  border-radius: 50%;
+  margin-left: 10px;
+}
+.by-author{
+  color: #A9A9A9;
+  font-size: 13px;
+}
+.by-author a{
+  color: #A9A9A9;
+}
 
-    .by-author a{
-      color: #A9A9A9;
-    }
 </style>
diff --git a/app/views/questions/index_shadow.html.erb b/app/views/questions/index_shadow.html.erb
@@ -48,7 +48,9 @@
     <span class="d-none d-lg-inline"><h2>Recent questions </h2></span>
 </div>
 
-<%= render partial: "questions/recent_questions_shadow" %>
+<div class="col-md-12">
+  <%= render partial: "questions/recent_questions_shadow" %>
+</div>
 
  <style>
   .question-area{