        :height wb/viewport-height}
 
       [:g {:transform (str  "translate(0, " translate-y ")")}
-       (for [value +ticks+]
-         (-> (horizontal-tick value)
-             (rum/with-key value)))]
+       (horizontal-ticks)]
       [:rect {:x 0
               :y 0
               :height 20

      {:width wb/viewport-width
       :height 20}
      [:g {:transform (str "translate(" translate-x ", 0)")}
       (for [value +ticks+]
         (-> (vertical-tick value)
             (rum/with-key value)))]])))

(def horizontal-rule
  (mx/component

    :name "horizontal-tick-render"
    :mixins [mx/static]}))

(defn- horizontal-ticks-render
  [own]
  (html
   [:g
    (for [value +ticks+]
      (-> (horizontal-tick value)
          (rum/with-key value)))]))

(def ^:const horizontal-ticks
  (mx/component
   {:render horizontal-ticks-render
    :name "horizontal-ticks-render"
    :mixins [mx/static]}))

(defn vertical-rule-render
  [own sidebar?]
  (let [scroll (rum/react wb/scroll-a)
