Updated all component styles

new mixins, consolidated
all original styles files uncomitted

app/javascript/gabsocial/components/search/search.scss

@@ -0,0 +1,69 @@
+.search {
+  position: relative;
+
+  &__input {
+    display: block;
+    padding: 7px 30px 6px 10px;
+    @include search-input();
+  }
+
+  &__icon {
+    &::-moz-focus-inner {
+      border: 0;
+    }
+
+    &::-moz-focus-inner,
+    &:focus {
+      outline: 0 !important;
+    }
+
+    .fa {
+      cursor: default;
+      display: inline-block;
+      position: absolute;
+      top: 8px;
+      right: 6px;
+      z-index: 2;
+      font-size: 16px;
+      color: $gab-placeholder-accent;
+      opacity: 0;
+      pointer-events: none;
+
+      @include size(18px);
+
+      &.active {
+        pointer-events: auto;
+        opacity: 1;
+      }
+    }
+
+    .fa-search.active {
+      pointer-events: none;
+    }
+
+    .fa-times-circle {
+      cursor: pointer;
+      font-size: 17px;
+      color: $gab-alert-red;
+
+      &:hover {
+        color: lighten($gab-alert-red, 7%);
+      }
+    }
+  }
+
+  @media screen and (max-width: 630px) and (max-height: 400px) {
+    will-change: margin-top;
+    transition: margin-top 400ms 100ms;
+  }
+
+  @media screen and (min-width: 360px) {
+    margin-bottom: 10px;
+  }
+}
+
+@media screen and (min-width: 895px) {
+  .search-page .search {
+    display: none;
+  }
+}