Fixes steemit#3195 - Adds border around the components of a comment b…

…lock (header, body, footer) this improves visibility of each comment layer.
quochuy · May 10, 2019 · b7f9f71 · b7f9f71
1 parent addc0ae
commit b7f9f71
Showing 1 changed file with 19 additions and 2 deletions.
diff --git a/src/app/components/cards/Comment.scss b/src/app/components/cards/Comment.scss
@@ -63,10 +63,22 @@
       }
     }
   }
+  .Comment__body {
+    padding: 0;
+    border: none;
+  }
+  .Comment__footer {
+    padding: 0;
+    border: none;
+  }
 }
 
 .Comment__header {
   margin-left: 62px;
+  border-radius: 3px 3px 0 0;
+  border: 1px solid #f0f0f0;
+  background-color: #f0f0f0;
+  padding: 7px 14px;
 }
 
 .Comment__header-user {
@@ -79,8 +91,6 @@
   }
 }
 
-
-
 .Comment__header_collapse {
   float: right;
   > a {
@@ -96,10 +106,17 @@
 .Comment__body {
   margin-left: 62px;
   max-width: 50rem;
+  border: 1px solid #f0f0f0;
+  padding: 14px;
+  border-bottom: none;
 }
 
 .Comment__footer {
   margin-left: 62px;
+  border: 1px solid #f0f0f0;
+  border-radius: 3px 0;
+  padding: 3px 14px;
+
   @include themify($themes) {
     color: themed('textColorPrimary');
   }