From 773c56f31febe1146303d8b4cd3ca03775a805b7 Mon Sep 17 00:00:00 2001 From: Andrew Suzuki Date: Thu, 2 Jun 2016 10:04:20 -0400 Subject: [PATCH] move grant op meta to misc ns; source sans pro; meta on builder page; more tweaks --- src/cljs/ulysses/components/misc.cljs | 23 +++++++++++++++++++++++ src/cljs/ulysses/pages/builder.cljs | 14 ++++++++++---- src/cljs/ulysses/pages/home.cljs | 21 ++++----------------- src/sass/_bootstrap-overrides.scss | 10 +++++----- src/sass/_common.scss | 18 +++++++++++++++--- src/sass/_fonts.scss | 2 +- src/sass/_variables.scss | 5 ++++- src/sass/components/_faculties-pool.scss | 2 +- src/sass/components/_grant-op-boxes.scss | 8 -------- src/sass/components/_uconn-banner.scss | 4 ++-- 10 files changed, 65 insertions(+), 42 deletions(-) create mode 100644 src/cljs/ulysses/components/misc.cljs diff --git a/src/cljs/ulysses/components/misc.cljs b/src/cljs/ulysses/components/misc.cljs new file mode 100644 index 0000000..b3704ec --- /dev/null +++ b/src/cljs/ulysses/components/misc.cljs @@ -0,0 +1,23 @@ +(ns ulysses.components.misc + (:require [ulysses.utils :refer [mechanism-to-contextual]] + [ulysses.components.basic :refer [label]] + [ulysses.lib.moment :as m])) + +;; ---------------------------------------------------------------------------- +;; grant op meta +;; ---------------------------------------------------------------------------- + +(defn grant-op-time-left-label [mi] + (when (m/is-valid mi) + [label :default + "ends " + (-> mi (m/from-now false))])) + +(defn grant-op-fm-label [{:keys [name]}] + [label (-> name keyword mechanism-to-contextual) name]) + +(defn grant-op-meta + [{:keys [funding-mechanism due-date]}] + [:div.grant-op-meta + [grant-op-fm-label funding-mechanism] + [grant-op-time-left-label due-date]]) diff --git a/src/cljs/ulysses/pages/builder.cljs b/src/cljs/ulysses/pages/builder.cljs index bc252a9..79e358b 100644 --- a/src/cljs/ulysses/pages/builder.cljs +++ b/src/cljs/ulysses/pages/builder.cljs @@ -1,6 +1,7 @@ (ns ulysses.pages.builder (:require [re-frame.core :as re-frame :refer [subscribe dispatch]] [ulysses.components.basic :refer [hink link loading-or-no-results fa]] + [ulysses.components.misc :refer [grant-op-meta]] [ulysses.components.word-cloud :refer [word-cloud]] [ulysses.utils :refer [map-subels map-lookup str->int]] [reagent.core :as r] @@ -119,7 +120,7 @@ [:div.faculties-pool.table-responsive [:table.table.table-striped.table-bordered.table-sm [:thead - [:tr [:th nil] [:th "Name"] [:th "Title"] [:th "Year Hired"] [:th "Score"]]] + [:tr [:th nil] [:th "Name"] [:th "Title"] [:th "Year Hired"] [:th "Score"] [:th ""]]] [:tbody (map-subels pool-row faculties-and-metrics)]]])) @@ -147,10 +148,15 @@ [:h3 "Word Cloud"]]]]]) (defn builder-header - [{:keys [title purpose]}] + [{:keys [title purpose] :as op}] [:div.builder-header - [:h3.text-xs-center.mb-15 title] - [:p purpose]]) + [:div.container-fluid + [:div.row + [:div.col-md-12 + [:h3.text-xs-center.mb-15 title] + [:div.text-xs-center + [grant-op-meta op]] + [:p purpose]]]]]) ;; ---------------------------------------------------------------------------- ;; main diff --git a/src/cljs/ulysses/pages/home.cljs b/src/cljs/ulysses/pages/home.cljs index 77f0283..11766cc 100644 --- a/src/cljs/ulysses/pages/home.cljs +++ b/src/cljs/ulysses/pages/home.cljs @@ -7,11 +7,10 @@ truncate-with-ellipsis]] [ulysses.components.basic :refer [hink link - label dropdown loading-or-no-results css-transition-group-standard]] - [ulysses.lib.moment :as m] + [ulysses.components.misc :refer [grant-op-meta]] [ulysses.routes :as routes])) ;; ---------------------------------------------------------------------------- @@ -20,15 +19,6 @@ ; grant-op-box ---------- -(defn grant-op-box-time-left [mi] - (when (m/is-valid mi) - [label :default - "ends " - (-> mi (m/from-now false))])) - -(defn grant-op-box-fm-label [{:keys [name]}] - [label (-> name keyword mechanism-to-contextual) name]) - (defn grant-op-box-initial-team-member [tm] [:span (or (:name tm) ", ")]) @@ -81,15 +71,12 @@ ;; primary sub-components ;; ---------------------------------------------------------------------------- -(defn grant-op-box [grant] - (let [{:keys [id title purpose due-date funding-mechanism initial-team]} grant - body (truncate-with-ellipsis purpose 300)] +(defn grant-op-box [{:keys [id title purpose initial-team] :as op}] + (let [body (truncate-with-ellipsis purpose 300)] [:div.grant-op-box [link [:builder :grant-op-id id] {:class :inside} [:div.title title] - [:div.meta - [grant-op-box-fm-label funding-mechanism] - [grant-op-box-time-left due-date]] + [grant-op-meta op] [:div.about [:p body]] [grant-op-box-initial-team initial-team]] [grant-op-box-actions id]])) diff --git a/src/sass/_bootstrap-overrides.scss b/src/sass/_bootstrap-overrides.scss index 75257da..69179df 100644 --- a/src/sass/_bootstrap-overrides.scss +++ b/src/sass/_bootstrap-overrides.scss @@ -7,19 +7,19 @@ // by a factor (for each size) .form-control { - padding-bottom: $input-padding-y * .7; + // padding-bottom: $input-padding-y * .7; } .form-control-sm { - padding-bottom: $input-padding-y-sm * .6; + // padding-bottom: $input-padding-y-sm * .6; } .form-control-lg { - padding-bottom: $input-padding-y-lg * .8; + // padding-bottom: $input-padding-y-lg * .8; } .c-select { - padding-bottom: .375rem * .7 !important; + // padding-bottom: .375rem * .7 !important; } // ---------------------------------------------------------------------------- @@ -27,5 +27,5 @@ // label padding is off .label { - padding-top: .35em; + // padding-top: .35em; } diff --git a/src/sass/_common.scss b/src/sass/_common.scss index 974572d..0df9fe0 100644 --- a/src/sass/_common.scss +++ b/src/sass/_common.scss @@ -18,7 +18,6 @@ h3, h4, h5, h6 { - font-weight: 100; text-transform: lowercase; } @@ -42,7 +41,7 @@ a.fancy-switch { height: 22px; left: 0; position: absolute; - top: 4px; + top: 5px; width: 40px; &::after { @@ -88,7 +87,8 @@ a.fancy-switch { display: inline-block; font-size: 1.3em; font-weight: bold; - padding-top: 2px; + line-height: 0; + padding-top: 6px; text-decoration: none; &:active, @@ -118,3 +118,15 @@ a.fancy-switch { .multi-select { width: 100%; } + +.grant-op-meta { + margin-bottom: 10px; + + .label { + margin-right: 5px; + + &:last-of-type { + margin-right: 0; + } + } +} diff --git a/src/sass/_fonts.scss b/src/sass/_fonts.scss index 6303e29..e819668 100644 --- a/src/sass/_fonts.scss +++ b/src/sass/_fonts.scss @@ -1 +1 @@ -@import url(https://fonts.googleapis.com/css?family=Catamaran:500,400,300,100); +@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:500,400,300|Catamaran:100); diff --git a/src/sass/_variables.scss b/src/sass/_variables.scss index aad657b..f04ffed 100644 --- a/src/sass/_variables.scss +++ b/src/sass/_variables.scss @@ -49,7 +49,10 @@ $link-color: $brand-primary; // Typography ------------------------ -$font-family-sans-serif: "Catamaran", "Helvetica Neue", Helvetica, Arial, sans-serif; +$font-family-sans-serif: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif; + +$headings-font-family: 'Catamaran', sans-serif; +$headings-font-weight: 100; // More Misc diff --git a/src/sass/components/_faculties-pool.scss b/src/sass/components/_faculties-pool.scss index 6ee38c5..bdb23bc 100644 --- a/src/sass/components/_faculties-pool.scss +++ b/src/sass/components/_faculties-pool.scss @@ -1,6 +1,6 @@ .faculties-pool { background: $white; - max-height: 50vh; + max-height: 25vh; overflow-y: auto; .table { diff --git a/src/sass/components/_grant-op-boxes.scss b/src/sass/components/_grant-op-boxes.scss index fa63494..0893eb3 100644 --- a/src/sass/components/_grant-op-boxes.scss +++ b/src/sass/components/_grant-op-boxes.scss @@ -43,14 +43,6 @@ $grant-op-box-actions-height: 42px; font-size: 1.5em; } - .meta { - margin-bottom: 10px; - - .label { - margin-right: 5px; - } - } - .about { opacity: 0; transition: opacity 150ms; diff --git a/src/sass/components/_uconn-banner.scss b/src/sass/components/_uconn-banner.scss index f8ac70b..3d4988e 100644 --- a/src/sass/components/_uconn-banner.scss +++ b/src/sass/components/_uconn-banner.scss @@ -3,7 +3,7 @@ margin-bottom: 0; .ovpr-sub { - margin-top: 10px; + margin-top: 9px; a { font-size: 1rem; @@ -104,7 +104,7 @@ .ovpr-sub { float: left; - margin-top: 18px; + margin-top: 17px; a { color: $grayed-link-color;