Specification style cleanup

Author: Victor George

src/components/FileList/AddFiles.scss

@@ -2,7 +2,8 @@
 
 .add-file {
   position: relative;
-  
+  margin-top: 10px;
+
   .tc-btn {
     position: absolute;
     bottom: $base-unit*4;

src/components/FileList/FileList.scss

@@ -5,6 +5,10 @@
   border: none;
   box-shadow: none;
 
+  &.panel {
+    padding: 0;
+  }
+
   > h4 {
     @include roboto-medium;
     font-size: 15px;

src/projects/detail/components/SpecQuestionList/SpecQuestionList.scss

@@ -4,9 +4,8 @@
 }
 
 .spec-question-list-item {
-  display: flex;
-  padding: 35px 0 15px;
-  width: 100%;
+  padding: 0;
+  margin-bottom: 30px;
 
   .icon-col {
     padding-top: 3px;
@@ -18,11 +17,11 @@
     width: 100%;
 
     > h5 {
-      @include roboto-medium;
+      @include roboto;
       font-size: 15px;
       line-height: 25px;
-      color: $tc-gray-80;
-      margin-bottom: 15px;
+      color: $tc-gray-70;
+      margin-bottom: 0;
 
       span {
         color: $tc-orange;
@@ -43,32 +42,35 @@
         font-size: 15px;
       }
     }
+
     .description {
       margin-bottom: $base-unit * 4;
     }
+
     .child-component {
-      margin-top: 10px;
-      
       .colorSelector {
         margin-bottom: $base-unit * 4;
       }
-      .checkbox-group-item.checkbox-item-checked{
+
+      .checkbox-group-item.checkbox-item-checked {
         background: $tc-dark-blue-10;
         border-radius: 4px;
       }
-      
+
       .dropdown-wrap.default {
         background: $tc-gray-neutral-light;
         border-color: $tc-gray-20;
         position: relative;
         width: 150px;
         left: 170px;
         margin-top: -45px;
+
         &:after {
           border-bottom-color: $tc-gray-70;
           border-right-color: $tc-gray-70;
         }
       }
+
       textarea {
         min-height: 45px;
         max-width: 100%;
@@ -77,13 +79,20 @@
         margin-bottom: 0;
         line-height: 25px;
       }
+
+      .radio-group-input,
       .checkbox-group-item {
         width: 100%;
-        padding: 12px 10px;
+        padding: 15px 0;
         margin-bottom: 20px;
         margin-right: 0;
+      }
+
+      .checkbox-group-item {
         border-radius: 4px;
         background: $tc-gray-neutral-light;
+        padding-left: 10px;
+
         label {
           font-weight: 400;
           color: $tc-black;
@@ -95,7 +104,7 @@
         width: auto;
         background: none;
         padding: 0;
-        margin-right: 30px;
+        margin: 15px 30px 15px 0;
       }
     }
   }

src/projects/detail/containers/Specification.scss

@@ -150,7 +150,7 @@ $sideBarWidth: 280px;
   }
 
   .sub-title {
-    margin: 50px 0 20px;
+    margin: 30px 0 10px;
 
     .title {
       font-size: 15px;
@@ -340,6 +340,8 @@ $sideBarWidth: 280px;
 
   /* .section-features-module */
   .section-features-module {
+    margin-top: 20px;
+
     &.open {
       .content-boxes {
         display: block;
@@ -351,6 +353,10 @@ $sideBarWidth: 280px;
       }
     }
 
+    .row {
+      margin-bottom: 5px;
+    }
+
     .bg-contents {
       @include roboto-medium;
       font-size: 15px;
@@ -380,8 +386,7 @@ $sideBarWidth: 280px;
       max-width: 100%;
       text-align: left;
       text-indent: 0;
-      margin-bottom: 20px;
-      resize: vertical;
+      resize: none;
       overflow: auto;
     }
   }
@@ -833,29 +838,38 @@ $sideBarWidth: 280px;
 .project-name-section {
   display: flex;
   align-items: flex-start;
+  margin-bottom: 20px;
 
   .dashed-bottom-border,
   .editable-project-name {
     flex: 1;
+    height: 40px;
+    border-bottom: 1px dashed $tc-gray-20;
 
     .project-name {
       word-break: break-all;
+      font-size: 20px;
+      margin-top: 10px;
     }
   }
 
   .read-only-refcode {
-    height: 100%;
+    height: 40px;
     align-self: flex-end;
-    border-bottom: 1px solid $tc-gray-40;
-    padding: 0px 2 * $base-unit;
+    border-bottom: 1px solid $tc-gray-20;
+    padding: 10px;
     position: relative;
+    margin-left: 20px;
 
     .refcode-desc {
       @include roboto;
       font-size: 13px;
-      color: #5d5d66;
+      color: $tc-gray-30;
       position: absolute;
       bottom: -20px;
+      left: 0;
+      width: 100%;
+      text-align: center;
       font-style: italic;
       white-space: nowrap;
     }
@@ -878,8 +892,6 @@ $sideBarWidth: 280px;
     }
 
     .project-refcode {
-      width: 100%;
-      height: 100%;
     }
   }
 }