                         [rc/h-box
                          :align :center
                          :class "timing-part-panel"
-                         :gap "25px"
+                         :gap common/gs-12s
                          :children
-                         [[rc/label :label (str "Animation frame #" frame)]
+                         [[:p "Animation" [:br] "frame" [:br] (str "#" frame)]
                           [timing-section "total" @frame-time]
-                          #_[timing-section "subs" 2]
-                          #_[timing-section "views" 3]]])))
-
-                  [rc/line :class "timing-details--line"]
-
-                  [rc/v-box
-                   :children
-                   [[rc/p "Be careful. There are two problems with these numbers:"]
-                    [:ol
-                     [:li "Accurately timing anything in the browser is a nightmare. One moment a given function takes 1ms and the next it takes 10ms, and you'll never know why. So bouncy."]
-                     [:li "You're currently running the dev build, not the production build. So don't freak out too much. Yet."]]
-                    [rc/hyperlink-href
-                     :label "Timing documentation"
-                     :style {:margin-left common/gs-7s}
-                     :attr {:rel "noopener noreferrer"}
-                     :target "_blank"
-                     :href "https://github.com/Day8/re-frame-trace/blob/master/docs/HyperlinkedInformation/UnderstandingTiming.md"]]]]]
+                          [:span "="]
+                          ;; TODO: subs timing
+                          [timing-section "subs" -1]
+                          [:span "+"]
+                          ;; TODO: views timing
+                          [timing-section "views" -1]
+                          [:span "+"]
+                          ;; TODO: timing for the rest
+                          [timing-section "react, etc" -1]]])))]]
       [rc/v-box
        :class "timing-details"
        :children [[:h1 "No timing data available currently."]]])))

    (if timing-data-available?
      [rc/v-box
       :class "timing-details"
       :children [
                  [rc/h-box
                   :gap common/gs-12s
                   :class "timing-part-panel"
                   :children
                   [[timing-section "total" @(rf/subscribe [:timing/total-epoch-time])]
                    [timing-section "event" @(rf/subscribe [:timing/event-processing-time])]
                    ]]
                  (doall
                    (for [frame (range 1 (inc @(rf/subscribe [:timing/animation-frame-count])))

(def timing-styles
  [:#--re-frame-trace--
   [:.timing-details
    {:margin-top common/gs-31s}]
   [:.timing-details--line
    {:margin "1em 0"}]

