"Top hunters" UI

* front end support for "top hunters"
* placeholder data used for now

src/cljs/commiteth/core.cljs

@@ -129,14 +129,37 @@
    :bounties #'bounties-page
    :update-address #'update-address-page})
 
+
+
+(defn top-hunters []
+  (let [top-hunters (rf/subscribe [:top-hunters])]
+    (fn []
+      (into [:div.ui.items.top-hunters]
+            (map-indexed (fn [idx hunter]
+                           [:div.item
+                            [:div.leader-ordinal (str (+ 1 idx))]
+                            [:div.ui..mini.circular.image
+                             [:img {:src (:profile-image-url hunter)}]]
+                            [:div.content
+                             [:div.header (:display-name hunter)]
+                             [:div.description (str "ETH " (:eth-earned hunter))]]])
+                         @top-hunters)))))
+
 (defn page []
   (fn []
     [:div.ui.pusher
      [page-header]
      ;;     [error-pane]
      [:div.ui.vertical.segment
-      [:div.page-content
-       [(pages @(rf/subscribe [:page]))]]]]))
+      [:div.ui.container
+       [:div.ui.grid.stackable
+        [:div.twelve.wide.column
+         [:div.ui.container.page-content
+          [(pages @(rf/subscribe [:page]))]]]
+        [:div.four.wide.column.computer.only
+         [:div.ui.container.page-content
+          [:h3 "Top hunters"]
+          [top-hunters]]]]]]]))
 
 (secretary/set-config! :prefix "#")
 

src/cljs/commiteth/db.cljs

@@ -10,4 +10,10 @@
    :error            nil
    :pagination       {}
    :pagination-props {:page-size 10
-                      :pages-max 10}})
+                      :pages-max 10}
+   :top-hunters [{:profile-image-url "https://randomuser.me/api/portraits/men/4.jpg"
+                  :display-name "Place Holder"
+                  :eth-earned "11 000.00"}
+                 {:profile-image-url "https://randomuser.me/api/portraits/men/6.jpg"
+                  :display-name "Dummy User"
+                  :eth-earned "8 400.00"}]})

src/cljs/commiteth/repos.cljs

@@ -41,7 +41,7 @@
         user (rf/subscribe [:user])
         repo-groups (keys @repos)]
     (fn []
-      (into [:div.ui.container]
+      (into [:div]
             (for [[group group-repos]
                   (map (fn [group] [group (get @repos group)]) repo-groups)]
               [:div [repo-group-title group (:login @user)]
@@ -53,8 +53,7 @@
   (let [repos-loading? (rf/subscribe [:repos-loading?])]
     (fn []
       (if @repos-loading?
-        [:div.ui.container
-         [:p]
+        [:div
          [:div.ui.active.dimmer
           [:div.ui.loader]]]
         [repos-list]))))

src/cljs/commiteth/subscriptions.cljs

@@ -41,6 +41,11 @@
   (fn [db [_ table]]
     (get-in db [:pagination table])))
 
+(reg-sub
+  :top-hunters
+  (fn [db _]
+    (:top-hunters db)))
+
 (reg-sub
   :get-in
   (fn [db [_ path]]

src/less/style.less

@@ -33,6 +33,25 @@
     opacity: 0.98;
 }
 
+.top-hunters {
+    .header {
+        color: #474951!important;
+        font-size: 1.1em!important;
+        opacity: .98!important;
+    }
+    .description {
+        color: #a8aab1!important;
+    }
+    .leader-ordinal {
+        font-size: 1.5em;
+        float: none;
+        margin-top: 8px;
+        margin-right: 15px;
+        color: #a8aab1;
+        opacity: .45;
+    }
+}
+
 .ui.mini.circular.image {
     height: 35px;
 }