Added centred arrow under the blue tab underlines

This commit is contained in:
Gregg8 2018-01-16 17:25:09 +11:00
parent 0d02ba3c2f
commit 2c2d0fb14d
2 changed files with 22 additions and 3 deletions

View File

@ -0,0 +1,12 @@
<svg width="12" height="7" viewBox="0 0 12 7" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<title>Polygon</title>
<desc>Created using Figma</desc>
<g id="Canvas" transform="translate(-2344 -40)">
<g id="Polygon">
<use xlink:href="#path0_fill" transform="matrix(-1 9.54098e-18 -9.54098e-18 -1 2356 47)" fill="#6EC0E6"/>
</g>
</g>
<defs>
<path id="path0_fill" d="M 6.05481 0L 12 7L 0 7L 6.05481 0Z"/>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 462 B

View File

@ -16,10 +16,16 @@
[day8.re-frame.trace.utils.re-com :as rc] [day8.re-frame.trace.utils.re-com :as rc]
[day8.re-frame.trace.common-styles :as common])) [day8.re-frame.trace.common-styles :as common]))
(def triangle-down (macros/slurp-macro "day8/re_frame/trace/images/triangle-down.svg"))
(defn tab-button [panel-id title] (defn tab-button [panel-id title]
(let [selected-tab @(rf/subscribe [:settings/selected-tab])] (let [selected-tab @(rf/subscribe [:settings/selected-tab])]
[:button {:class (str "tab button bm-heading-text " (when (= selected-tab panel-id) "active")) [rc/v-box
:on-click #(rf/dispatch [:settings/selected-tab panel-id])} title])) :style {:margin-bottom "-8px"
:z-index 1}
:children [[:button {:class (str "tab button bm-heading-text " (when (= selected-tab panel-id) "active"))
:on-click #(rf/dispatch [:settings/selected-tab panel-id])} title]
[:img {:src (str "data:image/svg+xml;utf8," triangle-down)
:style {:opacity (if (= selected-tab panel-id) "1" "0")}}]]]))
(def open-external (macros/slurp-macro "day8/re_frame/trace/images/logout.svg")) (def open-external (macros/slurp-macro "day8/re_frame/trace/images/logout.svg"))
(def settings-svg (macros/slurp-macro "day8/re_frame/trace/images/wrench.svg")) (def settings-svg (macros/slurp-macro "day8/re_frame/trace/images/wrench.svg"))
@ -122,7 +128,8 @@
:justify :between :justify :between
:children [[rc/h-box :children [[rc/h-box
:gap "7px" :gap "7px"
:align :center :align :end
:height "50px"
:children [(tab-button :event "Event") :children [(tab-button :event "Event")
(tab-button :app-db "app-db") (tab-button :app-db "app-db")
(tab-button :subs "Subs") (tab-button :subs "Subs")