From 0d0b9acc1d351168fd99f7736d825f3a254da9a8 Mon Sep 17 00:00:00 2001
From: M Fikri A <fikzzzy@gmail.com>
Date: Mon, 21 Sep 2020 09:07:12 +0700
Subject: [PATCH] Fix indentation and font size

---
 .../Specification/styles.scss                 | 447 +++++++++---------
 1 file changed, 223 insertions(+), 224 deletions(-)

diff --git a/src/shared/components/challenge-detail/Specification/styles.scss b/src/shared/components/challenge-detail/Specification/styles.scss
index 90068d42d4..2605a43efe 100644
--- a/src/shared/components/challenge-detail/Specification/styles.scss
+++ b/src/shared/components/challenge-detail/Specification/styles.scss
@@ -68,230 +68,6 @@ $tc-link-visited: #0c4e98;
   max-width: 10px !important;
 }
 
-.challenge-details-view {
-  white-space: normal;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  overflow: hidden;
-  position: relative;
-  align-items: baseline;
-  word-break: break-word;
-
-  @include linkStyle;
-
-  @include xs-to-sm {
-    flex-direction: column;
-  }
-
-  .challenge-specifications {
-    @include roboto-regular;
-
-    flex: 4;
-    text-align: left;
-    display: flex;
-    flex-direction: column;
-    margin: 5px 0 50px;
-
-    .challenge-specs-develop {
-      blockquote {
-        border-left: 3px solid $tc-green;
-        padding-left: 17px;
-      }
-    }
-
-    .challenge-specs-datasci {
-      blockquote {
-        border-left: 3px solid $tc-orange;
-        padding-left: 17px;
-      }
-    }
-
-    .challenge-specs-design {
-      blockquote {
-        border-left: 3px solid $tc-light-blue;
-        padding-left: 17px;
-      }
-    }
-  }
-
-  h1 {
-    @include roboto-bold;
-
-    font-size: 28px;
-    color: #151516;
-    letter-spacing: -0.78px;
-    line-height: 40px;
-    margin: (10 * $base-unit) 0 (2 * $base-unit);
-  }
-
-  h2 {
-    @include roboto-bold;
-
-    font-size: 20px;
-    color: $tc-black;
-    line-height: 30px;
-    margin: (6 * $base-unit) 0 (2 * $base-unit);
-  }
-
-  h3 {
-    @include roboto-bold;
-
-    font-size: 15px;
-    color: $tc-black;
-    line-height: 25px;
-    margin: (5 * $base-unit) 0 0;
-    text-transform: uppercase;
-  }
-
-  h4 {
-    @include roboto-bold;
-
-    margin: (4 * $base-unit) 0 (2 * $base-unit);
-    font-size: 15px;
-    line-height: 25px;
-    color: $tc-gray-90;
-  }
-
-  h5,
-  h6 {
-    margin: (4 * $base-unit) 0 (2 * $base-unit);
-  }
-
-  p,
-  em,
-  strong {
-    @include roboto-regular;
-
-    font-size: 15px;
-    color: $tc-gray-90;
-    line-height: 25px;
-  }
-
-  p {
-    @include roboto-regular;
-
-    font-size: 15px;
-    color: $tc-gray-90;
-    line-height: 25px;
-
-    @include linkStyle;
-
-    margin: (2 * $base-unit) 0 (3 * $base-unit);
-  }
-
-  ul {
-    @include roboto-regular;
-
-    margin: 0 0 5px 20px;
-    font-size: 15px;
-    color: $tc-gray-90;
-    line-height: 25px;
-    list-style: disc outside none;
-
-    li {
-      font-weight: 400;
-
-      @include linkStyle;
-    }
-  }
-
-  em {
-    @include roboto-regular;
-
-    font-style: italic;
-    font-weight: 400;
-    font-size: 15px;
-    color: $tc-gray-90;
-    line-height: 25px;
-  }
-
-  ol {
-    @include roboto-regular;
-
-    color: $tc-gray-80;
-    font-size: 15px;
-    line-height: 25px;
-    padding-left: 20px;
-    list-style-type: decimal;
-    margin: 0 0 5px;
-    counter-reset: item;
-    display: table;
-
-    li {
-      list-style-type: none;
-      font-weight: 400;
-      counter-increment: item;
-      display: table-row;
-      white-space: normal;
-
-      &::before {
-        display: table-cell;
-        font-weight: 700;
-        text-align: right;
-        content: counter(item) ".";
-        padding: 0 10px 0 0;
-      }
-    }
-  }
-
-  td,
-  th {
-    @include roboto-regular;
-
-    color: $tc-gray-80;
-    font-size: 15px;
-    line-height: 25px;
-  }
-
-  img {
-    max-width: 100%;
-  }
-
-  code {
-    white-space: pre;
-    margin: 10px 0 15px;
-    background: $tc-gray-neutral-light;
-    border: 1px solid silver;
-    border-radius: 6px;
-    font-family: Roboto Mono, monospace;
-    font-weight: 400;
-    font-size: 13px;
-    color: $tc-black;
-    line-height: 20px;
-    padding: 15px;
-    display: block;
-  }
-
-  sub {
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
-    bottom: -0.25em;
-  }
-
-  sup {
-    font-size: 75%;
-    line-height: 0;
-    position: relative;
-    vertical-align: baseline;
-    top: -0.5em;
-  }
-
-  strong {
-    @include roboto-bold;
-
-    font-size: 15px;
-    color: $tc-gray-90;
-    line-height: 25px;
-  }
-
-  pre {
-    overflow-x: scroll;
-  }
-}
-
 .rawHtml {
   @include tc-typography;
 
@@ -419,6 +195,229 @@ $tc-link-visited: #0c4e98;
   @include linkStyle;
 }
 
