diff --git a/docs/features/core.md b/docs/features/core.md index fa9c083..49761e8 100644 --- a/docs/features/core.md +++ b/docs/features/core.md @@ -10,8 +10,8 @@ - [] Circle - [] Image - [] Point -- [] Drag elements +- [x] Drag elements - [] Move elements' index - [] Rotate elements -- [] Transform elements's size +- [x] Transform elements's size - [] Undo action record \ No newline at end of file diff --git a/packages/core/example/css/index.css b/packages/core/example/css/index.css new file mode 100644 index 0000000..2216f97 --- /dev/null +++ b/packages/core/example/css/index.css @@ -0,0 +1,52 @@ +html, body { + margin: 0; + padding: 0; + width: 100%; + height: 100%; +} + +#mount canvas { + /* border-right: 1px solid #aaaaaa40; */ + border: 1px solid #aaaaaa40; + background-image: + linear-gradient(#aaaaaa40 1px, transparent 0), + linear-gradient(90deg, #aaaaaa40 1px, transparent 0), + linear-gradient(#aaa 1px, transparent 0), + linear-gradient(90deg, #aaa 1px, transparent 0); + background-size: 10px 10px, 10px 10px, 50px 50px, 50px 50px; +} + +.dashboard { + display: flex; + width: 100%; + flex-direction: column; +} + +.dashboard .row { + margin-top: 20px; + display: flex; + width: 100%; + flex-direction: row; +} + +.dashboard .row .col { + display: flex; + flex: 1; + width: 100%; +} + +.center { + justify-content: center; + align-items: center; +} + + +.transform { + display: flex; + margin-top: 10px; +} + +.transform input { + width: 100px; + margin-right: 12px; +} \ No newline at end of file diff --git a/packages/core/example/index.html b/packages/core/example/index.html index 9d6d0ed..2ef456c 100644 --- a/packages/core/example/index.html +++ b/packages/core/example/index.html @@ -2,39 +2,31 @@ - + -
- -
-
- scale: - - scrollX: - - scrollY: - +
+
+
+
+
+
+
+
+
+
+
+
+ scale: + + scrollX: + + scrollY: + +
+
+