js-draw 0.1.3 → 0.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +5 -0
- package/README.md +19 -10
- package/dist/bundle.js +1 -1
- package/dist/src/Editor.d.ts +2 -1
- package/dist/src/Editor.js +18 -3
- package/dist/src/SVGLoader.js +1 -1
- package/dist/src/components/Text.js +3 -1
- package/dist/src/toolbar/HTMLToolbar.js +27 -1
- package/dist/src/toolbar/icons.js +1 -0
- package/dist/src/toolbar/localization.d.ts +1 -0
- package/dist/src/toolbar/localization.js +1 -0
- package/dist/src/tools/TextTool.d.ts +1 -0
- package/dist/src/tools/TextTool.js +22 -3
- package/dist-test/test-dist-bundle.html +8 -1
- package/package.json +1 -1
- package/src/Editor.css +2 -0
- package/src/Editor.ts +19 -4
- package/src/SVGLoader.ts +1 -1
- package/src/components/Text.ts +5 -1
- package/src/toolbar/HTMLToolbar.ts +34 -2
- package/src/toolbar/icons.ts +1 -0
- package/src/toolbar/localization.ts +2 -0
- package/src/toolbar/toolbar.css +6 -3
- package/src/tools/TextTool.ts +22 -3
package/CHANGELOG.md
CHANGED
package/README.md
CHANGED
@@ -109,6 +109,13 @@ const editor = new Editor(document.body, {
|
|
109
109
|
});
|
110
110
|
```
|
111
111
|
|
112
|
+
Alternatively, to only enable touchpad panning when the editor has focus,
|
113
|
+
```ts
|
114
|
+
const editor = new Editor(document.body, {
|
115
|
+
wheelEventsEnabled: 'only-if-focused',
|
116
|
+
});
|
117
|
+
```
|
118
|
+
|
112
119
|
### Localization
|
113
120
|
|
114
121
|
See [src/localization.ts](src/localization.ts) for a list of strings.
|
@@ -149,25 +156,27 @@ const editor = new Editor(document.body, {
|
|
149
156
|
The editor's color theme is specified using CSS. Its default theme looks like this:
|
150
157
|
```css
|
151
158
|
.imageEditorContainer {
|
152
|
-
|
159
|
+
/* Deafult colors for the editor -- light mode */
|
153
160
|
|
154
161
|
--primary-background-color: white;
|
155
162
|
--primary-background-color-transparent: rgba(255, 255, 255, 0.5);
|
156
163
|
--secondary-background-color: #faf;
|
157
164
|
--primary-foreground-color: black;
|
158
165
|
--secondary-foreground-color: black;
|
166
|
+
--primary-shadow-color: rgba(0, 0, 0, 0.5);
|
159
167
|
}
|
160
168
|
|
161
169
|
@media (prefers-color-scheme: dark) {
|
162
|
-
|
163
|
-
|
164
|
-
|
165
|
-
|
166
|
-
|
167
|
-
|
168
|
-
|
169
|
-
|
170
|
-
|
170
|
+
.imageEditorContainer {
|
171
|
+
/* Deafult colors for the editor -- dark mode */
|
172
|
+
|
173
|
+
--primary-background-color: #151515;
|
174
|
+
--primary-background-color-transparent: rgba(50, 50, 50, 0.5);
|
175
|
+
--secondary-background-color: #607;
|
176
|
+
--primary-foreground-color: white;
|
177
|
+
--secondary-foreground-color: white;
|
178
|
+
--primary-shadow-color: rgba(250, 250, 250, 0.5);
|
179
|
+
}
|
171
180
|
}
|
172
181
|
```
|
173
182
|
|