Updated all component styles

new mixins, consolidated
all original styles files uncomitted

app/javascript/gabsocial/components/columns_area/columns_area.scss

@@ -24,25 +24,22 @@
 }
 
 .columns-area {
-  display: flex;
   flex: 1 1 auto;
-  flex-direction: row;
-  justify-content: flex-start;
   position: relative;
 
-  &__panels {
-    display: flex;
-    justify-content: center;
+  @include flex(center, stretch, row);
 
+  &__panels {
     @include size(100%);
+    @include flex(center);
 
     &__pane {
       height: 100%;
       pointer-events: none;
-      display: flex;
-      justify-content: flex-end;
       padding-top: 15px;
 
+      @include flex(flex-end);
+
       &--start {
         justify-content: flex-start;
       }
@@ -78,14 +75,12 @@
 @media screen and (min-width: 631px) {
   .columns-area {
     padding: 0;
-  }
 
-  .columns-area>div {
-
-    .column,
-    .drawer {
-      padding-left: 5px;
-      padding-right: 5px;
+    >div {
+      .column,
+      .drawer {
+        @include horizontal-padding(5px);
+      }
     }
   }
 }
@@ -104,9 +99,9 @@
   }
 
   .search__input {
-    line-height: 18px;
-    font-size: 16px;
     padding: 15px 30px 15px 15px;
+
+    @include text-sizing(16px, 400, 18px);
   }
 
   .search__icon .fa {
@@ -163,8 +158,7 @@
       }
 
       .account__avatar-wrapper {
-        margin-left: 17px;
-        margin-right: 15px;
+        @include horizontal-margin(17px, 15px);
       }
     }
   }