diff --git a/sx/sx/pretext-client.sx b/sx/sx/pretext-client.sx index 3896b6bc..8afd1917 100644 --- a/sx/sx/pretext-client.sx +++ b/sx/sx/pretext-client.sx @@ -67,55 +67,50 @@ (div (~tw :tokens "text-xs text-stone-400") (str (deref max-w) "px / " (deref font-size) "px"))) - (let - ((lines (deref layout)) - (lh (* (deref font-size) 1.5)) - (mxw (deref max-w)) - (sz (deref font-size))) + (div + :class "relative rounded-lg border border-stone-200 bg-white overflow-hidden" (div - :class "relative rounded-lg border border-stone-200 bg-white overflow-hidden" - (div - :class "px-4 pt-3 pb-1" - (span - :class "text-xs font-medium uppercase tracking-wide text-stone-400" - (str - "Client-side — " - (len lines) - " lines, " - (len words) - " words"))) - (div - :style (str - "position:relative;height:" - (* (len lines) lh) - "px;padding:12px 16px;") - (map - (fn - (line) - (let - ((y (get line :y))) - (map - (fn - (pw) - (span - :style (str - "position:absolute;left:" - (+ (get pw :x) 16) - "px;top:" - (+ y 12) - "px;font-family:'Pretext Serif',serif;font-size:" - sz - "px;line-height:" - lh - "px;white-space:nowrap;") - (get pw :word))) - (get line :words)))) - lines)) - (div - :class "px-4 py-2 border-t border-stone-100 bg-stone-50 flex justify-between" - (span - :class "text-xs text-stone-400" - (str (len lines) " lines")) - (span - :class "text-xs text-stone-400" - (str "width: " mxw "px")))))))))) + :class "px-4 pt-3 pb-1" + (span + :class "text-xs font-medium uppercase tracking-wide text-stone-400" + (str + "Client-side — " + (len (deref layout)) + " lines, " + (len words) + " words"))) + (div + :style (str + "position:relative;height:" + (* (len (deref layout)) (* (deref font-size) 1.5)) + "px;padding:12px 16px;") + (map + (fn + (line) + (let + ((y (get line :y))) + (map + (fn + (pw) + (span + :style (str + "position:absolute;left:" + (+ (get pw :x) 16) + "px;top:" + (+ y 12) + "px;font-family:'Pretext Serif',serif;font-size:" + (deref font-size) + "px;line-height:" + (* (deref font-size) 1.5) + "px;white-space:nowrap;") + (get pw :word))) + (get line :words)))) + (deref layout))) + (div + :class "px-4 py-2 border-t border-stone-100 bg-stone-50 flex justify-between" + (span + :class "text-xs text-stone-400" + (str (len (deref layout)) " lines")) + (span + :class "text-xs text-stone-400" + (str "width: " (deref max-w) "px")))))))))