From 0854fb70045e00d235b385d745e90fd72fc1469a Mon Sep 17 00:00:00 2001
From: Akinwale Ariwodola <akinwale@gmail.com>
Date: Mon, 17 Jul 2017 15:50:07 +0100
Subject: [PATCH] Discover page UI tweaks

---
 ui/js/component/fileCard/view.jsx |  4 ++--
 ui/scss/component/_card.scss      | 11 ++++++++---
 2 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/ui/js/component/fileCard/view.jsx b/ui/js/component/fileCard/view.jsx
index 5a35d740d..12f0218e2 100644
--- a/ui/js/component/fileCard/view.jsx
+++ b/ui/js/component/fileCard/view.jsx
@@ -78,8 +78,9 @@ class FileCard extends React.PureComponent {
             onClick={() => navigate("/show", { uri })}
             className="card__link"
           >
+            <CardMedia title={title} thumbnail={thumbnail} />
             <div className="card__title-identity">
-              <h5 title={title}>
+              <h5 className="card__title" title={title}>
                 <TruncatedText lines={1}>{title}</TruncatedText>
               </h5>
               <div className="card__subtitle">
@@ -92,7 +93,6 @@ class FileCard extends React.PureComponent {
                 <UriIndicator uri={uri} />
               </div>
             </div>
-            <CardMedia title={title} thumbnail={thumbnail} />
             <div className="card__content card__subtext card__subtext--two-lines">
               <TruncatedMarkdown lines={2}>{description}</TruncatedMarkdown>
             </div>
diff --git a/ui/scss/component/_card.scss b/ui/scss/component/_card.scss
index da73b21bd..72032fbb4 100644
--- a/ui/scss/component/_card.scss
+++ b/ui/scss/component/_card.scss
@@ -28,6 +28,9 @@ $padding-card-horizontal: $spacing-vertical * 2/3;
   margin-top: $spacing-vertical * 1/3;
   margin-bottom: $spacing-vertical * 1/3;
 }
+.card__title-identity .card__title {
+  font-size: 0.95em
+}
 .card__actions {
   padding: 0 $padding-card-horizontal;
 }
@@ -51,8 +54,8 @@ $padding-card-horizontal: $spacing-vertical * 2/3;
   color: #444;
   margin-top: 12px;
   font-size: 0.9em;
-  margin-top: $spacing-vertical * 2/3;
-  margin-bottom: $spacing-vertical * 2/3;
+  margin-top: $spacing-vertical * 1/3;
+  margin-bottom: $spacing-vertical * 1/3;
   padding: 0 $padding-card-horizontal;
 }
 .card__subtext--allow-newlines {
@@ -60,6 +63,8 @@ $padding-card-horizontal: $spacing-vertical * 2/3;
 }
 .card__subtext--two-lines {
   height: $font-size * 0.9 * $font-line-height * 2;
+  font-size: 0.82em;
+  color: #515151
 }
 .card-overlay {
   position: absolute;
@@ -144,7 +149,7 @@ $card-link-scaling: 1.1;
   top: 36%
 }
 
-$width-card-small: $spacing-vertical * 12;
+$width-card-small: $spacing-vertical * 10;
 $height-card-small: $spacing-vertical * 15;
 
 .card--small {