From 591ebb22bf98e147b3eede245fc67e00dc976a17 Mon Sep 17 00:00:00 2001
From: Vaibhav <vrongmeal@gmail.com>
Date: Fri, 16 Aug 2019 07:08:38 +0530
Subject: [PATCH] css: Use SCSS nesting for .draft- row, info-box and controls.

---
 static/styles/drafts.scss | 112 ++++++++++++++++++++------------------
 1 file changed, 58 insertions(+), 54 deletions(-)

diff --git a/static/styles/drafts.scss b/static/styles/drafts.scss
index 087aa6c98a..9a9025bed7 100644
--- a/static/styles/drafts.scss
+++ b/static/styles/drafts.scss
@@ -69,67 +69,71 @@
 
 .draft-row {
     padding: 5px 25px;
+
+    > div {
+        display: inline-block;
+        vertical-align: top;
+    }
+
+    .draft-info-box {
+        width: 100%;
+        border: 1px solid hsl(0, 0%, 88%);
+        margin-bottom: 10px;
+
+        .draft_controls {
+            display: inline-block;
+            position: absolute;
+            top: 9px;
+            right: -80px;
+            font-size: 0.9em;
+        }
+    }
 }
 
-.draft-row > div {
-    display: inline-block;
-    vertical-align: top;
+.draft-info-box {
+    &.active {
+        outline: 2px solid hsl(215, 47%, 50%);
+    }
+
+    .message_row {
+        border: 0;
+    }
+
+    .messagebox {
+        cursor: auto;
+        box-shadow: none;
+    }
+
+    .message_content {
+        line-height: 1;
+        padding-top: 10px;
+        padding-bottom: 10px;
+        margin-left: 0px;
+    }
 }
 
-.draft-row .draft-info-box {
-    width: 100%;
-    border: 1px solid hsl(0, 0%, 88%);
-    margin-bottom: 10px;
-}
+.draft_controls {
+    .restore-draft {
+        cursor: pointer;
+        margin-right: 5px;
+        color: hsl(170, 48%, 54%);
+        opacity: 0.7;
 
-.draft-row .draft-info-box .draft_controls {
-    display: inline-block;
-    position: absolute;
-    top: 9px;
-    right: -80px;
-    font-size: 0.9em;
-}
+        &:hover {
+            opacity: 1;
+        }
+    }
 
-.draft-info-box.active {
-    outline: 2px solid hsl(215, 47%, 50%);
-}
+    .delete-draft {
+        cursor: pointer;
+        margin-left: 5px;
+        color: hsl(357, 52%, 57%);
+        opacity: 0.7;
 
-.draft-info-box .message_row {
-    border: 0;
-}
-
-.draft-info-box .messagebox {
-    cursor: auto;
-    box-shadow: none;
-}
-
-.draft-info-box .message_content {
-    line-height: 1;
-    padding-top: 10px;
-    padding-bottom: 10px;
-    margin-left: 0px;
-}
-
-.draft_controls .restore-draft {
-    cursor: pointer;
-    margin-right: 5px;
-    color: hsl(170, 48%, 54%);
-    opacity: 0.7;
-}
-
-.draft_controls .restore-draft:hover {
-    opacity: 1;
-}
-
-.draft_controls .delete-draft {
-    cursor: pointer;
-    margin-left: 5px;
-    color: hsl(357, 52%, 57%);
-    opacity: 0.7;
-}
-
-.draft_controls .delete-draft:hover {
-    opacity: 1;
+        &:hover {
+            opacity: 1;
+        }
+    }
 }
 
 @media (max-width: 1130px) {