+.challenge-details-view {
+  white-space: normal;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  overflow: hidden;
+  position: relative;
+  align-items: baseline;
+  word-break: break-word;
+
+  @include linkStyle;
+
+  @include xs-to-sm {
+    flex-direction: column;
+  }
+
+  .challenge-specifications {
+    @include roboto-regular;
+
+    flex: 4;
+    text-align: left;
+    display: flex;
+    flex-direction: column;
+    margin: 5px 0 50px;
+
+    .challenge-specs-develop {
+      blockquote {
+        border-left: 3px solid $tc-green;
+        padding-left: 17px;
+      }
+    }
+
+    .challenge-specs-datasci {
+      blockquote {
+        border-left: 3px solid $tc-orange;
+        padding-left: 17px;
+      }
+    }
+
+    .challenge-specs-design {
+      blockquote {
+        border-left: 3px solid $tc-light-blue;
+        padding-left: 17px;
+      }
+    }
+
+    h1 {
+      @include roboto-bold;
+
+      font-size: 28px;
+      color: #151516;
+      letter-spacing: -0.78px;
+      line-height: 40px;
+      margin: (10 * $base-unit) 0 (2 * $base-unit);
+    }
+
+    h2 {
+      @include roboto-bold;
+
+      font-size: 20px;
+      color: $tc-black;
+      line-height: 30px;
+      margin: (6 * $base-unit) 0 (2 * $base-unit);
+    }
+
+    h3 {
+      @include roboto-bold;
+
+      font-size: 15px;
+      color: $tc-black;
+      line-height: 25px;
+      margin: (5 * $base-unit) 0 0;
+      text-transform: uppercase;
+    }
+
+    h4 {
+      @include roboto-bold;
+
+      margin: (4 * $base-unit) 0 (2 * $base-unit);
+      font-size: 15px;
+      line-height: 25px;
+      color: $tc-gray-90;
+    }
+
+    h5,
+    h6 {
+      margin: (4 * $base-unit) 0 (2 * $base-unit);
+    }
+
+    p,
+    em,
+    strong {
+      @include roboto-regular;
+
+      font-size: 15px;
+      color: $tc-gray-90;
+      line-height: 25px;
+    }
+
+    p {
+      @include roboto-regular;
+
+      font-size: 15px;
+      color: $tc-gray-90;
+      line-height: 25px;
+
+      @include linkStyle;
+
+      margin: (2 * $base-unit) 0 (3 * $base-unit);
+    }
+
+    ul {
+      @include roboto-regular;
+
+      margin: 0 0 5px 20px;
+      font-size: 15px;
+      color: $tc-gray-90;
+      line-height: 25px;
+      list-style: disc outside none;
+
+      li {
+        font-weight: 400;
+
+        @include linkStyle;
+      }
+    }
+
+    em {
+      @include roboto-regular;
+
+      font-style: italic;
+      font-weight: 400;
+      font-size: 15px;
+      color: $tc-gray-90;
+      line-height: 25px;
+    }
+
+    ol {
+      @include roboto-regular;
+
+      color: $tc-gray-80;
+      font-size: 15px;
+      line-height: 25px;
+      list-style-type: decimal;
+      margin: 0 0 5px;
+      counter-reset: item;
+      display: table;
+
+      li {
+        list-style-type: none;
+        font-weight: 400;
+        counter-increment: item;
+        display: table-row;
+        white-space: normal;
+
+        &::before {
+          display: table-cell;
+          font-weight: 700;
+          text-align: right;
+          content: counter(item) ".";
+          padding: 0 10px 0 0;
+        }
+      }
+    }
+
+    td,
+    th {
+      @include roboto-regular;
+
+      color: $tc-gray-80;
+      font-size: 15px;
+      line-height: 25px;
+    }
+
+    img {
+      max-width: 100%;
+    }
+
+    code {
+      white-space: pre;
+      margin: 10px 0 15px;
+      background: $tc-gray-neutral-light;
+      border: 1px solid silver;
+      border-radius: 6px;
+      font-family: Roboto Mono, monospace;
+      font-weight: 400;
+      font-size: 13px;
+      color: $tc-black;
+      line-height: 20px;
+      padding: 15px;
+      display: block;
+    }
+
+    sub {
+      font-size: 75%;
+      line-height: 0;
+      position: relative;
+      vertical-align: baseline;
+      bottom: -0.25em;
+    }
+
+    sup {
+      font-size: 75%;
+      line-height: 0;
+      position: relative;
+      vertical-align: baseline;
+      top: -0.5em;
+    }
+
+    strong {
+      @include roboto-bold;
+
+      font-size: 15px;
+      color: $tc-gray-90;
+      line-height: 25px;
+    }
+
+    pre {
+      overflow-x: scroll;
+    }
+  }
+}
+
 .challenge-specs-main {
   @include roboto-regular;