1 | {
|
2 | "name": "hatch-lab",
|
3 | "library": "styled-components",
|
4 | "components": [
|
5 | {
|
6 | "name": "Card",
|
7 | "imports": [
|
8 | "Panel",
|
9 | "Div",
|
10 | "Img",
|
11 | "Badge",
|
12 | "Heading",
|
13 | "Subheading",
|
14 | "BadgePrimary",
|
15 | "BadgeDanger",
|
16 | "BadgeInfo"
|
17 | ],
|
18 | "jsx": "<Panel px={0} py={0} style={{overflow: 'hidden'}} {...props}>\n <Div mb={3} style={{\n position: 'relative',\n paddingBottom: \"33%\",\n height: '0',\n background: `url(${props.imgSrc ? props.imgSrc : \"https://openclipart.org/download/263304/Checkered.svg\"})\ncenter`,\n backgroundSize: 'cover',\n boxShadow: 'inset 0rem -1rem 8rem 0rem #232323'\n }}>\n <Div style={{position: 'absolute', bottom: '1rem', left: '1rem'}}>\n {props.badges.map((badge, index) => {\n switch(badge.style) {\n case 'primary':\n return <BadgePrimary key={`primary-${index}`} mr={2}>{badge.text}</BadgePrimary>\n case 'danger':\n return <BadgeDanger key={`danger-${index}`} mr={2}>{badge.text}</BadgeDanger>\n case 'info':\n return <BadgeInfo key={`info-${index}`} mr={2}>{badge.text}</BadgeInfo>\n default:\n return <Badge key={`default-${index}`} mr={2}>{badge.text}</Badge>\n }\n })}\n </Div>\n </Div>\n <Div p={3}>\n <Heading mb={2}>{props.heading}</Heading>\n <Subheading color=\"grayDark\" mb={3}>{props.subheading}</Subheading>\n {props.children}\n </Div>\n</Panel>",
|
19 | "examples": [
|
20 | "<Card\n heading=\"Go Go Gadget Coffee!\"\n subheading=\"Buy a coffee within 7 days of activation and earn 125 points!\"\n badges={[\n {text: 'Normal'},\n {text: 'haha', style:'primary'},\n {text: 'haha', style:'danger'},\n {text: 'haha', style:'info'}\n ]}\n imgSrc=\"https://images.unsplash.com/photo-1487020678349-eda85ffade88?ixlib=rb-0.3.5&ixid=eyJhcHBfaWQiOjEyMDd9&s=d33583721b22a64733793606d1e734cc&auto=format&fit=crop&w=1500&q=80\"\n >\n</Card>"
|
21 | ],
|
22 | "system": []
|
23 | },
|
24 | {
|
25 | "name": "Button",
|
26 | "type": "button",
|
27 | "props": {
|
28 | "fontSize": 1,
|
29 | "px": 3,
|
30 | "py": 2,
|
31 | "color": "black",
|
32 | "bg": "grayLight",
|
33 | "borderRadius": 3,
|
34 | "borderColor": "grayLight",
|
35 | "borderWidth": 2,
|
36 | "fontWeight": "600"
|
37 | },
|
38 | "style": {
|
39 | "cursor": "pointer"
|
40 | },
|
41 | "examples": [
|
42 | "<Button>Confirm</Button>",
|
43 | "<Button>Save</Button>",
|
44 | "<Button>Hello</Button>"
|
45 | ],
|
46 | "system": [
|
47 | "borderRadius",
|
48 | "borderColor",
|
49 | "borderWidth",
|
50 | "fontWeight"
|
51 | ]
|
52 | },
|
53 | {
|
54 | "name": "ButtonPrimary",
|
55 | "type": "Button",
|
56 | "props": {
|
57 | "color": "white",
|
58 | "bg": "green",
|
59 | "borderColor": "green",
|
60 | "borderWidth": 2
|
61 | },
|
62 | "style": {},
|
63 | "examples": [
|
64 | "<ButtonPrimary>\n Hello\n</ButtonPrimary>"
|
65 | ],
|
66 | "system": [
|
67 | "borderColor",
|
68 | "borderWidth"
|
69 | ]
|
70 | },
|
71 | {
|
72 | "name": "ButtonDanger",
|
73 | "type": "Button",
|
74 | "props": {
|
75 | "color": "white",
|
76 | "bg": "red",
|
77 | "borderColor": "red",
|
78 | "borderWidth": 2
|
79 | },
|
80 | "style": {},
|
81 | "examples": [
|
82 | "<ButtonDanger>Danger</ButtonDanger>"
|
83 | ],
|
84 | "system": [
|
85 | "borderColor",
|
86 | "borderWidth"
|
87 | ]
|
88 | },
|
89 | {
|
90 | "name": "ButtonOutline",
|
91 | "type": "button",
|
92 | "props": {
|
93 | "fontSize": 1,
|
94 | "px": 3,
|
95 | "py": 2,
|
96 | "bg": "transparent",
|
97 | "borderWidth": 2,
|
98 | "borderColor": "black",
|
99 | "borderRadius": 4,
|
100 | "fontWeight": "600"
|
101 | },
|
102 | "style": {
|
103 | "cursor": "pointer"
|
104 | },
|
105 | "examples": [
|
106 | "<ButtonOutline>Hello</ButtonOutline>"
|
107 | ],
|
108 | "system": [
|
109 | "borderWidth",
|
110 | "borderColor",
|
111 | "borderRadius",
|
112 | "fontWeight"
|
113 | ]
|
114 | },
|
115 | {
|
116 | "name": "Link",
|
117 | "type": "a",
|
118 | "props": {
|
119 | "color": "blue",
|
120 | "hover": {
|
121 | "color": "#2d5d95"
|
122 | }
|
123 | },
|
124 | "style": {
|
125 | "textAlign": "${props.center? 'center': 'left'}",
|
126 | "textDecoration": "${props.underline? 'underline': 'none'}",
|
127 | "opacity": 1,
|
128 | "transition": "all .25s ease",
|
129 | "display": "inline-block",
|
130 | "cursor": "pointer",
|
131 | "color": "${props.disabled? 'gray' : '${props.color}'}"
|
132 | },
|
133 | "examples": [
|
134 | "<Link href=\"https://compositor.io\"mr={2}>Read our docs</Link>",
|
135 | "<Link underline href=\"https://compositor.io/lab/docs\">Read our docs</Link>"
|
136 | ],
|
137 | "system": [
|
138 | "hover",
|
139 | "borderWidth",
|
140 | "borderColor"
|
141 | ]
|
142 | },
|
143 | {
|
144 | "name": "Img",
|
145 | "type": "img",
|
146 | "props": {},
|
147 | "style": {
|
148 | "display": "block",
|
149 | "maxWidth": "100%",
|
150 | "width": "100%"
|
151 | },
|
152 | "examples": [
|
153 | "<Img src='https://mrmrs.github.io/photos/u/001.jpg' mb={2} />",
|
154 | "<Img src='https://mrmrs.github.io/photos/u/002.jpg' mb={2} />",
|
155 | "<Img src='https://mrmrs.github.io/photos/u/007.jpg' mb={2} />",
|
156 | "<Img src='https://mrmrs.github.io/photos/u/004.jpg' mb={2} />"
|
157 | ],
|
158 | "system": []
|
159 | },
|
160 | {
|
161 | "name": "Hr",
|
162 | "type": "hr",
|
163 | "props": {
|
164 | "bg": "transparent",
|
165 | "color": "offWhite",
|
166 | "pl": 0,
|
167 | "pr": 0,
|
168 | "pb": 0,
|
169 | "borderRadius": 0,
|
170 | "borderWidth": 1,
|
171 | "borderTop": true
|
172 | },
|
173 | "style": {
|
174 | "height": 0
|
175 | },
|
176 | "examples": [
|
177 | "<Hr />"
|
178 | ],
|
179 | "system": [
|
180 | "borderRadius",
|
181 | "borderWidth"
|
182 | ]
|
183 | },
|
184 | {
|
185 | "name": "Heading",
|
186 | "type": "h2",
|
187 | "props": {
|
188 | "fontSize": 3,
|
189 | "m": 0,
|
190 | "fontWeight": "600"
|
191 | },
|
192 | "style": {},
|
193 | "examples": [
|
194 | "<Heading>Hello</Heading>"
|
195 | ],
|
196 | "system": [
|
197 | "fontWeight",
|
198 | "borderColor",
|
199 | "borderWidth"
|
200 | ]
|
201 | },
|
202 | {
|
203 | "name": "Subheading",
|
204 | "type": "h3",
|
205 | "props": {
|
206 | "fontSize": 2,
|
207 | "m": 0,
|
208 | "fontWeight": "normal"
|
209 | },
|
210 | "style": {
|
211 | "lineHeight": "1.2"
|
212 | },
|
213 | "examples": [
|
214 | "<Subheading>Hello</Subheading>"
|
215 | ],
|
216 | "system": [
|
217 | "fontWeight"
|
218 | ]
|
219 | },
|
220 | {
|
221 | "name": "P",
|
222 | "type": "p",
|
223 | "props": {},
|
224 | "style": {
|
225 | "maxWidth": "${props.wide? '34em': '28em'}",
|
226 | "lineHeight": "1.5"
|
227 | },
|
228 | "examples": [
|
229 | "<P>\rIMMACULATE typography is certainly the most brittle of all the arts. To create a whole from many petrified, dis- connected and given parts, to make this whole appear alive and of a piece — only sculpture in stone approaches the unyielding stiffness of perfect typography. For most people, even impeccable typography does not hold any particular aesthetic appeal. In its inaccessibility, it resembles great\rmusic. Under the best of circumstances, it is gratefully , accepted. To remain nameless and without specific appre- ciation, yet to have been of service to a valuable work and to the small number of visually sensitive readers — this, as a rule, is the only compensation for the long, and indeed never- ending, indenture of the typographer.</P>",
|
230 | "<P>\rA very short example of a paragraph.</P>"
|
231 | ],
|
232 | "system": []
|
233 | },
|
234 | {
|
235 | "name": "H1",
|
236 | "type": "h1",
|
237 | "props": {
|
238 | "fontWeight": "600",
|
239 | "fontSize": null
|
240 | },
|
241 | "style": {
|
242 | "textAlign": "${props.center? 'center': 'left'}"
|
243 | },
|
244 | "examples": [
|
245 | "<H1>Heading Number 1</H1>",
|
246 | "<H1 center>Heading Number 1</H1>"
|
247 | ],
|
248 | "system": [
|
249 | "fontWeight"
|
250 | ]
|
251 | },
|
252 | {
|
253 | "name": "H2",
|
254 | "type": "h2",
|
255 | "props": {
|
256 | "fontWeight": "600"
|
257 | },
|
258 | "style": {
|
259 | "textAlign": "${props.center? 'center': 'left'}"
|
260 | },
|
261 | "examples": [
|
262 | "<H2>Heading Number 2</H2>",
|
263 | "<H2 center>Centered Heading Number 2</H2>"
|
264 | ],
|
265 | "system": [
|
266 | "fontWeight"
|
267 | ]
|
268 | },
|
269 | {
|
270 | "name": "H3",
|
271 | "type": "h3",
|
272 | "props": {
|
273 | "fontWeight": "600"
|
274 | },
|
275 | "style": {
|
276 | "textAlign": "${props.center? 'center': 'left'}"
|
277 | },
|
278 | "examples": [
|
279 | "<H3>Heading Number 3</H3>"
|
280 | ],
|
281 | "system": [
|
282 | "fontWeight"
|
283 | ]
|
284 | },
|
285 | {
|
286 | "name": "H4",
|
287 | "type": "h4",
|
288 | "props": {
|
289 | "fontWeight": "600"
|
290 | },
|
291 | "style": {
|
292 | "textAlign": "${props.center? 'center': 'left'}"
|
293 | },
|
294 | "examples": [
|
295 | "<H4>Heading Number 4</H4>"
|
296 | ],
|
297 | "system": [
|
298 | "fontWeight"
|
299 | ]
|
300 | },
|
301 | {
|
302 | "name": "Th",
|
303 | "type": "th",
|
304 | "props": {
|
305 | "fontSize": 0,
|
306 | "fontWeight": "600",
|
307 | "color": "grayDark",
|
308 | "pb": 3
|
309 | },
|
310 | "style": {
|
311 | "webkitTextTransform": "uppercase",
|
312 | "textTransform": "uppercase",
|
313 | "letterSpacing": "0.1rem",
|
314 | "whiteSpace": "nowrap",
|
315 | "overflow": "hidden",
|
316 | "webkitTextOverflow": "ellipsis",
|
317 | "textOverflow": "ellipsis",
|
318 | "webkitTextAlign": "left",
|
319 | "textAlign": "left"
|
320 | },
|
321 | "examples": [
|
322 | "<Th>Hello</Th>"
|
323 | ],
|
324 | "system": [
|
325 | "fontWeight"
|
326 | ]
|
327 | },
|
328 | {
|
329 | "name": "Div",
|
330 | "type": "div",
|
331 | "props": {},
|
332 | "style": {},
|
333 | "examples": [
|
334 | "<Div>A generic div component that now has the super powers of styled-system.</Div>",
|
335 | "<Div bg='black' color='white' p={5}>A generic div component that now has the super powers of styled-system.</Div>",
|
336 | "<Div bg='gray1' color='gray6' p={6} fontSize={4}>A generic div component that now has the super powers of styled-system.</Div>"
|
337 | ],
|
338 | "system": [
|
339 | "borderWidth",
|
340 | "borderColor"
|
341 | ]
|
342 | },
|
343 | {
|
344 | "name": "Container",
|
345 | "type": "main",
|
346 | "props": {
|
347 | "mx": "auto"
|
348 | },
|
349 | "style": {
|
350 | "maxWidth": "75rem",
|
351 | "boxSizing": "border-box"
|
352 | },
|
353 | "examples": [
|
354 | "<Container>A container for centering your page content. </Container>"
|
355 | ],
|
356 | "system": []
|
357 | },
|
358 | {
|
359 | "name": "Label",
|
360 | "type": "label",
|
361 | "props": {
|
362 | "fontSize": 0,
|
363 | "fontWeight": "600",
|
364 | "color": "grayDark"
|
365 | },
|
366 | "style": {
|
367 | "textTransform": "uppercase",
|
368 | "letterSpacing": "0.1em"
|
369 | },
|
370 | "examples": [
|
371 | "<Label>Hello</Label>"
|
372 | ],
|
373 | "system": [
|
374 | "fontWeight"
|
375 | ]
|
376 | },
|
377 | {
|
378 | "name": "Input",
|
379 | "type": "input",
|
380 | "props": {
|
381 | "m": 0,
|
382 | "w": 1,
|
383 | "px": 2,
|
384 | "py": 2,
|
385 | "color": "inherit",
|
386 | "bg": "transparent",
|
387 | "borderColor": "gray",
|
388 | "borderWidth": 1,
|
389 | "focus": {
|
390 | "outline": "0px"
|
391 | },
|
392 | "borderRadius": 3
|
393 | },
|
394 | "style": {
|
395 | "display": "block",
|
396 | "fontFamily": "inherit",
|
397 | "fontSize": "inherit"
|
398 | },
|
399 | "examples": [
|
400 | "<Input />"
|
401 | ],
|
402 | "system": [
|
403 | "borderColor",
|
404 | "borderWidth",
|
405 | "focus",
|
406 | "borderRadius"
|
407 | ]
|
408 | },
|
409 | {
|
410 | "name": "TextInput",
|
411 | "imports": [
|
412 | "Label",
|
413 | "Div",
|
414 | "Input",
|
415 | "P"
|
416 | ],
|
417 | "jsx": "<Div {...props}>\n <Label mb={1} children={props.label} />\n {props.text &&\n <P mt={0} mb={2} fontSize={0} color='gray5' wide>\n {props.text}\n </P>\n }\n <Input \n type='text' \n value={props.value} />\n</Div>",
|
418 | "examples": [
|
419 | "<TextInput mb={3} label=\"First Name\" />",
|
420 | "<TextInput mb={3} label=\"Last Name\" />",
|
421 | "<TextInput mb={3} label=\"Address\" text=\"Must be a valid shipping address\"/>"
|
422 | ],
|
423 | "system": []
|
424 | },
|
425 | {
|
426 | "name": "Ul",
|
427 | "type": "ul",
|
428 | "props": {
|
429 | "m": 0,
|
430 | "p": 0,
|
431 | "borderColor": "transparent",
|
432 | "borderWidth": 1
|
433 | },
|
434 | "style": {
|
435 | "listStyleType": "none"
|
436 | },
|
437 | "examples": [
|
438 | "<Ul>\n <li>hi</li>\n <li>there</li>\n</Ul>"
|
439 | ],
|
440 | "system": [
|
441 | "borderColor",
|
442 | "borderWidth"
|
443 | ]
|
444 | },
|
445 | {
|
446 | "name": "Li",
|
447 | "type": "li",
|
448 | "props": {
|
449 | "borderWidth": 1,
|
450 | "borderColor": "transparent"
|
451 | },
|
452 | "style": {},
|
453 | "examples": [
|
454 | "<Li>Hello</Li>"
|
455 | ],
|
456 | "system": [
|
457 | "borderWidth",
|
458 | "borderColor"
|
459 | ]
|
460 | },
|
461 | {
|
462 | "name": "Panel",
|
463 | "type": "div",
|
464 | "props": {
|
465 | "bg": "white",
|
466 | "borderColor": "grayLight",
|
467 | "borderWidth": 1,
|
468 | "borderRadius": 3,
|
469 | "px": 3,
|
470 | "py": 3
|
471 | },
|
472 | "style": {
|
473 | "boxShadow": "0 2px 4px 0 rgba(153,153,153,0.50)"
|
474 | },
|
475 | "examples": [
|
476 | "<Panel>Hello</Panel>"
|
477 | ],
|
478 | "system": [
|
479 | "borderColor",
|
480 | "borderWidth",
|
481 | "borderRadius"
|
482 | ]
|
483 | },
|
484 | {
|
485 | "name": "Text",
|
486 | "type": "span",
|
487 | "props": {},
|
488 | "style": {},
|
489 | "examples": [
|
490 | "<Text>Hello</Text>"
|
491 | ],
|
492 | "system": [
|
493 | "fontWeight"
|
494 | ]
|
495 | },
|
496 | {
|
497 | "name": "Badge",
|
498 | "type": "label",
|
499 | "props": {
|
500 | "fontSize": 0,
|
501 | "fontWeight": "600",
|
502 | "py": 1,
|
503 | "bg": "grayLight",
|
504 | "borderRadius": 3,
|
505 | "color": "black",
|
506 | "px": 2
|
507 | },
|
508 | "style": {},
|
509 | "examples": [
|
510 | "<Badge>Normal</Badge>"
|
511 | ],
|
512 | "system": [
|
513 | "fontWeight",
|
514 | "borderRadius"
|
515 | ]
|
516 | },
|
517 | {
|
518 | "name": "BadgePrimary",
|
519 | "type": "Badge",
|
520 | "props": {
|
521 | "bg": "green",
|
522 | "color": "white"
|
523 | },
|
524 | "style": {},
|
525 | "examples": [
|
526 | "<BadgePrimary>\n Hello Primary\n</BadgePrimary>"
|
527 | ],
|
528 | "system": []
|
529 | },
|
530 | {
|
531 | "name": "BadgeDanger",
|
532 | "type": "Badge",
|
533 | "props": {
|
534 | "bg": "red",
|
535 | "color": "white"
|
536 | },
|
537 | "style": {},
|
538 | "examples": [
|
539 | "<BadgeDanger>\n Hello Danger\n</BadgeDanger>"
|
540 | ],
|
541 | "system": []
|
542 | },
|
543 | {
|
544 | "name": "BadgeInfo",
|
545 | "type": "Badge",
|
546 | "props": {
|
547 | "bg": "blue",
|
548 | "color": "white"
|
549 | },
|
550 | "style": {},
|
551 | "examples": [
|
552 | "<BadgeInfo>\n Hello Info\n</BadgeInfo>"
|
553 | ],
|
554 | "system": []
|
555 | },
|
556 | {
|
557 | "name": "Table",
|
558 | "type": "table",
|
559 | "props": {
|
560 | "w": 1
|
561 | },
|
562 | "style": {
|
563 | "tableLayout": "fixed",
|
564 | "borderCollapse": "collapse"
|
565 | },
|
566 | "examples": [
|
567 | "<Table />"
|
568 | ],
|
569 | "system": []
|
570 | },
|
571 | {
|
572 | "name": "Tr",
|
573 | "type": "tr",
|
574 | "props": {
|
575 | "borderWidth": 1,
|
576 | "borderColor": "grayLight",
|
577 | "borderTop": true,
|
578 | "hover": {
|
579 | "backgroundColor": "offWhite"
|
580 | }
|
581 | },
|
582 | "style": {
|
583 | "cursor": "pointer"
|
584 | },
|
585 | "examples": [
|
586 | "<Tr>Hello</Tr>"
|
587 | ],
|
588 | "system": [
|
589 | "borderWidth",
|
590 | "borderColor",
|
591 | "hover",
|
592 | "active",
|
593 | "focus"
|
594 | ]
|
595 | },
|
596 | {
|
597 | "name": "Td",
|
598 | "type": "td",
|
599 | "props": {
|
600 | "pr": 2,
|
601 | "py": 3
|
602 | },
|
603 | "style": {
|
604 | "whiteSpace": "nowrap",
|
605 | "overflow": "hidden",
|
606 | "webkitTextOverflow": "ellipsis",
|
607 | "textOverflow": "ellipsis"
|
608 | },
|
609 | "examples": [
|
610 | "<Td>Hello</Td>"
|
611 | ],
|
612 | "system": [
|
613 | "borderWidth",
|
614 | "borderColor"
|
615 | ]
|
616 | },
|
617 | {
|
618 | "name": "TBody",
|
619 | "type": "tbody",
|
620 | "props": {},
|
621 | "style": {},
|
622 | "examples": [
|
623 | "<TBody>Hello</TBody>"
|
624 | ],
|
625 | "system": []
|
626 | },
|
627 | {
|
628 | "name": "THeadRow",
|
629 | "type": "Tr",
|
630 | "props": {
|
631 | "hover": {
|
632 | "backgroundColor": "transparent"
|
633 | },
|
634 | "borderWidth": 0
|
635 | },
|
636 | "style": {
|
637 | "cursor": "initial"
|
638 | },
|
639 | "examples": [
|
640 | "<THeadRow />"
|
641 | ],
|
642 | "system": [
|
643 | "hover",
|
644 | "borderWidth"
|
645 | ]
|
646 | }
|
647 | ],
|
648 | "layout": [
|
649 | {
|
650 | "name": "Label",
|
651 | "i": "0",
|
652 | "w": 3,
|
653 | "h": 4,
|
654 | "x": 0,
|
655 | "y": 20,
|
656 | "moved": false,
|
657 | "static": false
|
658 | },
|
659 | {
|
660 | "name": "Avatar",
|
661 | "i": "1",
|
662 | "w": 3,
|
663 | "h": 4,
|
664 | "x": 3,
|
665 | "y": 36,
|
666 | "moved": false,
|
667 | "static": false
|
668 | },
|
669 | {
|
670 | "name": "Button",
|
671 | "i": "2",
|
672 | "w": 3,
|
673 | "h": 4,
|
674 | "x": 6,
|
675 | "y": 8,
|
676 | "moved": false,
|
677 | "static": false
|
678 | },
|
679 | {
|
680 | "name": "ButtonOutline",
|
681 | "i": "3",
|
682 | "w": 3,
|
683 | "h": 4,
|
684 | "x": 9,
|
685 | "y": 8,
|
686 | "moved": false,
|
687 | "static": false
|
688 | },
|
689 | {
|
690 | "name": "Link",
|
691 | "i": "4",
|
692 | "w": 3,
|
693 | "h": 4,
|
694 | "x": 3,
|
695 | "y": 28,
|
696 | "moved": false,
|
697 | "static": false
|
698 | },
|
699 | {
|
700 | "name": "LinkBox",
|
701 | "i": "5",
|
702 | "w": 3,
|
703 | "h": 4,
|
704 | "x": 3,
|
705 | "y": 32,
|
706 | "moved": false,
|
707 | "static": false
|
708 | },
|
709 | {
|
710 | "name": "Img",
|
711 | "i": "6",
|
712 | "w": 3,
|
713 | "h": 4,
|
714 | "x": 9,
|
715 | "y": 24,
|
716 | "moved": false,
|
717 | "static": false
|
718 | },
|
719 | {
|
720 | "name": "Hr",
|
721 | "i": "7",
|
722 | "w": 3,
|
723 | "h": 4,
|
724 | "x": 9,
|
725 | "y": 0,
|
726 | "moved": false,
|
727 | "static": false
|
728 | },
|
729 | {
|
730 | "name": "Text",
|
731 | "i": "8",
|
732 | "w": 3,
|
733 | "h": 4,
|
734 | "x": 9,
|
735 | "y": 28,
|
736 | "moved": false,
|
737 | "static": false
|
738 | },
|
739 | {
|
740 | "name": "Heading",
|
741 | "i": "9",
|
742 | "w": 3,
|
743 | "h": 4,
|
744 | "x": 3,
|
745 | "y": 24,
|
746 | "moved": false,
|
747 | "static": false
|
748 | },
|
749 | {
|
750 | "name": "P",
|
751 | "i": "10",
|
752 | "w": 3,
|
753 | "h": 4,
|
754 | "x": 6,
|
755 | "y": 0,
|
756 | "moved": false,
|
757 | "static": false
|
758 | },
|
759 | {
|
760 | "name": "H1",
|
761 | "i": "11",
|
762 | "w": 3,
|
763 | "h": 4,
|
764 | "x": 6,
|
765 | "y": 20,
|
766 | "moved": false,
|
767 | "static": false
|
768 | },
|
769 | {
|
770 | "name": "H2",
|
771 | "i": "12",
|
772 | "w": 3,
|
773 | "h": 4,
|
774 | "x": 9,
|
775 | "y": 20,
|
776 | "moved": false,
|
777 | "static": false
|
778 | },
|
779 | {
|
780 | "name": "H3",
|
781 | "i": "13",
|
782 | "w": 3,
|
783 | "h": 4,
|
784 | "x": 3,
|
785 | "y": 16,
|
786 | "moved": false,
|
787 | "static": false
|
788 | },
|
789 | {
|
790 | "name": "H4",
|
791 | "i": "14",
|
792 | "w": 3,
|
793 | "h": 4,
|
794 | "x": 6,
|
795 | "y": 4,
|
796 | "moved": false,
|
797 | "static": false
|
798 | },
|
799 | {
|
800 | "name": "Div",
|
801 | "i": "15",
|
802 | "w": 3,
|
803 | "h": 4,
|
804 | "x": 9,
|
805 | "y": 4,
|
806 | "moved": false,
|
807 | "static": false
|
808 | },
|
809 | {
|
810 | "name": "Container",
|
811 | "i": "16",
|
812 | "w": 3,
|
813 | "h": 4,
|
814 | "x": 6,
|
815 | "y": 24,
|
816 | "moved": false,
|
817 | "static": false
|
818 | },
|
819 | {
|
820 | "name": "Input",
|
821 | "i": "17",
|
822 | "w": 3,
|
823 | "h": 4,
|
824 | "x": 3,
|
825 | "y": 0,
|
826 | "moved": false,
|
827 | "static": false
|
828 | },
|
829 | {
|
830 | "name": "Li",
|
831 | "i": "18",
|
832 | "w": 3,
|
833 | "h": 4,
|
834 | "x": 0,
|
835 | "y": 24,
|
836 | "moved": false,
|
837 | "static": false
|
838 | },
|
839 | {
|
840 | "name": "Panel",
|
841 | "i": "19",
|
842 | "w": 3,
|
843 | "h": 4,
|
844 | "x": 0,
|
845 | "y": 28,
|
846 | "moved": false,
|
847 | "static": false
|
848 | },
|
849 | {
|
850 | "name": "Text",
|
851 | "i": "20",
|
852 | "w": 3,
|
853 | "h": 4,
|
854 | "x": 3,
|
855 | "y": 12,
|
856 | "moved": false,
|
857 | "static": false
|
858 | },
|
859 | {
|
860 | "name": "Td",
|
861 | "i": "21",
|
862 | "w": 3,
|
863 | "h": 4,
|
864 | "x": 6,
|
865 | "y": 16,
|
866 | "moved": false,
|
867 | "static": false
|
868 | },
|
869 | {
|
870 | "name": "Th",
|
871 | "i": "22",
|
872 | "w": 3,
|
873 | "h": 4,
|
874 | "x": 9,
|
875 | "y": 12,
|
876 | "moved": false,
|
877 | "static": false
|
878 | },
|
879 | {
|
880 | "name": "TFoot",
|
881 | "i": "23",
|
882 | "w": 3,
|
883 | "h": 4,
|
884 | "x": 0,
|
885 | "y": 32,
|
886 | "moved": false,
|
887 | "static": false
|
888 | },
|
889 | {
|
890 | "name": "Card",
|
891 | "i": "24",
|
892 | "w": 3,
|
893 | "h": 4,
|
894 | "x": 3,
|
895 | "y": 20,
|
896 | "moved": false,
|
897 | "static": false
|
898 | },
|
899 | {
|
900 | "name": "Th",
|
901 | "i": "25",
|
902 | "w": 3,
|
903 | "h": 4,
|
904 | "x": 3,
|
905 | "y": 8,
|
906 | "moved": false,
|
907 | "static": false
|
908 | },
|
909 | {
|
910 | "name": "Badge",
|
911 | "i": "26",
|
912 | "w": 3,
|
913 | "h": 4,
|
914 | "x": 0,
|
915 | "y": 0,
|
916 | "moved": false,
|
917 | "static": false
|
918 | },
|
919 | {
|
920 | "name": "BadgePrimary",
|
921 | "i": "27",
|
922 | "w": 3,
|
923 | "h": 4,
|
924 | "x": 0,
|
925 | "y": 8,
|
926 | "moved": false,
|
927 | "static": false
|
928 | },
|
929 | {
|
930 | "name": "BadgeDanger",
|
931 | "i": "28",
|
932 | "w": 3,
|
933 | "h": 4,
|
934 | "x": 0,
|
935 | "y": 12,
|
936 | "moved": false,
|
937 | "static": false
|
938 | },
|
939 | {
|
940 | "name": "BadgeInfo",
|
941 | "i": "29",
|
942 | "w": 3,
|
943 | "h": 4,
|
944 | "x": 0,
|
945 | "y": 16,
|
946 | "moved": false,
|
947 | "static": false
|
948 | },
|
949 | {
|
950 | "name": "Table",
|
951 | "i": "30",
|
952 | "w": 3,
|
953 | "h": 4,
|
954 | "x": 6,
|
955 | "y": 12,
|
956 | "moved": false,
|
957 | "static": false
|
958 | },
|
959 | {
|
960 | "name": "Th",
|
961 | "i": "31",
|
962 | "w": 3,
|
963 | "h": 4,
|
964 | "x": 9,
|
965 | "y": 16,
|
966 | "moved": false,
|
967 | "static": false
|
968 | },
|
969 | {
|
970 | "name": "TBody",
|
971 | "i": "32",
|
972 | "w": 3,
|
973 | "h": 4,
|
974 | "x": 0,
|
975 | "y": 4,
|
976 | "moved": false,
|
977 | "static": false
|
978 | },
|
979 | {
|
980 | "name": "THeadRow",
|
981 | "i": "33",
|
982 | "w": 3,
|
983 | "h": 4,
|
984 | "x": 3,
|
985 | "y": 4,
|
986 | "moved": false,
|
987 | "static": false
|
988 | }
|
989 | ]
|
990 | }
|