@netless/fastboard-ui 1.0.0-canary.6 → 1.0.0-canary.8

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.
Files changed (21) hide show
  1. package/dist/index.css +39 -11
  2. package/dist/index.js +222 -179
  3. package/dist/index.mjs +220 -171
  4. package/dist/index.svelte.mjs +205 -164
  5. package/package.json +3 -3
  6. package/src/components/Button/Button.svelte +4 -1
  7. package/src/components/Button/Button.svelte.d.ts +1 -0
  8. package/src/components/Fastboard/Fastboard.scss +2 -3
  9. package/src/components/Toolbar/Toolbar.scss +4 -4
  10. package/src/components/Toolbar/Toolbar.svelte +18 -9
  11. package/src/components/Toolbar/components/Contents.scss +3 -3
  12. package/src/components/Toolbar/components/Contents.svelte +49 -6
  13. package/src/components/Toolbar/components/Shapes.svelte +1 -0
  14. package/src/components/Toolbar/components/StrokeColor.svelte +1 -0
  15. package/src/components/Toolbar/components/TextColor.svelte +1 -0
  16. package/src/components/ZoomControl/ZoomControl.svelte +1 -1
  17. package/src/components/theme.scss +11 -4
  18. package/dist/index.css.map +0 -1
  19. package/dist/index.js.map +0 -1
  20. package/dist/index.mjs.map +0 -1
  21. package/dist/index.svelte.mjs.map +0 -1
