diff options
Diffstat (limited to 'src/frontend/tubo/components/player.cljs')
| -rw-r--r-- | src/frontend/tubo/components/player.cljs | 23 |
1 files changed, 21 insertions, 2 deletions
diff --git a/src/frontend/tubo/components/player.cljs b/src/frontend/tubo/components/player.cljs index ac721e2..c44a408 100644 --- a/src/frontend/tubo/components/player.cljs +++ b/src/frontend/tubo/components/player.cljs @@ -25,6 +25,23 @@ :on-click on-click-cb} icon]) +(defn loop-button + [loop-playback service-color show-on-mobile?] + [button + [:div.relative.flex.items-center + [:i.fa-solid.fa-repeat + {:style {:color (when loop-playback service-color)}}] + (when (= loop-playback :stream) + [:div.absolute.font-bold + {:style {:color (when loop-playback service-color) + :font-size "5.5px" + :right "6px" + :top "-4px"}} + "1"])] + #(rf/dispatch [::events/toggle-loop-playback]) + :extra-styles "text-sm" + :show-on-mobile? show-on-mobile?]) + (defn volume-slider [player volume-level muted? service-color] (let [show-slider? (r/atom nil)] (fn [player volume-level muted? service-color] @@ -35,10 +52,12 @@ (if muted? [:i.fa-solid.fa-volume-xmark] [:i.fa-solid.fa-volume-low]) #(rf/dispatch [::events/toggle-mute player])] (when @show-slider? - [:input.rounded-lg.cursor-pointer.focus:outline-none.absolute + [:input.rounded-lg.w-24.cursor-pointer.focus:outline-none.absolute {:class "rotate-[270deg]" :type "range" :on-input #(rf/dispatch [::events/change-volume-level (.. % -target -value) player]) - :style {:accentColor service-color :left "-48px" :bottom "80px" :display (if @show-slider? "block" "none")} + :style {:accentColor service-color + :left "-32.5px" + :bottom "67.5px"} :max 100 :value volume-level}])]))) |