diff --git a/resources/day8/re_frame/trace/main.css b/resources/day8/re_frame/trace/main.css index f951766..679d4b4 100644 --- a/resources/day8/re_frame/trace/main.css +++ b/resources/day8/re_frame/trace/main.css @@ -456,3 +456,11 @@ color: #8f8f8f; content: "}"; } +#--re-frame-trace-- .re-frame-trace--object:before { + color: #8f8f8f; + content: "▶ "; +} +#--re-frame-trace-- .re-frame-trace--object:after { + color: #222222; + content: "{...}"; +} diff --git a/resources/day8/re_frame/trace/main.less b/resources/day8/re_frame/trace/main.less index 4d1f7be..e7e3519 100644 --- a/resources/day8/re_frame/trace/main.less +++ b/resources/day8/re_frame/trace/main.less @@ -574,4 +574,14 @@ content: "}"; } } + .re-frame-trace--object { + &:before { + color: @text-color-muted; + content: "▶ "; + } + &:after { + color: @text-color; + content: "{...}"; + } + } } diff --git a/src/day8/re_frame/trace/app_state.cljs b/src/day8/re_frame/trace/app_state.cljs index 0c04a31..edd2b38 100644 --- a/src/day8/re_frame/trace/app_state.cljs +++ b/src/day8/re_frame/trace/app_state.cljs @@ -32,20 +32,15 @@ (defn jsonml-style [style-map] - ; {:style (get style-map "style")} - {:style {:background "rgba(0,0,0,0.1)"}}) + {:style {:background "rgba(0,0,0,0.04)"}}) (defn str->hiccup [string] - ; (println string) - (cond (= string "span") :span - (= string "style") :style - ; (= string "}") nil - ; (= string "{") nil - ; (= string " ") nil - ; (= string ", ") nil - :else string)) - + (println string) + (cond (= string "span") :span + (= string "style") :style + (= string "object") :span.re-frame-trace--object + :else string)) (defn crawl [data] @@ -63,5 +58,5 @@ (defn tab [data] [:div {:style {:flex "1 0 auto" :width "100%" :height "100%" :display "flex" :flex-direction "column"}} [:div.panel-content-scrollable - (jsonml->hiccup (js->clj (cljs-devtools/header-api-call data)))]]) + (jsonml->hiccup (js->clj (cljs-devtools/header-api-call data) :keywordize-keys true))]]) ; (crawl data)]])