WIP: more SOB UX changes

* make bounties view default
* new top hunters look
* only show top hunters for bounties and activity views
* misc css tweaks

src/cljs/commiteth/core.cljs

@@ -67,13 +67,13 @@
          [:div.item
           [user-dropdown @user [[:update-address "Update address" {}]
                                 ["/logout" "Sign out" {:class "logout-link"}]]]]]
-        [:a.ui.button.small {:href js/authorizeUrl} "Sign in"]))))
+        [:a.ui.button.small {:href js/authorizeUrl} "LOG IN ->"]))))
 
 (defn tabs []
   (let [user (rf/subscribe [:user])
         current-page (rf/subscribe [:page])]
     (fn []
-      (let [tabs (apply conj [[:bounties "Bounties"]
+      (let [tabs (apply conj [[:bounties (str (when-not @user "Open ") "Bounties")]
                               [:activity "Activity"]]
                         (when @user
                           [[:repos "Repositories"]
@@ -124,18 +124,24 @@
     (fn []
       (if (empty? @top-hunters)
         [:div.ui.text "No data"]
-        (into [:div.ui.items.top-hunters]
+        (into [:div.ui.items]
               (map-indexed (fn [idx hunter]
                              [:div.item
-                              [:div.leader-ordinal (str (inc idx))]
+                              [:div.ui.mini.circular.image
-                              [:div.ui..mini.circular.image
                                [:img {:src (:avatar-url hunter)}]]
-                              [:div.content
+                              [:div.leader-ordinal (str (inc idx) ".")]
-                               [:div.header (:display-name hunter)]
+                              [:div.header.leader-name (:display-name hunter)]
-                               [:div.description (str "USD " (:total-usd hunter))]]])
+                              [:div.leader-amount (str "$" (:total-usd hunter))]])
                            @top-hunters))))))
 
+(defn footer []
+  [:div.commiteth-footer "Built by " [:a {:href "https://status.im"} "Status"]
+   (when-not (= "unknown" version)
+          [:div.version-footer "version " [:a {:href (str "https://github.com/status-im/commiteth/commit/" version)} version]])])
+
 (defn page []
+  (let [current-page (rf/subscribe [:page])
+        show-top-hunters? #(contains? #{:bounties :activity} @current-page)]
     (fn []
       [:div.ui.pusher
        [page-header]
@@ -144,19 +150,19 @@
          [:div.ui.grid.stackable
           [:div.ten.wide.computer.sixteen.wide.tablet.column
            [:div.ui.container
-          [(pages @(rf/subscribe [:page]))]]]
+            [(pages @current-page)]]]
+          (when (show-top-hunters?)
             [:div.six.wide.column.computer.only
-         [:div.ui.container
+             [:div.ui.container.top-hunters
-          [:h3 "Top hunters"]
+              [:h3.top-hunters-header "Top hunters"]
-          [top-hunters]]]]
+              [:div.top-hunters-subheader "All time"]
-       [:div.commiteth-footer "Built by " [:a {:href "https://status.im"} "Status"]
+              [top-hunters]]])]
-        (when-not (= "unknown" version)
+         [footer]]]])))
-          [:div.version-footer "version " [:a {:href (str "https://github.com/status-im/commiteth/commit/" version)} version]])]]]]))
 
 (secretary/set-config! :prefix "#")
 
 (secretary/defroute "/" []
-  (rf/dispatch [:set-active-page :activity]))
+  (rf/dispatch [:set-active-page :bounties]))
 
 (secretary/defroute "/repos" []
   (if js/user

src/cljs/commiteth/db.cljs

@@ -1,7 +1,7 @@
 (ns commiteth.db)
 
 (def default-db
-  {:page             :activity
+  {:page             :bounties
    :user             nil
    :repos-loading?   false
    :repos            {}

src/less/style.less

@@ -18,7 +18,6 @@
     white-space: nowrap;
     padding: 0.9em 1.2em 0.9em;
     &:hover {
-        background-color: #bdf8f5;
     }
     &:active,&:focus {
         background-color: #97ebe7;
@@ -31,9 +30,10 @@
 }
 .ui.small.button {
     font-size: 13px!important;
+    background-color: rgba(255,255,255,0.2);
+    color: #fff!important;
 }
 
-
 .commiteth-header {
     background-color: #57a7ed!important;
     border-radius: 0em;
@@ -68,23 +68,40 @@
 	text-align: left;
 }
 
+.top-hunters-header {
+    margin-bottom: 0;
+}
+
+.top-hunters-subheader {
+    margin-top: 0;
+    color: #8d99a4;
+}
+
+.test {
+    background-color: #f00;
+}
 
 .top-hunters {
-    .header {
+    background-color: #fff;
-        color: #474951!important;
+    transform: translate(0, -30px);
-        font-size: 1.1em!important;
+    border-radius: 10px;
-        opacity: .98!important;
+    padding: 10px;
-    }
-    .description {
-        color: #a8aab1!important;
-    }
     .leader-ordinal {
-        font-size: 1.5em;
+        font-size: 15px;
         float: none;
         margin-top: 8px;
+        margin-left: 15px;
         margin-right: 15px;
-        color: #a8aab1;
+        color: #57a7ed;
-        opacity: .45;
+    }
+    .leader-name {
+        margin-top: 8px;
+    }
+    .leader-amount {
+        margin-top: 8px;
+        margin-left: 15px;
+        text-align: right;
+        color: #8d99a4;
     }
 }
 
@@ -143,12 +160,9 @@
     border-radius: 8px;
     border: none;
     padding: .5em;
-    overflow: visible!important;
     .item>a {
-        // &:hover {
-        //     color:#1bb5c1;
-        // }
         color: #fff;
+        pointer: default;
     }
 }