package/dist/index.css CHANGED
@@ -180,9 +180,15 @@
180
180
  .fastboard-redo-undo-btn.light:not(:disabled):hover {
181
181
  background-color: var(--fastboard-hover-bg-color, #ebf2ff);
182
182
  }
183
+ .fastboard-redo-undo-btn.light:not(:disabled).is-active {
184
+ background-color: var(--fastboard-active-bg-color, #ebf2ff);
185
+ }
183
186
  .fastboard-redo-undo-btn.dark:not(:disabled):hover {
184
187
  background-color: var(--fastboard-hover-bg-color, #383b42);
185
188
  }
189
+ .fastboard-redo-undo-btn.dark:not(:disabled).is-active {
190
+ background-color: var(--fastboard-active-bg-color, #383b42);
191
+ }
186
192
  .fastboard-zoom-control {
187
193
  box-sizing: border-box;
188
194
  display: inline-flex;
@@ -237,9 +243,15 @@
237
243
  .fastboard-zoom-control-btn.light:not(:disabled):hover {
238
244
  background-color: var(--fastboard-hover-bg-color, #ebf2ff);
239
245
  }
246
+ .fastboard-zoom-control-btn.light:not(:disabled).is-active {
247
+ background-color: var(--fastboard-active-bg-color, #ebf2ff);
248
+ }
240
249
  .fastboard-zoom-control-btn.dark:not(:disabled):hover {
241
250
  background-color: var(--fastboard-hover-bg-color, #383b42);
242
251
  }
252
+ .fastboard-zoom-control-btn.dark:not(:disabled).is-active {
253
+ background-color: var(--fastboard-active-bg-color, #383b42);
254
+ }
243
255
  .fastboard-zoom-control-text {
244
256
  font-variant-numeric: tabular-nums;
245
257
  }
@@ -297,9 +309,15 @@
297
309
  .fastboard-page-control-btn.light:not(:disabled):hover {
298
310
  background-color: var(--fastboard-hover-bg-color, #ebf2ff);
299
311
  }
312
+ .fastboard-page-control-btn.light:not(:disabled).is-active {
313
+ background-color: var(--fastboard-active-bg-color, #ebf2ff);
314
+ }
300
315
  .fastboard-page-control-btn.dark:not(:disabled):hover {
301
316
  background-color: var(--fastboard-hover-bg-color, #383b42);
302
317
  }
318
+ .fastboard-page-control-btn.dark:not(:disabled).is-active {
319
+ background-color: var(--fastboard-active-bg-color, #383b42);
320
+ }
303
321
  .fastboard-page-control-text {
304
322
  font-variant-numeric: tabular-nums;
305
323
  }
@@ -359,9 +377,15 @@
359
377
  .fastboard-player-control-btn.light:not(:disabled):hover {
360
378
  background-color: var(--fastboard-hover-bg-color, #ebf2ff);
361
379
  }
380
+ .fastboard-player-control-btn.light:not(:disabled).is-active {
381
+ background-color: var(--fastboard-active-bg-color, #ebf2ff);
382
+ }
362
383
  .fastboard-player-control-btn.dark:not(:disabled):hover {
363
384
  background-color: var(--fastboard-hover-bg-color, #383b42);
364
385
  }
386
+ .fastboard-player-control-btn.dark:not(:disabled).is-active {
387
+ background-color: var(--fastboard-active-bg-color, #383b42);
388
+ }
365
389
  .fastboard-player-control-btn.loading svg,
366
390
  .fastboard-player-control-btn.loading img {
367
391
  animation: fastboard-player-control-rotate .5s linear infinite;
@@ -403,12 +427,12 @@
403
427
  display: flex;
404
428
  align-items: center;
405
429
  position: relative;
406
- transform: translate(0);
407
- transition: transform .5s cubic-bezier(.34, 1.56, .64, 1);
430
+ left: 0;
431
+ transition: left .5s cubic-bezier(.34, 1.56, .64, 1);
408
432
  pointer-events: none;
409
433
  }
410
434
  .fastboard-toolbar.collapsed {
411
- transform: translate(-100%);
435
+ left: -100%;
412
436
  }
413
437
  .fastboard-toolbar-handler {
414
438
  position: absolute;
@@ -477,7 +501,7 @@
477
501
  width: 32px;
478
502
  height: 32px;
479
503
  background-color: #0000;
480
- border-radius: 4px;
504
+ border-radius: 8px;
481
505
  font-size: 0;
482
506
  line-height: 1;
483
507
  flex-shrink: 0;
@@ -495,9 +519,15 @@
495
519
  .fastboard-toolbar-btn.light:not(:disabled):hover {
496
520
  background-color: var(--fastboard-hover-bg-color, #ebf2ff);
497
521
  }
522
+ .fastboard-toolbar-btn.light:not(:disabled).is-active {
523
+ background-color: var(--fastboard-active-bg-color, #ebf2ff);
524
+ }
498
525
  .fastboard-toolbar-btn.dark:not(:disabled):hover {
499
526
  background-color: var(--fastboard-hover-bg-color, #383b42);
500
527
  }
528
+ .fastboard-toolbar-btn.dark:not(:disabled).is-active {
529
+ background-color: var(--fastboard-active-bg-color, #383b42);
530
+ }
501
531
  .fastboard-slider {
502
532
  box-sizing: border-box;
503
533
  position: relative;
@@ -650,8 +680,8 @@
650
680
  .fastboard-toolbar-triangle {
651
681
  width: 0px;
652
682
  height: 0px;
653
- border-bottom: 4px solid;
654
- border-left: 4px solid rgba(0, 0, 0, 0);
683
+ border-bottom: 3px solid;
684
+ border-left: 3px solid rgba(0, 0, 0, 0);
655
685
  position: absolute;
656
686
  bottom: 0;
657
687
  right: 0;
@@ -664,7 +694,7 @@
664
694
  overflow: hidden;
665
695
  display: flex;
666
696
  flex-direction: column;
667
- gap: 4px;
697
+ gap: 0;
668
698
  }
669
699
  .fastboard-toolbar-tooltip {
670
700
  display: inline-flex;
@@ -801,14 +831,14 @@
801
831
  display: flex;
802
832
  align-items: center;
803
833
  position: absolute;
804
- bottom: 62px;
834
+ bottom: 50px;
805
835
  top: 8px;
806
836
  left: 0;
807
837
  z-index: 200;
808
838
  pointer-events: none;
809
839
  }
810
840
  .fastboard-left .fastboard-toolbar {
811
- padding-left: 16px;
841
+ padding-left: 8px;
812
842
  }
813
843
  .fastboard-bottom-left,
814
844
  .fastboard-bottom,
@@ -818,7 +848,6 @@
818
848
  position: absolute;
819
849
  bottom: 8px;
820
850
  left: 8px;
821
- padding: 8px;
822
851
  z-index: 200;
823
852
  pointer-events: none;
824
853
  }
@@ -857,4 +886,3 @@
857
886
  .netless-whiteboard:focus-visible {
858
887
  outline: none;
859
888
  }
860
- /*# sourceMappingURL=index.css.map */