From aaf119aee65372b5b633606830b084a2a9700219 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=83=9D=E3=83=BC=E3=83=AB=20=E3=82=A6=E3=82=A7=E3=83=83?=
 =?UTF-8?q?=E3=83=96?= <netopwibby@thenetwork.email>
Date: Mon, 12 Nov 2018 01:27:43 -0600
Subject: [PATCH] Why is search so weird

---
 .../common/form-components/form-field.jsx     |  2 +-
 src/renderer/modal/modalCreditIntro/view.jsx  |  3 +++
 src/renderer/scss/component/_file-list.scss   |  3 +++
 src/renderer/scss/component/_form-field.scss  |  6 +++++-
 src/renderer/scss/component/_media.scss       | 21 +++++++++++++++++++
 src/renderer/scss/component/_search.scss      | 19 ++++++++++-------
 6 files changed, 45 insertions(+), 9 deletions(-)

diff --git a/src/renderer/component/common/form-components/form-field.jsx b/src/renderer/component/common/form-components/form-field.jsx
index a8ba3cb2b6f..90337c5a73a 100644
--- a/src/renderer/component/common/form-components/form-field.jsx
+++ b/src/renderer/component/common/form-components/form-field.jsx
@@ -121,7 +121,7 @@ export class FormField extends React.PureComponent<Props> {
           </label>
         )}
         <div
-          className={classnames('form-field__input', {
+          className={classnames('form-field__input form-field__input--level', {
             'form-field--auto-height': type === 'markdown',
           })}
         >
diff --git a/src/renderer/modal/modalCreditIntro/view.jsx b/src/renderer/modal/modalCreditIntro/view.jsx
index 16d93de80c7..2550041a153 100644
--- a/src/renderer/modal/modalCreditIntro/view.jsx
+++ b/src/renderer/modal/modalCreditIntro/view.jsx
@@ -37,6 +37,9 @@ const ModalCreditIntro = (props: Props) => {
             {__('in free rewards for participating in the LBRY beta.')}
           </p>
         )}
+      </section>
+
+      <section className="card__content">
         <div className="card__actions card__actions--center">
           <Button button="primary" onClick={addBalance} label={__('Get Credits')} />
           <Button
diff --git a/src/renderer/scss/component/_file-list.scss b/src/renderer/scss/component/_file-list.scss
index e1eb44e0bd8..1d2ca65bfb2 100644
--- a/src/renderer/scss/component/_file-list.scss
+++ b/src/renderer/scss/component/_file-list.scss
@@ -7,12 +7,15 @@
 }
 
 .tile__info {
+  @extend .media__info;
 }
 
 .tile__subtitle {
+  @extend .media__subtitle;
 }
 
 .tile__title {
+  @extend .media__title;
 }
 
 /*
diff --git a/src/renderer/scss/component/_form-field.scss b/src/renderer/scss/component/_form-field.scss
index 826da27b4eb..0ad7563ad3d 100644
--- a/src/renderer/scss/component/_form-field.scss
+++ b/src/renderer/scss/component/_form-field.scss
@@ -74,6 +74,10 @@
     padding: 0;
   }
 
+  &--level {
+    line-height: 2;
+  }
+
   input {
     &[type='checkbox'] {
       margin-top: 4px;
@@ -121,7 +125,7 @@
 .form-field__prefix,
 .form-field__postfix {
   font-weight: 500;
-  line-height: 2;
+  // line-height: 2;
 
   &.form-field--align-center {
     align-self: center;
diff --git a/src/renderer/scss/component/_media.scss b/src/renderer/scss/component/_media.scss
index 01442d9b5b4..5667bc83312 100644
--- a/src/renderer/scss/component/_media.scss
+++ b/src/renderer/scss/component/_media.scss
@@ -1,4 +1,25 @@
 .media {
+  &--large {
+    .media__thumb {
+      width: 40rem;
+      height: 20rem;
+      margin-bottom: 1rem;
+    }
+
+    .media__title {
+      @media (min-width: 601px) {
+        font-size: 1.15rem;
+        // height: 4rem;
+        line-height: 1.33;
+      }
+
+      @media (max-width: 600px) {
+        // height: 3rem;
+        margin-bottom: 0.5rem;
+      }
+    }
+  }
+
   &--placeholder {
     > * {
       animation-duration: 2.5s;
diff --git a/src/renderer/scss/component/_search.scss b/src/renderer/scss/component/_search.scss
index cd5125f5537..c81062d7a63 100644
--- a/src/renderer/scss/component/_search.scss
+++ b/src/renderer/scss/component/_search.scss
@@ -3,13 +3,6 @@
 
 .search-results-wrapper {
   padding: 2rem;
-  // flex-flow: wrap column;
-  // margin-top: -$spacing-width;
-  // padding-bottom: $spacing-vertical;
-
-  .media__thumb--no-img {
-    width: 20rem; height: 10rem;
-  }
 }
 
 .search-results__content__row {
@@ -80,6 +73,18 @@
 }
 
 .search__results__row {
+  @extend .card__list;
+  position: relative;
+
+  &:not(:last-of-type) {
+    margin-bottom: 2rem;
+  }
+
+  .file-list__header {
+    @extend .media-group__header__title;
+    top: -1.5rem; left: 0;
+    position: absolute;
+  }
 }
 
 .search__top {