diff --git a/frontend/src/app/render_wasm/api/texts.cljs b/frontend/src/app/render_wasm/api/texts.cljs
index 9f6dbd4575..eb0d961491 100644
--- a/frontend/src/app/render_wasm/api/texts.cljs
+++ b/frontend/src/app/render_wasm/api/texts.cljs
@@ -16,7 +16,7 @@
[app.render-wasm.wasm :as wasm]))
(def ^:const PARAGRAPH-ATTR-U8-SIZE 44)
-(def ^:const LEAF-ATTR-U8-SIZE 56)
+(def ^:const LEAF-ATTR-U8-SIZE 60)
(defn- encode-text
"Into an UTF8 buffer. Returns an ArrayBuffer instance"
@@ -79,6 +79,7 @@
(reduce (fn [offset leaf]
(let [font-style (sr/translate-font-style (get leaf :font-style))
font-size (get leaf :font-size)
+ letter-spacing (get leaf :letter-spacing)
font-weight (get leaf :font-weight)
font-id (f/normalize-font-id (get leaf :font-id))
font-family (hash (get leaf :font-family))
@@ -104,15 +105,21 @@
text-transform
(or (sr/translate-text-transform (:text-transform leaf))
(sr/translate-text-transform (:text-transform paragraph))
- (sr/translate-text-transform "none"))]
+ (sr/translate-text-transform "none"))
+
+ text-direction
+ (or (sr/translate-text-direction (:text-direction leaf))
+ (sr/translate-text-direction (:text-direction paragraph))
+ (sr/translate-text-direction "ltr"))]
(-> offset
(mem/write-u8 dview font-style)
(mem/write-u8 dview text-decoration)
(mem/write-u8 dview text-transform)
- (+ 1) ;;padding
+ (mem/write-u8 dview text-direction)
(mem/write-f32 dview font-size)
+ (mem/write-f32 dview letter-spacing)
(mem/write-u32 dview font-weight)
(mem/write-uuid dview font-id)
diff --git a/frontend/src/app/render_wasm/serializers.cljs b/frontend/src/app/render_wasm/serializers.cljs
index 13fc6a62c3..32c5e20854 100644
--- a/frontend/src/app/render_wasm/serializers.cljs
+++ b/frontend/src/app/render_wasm/serializers.cljs
@@ -310,7 +310,8 @@
[text-direction]
(case text-direction
"ltr" 0
- "rtl" 1))
+ "rtl" 1
+ 0))
(defn translate-font-style
[font-style]
diff --git a/frontend/text-editor/src/style.css b/frontend/text-editor/src/style.css
index a2e71ddda1..659dbc2e16 100644
--- a/frontend/text-editor/src/style.css
+++ b/frontend/text-editor/src/style.css
@@ -3,12 +3,20 @@
color: #eee;
}
+html, body {
+ margin: 0;
+ padding: 0;
+}
+
+canvas {
+ width: 100cqw;
+}
+
.text-editor-container {
background-color: white;
}
-#output {
- font-family: monospace;
- padding: 1rem;
- border: 1px solid #333;
+.playground {
+ display: grid;
+ max-width: 1280px;
}
diff --git a/frontend/text-editor/src/wasm.html b/frontend/text-editor/src/wasm.html
index 700d38a363..cb3d0dafa0 100644
--- a/frontend/text-editor/src/wasm.html
+++ b/frontend/text-editor/src/wasm.html
@@ -8,220 +8,216 @@
Penpot - Text Editor Playground
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
-
-
-