Make back button a styled clickable button

This commit is contained in:
Jeremy Dormitzer 2018-01-30 23:31:40 -07:00
parent fe0bbf7385
commit 8a222c545e
No known key found for this signature in database
GPG Key ID: 04F17C0F5A32C320
3 changed files with 31 additions and 14 deletions

View File

@ -254,10 +254,6 @@ html, body {
flex: 1 0 auto;
}
.headerIcon {
margin-right: 4px;
}
.card {
background-color: #f9f9fa;
width: 284px;
@ -380,6 +376,16 @@ html, body {
background-color: #d7d7db;
}
.headerIcon {
margin-right: 4px;
}
.headerIcon.iconButton {
padding: 0;
width: 16px;
height: 20px;
}
.spinner {
margin: 80px auto;
width: 50px;

View File

@ -108,13 +108,15 @@
(for [i (range 1 6)]
(dom/createDom "div" (str "rect" i)))))
(defn sidebar-header [icon-src]
(defn header-icon [src]
(dom/createDom "img"
(clj->js {:src src
:width "16px"
:height "16px"})))
(defn sidebar-header [icon-el]
(dom/createDom "div" "sidebarHeader"
(dom/createDom "img"
(clj->js {:class "headerIcon"
:src icon-src
:width "16px"
:height "16px"}))
icon-el
(dom/createDom "span" "body30 headerTitle" "Looped In")
(dom/createDom "button"
(clj->js {:class "iconButton"

View File

@ -76,10 +76,16 @@
[dispatch-message state]
(log/debug state)
(cond
(:loading state) (list (components/sidebar-header "icons/icon48.png")
(:loading state) (list (components/sidebar-header (components/with-classes
(components/header-icon "icons/icon48.png")
"headerIcon"))
(components/sidebar-content (components/loader)))
(:item state) (list
(components/sidebar-header "icons/back-16.svg")
(components/sidebar-header (dom/createDom
"button"
(clj->js {:class "headerIcon iconButton"
:id "backButton"})
(components/header-icon "icons/back-16.svg")))
(apply
components/sidebar-content
(let [current-item (get-in-item
@ -115,7 +121,8 @@
(* (:created_at_i child) 1000))
(components/item-link (:id child)))
(components/comment-text (:text child))
(-> (components/replies-indicator (count (:children child)))
(-> (components/replies-indicator
(count (:children child)))
((fn [indicator]
(if (> (count (:children child)) 0)
(-> indicator
@ -136,7 +143,9 @@
(filter #(contains? % :text))
(sort-by #(count (:children %)) #(compare %2 %1))))))))
(:hits state) (list
(components/sidebar-header "icons/icon48.png")
(components/sidebar-header (components/with-classes
(components/header-icon "icons/icon48.png")
"headerIcon"))
(apply
components/sidebar-content
(map (fn [hit]