blob: 3240f9e036f16834e0bf2a98a87bf8b734f61806 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
|
import { slideTypes } from '../timeline';
export function PressureIcon() {
return <svg width='48' height='48' viewBox='0 0 48 48' fill='none' xmlns='http://www.w3.org/2000/svg'>
<path
d='M18 30L14.7004 41.5487C14.3494 42.7771 15.2718 44 16.5494 44V44C17.408 44 18.1626 43.4308 18.3985 42.6053L22 30H18Z'
fill='url(#paint0_linear)'
/>
<path
d='M31.4506 44C30.592 44 29.8374 43.4308 29.6015 42.6053L26 30H30L33.2996 41.5487C33.6506 42.7771 32.7282 44 31.4506 44V44Z'
fill='url(#paint1_linear)'
/>
<path
d='M28 6C28 8.20914 26.2091 10 24 10C21.7909 10 20 8.20914 20 6C20 3.79086 21.7909 2 24 2C26.2091 2 28 3.79086 28 6Z'
fill='url(#paint2_linear)'
/>
<path
d='M42 32C40.9391 32 39.9217 31.5786 39.1716 30.8284C38.4214 30.0783 38 29.0609 38 28C38 26.9391 38.4214 25.9217 39.1716 25.1716C39.9217 24.4214 40.9391 24 42 24C43.0609 24 44.0783 24.4214 44.8284 25.1716C45.5786 25.9217 46 26.9391 46 28C46 29.0609 45.5786 30.0783 44.8284 30.8284C44.0783 31.5786 43.0609 32 42 32ZM46 20H38C37.4696 20 36.9609 20.2107 36.5858 20.5858C36.2107 20.9609 36 21.4696 36 22V46C36 46.5304 36.2107 47.0391 36.5858 47.4142C36.9609 47.7893 37.4696 48 38 48H46C46.5304 48 47.0391 47.7893 47.4142 47.4142C47.7893 47.0391 48 46.5304 48 46V22C48 21.4696 47.7893 20.9609 47.4142 20.5858C47.0391 20.2107 46.5304 20 46 20Z'
fill='url(#paint3_linear)'
/>
<path d='M38 10H10V28H34V22C34 20 36 18 38 18V10Z' fill='url(#paint4_linear)' />
<g filter='url(#filter0_d)'>
<path
d='M6 10C6 7.79086 7.79086 6 10 6H38C40.2091 6 42 7.79086 42 10V18H38V12C38 10.8954 37.1046 10 36 10H12C10.8954 10 10 10.8954 10 12V26C10 27.1046 10.8954 28 12 28H34V32H10C7.79086 32 6 30.2091 6 28V10Z'
fill='url(#paint5_linear)'
/>
<path
d='M29.4142 14C29.7893 14 30.149 14.149 30.4142 14.4142L33.2929 17.2929C33.7456 17.7456 34 18.3597 34 19V19C34 19.6403 33.7456 20.2544 33.2929 20.7071L30.4142 23.5858C30.149 23.851 29.7893 24 29.4142 24V24C28.6332 24 28 23.3668 28 22.5858V15.4142C28 14.6332 28.6332 14 29.4142 14V14Z'
fill='url(#paint6_linear)'
/>
<path
d='M20 16C20 14.8954 20.8954 14 22 14V14C23.1046 14 24 14.8954 24 16V22C24 23.1046 23.1046 24 22 24V24C20.8954 24 20 23.1046 20 22V16Z'
fill='url(#paint7_linear)'
/>
<path
d='M14 16C14 14.8954 14.8954 14 16 14V14C17.1046 14 18 14.8954 18 16V22C18 23.1046 17.1046 24 16 24V24C14.8954 24 14 23.1046 14 22V16Z'
fill='url(#paint8_linear)'
/>
</g>
<g filter='url(#filter1_d)'>
<rect x='4' y='6' width='40' height='4' rx='2' fill='#5DE9AE' />
</g>
<defs>
<filter
id='filter0_d'
x='2'
y='3'
width='44'
height='34'
filterUnits='userSpaceOnUse'
color-interpolation-filters='sRGB'
>
<feFlood flood-opacity='0' result='BackgroundImageFix' />
<feColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' />
<feOffset dy='1' />
<feGaussianBlur stdDeviation='2' />
<feColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0' />
<feBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow' />
<feBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow' result='shape' />
</filter>
<filter
id='filter1_d'
x='0'
y='3'
width='48'
height='12'
filterUnits='userSpaceOnUse'
color-interpolation-filters='sRGB'
>
<feFlood flood-opacity='0' result='BackgroundImageFix' />
<feColorMatrix in='SourceAlpha' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0' />
<feOffset dy='1' />
<feGaussianBlur stdDeviation='2' />
<feColorMatrix type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0' />
<feBlend mode='normal' in2='BackgroundImageFix' result='effect1_dropShadow' />
<feBlend mode='normal' in='SourceGraphic' in2='effect1_dropShadow' result='shape' />
</filter>
<linearGradient id='paint0_linear' x1='24' y1='2' x2='24' y2='44' gradientUnits='userSpaceOnUse'>
<stop stop-color='#5DE9AE' />
<stop offset='1' stop-color='#4081E2' />
</linearGradient>
<linearGradient id='paint1_linear' x1='24' y1='2' x2='24' y2='44' gradientUnits='userSpaceOnUse'>
<stop stop-color='#5DE9AE' />
<stop offset='1' stop-color='#4081E2' />
</linearGradient>
<linearGradient id='paint2_linear' x1='24' y1='2' x2='24' y2='44' gradientUnits='userSpaceOnUse'>
<stop stop-color='#5DE9AE' />
<stop offset='1' stop-color='#4081E2' />
</linearGradient>
<linearGradient id='paint3_linear' x1='42' y1='20' x2='42' y2='48' gradientUnits='userSpaceOnUse'>
<stop stop-color='#8045FE' />
<stop offset='1' stop-color='#C482ED' />
</linearGradient>
<linearGradient id='paint4_linear' x1='24' y1='10' x2='24' y2='28' gradientUnits='userSpaceOnUse'>
<stop stop-color='#3E4299' />
<stop offset='1' stop-color='#020122' />
</linearGradient>
<linearGradient id='paint5_linear' x1='24' y1='6' x2='24' y2='32' gradientUnits='userSpaceOnUse'>
<stop stop-color='#6FE4E4' />
<stop offset='1' stop-color='#6268E6' />
</linearGradient>
<linearGradient id='paint6_linear' x1='24' y1='6' x2='24' y2='32' gradientUnits='userSpaceOnUse'>
<stop stop-color='#6FE4E4' />
<stop offset='1' stop-color='#6268E6' />
</linearGradient>
<linearGradient id='paint7_linear' x1='24' y1='6' x2='24' y2='32' gradientUnits='userSpaceOnUse'>
<stop stop-color='#6FE4E4' />
<stop offset='1' stop-color='#6268E6' />
</linearGradient>
<linearGradient id='paint8_linear' x1='24' y1='6' x2='24' y2='32' gradientUnits='userSpaceOnUse'>
<stop stop-color='#6FE4E4' />
<stop offset='1' stop-color='#6268E6' />
</linearGradient>
</defs>
</svg>;
}
export function SlideKeyframe(props: {
type: slideTypes;
ghost?: boolean;
loopEnd?: boolean;
}) {
return <div className={'keyframe dispinbl posrel' + (props.ghost ? ' ghost' : '')}>
<SlideKeyframeOutline type={props.type} loopEnd={props.loopEnd} />
<SlideKeyframeBackground type={props.type} loopEnd={props.loopEnd} />
</div>;
}
export function SlideKeyframeBackground(props: {
type: slideTypes;
loopEnd?: boolean;
}) {
return <svg
className='background'
width='24'
height='24'
viewBox='0 0 24 24'
xmlns='http://www.w3.org/2000/svg'
>
{{
'default': <path
d='M10.2929 19.2929L4.70711 13.7071C4.25435 13.2544 4 12.6403 4 12C4 11.3597 4.25435 10.7456 4.70711 10.2929L10.2929 4.70711C10.7456 4.25435 11.3597 4 12 4C12.6403 4 13.2544 4.25435 13.7071 4.70711L19.2929 10.2929C19.7456 10.7456 20 11.3597 20 12C20 12.6403 19.7456 13.2544 19.2929 13.7071L13.7071 19.2929C13.2544 19.7456 12.6403 20 12 20C11.3597 20 10.7456 19.7456 10.2929 19.2929Z'
/>,
'delay': <circle cx='12' cy='12' r='8' />,
'speedChange': <path
d='M4 18V6C4 4.89543 4.89543 4 6 4H18C19.1046 4 20 4.89543 20 6V18C20 19.1046 19.1046 20 18 20H6C4.89543 20 4 19.1046 4 18Z'
/>,
'loop': !props.loopEnd
? <path
d='M9 6C9 4.89543 9.89543 4 11 4H15C16.1046 4 17 4.89543 17 6C17 7.10457 16.1046 8 15 8H13V16H15C16.1046 16 17 16.8954 17 18C17 19.1046 16.1046 20 15 20H11C9.89543 20 9 19.1046 9 18V6Z'
/>
: <path
d='M15 18C15 19.1046 14.1046 20 13 20H9C7.89543 20 7 19.1046 7 18C7 16.8954 7.89543 16 9 16H11V8H9C7.89543 8 7 7.10457 7 6C7 4.89543 7.89543 4 9 4H13C14.1046 4 15 4.89543 15 6V18Z'
/>,
}[props.type]}
</svg>;
}
export function SlideKeyframeOutline(props: {
type: slideTypes;
loopEnd?: boolean;
}) {
return <svg
className='outline posabs l0 t0'
width='24'
height='24'
viewBox='0 0 24 24'
xmlns='http://www.w3.org/2000/svg'
>
{{
'default': <path
fill-rule='evenodd'
clip-rule='evenodd'
d='M5.41421 13L11 18.5858C11.2652 18.851 11.6249 19 12 19C12.3751 19 12.7348 18.851 13 18.5858L18.5858 13C18.851 12.7348 19 12.3751 19 12C19 11.6249 18.851 11.2652 18.5858 11L13 5.41421L13.7071 4.70711L19.2929 10.2929C19.7456 10.7456 20 11.3597 20 12C20 12.6403 19.7456 13.2544 19.2929 13.7071L13.7071 19.2929C13.2544 19.7456 12.6403 20 12 20C11.3597 20 10.7456 19.7456 10.2929 19.2929L4.70711 13.7071C4.25435 13.2544 4 12.6403 4 12C4 11.3597 4.25435 10.7456 4.70711 10.2929L10.2929 4.70711L11 5.41421L5.41421 11C5.149 11.2652 5 11.6249 5 12C5 12.3751 5.149 12.7348 5.41421 13ZM10.2929 4.70711L11 5.41421C11.2652 5.149 11.6249 5 12 5C12.3751 5 12.7348 5.149 13 5.41421L13.7071 4.70711C13.2544 4.25435 12.6403 4 12 4C11.3597 4 10.7456 4.25435 10.2929 4.70711Z'
/>,
'delay': <path
fill-rule='evenodd'
clip-rule='evenodd'
d='M12 19C15.866 19 19 15.866 19 12C19 8.13401 15.866 5 12 5C8.13401 5 5 8.13401 5 12C5 15.866 8.13401 19 12 19ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20Z'
/>,
'speedChange': <path
fill-rule='evenodd'
clip-rule='evenodd'
d='M5 6V18C5 18.5523 5.44772 19 6 19H18C18.5523 19 19 18.5523 19 18V6C19 5.44772 18.5523 5 18 5H6C5.44772 5 5 5.44772 5 6ZM4 6V18C4 19.1046 4.89543 20 6 20H18C19.1046 20 20 19.1046 20 18V6C20 4.89543 19.1046 4 18 4H6C4.89543 4 4 4.89543 4 6Z'
/>,
'loop': !props.loopEnd
? <path
fill-rule='evenodd'
clip-rule='evenodd'
d='M12 7H15C15.5523 7 16 6.55228 16 6C16 5.44772 15.5523 5 15 5H11C10.4477 5 10 5.44772 10 6V18C10 18.5523 10.4477 19 11 19H15C15.5523 19 16 18.5523 16 18C16 17.4477 15.5523 17 15 17H12V7ZM11 4C9.89543 4 9 4.89543 9 6V18C9 19.1046 9.89543 20 11 20H15C16.1046 20 17 19.1046 17 18C17 16.8954 16.1046 16 15 16H13V8H15C16.1046 8 17 7.10457 17 6C17 4.89543 16.1046 4 15 4H11Z'
/>
: <path
fill-rule='evenodd'
clip-rule='evenodd'
d='M12 17H9C8.44772 17 8 17.4477 8 18C8 18.5523 8.44772 19 9 19H13C13.5523 19 14 18.5523 14 18V6C14 5.44772 13.5523 5 13 5H9C8.44772 5 8 5.44772 8 6C8 6.55228 8.44772 7 9 7H12V17ZM13 20C14.1046 20 15 19.1046 15 18V6C15 4.89543 14.1046 4 13 4H9C7.89543 4 7 4.89543 7 6C7 7.10457 7.89543 8 9 8H11V16H9C7.89543 16 7 16.8954 7 18C7 19.1046 7.89543 20 9 20H13Z'
/>,
}[props.type]}
</svg>;
}
export function FullScreenControlsRoundedIcon() {
return <svg width='24' height='24' viewBox='0 0 24 24' fill='currentColor' xmlns='http://www.w3.org/2000/svg'>
<path
d='M2 7C2 6.44772 2.44772 6 3 6H8C8.55228 6 9 6.44772 9 7V17C9 17.5523 8.55228 18 8 18H3C2.44772 18 2 17.5523 2 17V7Z'
/>
<path
d='M10 7C10 6.44772 10.4477 6 11 6H13C13.5523 6 14 6.44772 14 7V17C14 17.5523 13.5523 18 13 18H11C10.4477 18 10 17.5523 10 17V7Z'
/>
<path
d='M15 7C15 6.44772 15.4477 6 16 6H21C21.5523 6 22 6.44772 22 7V17C22 17.5523 21.5523 18 21 18H16C15.4477 18 15 17.5523 15 17V7Z'
/>
</svg>;
}
export function MenuBarControlsRoundedIcon() {
return <svg width='24' height='24' viewBox='0 0 24 24' fill='currentColor' xmlns='http://www.w3.org/2000/svg'>
<path
fillRule='evenodd'
clipRule='evenodd'
d='M2 17V7C2 6.44772 2.44772 6 3 6H21C21.5523 6 22 6.44772 22 7V17C22 17.5523 21.5523 18 21 18H3C2.44772 18 2 17.5523 2 17ZM8 15C7.44772 15 7 15.4477 7 16C7 16.5523 7.44772 17 8 17H16C16.5523 17 17 16.5523 17 16C17 15.4477 16.5523 15 16 15H8Z'
/>
</svg>;
}
export function QRCodeRoundedIcon() {
return <svg width='24' height='24' viewBox='0 0 24 24' fill='currentColor' xmlns='http://www.w3.org/2000/svg'>
<path
d='M3 9C3 10.1046 3.89543 11 5 11H9C10.1046 11 11 10.1046 11 9V5C11 3.89543 10.1046 3 9 3H5C3.89543 3 3 3.89543 3 5V9ZM5 5H9V9H5V5Z'
/>
<path
d='M3 19C3 20.1046 3.89543 21 5 21H9C10.1046 21 11 20.1046 11 19V15C11 13.8954 10.1046 13 9 13H5C3.89543 13 3 13.8954 3 15V19ZM5 15H9V19H5V15Z'
/>
<path
d='M15 3C13.8954 3 13 3.89543 13 5V9C13 10.1046 13.8954 11 15 11H19C20.1046 11 21 10.1046 21 9V5C21 3.89543 20.1046 3 19 3H15ZM19 9H15V5H19V9Z'
/>
<path d='M21 19H19V21H21V19Z' />
<path d='M15 13H13V15H15V13Z' />
<path d='M17 15H15V17H17V15Z' />
<path d='M15 17H13V19H15V17Z' />
<path d='M17 19H15V21H17V19Z' />
<path d='M19 17H17V19H19V17Z' />
<path d='M19 13H17V15H19V13Z' />
<path d='M21 15H19V17H21V15Z' />
</svg>;
}
export function LoginRoundedIcon() {
return <svg width='24' height='24' viewBox='0 0 24 24' fill='currentColor' xmlns='http://www.w3.org/2000/svg'>
<path
d='M11.7 7.7C11.3134 7.3134 10.6866 7.3134 10.3 7.7V7.7C9.9134 8.0866 9.9134 8.7134 10.3 9.1L12.2 11H3C2.44771 11 2 11.4477 2 12V12C2 12.5523 2.44772 13 3 13H12.2L10.3 14.9C9.9134 15.2866 9.9134 15.9134 10.3 16.3V16.3C10.6866 16.6866 11.3134 16.6866 11.7 16.3L15.2929 12.7071C15.6834 12.3166 15.6834 11.6834 15.2929 11.2929L11.7 7.7ZM20 19H13C12.4477 19 12 19.4477 12 20V20C12 20.5523 12.4477 21 13 21H20C21.1 21 22 20.1 22 19V5C22 3.9 21.1 3 20 3H13C12.4477 3 12 3.44772 12 4V4C12 4.55228 12.4477 5 13 5H20V19Z'
/>
</svg>;
}
export function BracketsRoundedIcon() {
return <svg width='24' height='24' viewBox='0 0 24 24' fill='currentColor' xmlns='http://www.w3.org/2000/svg'>
<path
fill-rule='evenodd'
clip-rule='evenodd'
d='M8.5 6C8.10218 6 7.72064 6.15804 7.43934 6.43934C7.15804 6.72064 7 7.10217 7 7.5V9.5C7 9.95963 6.90947 10.4148 6.73358 10.8394C6.55769 11.264 6.29988 11.6499 5.97487 11.9749C5.96645 11.9833 5.95799 11.9917 5.94949 12C5.95799 12.0083 5.96645 12.0167 5.97487 12.0251C6.29988 12.3501 6.55769 12.736 6.73358 13.1606C6.90947 13.5852 7 14.0404 7 14.5V16.5C7 16.8978 7.15804 17.2794 7.43934 17.5607C7.72064 17.842 8.10218 18 8.5 18H9C9.55228 18 10 18.4477 10 19C10 19.5523 9.55228 20 9 20H8.5C7.57174 20 6.6815 19.6313 6.02513 18.9749C5.36875 18.3185 5 17.4283 5 16.5V14.5C5 14.303 4.9612 14.108 4.88582 13.926C4.81044 13.744 4.69995 13.5786 4.56066 13.4393C4.42137 13.3001 4.25601 13.1896 4.07403 13.1142C3.89204 13.0388 3.69698 13 3.5 13H3C2.44772 13 2 12.5523 2 12C2 11.4477 2.44772 11 3 11H3.5C3.69698 11 3.89204 10.9612 4.07403 10.8858C4.25601 10.8104 4.42137 10.6999 4.56066 10.5607C4.69995 10.4214 4.81044 10.256 4.88582 10.074C4.9612 9.89204 5 9.69698 5 9.5V7.5C5 6.57174 5.36875 5.6815 6.02513 5.02513C6.6815 4.36875 7.57174 4 8.5 4H9C9.55228 4 10 4.44772 10 5C10 5.55228 9.55228 6 9 6H8.5Z'
/>
<path
fill-rule='evenodd'
clip-rule='evenodd'
d='M15.5 6C15.8978 6 16.2794 6.15804 16.5607 6.43934C16.842 6.72064 17 7.10217 17 7.5V9.5C17 9.95963 17.0905 10.4148 17.2664 10.8394C17.4423 11.264 17.7001 11.6499 18.0251 11.9749C18.0335 11.9833 18.042 11.9917 18.0505 12C18.042 12.0083 18.0335 12.0167 18.0251 12.0251C17.7001 12.3501 17.4423 12.736 17.2664 13.1606C17.0905 13.5852 17 14.0404 17 14.5V16.5C17 16.8978 16.842 17.2794 16.5607 17.5607C16.2794 17.842 15.8978 18 15.5 18H15C14.4477 18 14 18.4477 14 19C14 19.5523 14.4477 20 15 20H15.5C16.4283 20 17.3185 19.6313 17.9749 18.9749C18.6313 18.3185 19 17.4283 19 16.5V14.5C19 14.303 19.0388 14.108 19.1142 13.926C19.1896 13.744 19.3001 13.5786 19.4393 13.4393C19.5786 13.3001 19.744 13.1896 19.926 13.1142C20.108 13.0388 20.303 13 20.5 13H21C21.5523 13 22 12.5523 22 12C22 11.4477 21.5523 11 21 11H20.5C20.303 11 20.108 10.9612 19.926 10.8858C19.744 10.8104 19.5786 10.6999 19.4393 10.5607C19.3001 10.4214 19.1896 10.256 19.1142 10.074C19.0388 9.89204 19 9.69698 19 9.5V7.5C19 6.57174 18.6313 5.6815 17.9749 5.02513C17.3185 4.36875 16.4283 4 15.5 4H15C14.4477 4 14 4.44772 14 5C14 5.55228 14.4477 6 15 6H15.5Z'
/>
</svg>;
}
export function SlashRoundedIcon() {
return <svg width='24' height='24' viewBox='0 0 24 24' fill='currentColor' xmlns='http://www.w3.org/2000/svg'>
<path
fill-rule='evenodd'
clip-rule='evenodd'
d='M9.31623 20C8.6687 20 8.21146 19.3656 8.41623 18.7513L13.7838 2.64868C13.9129 2.2613 14.2754 2 14.6838 2C15.3313 2 15.7885 2.63438 15.5838 3.24868L10.2162 19.3513C10.0871 19.7387 9.72457 20 9.31623 20Z'
/>
</svg>;
}
export function UploadRoundedIcon() {
return <svg width='24' height='24' viewBox='0 0 24 24' fill='currentColor' xmlns='http://www.w3.org/2000/svg'>
<path
d='M6.70711 8.29289L11.2929 3.70711C11.6834 3.31658 12.3166 3.31658 12.7071 3.70711L17.2929 8.29289C17.9229 8.92286 17.4767 10 16.5858 10H7.41421C6.52331 10 6.07714 8.92286 6.70711 8.29289Z'
/>
<path d='M9 10H15V15C15 15.5523 14.5523 16 14 16H10C9.44772 16 9 15.5523 9 15V10Z' />
<rect x='5' y='18' width='14' height='2' rx='1' />
</svg>;
}
|