@lls/vivi 24.1.7-d088161a → 24.1.7-db241c20

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 (3) hide show
  1. package/lib/assets/vivi.css +137 -15
  2. package/lib/index.js +890 -355
  3. package/package.json +4 -4
package/lib/assets/vivi.css CHANGED
@@ -83,43 +83,165 @@
83
83
  }
84
84
  }
85
85
 
86
- /* css-modules:css-modules://O33TtB9PRCTwb4sTLsvHxRLVlvvgk7rVn2k8rnGvKak.css */
87
- .vv-s56jqa-editGrid {
86
+ /* css-modules:css-modules://Nn6QZ2dCL6jNXAHejP5TSaMKoN_atqm6Gs_XTxaFR20.css */
87
+ .vv-WWJSSq-editGrid {
88
88
  flex-direction: column;
89
89
  width: 100%;
90
90
  display: flex;
91
91
  }
92
- .vv-s56jqa-editGrid .vv-s56jqa-layout {
92
+ .vv-WWJSSq-layout {
93
93
  box-sizing: border-box;
94
- gap: 8px;
94
+ flex-direction: column;
95
+ gap: 16px;
95
96
  width: 100%;
96
97
  padding: 8px;
97
98
  display: flex;
98
99
  }
99
- .vv-s56jqa-editGrid .vv-s56jqa-illu {
100
+ .vv-WWJSSq-interface {
101
+ box-sizing: border-box;
102
+ background: #f7faff;
103
+ border-radius: 8px;
104
+ flex-direction: column;
105
+ flex: 1;
106
+ gap: 16px;
107
+ padding: 16px;
108
+ display: flex;
109
+ box-shadow: 0 4px 4px #04224d1f;
110
+ }
111
+ .vv-WWJSSq-interfaceHeader {
112
+ justify-content: space-between;
113
+ align-items: center;
114
+ display: flex;
115
+ }
116
+ .vv-WWJSSq-zone {
117
+ box-sizing: border-box;
118
+ --kit-button-margin: 0 2px;
119
+ background: #fff;
120
+ border-radius: 8px;
121
+ justify-content: center;
122
+ gap: 8px;
123
+ padding: 16px;
124
+ display: flex;
125
+ box-shadow: 0 4px 4px #04224d1f;
126
+ }
127
+ .vv-WWJSSq-zone h3 {
128
+ margin: 0;
129
+ }
130
+ .vv-WWJSSq-zone .vv-WWJSSq-col {
131
+ flex-direction: column;
132
+ gap: 8px;
133
+ display: flex;
134
+ }
135
+ .vv-WWJSSq-zone .vv-WWJSSq-row {
136
+ justify-content: space-between;
137
+ align-items: center;
138
+ gap: 8px;
139
+ display: flex;
140
+ }
141
+ .vv-WWJSSq-zone .vv-WWJSSq-zonePicture {
142
+ box-sizing: border-box;
143
+ width: 200px;
144
+ height: 130px;
145
+ }
146
+ .vv-WWJSSq-zone .vv-WWJSSq-zonePicture > div {
147
+ aspect-ratio: var(--v-grid-zone-picture-ratio);
148
+ box-sizing: border-box;
149
+ outline: 4px solid var(--v-grid-zone-picture-color);
150
+ max-width: 100%;
151
+ max-height: 100%;
152
+ margin: auto;
153
+ position: relative;
154
+ top: 50%;
155
+ overflow: hidden;
156
+ transform: translateY(-50%);
157
+ }
158
+ .vv-WWJSSq-zone .vv-WWJSSq-zonePicture > div:before {
159
+ content: "";
160
+ width: var(--v-grid-zone-picture-size);
161
+ aspect-ratio: var(--v-grid-picture-aspect-ratio);
162
+ background-image: var(--v-grid-zone-picture-url);
163
+ transform: translate(var(--v-grid-zone-picture-left), var(--v-grid-zone-picture-top));
164
+ background-repeat: no-repeat;
165
+ background-size: 100%;
166
+ position: absolute;
167
+ top: 0;
168
+ left: 0;
169
+ }
170
+ .vv-WWJSSq-addZone {
171
+ border: 2px dashed var(--primary-40-color);
172
+ border-radius: 16px;
173
+ flex-direction: column;
174
+ justify-content: center;
175
+ align-items: center;
176
+ min-height: 178px;
177
+ padding: 16px;
178
+ display: flex;
179
+ }
180
+
181
+ /* css-modules:css-modules://E8q_Xr1n2R9Y3XOpQIwBbolIOMDkNminpn6uEP1O3G4.css */
182
+ .vv-WzhmXa-zoneMaker {
183
+ box-sizing: border-box;
184
+ user-select: none;
100
185
  border: 4px solid #002747;
101
186
  border-radius: 8px;
102
- flex: 2;
103
187
  min-width: 0;
188
+ position: relative;
104
189
  }
105
- .vv-s56jqa-editGrid .vv-s56jqa-illu > img {
190
+ .vv-WzhmXa-zoneMaker > img {
191
+ aspect-ratio: var(--v-grid-picture-aspect-ratio);
106
192
  width: 100%;
107
193
  display: block;
108
194
  }
109
- .vv-s56jqa-editGrid .vv-s56jqa-interface {
195
+ .vv-WzhmXa-pictureZone {
110
196
  box-sizing: border-box;
197
+ top: var(--v-zonemaker-y);
198
+ left: var(--v-zonemaker-x);
199
+ width: var(--v-zonemaker-w);
200
+ height: var(--v-zonemaker-h);
201
+ outline: 4px solid var(--v-zonemaker-color);
202
+ cursor: move;
203
+ position: absolute;
204
+ }
205
+ .vv-WzhmXa-pictureZone[data-selected="1"] {
206
+ z-index: 1;
207
+ box-shadow: 0 0 20px 4px var(--v-zonemaker-color);
208
+ }
209
+ .vv-WzhmXa-pictureZone[data-has-selection="0"]:hover {
210
+ z-index: 1;
211
+ box-shadow: 0 0 20px 4px var(--v-zonemaker-color);
212
+ }
213
+ .vv-WzhmXa-handle {
214
+ top: var(--v-zonemaker-handle-top);
215
+ left: var(--v-zonemaker-handle-left);
216
+ outline: 4px solid var(--v-zonemaker-color);
217
+ cursor: grab;
111
218
  background: #fff;
112
- border-radius: 8px;
113
- flex: 1;
114
- min-width: 200px;
115
- padding: 8px;
116
- box-shadow: 0 4px 4px #04224d1f;
219
+ border-radius: 50%;
220
+ width: 16px;
221
+ height: 16px;
222
+ position: absolute;
223
+ transform: translate(-50%, -50%);
117
224
  }
118
- .vv-s56jqa-viewGrid {
225
+
226
+ /* css-modules:css-modules://k25kGthh01F0JC5uCLZYEJNVKnlYVmK81yw21wwRr0g.css */
227
+ .vv-TauroG-viewGrid {
119
228
  width: 100%;
120
229
  }
121
- .vv-s56jqa-viewGrid .vv-s56jqa-illu > img {
230
+ .vv-TauroG-illu {
231
+ position: relative;
232
+ }
233
+ .vv-TauroG-illu > img {
234
+ aspect-ratio: var(--v-grid-picture-aspect-ratio);
122
235
  width: 100%;
236
+ display: block;
237
+ }
238
+ .vv-TauroG-pictureZone {
239
+ top: var(--v-picturezone-y);
240
+ left: var(--v-picturezone-x);
241
+ width: var(--v-picturezone-w);
242
+ height: var(--v-picturezone-h);
243
+ outline: 5px solid var(--v-picturezone-color);
244
+ position: absolute;
123
245
  }
124
246
 
125
247
  /* css-modules:css-modules://J5_xl3NfC9uUzCf8dvnv2lVDvTF6x61j2B3MI8uRK3U.css */