lakelib 0.1.12 → 0.1.14

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/lib/lake.css CHANGED
@@ -32,7 +32,7 @@
32
32
  --input-outline: 2px solid #69b1ff;
33
33
  }
34
34
 
35
- @keyframes lakeRotate {
35
+ @keyframes lakerotate {
36
36
  0% {
37
37
  transform: rotate(0);
38
38
  }
@@ -76,14 +76,6 @@
76
76
  padding: 0;
77
77
  margin-bottom: 8px;
78
78
  }
79
- .lake-container a {
80
- color: var(--link-color);
81
- text-decoration: none;
82
- }
83
- .lake-container a:hover {
84
- color: var(--link-hover-color);
85
- text-decoration: underline;
86
- }
87
79
  .lake-drop-indication {
88
80
  position: absolute;
89
81
  height: 2px;
@@ -130,6 +122,104 @@
130
122
  background-color: #0000000a;
131
123
  }
132
124
 
125
+ lake-box {
126
+ margin: 0;
127
+ padding: 0;
128
+ text-indent: 0;
129
+ grid-template-columns: 1px 1fr 1px;
130
+ }
131
+ lake-box[type="inline"] {
132
+ display: inline grid;
133
+ }
134
+ lake-box[type="block"] {
135
+ display: block grid;
136
+ }
137
+ lake-box .lake-box-strip {
138
+ display: block;
139
+ min-width: 1px;
140
+ }
141
+ lake-box[type="inline"] .lake-box-strip {
142
+ align-self: flex-end;
143
+ }
144
+ lake-box[type="block"] .lake-box-strip {
145
+ align-self: stretch;
146
+ }
147
+ lake-box .lake-box-strip ::selection {
148
+ background: transparent;
149
+ }
150
+ lake-box .lake-box-container {
151
+ display: block;
152
+ align-self: center;
153
+ }
154
+ /* box button group */
155
+ lake-box .lake-box-hovered .lake-button-group,
156
+ lake-box .lake-box-focused .lake-button-group,
157
+ lake-box .lake-box-activated .lake-button-group {
158
+ display: flex;
159
+ }
160
+ lake-box .lake-box-focused .lake-resizer {
161
+ display: block;
162
+ }
163
+ lake-box .lake-button-group {
164
+ position: absolute;
165
+ top: 8px;
166
+ right: 8px;
167
+ z-index: 2;
168
+ border-radius: 4px;
169
+ background-color: rgba(0, 0, 0, .4);
170
+ line-height: 0;
171
+ display: flex;
172
+ align-items: center;
173
+ padding: 0 6px;
174
+ display: none;
175
+ }
176
+ lake-box .lake-button-group button {
177
+ border-radius: 5px;
178
+ border: 0;
179
+ color: var(--text-color);
180
+ background-color: transparent;
181
+ padding: 0;
182
+ margin: 0;
183
+ line-height: 0;
184
+ cursor: pointer;
185
+ user-select: none;
186
+ }
187
+ lake-box .lake-button-group button svg {
188
+ fill: #fff;
189
+ width: 16px;
190
+ height: 16px;
191
+ margin: 6px;
192
+ }
193
+ /* box toolbar */
194
+ .lake-box-toolbar {
195
+ position: absolute;
196
+ top: 0;
197
+ left: 0;
198
+ z-index: 1;
199
+ box-sizing: content-box;
200
+ border: 1px solid var(--border-color);
201
+ border-radius: 5px;
202
+ font-family: var(--font-family);
203
+ font-size: 14px;
204
+ font-weight: normal;
205
+ line-height: normal;
206
+ color: var(--text-color);
207
+ background-color: #fff;
208
+ box-shadow: 0 2px 0 #00000005;
209
+ padding: 4px;
210
+ display: flex;
211
+ flex-wrap: wrap;
212
+ align-items: center;
213
+ }
214
+ .lake-box-toolbar .lake-toolbar-divider {
215
+ box-sizing: content-box;
216
+ width: 1px;
217
+ height: 20px;
218
+ margin: 0 4px;
219
+ border-left: 1px solid var(--border-color);
220
+ user-select: none;
221
+ }
222
+
133
223
  button.lake-button {
134
224
  box-sizing: content-box;
135
225
  border-radius: 5px;
@@ -472,60 +562,6 @@ button.lake-primary-button.lake-button-hovered {
472
562
  display: none;
473
563
  }
474
564
 
475
- .lake-toolbar {
476
- font-family: var(--font-family);
477
- font-size: 14px;
478
- font-weight: normal;
479
- line-height: normal;
480
- padding: 4px;
481
- display: flex;
482
- flex-wrap: wrap;
483
- align-items: center;
484
- }
485
- .lake-toolbar .lake-toolbar-divider {
486
- box-sizing: content-box;
487
- width: 1px;
488
- height: 20px;
489
- margin: 0 4px;
490
- border-left: 1px solid var(--border-color);
491
- user-select: none;
492
- }
493
- .lake-toolbar .lake-upload {
494
- line-height: 0;
495
- }
496
- .lake-toolbar .lake-upload input[type="file"] {
497
- display: none;
498
- }
499
-
500
- .lake-box-toolbar {
501
- position: absolute;
502
- top: 0;
503
- left: 0;
504
- z-index: 1;
505
- box-sizing: content-box;
506
- border: 1px solid var(--border-color);
507
- border-radius: 5px;
508
- font-family: var(--font-family);
509
- font-size: 14px;
510
- font-weight: normal;
511
- line-height: normal;
512
- color: var(--text-color);
513
- background-color: #fff;
514
- box-shadow: 0 2px 0 #00000005;
515
- padding: 4px;
516
- display: flex;
517
- flex-wrap: wrap;
518
- align-items: center;
519
- }
520
- .lake-box-toolbar .lake-toolbar-divider {
521
- box-sizing: content-box;
522
- width: 1px;
523
- height: 20px;
524
- margin: 0 4px;
525
- border-left: 1px solid var(--border-color);
526
- user-select: none;
527
- }
528
-
529
565
  .lake-container.lake-format-painter {
530
566
  /* file: ../svg/format-painter-cursor.svg */
531
567
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='20' viewBox='0 0 600 400'%3E%3Cpath fill='none' d='M397 401H1V1h600v400H397m27.39-160.456v-37.606h5.963c41.821 0 83.642.024 125.463-.016 10.848-.01 17.325-6 17.358-16.286.096-30.823.1-61.648 0-92.471-.034-10.554-5.94-16.103-16.674-16.16-6.45-.035-12.899-.007-19.657-.007 0-8.783.063-17.08-.018-25.374-.079-7.94-3.319-11.204-11.29-11.207-73.81-.03-147.621-.034-221.432.004-8.106.004-11.091 3.142-11.096 11.293-.02 32.99-.02 65.98-.003 98.97.005 8.202 3.26 11.461 11.504 11.463 73.644.015 147.289.016 220.933-.002 8.157-.002 11.373-3.312 11.393-11.649.036-14.662.003-29.324.02-43.986.002-1.608.14-3.216.215-4.84h11.502v75.804h-5.843c-41.487 0-82.975-.005-124.462.003-12.796.002-18.147 5.394-18.162 18.306-.017 14.662.002 29.324-.015 43.987-.002 1.432-.153 2.865-.249 4.53-5.076 0-9.73.089-14.38-.027-3.776-.095-5.384 1.436-5.371 5.34.099 29.489-.097 58.98.155 88.468.142 16.617 14.312 30.632 30.552 30.954 17.736.352 32.858-12.285 33.16-29.098.542-30.313.202-60.641.302-90.963.011-3.525-1.706-4.728-4.922-4.686-3.832.05-7.676-.172-11.493.067-3.036.19-3.824-1.148-3.452-4.81M98.997 123.5v81.255H76.999v22.088h21.982c0 2.045.005 3.674 0 5.303-.087 25.83-.49 51.664-.091 77.487.143 9.23-2.38 16.953-7.836 24.049-.913 1.187-1.723 2.452-2.59 3.675-9.838 13.893-23.103 21.722-40.24 22.51-4.767.218-9.553.032-14.914.032v22.282c32.478 3.01 58.566-8.283 76.789-36.428 17.756 26.721 48.899 40.773 78.248 36.027l-1.083-21.66c-2.256 0-3.75-.08-5.232.012-21.104 1.302-37.87-6.871-50.84-23.287-6.506-8.233-10.772-16.802-10.401-28.137.833-25.47.26-50.985.26-76.482v-5.482h21.96v-22.25h-21.96v-5.966c0-32.329.294-64.663-.185-96.985-.141-9.484 1.949-17.494 7.541-25.066 12.268-16.61 27.766-26.975 49.095-26.868 3.12.015 6.24.002 10.04.002V27.314c-15.008-.802-29.72-.048-43.6 7.157-13.625 7.073-25.309 16.192-33.954 29.838-8.595-13.434-19.139-23.646-33.21-30.154-14.041-6.495-28.642-7.867-43.307-6.781V49.62c4.253 0 7.742.003 11.23 0 7.756-.006 14.966 1.724 22.189 4.873 10.95 4.774 18.144 12.992 24.784 22.4 5.426 7.69 8.207 15.646 7.43 25.118-.555 6.787-.107 13.657-.107 21.489z'/%3E%3Cpath fill='%23020202' d='M424.39 241.051c-.371 3.156.417 4.494 3.453 4.304 3.817-.239 7.661-.017 11.493-.067 3.216-.042 4.933 1.161 4.922 4.686-.1 30.322.24 60.65-.303 90.963-.3 16.813-15.423 29.45-33.159 29.098-16.24-.322-30.41-14.337-30.552-30.954-.252-29.488-.056-58.98-.155-88.469-.013-3.903 1.595-5.434 5.371-5.34 4.65.117 9.304.028 14.38.028.096-1.665.247-3.098.249-4.53.017-14.663-.002-29.325.015-43.987.015-12.912 5.366-18.304 18.162-18.306 41.487-.008 82.975-.003 124.462-.003h5.843V102.67H537.07c-.075 1.624-.213 3.232-.215 4.84-.017 14.662.016 29.324-.02 43.986-.02 8.337-3.236 11.647-11.393 11.649-73.644.018-147.289.017-220.933.002-8.244-.002-11.5-3.261-11.504-11.462-.016-32.99-.017-65.98.003-98.97.005-8.152 2.99-11.29 11.096-11.294 73.81-.038 147.622-.034 221.433-.004 7.97.003 11.21 3.266 11.289 11.207.081 8.295.018 16.59.018 25.374 6.758 0 13.208-.028 19.657.006 10.734.058 16.64 5.607 16.674 16.16.1 30.824.096 61.649 0 92.472-.033 10.286-6.51 16.275-17.358 16.286-41.821.04-83.642.016-125.463.016h-5.962v38.113z'/%3E%3Cpath fill='%23040404' d='M98.997 123c0-7.332-.448-14.202.108-20.989.776-9.472-2.005-17.429-7.431-25.118-6.64-9.408-13.834-17.626-24.784-22.4-7.223-3.15-14.433-4.879-22.189-4.873-3.488.003-6.977 0-11.23 0V27.374c14.665-1.086 29.266.286 43.307 6.78 14.071 6.51 24.615 16.72 33.21 30.155 8.645-13.646 20.33-22.765 33.954-29.838 13.88-7.205 28.592-7.959 43.6-7.157V49.61c-3.8 0-6.92.013-10.04-.002-21.329-.107-36.827 10.259-49.095 26.868-5.592 7.572-7.682 15.582-7.541 25.066.479 32.322.185 64.656.186 96.985v5.966h21.958v22.25h-21.958v5.482c0 25.497.572 51.013-.261 76.482-.37 11.335 3.895 19.904 10.4 28.137 12.97 16.416 29.737 24.589 50.84 23.287 1.483-.092 2.977-.012 5.233-.012l1.083 21.66c-29.349 4.746-60.492-9.306-78.248-36.027-18.223 28.145-44.31 39.438-76.79 36.428v-22.282c5.362 0 10.148.186 14.914-.033 17.138-.787 30.403-8.616 40.242-22.509.866-1.223 1.676-2.488 2.589-3.675 5.455-7.096 7.979-14.82 7.836-24.05-.4-25.822.004-51.656.09-77.486.006-1.63 0-3.258 0-5.303H77v-22.088h21.997V123z'/%3E%3C/svg%3E") 2 2, text;
@@ -568,6 +604,57 @@ button.lake-primary-button.lake-button-hovered {
568
604
  margin-bottom: 8px;
569
605
  }
570
606
 
607
+ .lake-container a {
608
+ color: var(--link-color);
609
+ text-decoration: none;
610
+ }
611
+ .lake-container a:hover {
612
+ color: var(--link-hover-color);
613
+ text-decoration: underline;
614
+ }
615
+ .lake-link-popup {
616
+ position: absolute;
617
+ top: 0;
618
+ left: 0;
619
+ z-index: 1;
620
+ box-sizing: content-box;
621
+ border: 1px solid var(--border-color);
622
+ border-radius: 5px;
623
+ padding: 16px;
624
+ width: fit-content;
625
+ font-family: var(--font-family);
626
+ font-size: 14px;
627
+ color: var(--text-color);
628
+ background-color: #fff;
629
+ box-shadow: var(--popup-shadow);
630
+ display: none;
631
+ }
632
+ .lake-link-popup .lake-url-row {
633
+ display: flex;
634
+ align-items: center;
635
+ }
636
+ .lake-link-popup .lake-button-row {
637
+ padding-top: 16px;
638
+ display: flex;
639
+ align-items: center;
640
+ justify-content: space-between;
641
+ }
642
+ .lake-link-popup input[type="text"] {
643
+ width: 200px;
644
+ margin-right: 4px;
645
+ }
646
+ .lake-link-popup button[name="copy"] svg:first-child {
647
+ display: inline;
648
+ }
649
+ .lake-link-popup button[name="copy"] svg:nth-child(2) {
650
+ display: none;
651
+ fill: var(--success-color);
652
+ }
653
+ .lake-link-popup button[name="copy"] svg:last-child {
654
+ display: none;
655
+ fill: var(--error-color);
656
+ }
657
+
571
658
  .lake-container ol,
572
659
  .lake-container ul {
573
660
  list-style: none;
@@ -735,73 +822,6 @@ button.lake-primary-button.lake-button-hovered {
735
822
  border: 1px solid var(--border-color);
736
823
  }
737
824
 
738
- lake-box {
739
- margin: 0;
740
- padding: 0;
741
- text-indent: 0;
742
- grid-template-columns: 1px 1fr 1px;
743
- }
744
- lake-box[type="inline"] {
745
- display: inline grid;
746
- }
747
- lake-box[type="block"] {
748
- display: block grid;
749
- }
750
- lake-box .lake-box-strip {
751
- display: block;
752
- min-width: 1px;
753
- }
754
- lake-box[type="inline"] .lake-box-strip {
755
- align-self: flex-end;
756
- }
757
- lake-box[type="block"] .lake-box-strip {
758
- align-self: stretch;
759
- }
760
- lake-box .lake-box-strip ::selection {
761
- background: transparent;
762
- }
763
- lake-box .lake-box-container {
764
- display: block;
765
- }
766
- lake-box .lake-box-hovered .lake-button-group,
767
- lake-box .lake-box-focused .lake-button-group,
768
- lake-box .lake-box-activated .lake-button-group {
769
- display: flex;
770
- }
771
- lake-box .lake-box-focused .lake-resizer {
772
- display: block;
773
- }
774
- lake-box .lake-button-group {
775
- position: absolute;
776
- top: 8px;
777
- right: 8px;
778
- z-index: 2;
779
- border-radius: 4px;
780
- background-color: rgba(0, 0, 0, .4);
781
- line-height: 0;
782
- display: flex;
783
- align-items: center;
784
- padding: 0 6px;
785
- display: none;
786
- }
787
- lake-box .lake-button-group button {
788
- border-radius: 5px;
789
- border: 0;
790
- color: var(--text-color);
791
- background-color: transparent;
792
- padding: 0;
793
- margin: 0;
794
- line-height: 0;
795
- cursor: pointer;
796
- user-select: none;
797
- }
798
- lake-box .lake-button-group button svg {
799
- fill: #fff;
800
- width: 16px;
801
- height: 16px;
802
- margin: 6px;
803
- }
804
-
805
825
  lake-box[name="hr"] {
806
826
  margin-bottom: 8px;
807
827
  }
@@ -833,6 +853,8 @@ lake-box[name="hr"] .lake-box-focused .lake-hr {
833
853
 
834
854
  .lake-video {
835
855
  position: relative;
856
+ font-size: 14px;
857
+ font-weight: normal;
836
858
  line-height: 0;
837
859
  box-sizing: content-box;
838
860
  border: 1px solid transparent;
@@ -1003,7 +1025,7 @@ lake-box[name="image"] .lake-box-focused .lake-image {
1003
1025
  width: 16px;
1004
1026
  height: 16px;
1005
1027
  margin: 6px;
1006
- animation: lakeRotate 1s linear 0s infinite normal none;
1028
+ animation: lakerotate 1s linear 0s infinite normal none;
1007
1029
  }
1008
1030
  .lake-image .lake-progress .lake-percent {
1009
1031
  font-size: 14px;
@@ -1052,6 +1074,8 @@ lake-box[name="image"] .lake-box-selected .lake-image-error {
1052
1074
 
1053
1075
  .lake-file {
1054
1076
  position: relative;
1077
+ font-size: 16px;
1078
+ font-weight: normal;
1055
1079
  line-height: 0;
1056
1080
  box-sizing: content-box;
1057
1081
  border: 1px solid transparent;
@@ -1098,7 +1122,7 @@ lake-box[name="file"] .lake-box-focused .lake-file {
1098
1122
  width: 16px;
1099
1123
  height: 16px;
1100
1124
  margin: 4px;
1101
- animation: lakeRotate 1s linear 0s infinite normal none;
1125
+ animation: lakerotate 1s linear 0s infinite normal none;
1102
1126
  }
1103
1127
  .lake-file-uploading .lake-progress .lake-percent {
1104
1128
  line-height: 24px;
@@ -1113,45 +1137,27 @@ lake-box[name="file"] .lake-box-focused .lake-file {
1113
1137
  color: var(--error-color);
1114
1138
  }
1115
1139
 
1116
- .lake-link-popup {
1117
- position: absolute;
1118
- top: 0;
1119
- left: 0;
1120
- z-index: 1;
1121
- box-sizing: content-box;
1122
- border: 1px solid var(--border-color);
1123
- border-radius: 5px;
1124
- padding: 16px;
1125
- width: fit-content;
1140
+ .lake-toolbar {
1126
1141
  font-family: var(--font-family);
1127
1142
  font-size: 14px;
1128
- color: var(--text-color);
1129
- background-color: #fff;
1130
- box-shadow: var(--popup-shadow);
1131
- display: none;
1132
- }
1133
- .lake-link-popup .lake-url-row {
1134
- display: flex;
1135
- align-items: center;
1136
- }
1137
- .lake-link-popup .lake-button-row {
1138
- padding-top: 16px;
1143
+ font-weight: normal;
1144
+ line-height: normal;
1145
+ padding: 4px;
1139
1146
  display: flex;
1147
+ flex-wrap: wrap;
1140
1148
  align-items: center;
1141
- justify-content: space-between;
1142
- }
1143
- .lake-link-popup input[type="text"] {
1144
- width: 200px;
1145
- margin-right: 4px;
1146
1149
  }
1147
- .lake-link-popup button[name="copy"] svg:first-child {
1148
- display: inline;
1150
+ .lake-toolbar .lake-toolbar-divider {
1151
+ box-sizing: content-box;
1152
+ width: 1px;
1153
+ height: 20px;
1154
+ margin: 0 4px;
1155
+ border-left: 1px solid var(--border-color);
1156
+ user-select: none;
1149
1157
  }
1150
- .lake-link-popup button[name="copy"] svg:nth-child(2) {
1151
- display: none;
1152
- fill: var(--success-color);
1158
+ .lake-toolbar .lake-upload {
1159
+ line-height: 0;
1153
1160
  }
1154
- .lake-link-popup button[name="copy"] svg:last-child {
1161
+ .lake-toolbar .lake-upload input[type="file"] {
1155
1162
  display: none;
1156
- fill: var(--error-color);
1157
1163
  }