diff --git a/examples/uidl-samples/project.json b/examples/uidl-samples/project.json index 891d88fe5..f59c940e7 100644 --- a/examples/uidl-samples/project.json +++ b/examples/uidl-samples/project.json @@ -1,9881 +1,839 @@ { - "name": "New Project3", - "globals": { - "settings": { - "title": "New Project3", - "language": "en" + "name": "New Project3", + "globals": { + "settings": { + "title": "New Project3", + "language": "en" + }, + "assets": [ + { + "type": "style", + "content": "html { line-height: 1.15;}body { margin: 0;}* { box-sizing: border-box; border-width: 0; border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6 { margin: 0; padding: 0;}button,input,optgroup,select,textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0;}button,select { text-transform: none;}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"] { -webkit-appearance: button;}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner { border-style: none; padding: 0;}button:-moz-focus,[type=\"button\"]:-moz-focus,[type=\"reset\"]:-moz-focus,[type=\"submit\"]:-moz-focus { outline: 1px dotted ButtonText;}a { color: inherit; text-decoration: inherit;}input { padding: 2px 4px;}img { display: block;}" + }, + { + "type": "style", + "content": "\n html {\n font-family: Inter;\n font-size: 16px;\n }\n\n body {\n font-weight: 400;\n font-style:normal;\n text-decoration: none;\n text-transform: none;\n letter-spacing: normal;\n line-height: 1.15;\n color: var(--dl-color-gray-black);\n background-color: var(--dl-color-gray-white);\n \n }\n\n \n" + }, + { + "type": "font", + "path": "", + "name": "Arial" + }, + { + "type": "font", + "path": "https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap", + "name": "Inter" + }, + { + "type": "font", + "path": "https://fonts.googleapis.com/css2?family=Chivo+Mono:wght@300&display=swap", + "name": "Chivo Mono" }, - "assets": [ - { - "type": "style", - "content": "html { line-height: 1.15;}body { margin: 0;}* { box-sizing: border-box; border-width: 0; border-style: solid;}p,li,ul,pre,div,h1,h2,h3,h4,h5,h6 { margin: 0; padding: 0;}button,input,optgroup,select,textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0;}button,select { text-transform: none;}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"] { -webkit-appearance: button;}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner { border-style: none; padding: 0;}button:-moz-focus,[type=\"button\"]:-moz-focus,[type=\"reset\"]:-moz-focus,[type=\"submit\"]:-moz-focus { outline: 1px dotted ButtonText;}a { color: inherit; text-decoration: inherit;}input { padding: 2px 4px;}img { display: block;}" - }, - { - "type": "style", - "content": "\n html {\n font-family: Inter;\n font-size: 16px;\n }\n\n body {\n font-weight: 400;\n font-style:normal;\n text-decoration: none;\n text-transform: none;\n letter-spacing: normal;\n line-height: 1.15;\n color: var(--dl-color-gray-black);\n background-color: var(--dl-color-gray-white);\n \n }\n\n \n" - }, - { - "type": "font", - "path": "", - "name": "Arial" - }, - { - "type": "font", - "path": "https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap", - "name": "Inter" - }, - { - "type": "script", - "content": "https://unpkg.com/@teleporthq/teleport-custom-scripts" - } - ], - "meta": [ - { - "name": "viewport", - "content": "width=device-width, initial-scale=1.0" - }, - { - "charSet": "utf-8" - }, - { - "property": "twitter:card", - "content": "summary_large_image" - } - ], - "customCode": { - "head": "\n\n" - } - }, - "root": { - "name": "App", - "designLanguage": { - "tokens": { - "--dl-space-space-fourunits": { - "type": "static", - "content": "64px" - }, - "--dl-space-space-threeunits": { - "type": "static", - "content": "48px" - }, - "--dl-space-space-twounits": { - "type": "static", - "content": "32px" - }, - "--dl-color-success-500": { - "type": "static", - "content": "#32A94C" - }, - "--dl-color-danger-700": { - "type": "static", - "content": "#E14747" - }, - "--dl-color-danger-500": { - "type": "static", - "content": "#BF2626" - }, - "--dl-color-primary-100": { - "type": "static", - "content": "#003EB3" - }, - "--dl-radius-radius-round": { - "type": "static", - "content": "50%" - }, - "--dl-color-success-300": { - "type": "static", - "content": "#199033" - }, - "--dl-size-size-small": { - "type": "static", - "content": "48px" - }, - "--dl-color-danger-300": { - "type": "static", - "content": "#A22020" - }, - "--dl-size-size-medium": { - "type": "static", - "content": "96px" - }, - "--dl-size-size-xsmall": { - "type": "static", - "content": "16px" - }, - "--dl-radius-radius-radius8": { - "type": "static", - "content": "8px" - }, - "--dl-color-gray-white": { - "type": "static", - "content": "#FFFFFF" - }, - "--dl-color-gray-700": { - "type": "static", - "content": "#999999" - }, - "--dl-size-size-maxwidth": { - "type": "static", - "content": "1400px" - }, - "--dl-radius-radius-radius4": { - "type": "static", - "content": "4px" - }, - "--dl-color-primary-300": { - "type": "static", - "content": "#0074F0" - }, - "--dl-color-primary-500": { - "type": "static", - "content": "#14A9FF" - }, - "--dl-size-size-xlarge": { - "type": "static", - "content": "192px" - }, - "--dl-color-success-700": { - "type": "static", - "content": "#4CC366" - }, - "--dl-space-space-unit": { - "type": "static", - "content": "16px" - }, - "--dl-color-primary-700": { - "type": "static", - "content": "#85DCFF" - }, - "--dl-space-space-oneandhalfunits": { - "type": "static", - "content": "24px" - }, - "--dl-color-gray-900": { - "type": "static", - "content": "#D9D9D9" - }, - "--dl-space-space-sixunits": { - "type": "static", - "content": "96px" - }, - "--dl-radius-radius-radius2": { - "type": "static", - "content": "2px" - }, - "--dl-color-gray-500": { - "type": "static", - "content": "#595959" - }, - "--dl-color-gray-black": { - "type": "static", - "content": "#000000" - }, - "--dl-size-size-large": { - "type": "static", - "content": "144px" - }, - "--dl-space-space-halfunit": { - "type": "static", - "content": "8px" - }, - "--dl-space-space-fiveunits": { - "type": "static", - "content": "80px" - }, - "--dl-size-size-xxlarge": { - "type": "static", - "content": "288px" - } - } - }, - "styleSetDefinitions": { - "button": { - "type": "reusable-project-style-map", - "content": { - "fontSize": { - "type": "static", - "content": "14px" - }, - "fontFamily": { - "type": "static", - "content": "Arial" - }, - "fontWeight": { - "type": "static", - "content": "500" - }, - "textTransform": { - "type": "static", - "content": "none" - }, - "textDecoration": { - "type": "static", - "content": "none" - } - } - }, - "input": { - "type": "reusable-project-style-map", - "content": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - }, - "cursor": { - "type": "static", - "content": "auto" - }, - "padding": { - "type": "static", - "content": "0.5rem 1rem" - }, - "borderColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - }, - "borderWidth": { - "type": "static", - "content": "1px" - }, - "borderRadius": { - "type": "static", - "content": "4px" - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - } - }, - "conditions": [] - }, - "textarea": { - "type": "reusable-project-style-map", - "content": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - }, - "cursor": { - "type": "static", - "content": "auto" - }, - "padding": { - "type": "static", - "content": "0.5rem" - }, - "borderColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - }, - "borderWidth": { - "type": "static", - "content": "1px" - }, - "borderRadius": { - "type": "static", - "content": "4px" - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - } - }, - "conditions": [] - }, - "list": { - "type": "reusable-project-style-map", - "content": { - "width": { - "type": "static", - "content": "100%" - }, - "margin": { - "type": "static", - "content": "1em 0px 1em 0px" - }, - "display": { - "type": "static", - "content": "block" - }, - "padding": { - "type": "static", - "content": "0px 0px 0px 1.5rem" - }, - "listStyleType": { - "type": "static", - "content": "none" - }, - "listStylePosition": { - "type": "static", - "content": "outside" - } - }, - "conditions": [] - }, - "list-item": { - "type": "reusable-project-style-map", - "content": { - "display": { - "type": "static", - "content": "list-item" - } - }, - "conditions": [] - }, - "teleport-show": { - "type": "reusable-project-style-map", - "content": { - "display": { - "type": "static", - "content": "flex !important" - } - }, - "conditions": [] - }, - "primary-button": { - "type": "reusable-project-style-map", - "content": { - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - }, - "color": { - "type": "static", - "content": "white" - } - }, - "conditions": [] - }, - "secondary-button": { - "type": "reusable-project-style-map", - "content": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - }, - "border": { - "type": "static", - "content": "1px solid" - } - }, - "conditions": [] - }, - "content": { - "type": "reusable-project-style-map", - "content": { - "fontSize": { - "type": "static", - "content": "16px" - }, - "fontFamily": { - "type": "static", - "content": "Inter" - }, - "fontWeight": { - "type": "static", - "content": "400" - }, - "lineHeight": { - "type": "static", - "content": "1.15" - }, - "textTransform": { - "type": "static", - "content": "none" - }, - "textDecoration": { - "type": "static", - "content": "none" - } - } - }, - "heading": { - "type": "reusable-project-style-map", - "content": { - "fontSize": { - "type": "static", - "content": "32px" - }, - "fontFamily": { - "type": "static", - "content": "Inter" - }, - "fontWeight": { - "type": "static", - "content": "700" - }, - "lineHeight": { - "type": "static", - "content": "1.15" - }, - "textTransform": { - "type": "static", - "content": "none" - }, - "textDecoration": { - "type": "static", - "content": "none" - } - } - } - }, - "stateDefinitions": { - "route": { - "type": "string", - "defaultValue": "Home", - "values": [ - { - "value": "Home", - "seo": { - "title": "New Project3", - "metaTags": [ - { - "property": "og:title", - "content": "New Project3" - } - ] - } - }, - { - "value": "About", - "seo": { - "title": "About - New Project3", - "metaTags": [ - { - "property": "og:title", - "content": "About - New Project3" - } - ] - } - }, - { - "value": "Fallback", - "seo": { - "title": "Fallback Page" - }, - "pageOptions": { - "fallback": true - } - } - ] - } - }, - "node": { - "type": "element", - "content": { - "elementType": "Router", - "children": [ - { - "type": "conditional", - "content": { - "node": { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "9f75e760-4477-44cd-8532-36c760cbc8aa": { - "type": "style-map", - "content": { - "conditions": [ - { - "maxWidth": 479, - "conditionType": "screen-size" - } - ], - "mapType": "inlined", - "styles": { - "color": { - "type": "static", - "content": "blue" - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "overflow": { - "type": "static", - "content": "auto" - }, - "minHeight": { - "type": "static", - "content": "100vh" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "html-node", - "attrs": { - "html": { - "type": "raw", - "content": "

Feels like the last 20 mins of Don’t Look Up right about now…

— Netflix (@netflix) November 18, 2022
" - } - } - } - }, - { - "type": "element", - "content": { - "elementType": "lottie-node", - "style": { - "width": "200px", - "height": "200px" - }, - "attrs": { - "src": { - "type": "static", - "content": "https://assets9.lottiefiles.com/datafiles/gUENLc1262ccKIO/data.json" - }, - "autoplay": { - "type": "static", - "content": "true" - } - } - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "Header" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "Hero" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "Features" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "Footer" - } - } - ], - "semanticType": "div" - } - }, - "value": "Home", - "reference": { - "type": "dynamic", - "content": { - "referenceType": "state", - "id": "route" - } - } - } - }, - { - "type": "conditional", - "content": { - "node": { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "overflow": { - "type": "static", - "content": "auto" - }, - "minHeight": { - "type": "static", - "content": "100vh" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "rootClassName": { - "type": "comp-style", - "content": "rootClassName" - } - }, - "children": [], - "semanticType": "Header" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "Gallery", - "referencedStyles": { - "785deea7-5086-40af-9e41-9a53bbb0fa28": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - }, - "ff5caa9e-fea4-44a8-900e-a4fc4f90d3e4": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "3rem" - }, - "textAlign": { - "type": "static", - "content": "center" - } - }, - "children": [ - { - "type": "static", - "content": "Our portfolio" - } - ], - "semanticType": "h1" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "f4a07a8b-08f2-46d4-a47b-33b57e57e16e": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - }, - "088b3180-ba7f-4d85-9124-4007789b5d1d": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "textAlign": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-700" - } - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "textAlign": { - "type": "static", - "content": "center" - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non volutpat turpis. " - }, - { - "type": "raw", - "content": " " - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": " " - }, - { - "type": "raw", - "content": " " - } - ] - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "br", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "br" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Mauris luctus rutrum mi ut rhoncus. Integer in dignissim tortor. " - }, - { - "type": "raw", - "content": " " - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": " " - }, - { - "type": "raw", - "content": " " - } - ] - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "111ff2d1-7b22-440d-b9f6-30946dca9598": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "gridTemplateColumns": { - "type": "static", - "content": "1fr" - } - } - } - }, - "4a8a977c-5afe-45e9-bf32-3667e2789650": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "gridTemplateColumns": { - "type": "static", - "content": "1fr 1fr 1fr" - } - } - } - }, - "a819dc66-7304-4c70-864c-f4288dc360c0": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "gridTemplateColumns": { - "type": "static", - "content": "1fr 1fr" - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "grid" - }, - "gridGap": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "gridTemplateColumns": { - "type": "static", - "content": "1fr 1fr 1fr 1fr" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "rootClassName": { - "type": "comp-style", - "content": "rootClassName" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1501127122-f385ca6ddd9d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDExfHxtaW5pbWFsaXNtJTIwaG9tZXxlbnwwfHx8fDE2MjY0NDg1Mjc&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName1" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1467043153537-a4fba2cd39ef?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDR8fG1pbmltYWxpc20lMjBob21lfGVufDB8fHx8MTYyNjQ0ODUyNw&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName3" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1531829039722-d3fb3e705a4b?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDE4fHxtaW5pbWFsaXNtJTIwaG9tZXxlbnwwfHx8fDE2MjY0NDg1Mjc&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName2" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1519710164239-da123dc03ef4?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDExfHxtaW5pbWFsaXNtfGVufDB8fHx8MTYyNjQ0NTY1Nw&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName4" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1494438639946-1ebd1d20bf85?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDJ8fG1pbmltYWxpc218ZW58MHx8fHwxNjI2NDQ1NjU3&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName5" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1504198458649-3128b932f49e?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDN8fG1pbmltYWxpc20lMjBob21lfGVufDB8fHx8MTYyNjQ0ODUyNw&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName6" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1453904300235-0f2f60b15b5d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDE3fHxtaW5pbWFsaXNtJTIwaG9tZXxlbnwwfHx8fDE2MjY0NDg1Mjc&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName7" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1493552152660-f915ab47ae9d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDd8fG1pbmltYWxpc20lMjBob21lfGVufDB8fHx8MTYyNjQ0ODUyNw&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName8" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1510172951991-856a654063f9?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDIwfHxtaW5pbWFsaXNtJTIwaG9tZXxlbnwwfHx8fDE2MjY0NDg1Mjc&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName9" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1449247709967-d4461a6a6103?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDN8fG1pbmltYWxpc218ZW58MHx8fHwxNjI2NDQ1NjU3&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName10" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "image_src": { - "type": "static", - "content": "https://images.unsplash.com/photo-1472157510410-64a053cbc39f?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDh8fG1pbmltYWxpc20lMjBob21lfGVufDB8fHx8MTYyNjQ0ODUyNw&ixlib=rb-1.2.1&h=1000" - }, - "rootClassName": { - "type": "comp-style", - "content": "rootClassName11" - } - }, - "children": [], - "semanticType": "GalleryCard3" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "Pricing", - "referencedStyles": {}, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "backgroundSize": { - "type": "static", - "content": "cover" - }, - "justifyContent": { - "type": "static", - "content": "center" - }, - "backgroundImage": { - "type": "static", - "content": "url('https://images.unsplash.com/photo-1503149779833-1de50ebe5f8a?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDE2fHxzd2lzcyUyMGNoZWVzZSUyMHBsYW50fGVufDB8fHx8MTYyNTg0MTU0Mg&ixlib=rb-1.2.1&h=1200')" - }, - "backgroundPosition": { - "type": "static", - "content": "center" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "a2125a63-cbeb-43b0-9529-e7ac2c8f9b2a": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "flexFlow": { - "type": "static", - "content": "column" - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "6c080f4f-f43d-4d98-9e8c-06577ec49b16": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "backgroundSize": { - "type": "static", - "content": "cover" - }, - "justifyContent": { - "type": "static", - "content": "center" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "PricingCard", - "referencedStyles": { - "4c7bef1b-4917-4ebc-bd58-ffff46cca3c7": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "element-state", - "content": "hover" - } - ], - "mapType": "inlined", - "styles": { - "transform": { - "type": "static", - "content": "scale(1.02)" - } - } - } - }, - "fbb0f3c6-a5e5-4b66-8864-2aecd48d6e83": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "100%" - }, - "maxWidth": { - "type": "static", - "content": "450px" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "marginRight": { - "type": "static", - "content": "0px" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "24eecf33-f1c7-4451-9bd3-1c5b5b1d5c32": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "100%" - }, - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "maxWidth": { - "type": "static", - "content": "100%" - }, - "alignItems": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "maxWidth": { - "type": "static", - "content": "450px" - }, - "minHeight": { - "type": "static", - "content": "450px" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "transition": { - "type": "static", - "content": "0.3s" - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "justifyContent": { - "type": "static", - "content": "space-between" - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "1.5rem" - }, - "fontWeight": { - "type": "static", - "content": "600" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "textTransform": { - "type": "static", - "content": "uppercase" - } - }, - "children": [ - { - "type": "static", - "content": "Free" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "flexDirection": { - "type": "static", - "content": "row" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "1.15rem" - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "fontWeight": { - "type": "static", - "content": "300" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "$" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "4rem" - }, - "fontWeight": { - "type": "static", - "content": "700" - } - }, - "children": [ - { - "type": "static", - "content": "0" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Full access to design tool" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Publish with Teleport" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Subdomain publish" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Download code" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "button", - "referencedStyles": { - "6bd2b679-67f7-4227-83a3-ea89ec6419e9": { - "type": "style-map", - "content": { - "mapType": "project-referenced", - "referenceId": "button" - } - } - }, - "abilities": {}, - "style": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - }, - "marginTop": { - "type": "static", - "content": "auto" - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - } - }, - "children": [ - { - "type": "static", - "content": "Learn More" - } - ] - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "PricingCard", - "referencedStyles": { - "2eb61348-d9b8-486c-a6da-2d4772461273": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "element-state", - "content": "hover" - } - ], - "mapType": "inlined", - "styles": { - "transform": { - "type": "static", - "content": "scale(1.02)" - } - } - } - }, - "d83eb5db-d509-4d8e-b3ea-ab00555d9bc1": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "100%" - }, - "maxWidth": { - "type": "static", - "content": "100%" - }, - "alignItems": { - "type": "static", - "content": "center" - } - } - } - }, - "1284ff41-ddec-4fff-be50-00d190082788": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "100%" - }, - "maxWidth": { - "type": "static", - "content": "450px" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "marginRight": { - "type": "static", - "content": "0px" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "maxWidth": { - "type": "static", - "content": "450px" - }, - "minHeight": { - "type": "static", - "content": "450px" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "transition": { - "type": "static", - "content": "0.3s" - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "1.5rem" - }, - "fontWeight": { - "type": "static", - "content": "600" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "textTransform": { - "type": "static", - "content": "uppercase" - } - }, - "children": [ - { - "type": "static", - "content": "basic" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "flexDirection": { - "type": "static", - "content": "row" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "1.15rem" - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "fontWeight": { - "type": "static", - "content": "300" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "$" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "4rem" - }, - "fontWeight": { - "type": "static", - "content": "700" - } - }, - "children": [ - { - "type": "static", - "content": "9" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "1.15rem" - }, - "fontStyle": { - "type": "static", - "content": "normal" - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "fontWeight": { - "type": "static", - "content": "300" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "/ monthly" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-500" - } - }, - "fontSize": { - "type": "static", - "content": "0.75rem" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Billed annualy or $12 month-to-month." - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ All features of FREE plan" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Connect to custom domains" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Private projects" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ No project limitations" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Unlimited collabotators" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "button", - "referencedStyles": { - "b04dd5a2-d42d-4b26-8502-a39fb959acd0": { - "type": "style-map", - "content": { - "mapType": "project-referenced", - "referenceId": "button" - } - } - }, - "abilities": {}, - "style": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - }, - "marginTop": { - "type": "static", - "content": "auto" - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - } - }, - "children": [ - { - "type": "static", - "content": "Learn More" - } - ] - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "PricingCard", - "referencedStyles": { - "620ab363-8615-4d67-8466-b1ac334928f4": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "element-state", - "content": "hover" - } - ], - "mapType": "inlined", - "styles": { - "transform": { - "type": "static", - "content": "scale(1.02)" - } - } - } - }, - "daa149de-f2b1-4985-9448-d20e00c20ecd": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "100%" - }, - "maxWidth": { - "type": "static", - "content": "100%" - }, - "alignItems": { - "type": "static", - "content": "center" - } - } - } - }, - "4e543b68-d747-4cfb-98cd-aeefcd8d5e47": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "100%" - }, - "maxWidth": { - "type": "static", - "content": "450px" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "marginRight": { - "type": "static", - "content": "0px" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "9b56b8f5-6ad1-45a9-95b9-d20f51ea92ac": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginBottom": { - "type": "static", - "content": "0px" - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "maxWidth": { - "type": "static", - "content": "450px" - }, - "minHeight": { - "type": "static", - "content": "450px" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "transition": { - "type": "static", - "content": "0.3s" - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "1.5rem" - }, - "fontWeight": { - "type": "static", - "content": "600" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "textTransform": { - "type": "static", - "content": "uppercase" - } - }, - "children": [ - { - "type": "static", - "content": "Pro" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "flexDirection": { - "type": "static", - "content": "row" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "1.15rem" - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "fontWeight": { - "type": "static", - "content": "300" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "$" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "4rem" - }, - "fontWeight": { - "type": "static", - "content": "700" - } - }, - "children": [ - { - "type": "static", - "content": "29" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "1.15rem" - }, - "fontStyle": { - "type": "static", - "content": "normal" - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "fontWeight": { - "type": "static", - "content": "300" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "/ monthly" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-500" - } - }, - "fontSize": { - "type": "static", - "content": "0.75rem" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Billed annualy or $32 month-to-month." - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ All features of BASIC plan" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Priority support" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Premium analytics" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "✔ Version history" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "button", - "referencedStyles": { - "6aca2dba-b64d-4717-bfe3-f878117af483": { - "type": "style-map", - "content": { - "mapType": "project-referenced", - "referenceId": "button" - } - } - }, - "abilities": {}, - "style": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - }, - "marginTop": { - "type": "static", - "content": "auto" - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - } - }, - "children": [ - { - "type": "static", - "content": "Learn More" - } - ] - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "Footer", - "referencedStyles": { - "ac03a616-c920-4c7a-aa56-b28289887daa": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "4869893b-b47d-45e1-b57b-fb13aa372fac": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - }, - "fd48bb4d-c79b-4f00-aae6-bc08cd53ad18": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "c7971a8b-e181-4297-8ddb-877b1aab505a": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - }, - "137f4fca-36bf-4e77-89c7-6c24bc723820": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "Logo", - "referencedStyles": { - "8f4de6e2-9707-4df7-8a04-f45a03d07430": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "image", - "referencedStyles": { - "47a078fc-35c7-4d8f-be4c-4edcc8006e14": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - } - } - }, - "b97a5c46-575e-4c9d-a973-0c206c237762": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginBottom": { - "type": "static", - "content": "0px" - } - } - } - } - }, - "abilities": {}, - "attrs": { - "alt": { - "type": "static", - "content": "logo" - }, - "src": { - "type": "static", - "content": "https://presentation-website-assets.teleporthq.io/logos/logo.png" - } - }, - "style": { - "height": { - "type": "static", - "content": "2rem" - } - }, - "children": [] - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "29d15ccf-cae9-4d9a-b4b5-350f476359d4": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "e6eced16-ecd0-4396-b8a0-1cf603eb6ceb": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "textAlign": { - "type": "static", - "content": "center" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Professional website builder " - }, - { - "type": "raw", - "content": " " - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": " " - }, - { - "type": "raw", - "content": " " - } - ] - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "br" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "for developers." - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "LinksContainer", - "referencedStyles": { - "2d142f86-2ea7-4bec-aa82-418bfe09a54f": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - }, - "962cef9c-1756-4da5-bf80-309cc72b6864": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "100%" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "Container", - "referencedStyles": { - "c53b00de-c77c-4f19-8bf4-89aa3fe9216a": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-fourunits" - } - } - } - } - }, - "6723537b-7ded-40a3-9f16-75cd103aa0e3": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-fourunits" - } - } - } - } - }, - "8060ddd8-d94f-4c71-bf1c-408f4e96b802": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "static", - "content": "0px" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginRight": { - "type": "static", - "content": "10rem" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "ProductContainer", - "referencedStyles": { - "37ae652f-131d-4e50-964a-261df0b833eb": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-fourunits" - } - } - } - } - }, - "8298ad80-e1ce-4251-8650-35811caab8d1": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-fourunits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "flex": { - "type": "static", - "content": "0 0 auto" - }, - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginRight": { - "type": "static", - "content": "10rem" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontWeight": { - "type": "static", - "content": "700" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "static", - "content": "Product" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "static", - "content": "Features" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "static", - "content": "Pricing" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "static", - "content": "Tutorials" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Releases" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "CompanyContainer", - "referencedStyles": {}, - "abilities": {}, - "style": { - "flex": { - "type": "static", - "content": "0 0 auto" - }, - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontWeight": { - "type": "static", - "content": "700" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "static", - "content": "Company" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "static", - "content": "About" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "static", - "content": "Careers" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "static", - "content": "Contact" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Blog" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "c859d78c-4ef7-4149-8467-fbb930cf7444": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginBottom": { - "type": "static", - "content": "0px" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "Contact", - "referencedStyles": { - "ffd9b25a-4d04-487a-bf86-e7711e63e02d": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontWeight": { - "type": "static", - "content": "700" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "static", - "content": "Contact Us" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "static", - "content": "hello@teleporthq.io" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "+123 (4567) 890" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "Socials", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontWeight": { - "type": "static", - "content": "700" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "static", - "content": "Follow Us" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "IconGroup", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 950.8571428571428 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 877.7142857142857 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M585.143 512c0-80.571-65.714-146.286-146.286-146.286s-146.286 65.714-146.286 146.286 65.714 146.286 146.286 146.286 146.286-65.714 146.286-146.286zM664 512c0 124.571-100.571 225.143-225.143 225.143s-225.143-100.571-225.143-225.143 100.571-225.143 225.143-225.143 225.143 100.571 225.143 225.143zM725.714 277.714c0 29.143-23.429 52.571-52.571 52.571s-52.571-23.429-52.571-52.571 23.429-52.571 52.571-52.571 52.571 23.429 52.571 52.571zM438.857 152c-64 0-201.143-5.143-258.857 17.714-20 8-34.857 17.714-50.286 33.143s-25.143 30.286-33.143 50.286c-22.857 57.714-17.714 194.857-17.714 258.857s-5.143 201.143 17.714 258.857c8 20 17.714 34.857 33.143 50.286s30.286 25.143 50.286 33.143c57.714 22.857 194.857 17.714 258.857 17.714s201.143 5.143 258.857-17.714c20-8 34.857-17.714 50.286-33.143s25.143-30.286 33.143-50.286c22.857-57.714 17.714-194.857 17.714-258.857s5.143-201.143-17.714-258.857c-8-20-17.714-34.857-33.143-50.286s-30.286-25.143-50.286-33.143c-57.714-22.857-194.857-17.714-258.857-17.714zM877.714 512c0 60.571 0.571 120.571-2.857 181.143-3.429 70.286-19.429 132.571-70.857 184s-113.714 67.429-184 70.857c-60.571 3.429-120.571 2.857-181.143 2.857s-120.571 0.571-181.143-2.857c-70.286-3.429-132.571-19.429-184-70.857s-67.429-113.714-70.857-184c-3.429-60.571-2.857-120.571-2.857-181.143s-0.571-120.571 2.857-181.143c3.429-70.286 19.429-132.571 70.857-184s113.714-67.429 184-70.857c60.571-3.429 120.571-2.857 181.143-2.857s120.571-0.571 181.143 2.857c70.286 3.429 132.571 19.429 184 70.857s67.429 113.714 70.857 184c3.429 60.571 2.857 120.571 2.857 181.143z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 602.2582857142856 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M548 6.857v150.857h-89.714c-70.286 0-83.429 33.714-83.429 82.286v108h167.429l-22.286 169.143h-145.143v433.714h-174.857v-433.714h-145.714v-169.143h145.714v-124.571c0-144.571 88.571-223.429 217.714-223.429 61.714 0 114.857 4.571 130.286 6.857z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "Separator", - "referencedStyles": {}, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "height": { - "type": "static", - "content": "1px" - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-900" - } - } - }, - "children": [], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "f9c6c553-e5ec-40ef-b8be-e53ea85a5a5d": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "textAlign": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "alignSelf": { - "type": "static", - "content": "center" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "© 2021 teleportHQ, All Rights Reserved." - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "textAlign": { - "type": "static", - "content": "left" - } - }, - "children": [], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "footer" - } - }, - { - "type": "element", - "content": { - "elementType": "image", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "src": { - "type": "static", - "content": "/kitten.png" - }, - "alt": { - "type": "static", - "content": "image" - } - }, - "style": { - "width": { - "type": "static", - "content": "100px" - }, - "objectFit": { - "type": "static", - "content": "cover" - } - }, - "children": [] - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "width": { - "type": "static", - "content": "100px" - }, - "height": { - "type": "static", - "content": "50px" - }, - "border": { - "type": "static", - "content": "2px dashed rgba(120, 120, 120, 0.4)" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flex": { - "type": "static", - "content": "0 0 auto" - }, - "backgroundImage": { - "type": "static", - "content": "url(\"/kitten.png\")" - }, - "backgroundSize": { - "type": "static", - "content": "cover" - } - }, - "children": [ - { - "type": "static", - "content": "Bg Image" - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "width": { - "type": "static", - "content": "100px" - }, - "height": { - "type": "static", - "content": "50px" - }, - "border": { - "type": "static", - "content": "2px dashed rgba(120, 120, 120, 0.4)" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flex": { - "type": "static", - "content": "0 0 auto" - }, - "backgroundImage": { - "type": "static", - "content": "url(\"/playground_assets/kitten.png\")" - }, - "backgroundSize": { - "type": "static", - "content": "cover" - } - }, - "children": [ - { - "type": "static", - "content": "Bg Image" - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - "value": "About", - "reference": { - "type": "dynamic", - "content": { - "referenceType": "state", - "id": "route" - } - } - } - }, - { - "type": "conditional", - "content": { - "node": { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "overflow": { - "type": "static", - "content": "auto" - }, - "minHeight": { - "type": "static", - "content": "100vh" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "children": [ - { - "type": "static", - "content": "This is a fallback page" - } - ] - } - } - ], - "semanticType": "div" - } - }, - "value": "Fallback", - "reference": { - "type": "dynamic", - "content": { - "referenceType": "state", - "id": "route" - } - } - } - } - ] - } - } - }, - "components": { - "Component": { - "propDefinitions": {}, - "node": { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "height": { - "type": "static", - "content": "400px" - }, - "display": { - "type": "static", - "content": "flex" - }, - "position": { - "type": "static", - "content": "relative" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - } - }, - "children": [], - "semanticType": "div" - } - }, - "name": "Component", - "styleSetDefinitions": {} - }, - "NavigationLinks": { - "propDefinitions": { - "text": { - "id": "aabae333-9120-42d3-9e36-525fb14689aa", - "defaultValue": "About", - "type": "string" - }, - "text3": { - "id": "5361ad50-a4f4-4c08-99b9-165314e12824", - "defaultValue": "Team", - "type": "string" - }, - "text4": { - "id": "0b56039c-7529-41ba-a510-a84252dff14c", - "defaultValue": "Blog", - "type": "string" - }, - "text1": { - "id": "717f2fc1-a3fe-4899-b7c2-1fb7d6c102f6", - "defaultValue": "Features", - "type": "string" - }, - "rootClassName": { - "id": "5f6c32bd-c13a-420a-944d-19e76359ea81", - "defaultValue": "", - "type": "string" - }, - "text2": { - "id": "cdbb8227-1e43-4506-abf0-538fcfc28eb3", - "defaultValue": "Pricing", - "type": "string" - } - }, - "node": { - "type": "element", - "content": { - "elementType": "container", - "name": "Nav", - "referencedStyles": { - "2f4a08a2-f790-49da-8dd3-658cf6d92000": { - "type": "style-map", - "content": { - "mapType": "component-referenced", - "content": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "rootClassName" - } - } - } - }, - "b347ca72-94de-4cfb-80f1-961cdac81b93": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - } - }, - "abilities": {}, - "style": { - "flex": { - "type": "static", - "content": "0 0 auto" - }, - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "row" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "db1acee6-818e-4ae8-b7e0-dd1637733a28": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - } - }, - "abilities": { - "link": { - "type": "navlink", - "content": { - "routeName": "About" - } - } - }, - "style": { - "textDecoration": { - "type": "static", - "content": "none" - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "f0040a92-5fc6-4367-99b6-ed0d915450a6": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginLeft": { - "type": "static", - "content": "0" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "marginLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text1" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "7a317b89-1ff8-4904-8e39-cd3596864c32": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginLeft": { - "type": "static", - "content": "0" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "marginLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text2" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "a4ccfeca-7315-43b8-9c59-2a32cbaac84f": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginLeft": { - "type": "static", - "content": "0" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "marginLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text3" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "0c8b2e95-0504-40e8-accf-bb8834a13069": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginLeft": { - "type": "static", - "content": "0" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "marginLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text4" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "nav" - } - }, - "name": "NavigationLinks", - "styleSetDefinitions": { - "rootClassName": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName1": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName2": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName3": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName4": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName5": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName6": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName7": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - } - } - }, - "Header": { - "propDefinitions": { - "image_src": { - "id": "601323c3-d5dc-4b10-80ad-c525b657b1f5", - "defaultValue": "https://presentation-website-assets.teleporthq.io/logos/logo.png", - "type": "string" - }, - "image_alt": { - "id": "cc962a83-18b6-4726-a48e-76e052f2c185", - "defaultValue": "logo", - "type": "string" - }, - "Login": { - "id": "86ba5e4e-f72c-4a5e-8ea9-062cee745891", - "defaultValue": "Login", - "type": "string" - }, - "Register": { - "id": "2236a64f-65fb-4c6e-bad4-0b49edbab440", - "defaultValue": "Register", - "type": "string" - }, - "image_src1": { - "id": "96165675-8961-4677-a985-1009731609c3", - "defaultValue": "https://presentation-website-assets.teleporthq.io/logos/logo.png", - "type": "string" - }, - "image_alt1": { - "id": "0fc7986b-0f08-497d-b6c5-089ed630cb86", - "defaultValue": "image", - "type": "string" - }, - "rootClassName": { - "id": "6e03e757-c9ee-4826-ac1c-3bab4a847b2c", - "defaultValue": "", - "type": "string" - } - }, - "node": { - "type": "element", - "content": { - "elementType": "container", - "name": "Header", - "referencedStyles": { - "f7a70914-a93d-42b6-8e08-d7308f987005": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - }, - "7ce7d4c6-65a0-42ef-92b1-533545d32ecb": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "c1964328-5a00-4e1e-a118-f395998202c1": { - "type": "style-map", - "content": { - "mapType": "component-referenced", - "content": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "rootClassName" - } - } - } - } - }, - "abilities": {}, - "attrs": { - "data-role": { - "type": "static", - "content": "Header" - } - }, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "image", - "referencedStyles": {}, - "abilities": { - "link": { - "type": "navlink", - "content": { - "routeName": "Home" - } - } - }, - "attrs": { - "alt": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_alt" - } - }, - "src": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_src" - } - } - }, - "style": { - "height": { - "type": "static", - "content": "2rem" - }, - "textDecoration": { - "type": "static", - "content": "none" - } - }, - "children": [] - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "Nav", - "referencedStyles": { - "2a26b67b-d08e-48f6-ac60-32f02dc0f471": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "display": { - "type": "static", - "content": "none" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "name": "NavigationLinks", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "rootClassName": { - "type": "comp-style", - "content": "rootClassName10" - } - }, - "children": [], - "semanticType": "NavigationLinks" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "BtnGroup", - "referencedStyles": { - "10826acb-433c-4b96-a5a0-d597b3b7d44a": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "display": { - "type": "static", - "content": "none" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "button", - "name": "Login", - "referencedStyles": { - "1c601ebb-ac3d-4b4a-b28e-eeadc638127a": { - "type": "style-map", - "content": { - "mapType": "project-referenced", - "referenceId": "button" - } - } - }, - "abilities": {}, - "style": { - "borderWidth": { - "type": "static", - "content": "0px" - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "Login" - } - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "button", - "name": "Register", - "referencedStyles": { - "cea81a34-4ba7-4d42-a34d-ee567ffc9432": { - "type": "style-map", - "content": { - "mapType": "project-referenced", - "referenceId": "button" - } - } - }, - "abilities": {}, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "Register" - } - } - ] - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "BurgerMenu", - "referencedStyles": { - "e77c96cc-f59e-47c8-8c4d-c96a425741b9": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "justifyContent": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "attrs": { - "data-type": { - "type": "static", - "content": "BurgerMenu" - } - }, - "style": { - "display": { - "type": "static", - "content": "none" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 1024 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M128 554.667h768c23.552 0 42.667-19.115 42.667-42.667s-19.115-42.667-42.667-42.667h-768c-23.552 0-42.667 19.115-42.667 42.667s19.115 42.667 42.667 42.667zM128 298.667h768c23.552 0 42.667-19.115 42.667-42.667s-19.115-42.667-42.667-42.667h-768c-23.552 0-42.667 19.115-42.667 42.667s19.115 42.667 42.667 42.667zM128 810.667h768c23.552 0 42.667-19.115 42.667-42.667s-19.115-42.667-42.667-42.667h-768c-23.552 0-42.667 19.115-42.667 42.667s19.115 42.667 42.667 42.667z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "MobileMenu", - "referencedStyles": { - "1d4e9d28-28c5-4ccc-982e-ecfc69bb5152": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "padding": { - "type": "static", - "content": "16px" - } - } - } - } - }, - "abilities": {}, - "attrs": { - "data-type": { - "type": "static", - "content": "MobileMenu" - } - }, - "style": { - "top": { - "type": "static", - "content": "0px" - }, - "left": { - "type": "static", - "content": "0px" - }, - "width": { - "type": "static", - "content": "100%" - }, - "height": { - "type": "static", - "content": "100vh" - }, - "zIndex": { - "type": "static", - "content": "100" - }, - "display": { - "type": "static", - "content": "none" - }, - "padding": { - "type": "static", - "content": "32px" - }, - "position": { - "type": "static", - "content": "absolute" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - }, - "backgroundColor": { - "type": "static", - "content": "#fff" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "Nav", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "Container", - "referencedStyles": {}, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "image", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "alt": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_alt1" - } - }, - "src": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_src1" - } - } - }, - "style": { - "height": { - "type": "static", - "content": "2rem" - } - }, - "children": [] - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "MenuClose", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "data-type": { - "type": "static", - "content": "CloseMobileMenu" - } - }, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "justifyContent": { - "type": "static", - "content": "center" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 1024 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M810 274l-238 238 238 238-60 60-238-238-238 238-60-60 238-238-238-238 60-60 238 238 238-238z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "name": "NavigationLinks", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "rootClassName": { - "type": "comp-style", - "content": "rootClassName11" - } - }, - "children": [], - "semanticType": "NavigationLinks" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "IconGroup", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 950.8571428571428 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 877.7142857142857 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M585.143 512c0-80.571-65.714-146.286-146.286-146.286s-146.286 65.714-146.286 146.286 65.714 146.286 146.286 146.286 146.286-65.714 146.286-146.286zM664 512c0 124.571-100.571 225.143-225.143 225.143s-225.143-100.571-225.143-225.143 100.571-225.143 225.143-225.143 225.143 100.571 225.143 225.143zM725.714 277.714c0 29.143-23.429 52.571-52.571 52.571s-52.571-23.429-52.571-52.571 23.429-52.571 52.571-52.571 52.571 23.429 52.571 52.571zM438.857 152c-64 0-201.143-5.143-258.857 17.714-20 8-34.857 17.714-50.286 33.143s-25.143 30.286-33.143 50.286c-22.857 57.714-17.714 194.857-17.714 258.857s-5.143 201.143 17.714 258.857c8 20 17.714 34.857 33.143 50.286s30.286 25.143 50.286 33.143c57.714 22.857 194.857 17.714 258.857 17.714s201.143 5.143 258.857-17.714c20-8 34.857-17.714 50.286-33.143s25.143-30.286 33.143-50.286c22.857-57.714 17.714-194.857 17.714-258.857s5.143-201.143-17.714-258.857c-8-20-17.714-34.857-33.143-50.286s-30.286-25.143-50.286-33.143c-57.714-22.857-194.857-17.714-258.857-17.714zM877.714 512c0 60.571 0.571 120.571-2.857 181.143-3.429 70.286-19.429 132.571-70.857 184s-113.714 67.429-184 70.857c-60.571 3.429-120.571 2.857-181.143 2.857s-120.571 0.571-181.143-2.857c-70.286-3.429-132.571-19.429-184-70.857s-67.429-113.714-70.857-184c-3.429-60.571-2.857-120.571-2.857-181.143s-0.571-120.571 2.857-181.143c3.429-70.286 19.429-132.571 70.857-184s113.714-67.429 184-70.857c60.571-3.429 120.571-2.857 181.143-2.857s120.571-0.571 181.143 2.857c70.286 3.429 132.571 19.429 184 70.857s67.429 113.714 70.857 184c3.429 60.571 2.857 120.571 2.857 181.143z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 602.2582857142856 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M548 6.857v150.857h-89.714c-70.286 0-83.429 33.714-83.429 82.286v108h167.429l-22.286 169.143h-145.143v433.714h-174.857v-433.714h-145.714v-169.143h145.714v-124.571c0-144.571 88.571-223.429 217.714-223.429 61.714 0 114.857 4.571 130.286 6.857z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "header" - } - }, - "name": "Header", - "styleSetDefinitions": { - "rootClassName": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - } - } - }, - "Hero": { - "propDefinitions": { - "image_src": { - "id": "09427368-90c9-497c-907e-754b8ba0b139", - "defaultValue": "https://images.unsplash.com/photo-1525498128493-380d1990a112?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDI0fHxtaW5pbWFsaXNtJTIwZ3JlZW58ZW58MHx8fHwxNjI1ODQxMDcw&ixlib=rb-1.2.1&h=1200", - "type": "string" - }, - "image_alt": { - "id": "2bad8f83-542b-448b-90de-314212b2b334", - "defaultValue": "image", - "type": "string" - }, - "heading": { - "id": "9e1857ce-9f52-4dcd-9000-ddaab6af0a53", - "defaultValue": "Magnificent things are very simple", - "type": "string" - }, - "button": { - "id": "f4abacea-00b2-4c0b-8ccf-c23d0f0c7700", - "defaultValue": "Get Started", - "type": "string" - }, - "button1": { - "id": "1b3866f9-5667-4b4f-97c4-5ca79f8254a4", - "defaultValue": "Learn More", - "type": "string" - } - }, - "node": { - "type": "element", - "content": { - "elementType": "container", - "name": "Hero", - "referencedStyles": { - "3ffdd7c0-6c8f-4139-9d57-9cd88f43cf27": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "5936298f-80ab-4221-83f8-90ce5984b023": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - }, - "86ca7cf7-0b5b-4453-9e30-c15e16c6165b": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "minHeight": { - "type": "static", - "content": "80vh" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "344948ea-fea3-42a4-8fc0-d3a4e382744b": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - }, - "marginRight": { - "type": "static", - "content": "0px" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "static", - "content": "0px" - } - } - } - }, - "6776dbcd-58b2-4513-bcb8-25761c12a4c7": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "78d44ec5-87ca-4329-b211-c840c24bd2ce": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "textAlign": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "3rem" - }, - "maxWidth": { - "type": "static", - "content": "450px" - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "heading" - } - } - ], - "semanticType": "h1" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "3eb02776-c341-43c5-abc4-73114f485316": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - }, - "0d41a2f4-38bc-40bd-b7ac-bcebe032d0f3": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "textAlign": { - "type": "static", - "content": "center" - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non volutpat turpis. " - }, - { - "type": "raw", - "content": " " - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": " " - }, - { - "type": "raw", - "content": " " - } - ] - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Mauris luctus rutrum mi ut rhoncus. Integer in dignissim tortor. " - }, - { - "type": "raw", - "content": " " - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": " " - }, - { - "type": "raw", - "content": " " - } - ] - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "BtnGroup", - "referencedStyles": { - "a8f29e6c-4bf5-460a-9d21-2680a2c1c1a4": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "row" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "button", - "referencedStyles": { - "587387e6-9e19-499b-a10b-25e16c26f942": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "element-state", - "content": "hover" - } - ], - "mapType": "inlined", - "styles": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - } - } - } - }, - "059c93d1-c3d3-4662-9c6c-d2a861154c5d": { - "type": "style-map", - "content": { - "mapType": "project-referenced", - "referenceId": "button" - } - }, - "0552c021-5ab1-4d40-99b8-04d3fa063d10": { - "id": "0552c021-5ab1-4d40-99b8-04d3fa063d10", - "type": "style-map", - "content": { - "mapType": "project-referenced", - "referenceId": "primary-button" - } - } - }, - "abilities": {}, - "style": { - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "transition": { - "type": "static", - "content": "0.3s" - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "button" - } - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "button", - "referencedStyles": { - "20c40652-8f4b-4675-989c-8485b2f3f1b7": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "element-state", - "content": "hover" - } - ], - "mapType": "inlined", - "styles": { - "borderColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - }, - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-black" - } - } - } - } - }, - "06670c8b-a0c0-491d-83f1-56c73d7ae213": { - "type": "style-map", - "content": { - "mapType": "project-referenced", - "referenceId": "button" - } - }, - "49c3aaf7-2ca0-4cf4-a9cd-c6582c629dc7": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "marginLeft": { - "type": "static", - "content": "0px" - } - } - } - }, - "9e7b7ffa-1ad3-42f3-9535-76a6d74b5691": { - "id": "9e7b7ffa-1ad3-42f3-9535-76a6d74b5691", - "type": "style-map", - "content": { - "mapType": "project-referenced", - "referenceId": "secondary-button" - } - } - }, - "abilities": {}, - "style": { - "marginLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "transition": { - "type": "static", - "content": "0.3s" - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "button1" - } - } - ] - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "image", - "referencedStyles": { - "885d62f9-2b10-4b14-8373-daa3ee90391b": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "80%" - } - } - } - } - }, - "abilities": {}, - "attrs": { - "alt": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_alt" - } - }, - "src": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_src" - } - } - }, - "style": { - "width": { - "type": "static", - "content": "400px" - }, - "objectFit": { - "type": "static", - "content": "cover" - } - }, - "children": [] - } - } - ], - "semanticType": "div" - } - }, - "name": "Hero", - "styleSetDefinitions": {} - }, - "FeatureCard4": { - "propDefinitions": { - "rootClassName": { - "id": "636d6f8e-21c7-45e6-9cf9-32fc692a69a8", - "defaultValue": "rootClassName", - "type": "string" - }, - "content": { - "id": "d94491db-94d1-4835-9934-0c3ff6b67840", - "defaultValue": "Lorem ipsum", - "type": "string" - }, - "description": { - "id": "6dc72a07-1492-4860-89f3-0e8b6d2e4a73", - "defaultValue": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In lorem lorem, malesuada in metus vitae, scelerisque accumsan ipsum.", - "type": "string" - } - }, - "node": { - "type": "element", - "content": { - "elementType": "container", - "name": "FeatureCard", - "referencedStyles": { - "0a40e87e-9c79-4469-a141-6abb2801ebe9": { - "type": "style-map", - "content": { - "mapType": "component-referenced", - "content": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "rootClassName" - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - }, - "backgroundColor": { - "type": "static", - "content": "#fff" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 1024 1024" - } - }, - "style": { - "fill": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-500" - } - }, - "width": { - "type": "static", - "content": "2rem" - }, - "height": { - "type": "static", - "content": "2rem" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M809.003 291.328l-297.003 171.819-297.003-171.819 275.456-157.397c4.779-2.731 9.899-4.48 15.147-5.333 9.301-1.451 18.987 0.128 27.904 5.291zM491.776 979.669c6.016 3.243 12.928 5.077 20.224 5.077 7.381 0 14.336-1.877 20.395-5.163 15.189-2.475 29.909-7.68 43.392-15.36l298.709-170.709c26.368-15.232 45.269-38.315 55.424-64.597 5.675-14.592 8.619-30.165 8.747-46.251v-341.333c0-20.395-4.821-39.723-13.397-56.917-0.939-3.029-2.219-5.973-3.883-8.832-1.963-3.371-4.267-6.357-6.912-8.96-1.323-1.835-2.731-3.669-4.139-5.419-9.813-12.203-21.845-22.528-35.456-30.507l-299.051-170.88c-26.027-15.019-55.467-19.84-83.328-15.531-15.531 2.432-30.507 7.637-44.288 15.488l-298.709 170.709c-16.341 9.429-29.824 21.888-40.149 36.267-2.56 2.56-4.864 5.547-6.784 8.832-1.664 2.901-2.987 5.888-3.925 8.96-1.707 3.456-3.243 6.955-4.608 10.496-5.632 14.635-8.576 30.208-8.704 45.995v341.632c0.043 30.293 10.581 58.197 28.331 80.128 9.813 12.203 21.845 22.528 35.456 30.507l299.051 170.88c13.824 7.979 28.587 13.099 43.605 15.445zM469.333 537.045v340.949l-277.12-158.336c-4.736-2.773-8.832-6.315-12.16-10.411-5.931-7.381-9.387-16.512-9.387-26.581v-318.379zM554.667 877.995v-340.949l298.667-172.757v318.379c-0.043 5.163-1.067 10.496-2.987 15.445-3.413 8.789-9.6 16.384-18.176 21.333z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "4861a50b-badf-4395-969d-f0d2d597a7f8": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "fontStyle": { - "type": "static", - "content": "normal" - }, - "fontWeight": { - "type": "static", - "content": "600" - } - } - } - }, - "4861a50b-badf-4395-969d-f0d2d597a7f9": { - "type": "style-map", - "content": { - "mapType": "component-referenced", - "content": { - "type": "dynamic", - "content": { - "referenceType": "comp", - "id": "root-class-name-4" - } - } - } - } - }, - "abilities": {}, - "style": { - "fontWeight": { - "type": "static", - "content": "600" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "content" - } - } - ], - "semanticType": "h2" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-700" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "description" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - "name": "FeatureCard4", - "styleSetDefinitions": { - "rootClassName": { - "content": { - "width": { - "type": "static", - "content": "100%" - } - }, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName1": { - "content": { - "backgroundColor": { - "type": "static", - "content": "#D9D9D9" - } - }, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName2": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName3": { - "content": { - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-500" - } - } - }, - "conditions": [], - "type": "reusable-component-style-override" - }, - "root-class-name-4": { - "content": { - "backgroundColor": { - "type": "static", - "content": "#1e622e" - } - }, - "conditions": [], - "type": "reusable-component-style-override" - } - } - }, - "Footer": { - "propDefinitions": { - "image_src": { - "id": "6d430ad8-cb40-4250-b292-0f9347922fd4", - "defaultValue": "https://presentation-website-assets.teleporthq.io/logos/logo.png", - "type": "string" - }, - "image_alt": { - "id": "35f73ad8-b02b-499a-a50f-a2a4ae261041", - "defaultValue": "logo", - "type": "string" - }, - "text": { - "id": "f439a1c6-dc7e-4c0b-953e-164f500ea79a", - "defaultValue": "Product", - "type": "string" - }, - "text1": { - "id": "769f76f8-465b-44e5-93a0-7ebfade13735", - "defaultValue": "Features", - "type": "string" - }, - "text2": { - "id": "32e8d12d-84ec-409c-82d5-ef77113c72f3", - "defaultValue": "Pricing", - "type": "string" - }, - "text3": { - "id": "5d23b5af-a1a2-4333-9918-46c68e6f5eba", - "defaultValue": "Tutorials", - "type": "string" - }, - "text4": { - "id": "afba6e7d-307b-45b6-ab0a-d014282b9268", - "defaultValue": "Releases", - "type": "string" - }, - "text5": { - "id": "215a600d-7431-480e-96d5-0205369937d9", - "defaultValue": "Company", - "type": "string" - }, - "text6": { - "id": "2ee23e1a-5866-4e9f-ac6c-a72377bca4dc", - "defaultValue": "About", - "type": "string" - }, - "text7": { - "id": "2338ebbd-abc8-455e-b1d6-ab408da34684", - "defaultValue": "Careers", - "type": "string" - }, - "text8": { - "id": "b731f788-58ce-4d92-b927-67c5874962d4", - "defaultValue": "Contact", - "type": "string" - }, - "text9": { - "id": "d9ea966f-047a-400f-8931-3a2e16d71546", - "defaultValue": "Blog", - "type": "string" - }, - "text10": { - "id": "62ac6502-a643-4d9a-b713-3bff2478ce29", - "defaultValue": "Contact Us", - "type": "string" - }, - "text11": { - "id": "21306fb7-5805-4139-8336-adf6cd681ddc", - "defaultValue": "hello@teleporthq.io", - "type": "string" - }, - "text12": { - "id": "0d56149b-47f9-4c63-9076-012f45e04c3c", - "defaultValue": "+123 (4567) 890", - "type": "string" - }, - "text13": { - "id": "54425500-d989-421d-b417-6bc76bb82da1", - "defaultValue": "Follow Us", - "type": "string" - } - }, - "node": { - "type": "element", - "content": { - "elementType": "container", - "name": "Footer", - "referencedStyles": { - "c231f77e-4ec0-4a78-b2f4-ee069175f2e2": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "d591d1fb-aa7f-4b65-8d81-3d292f60ea8f": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - }, - "d818d218-816a-4881-bc89-00aa79c1d182": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "d7de3cf9-1305-4fd9-8b37-4efa8edc8ec5": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - }, - "c80f767b-f98d-4532-aa21-6f1ea7e46836": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "Logo", - "referencedStyles": { - "9882a10b-2511-41ca-abc1-2a37a3c6c373": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "image", - "referencedStyles": { - "d240470c-85db-475e-98e8-1c1d24ec6671": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - } - } - }, - "e7e77db5-9bd9-4ce2-b392-8221ea397711": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginBottom": { - "type": "static", - "content": "0px" - } - } - } - } - }, - "abilities": {}, - "attrs": { - "alt": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_alt" - } - }, - "src": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_src" - } - } - }, - "style": { - "height": { - "type": "static", - "content": "2rem" - } - }, - "children": [] - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "626b0960-401a-4da9-b49a-448e5238a70b": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "c5a0e725-e23a-46a5-8126-957e5af046ff": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "textAlign": { - "type": "static", - "content": "center" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Professional website builder " - }, - { - "type": "raw", - "content": " " - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": " " - }, - { - "type": "raw", - "content": " " - } - ] - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "br" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "for developers." - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "LinksContainer", - "referencedStyles": { - "cfe534c9-3e1f-4491-a3c9-a481dabba616": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - }, - "b2c5c473-2dec-4e76-911c-e71b0f248ea8": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "100%" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "Container", - "referencedStyles": { - "92317702-2334-442c-a33c-f590e61cb8e6": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-fourunits" - } - } - } - } - }, - "2296ba24-e475-4425-9efe-b60fe3ee138b": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-fourunits" - } - } - } - } - }, - "dce7778b-c389-45ed-85ce-635f74022422": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "static", - "content": "0px" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginRight": { - "type": "static", - "content": "10rem" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "ProductContainer", - "referencedStyles": { - "d2eb228c-3fe0-4b71-abe1-a8f930a3e9be": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-fourunits" - } - } - } - } - }, - "75c35b91-d1e2-453a-bbe4-515319b5057d": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-fourunits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "flex": { - "type": "static", - "content": "0 0 auto" - }, - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginRight": { - "type": "static", - "content": "10rem" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontWeight": { - "type": "static", - "content": "700" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text1" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text2" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text3" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text4" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "CompanyContainer", - "referencedStyles": {}, - "abilities": {}, - "style": { - "flex": { - "type": "static", - "content": "0 0 auto" - }, - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontWeight": { - "type": "static", - "content": "700" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text5" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text6" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text7" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text8" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text9" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "efc6020d-7bec-4b57-94be-cac257605d54": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginBottom": { - "type": "static", - "content": "0px" - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "container", - "name": "Contact", - "referencedStyles": { - "1abbd246-985f-4fd9-bf80-5af756e5bb72": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontWeight": { - "type": "static", - "content": "700" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text10" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text11" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text12" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "Socials", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "flex-start" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "fontWeight": { - "type": "static", - "content": "700" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "text13" - } - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "IconGroup", - "referencedStyles": {}, - "abilities": {}, - "style": { - "display": { - "type": "static", - "content": "flex" - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "flexDirection": { - "type": "static", - "content": "row" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 950.8571428571428 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 877.7142857142857 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M585.143 512c0-80.571-65.714-146.286-146.286-146.286s-146.286 65.714-146.286 146.286 65.714 146.286 146.286 146.286 146.286-65.714 146.286-146.286zM664 512c0 124.571-100.571 225.143-225.143 225.143s-225.143-100.571-225.143-225.143 100.571-225.143 225.143-225.143 225.143 100.571 225.143 225.143zM725.714 277.714c0 29.143-23.429 52.571-52.571 52.571s-52.571-23.429-52.571-52.571 23.429-52.571 52.571-52.571 52.571 23.429 52.571 52.571zM438.857 152c-64 0-201.143-5.143-258.857 17.714-20 8-34.857 17.714-50.286 33.143s-25.143 30.286-33.143 50.286c-22.857 57.714-17.714 194.857-17.714 258.857s-5.143 201.143 17.714 258.857c8 20 17.714 34.857 33.143 50.286s30.286 25.143 50.286 33.143c57.714 22.857 194.857 17.714 258.857 17.714s201.143 5.143 258.857-17.714c20-8 34.857-17.714 50.286-33.143s25.143-30.286 33.143-50.286c22.857-57.714 17.714-194.857 17.714-258.857s5.143-201.143-17.714-258.857c-8-20-17.714-34.857-33.143-50.286s-30.286-25.143-50.286-33.143c-57.714-22.857-194.857-17.714-258.857-17.714zM877.714 512c0 60.571 0.571 120.571-2.857 181.143-3.429 70.286-19.429 132.571-70.857 184s-113.714 67.429-184 70.857c-60.571 3.429-120.571 2.857-181.143 2.857s-120.571 0.571-181.143-2.857c-70.286-3.429-132.571-19.429-184-70.857s-67.429-113.714-70.857-184c-3.429-60.571-2.857-120.571-2.857-181.143s-0.571-120.571 2.857-181.143c3.429-70.286 19.429-132.571 70.857-184s113.714-67.429 184-70.857c60.571-3.429 120.571-2.857 181.143-2.857s120.571-0.571 181.143 2.857c70.286 3.429 132.571 19.429 184 70.857s67.429 113.714 70.857 184c3.429 60.571 2.857 120.571 2.857 181.143z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - }, - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "viewBox": { - "type": "static", - "content": "0 0 602.2582857142856 1024" - } - }, - "style": { - "width": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - }, - "height": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-xsmall" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "icon", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "d": { - "type": "static", - "content": "M548 6.857v150.857h-89.714c-70.286 0-83.429 33.714-83.429 82.286v108h167.429l-22.286 169.143h-145.143v433.714h-174.857v-433.714h-145.714v-169.143h145.714v-124.571c0-144.571 88.571-223.429 217.714-223.429 61.714 0 114.857 4.571 130.286 6.857z" - } - }, - "children": [], - "semanticType": "path" - } - } - ] - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "Separator", - "referencedStyles": {}, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "height": { - "type": "static", - "content": "1px" - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-900" - } - } - }, - "children": [], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "02e79181-ec5c-485d-8f0b-eb886d79949d": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "textAlign": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "alignSelf": { - "type": "static", - "content": "center" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "© 2021 teleportHQ, All Rights Reserved." - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "textAlign": { - "type": "static", - "content": "left" - } - }, - "children": [], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "span" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "footer" - } - }, - "name": "Footer", - "styleSetDefinitions": {} - }, - "Features": { - "propDefinitions": { - "image_src": { - "id": "7e747fc8-782e-4142-8bab-b2b81aeda5a7", - "defaultValue": "https://images.unsplash.com/photo-1471086569966-db3eebc25a59?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDIzfHxtaW5pbWFsaXNtfGVufDB8fHx8MTYyNjQ0NTY1Nw&ixlib=rb-1.2.1&h=1000", - "type": "string" - }, - "image_alt": { - "id": "f7b922dc-255c-4f10-9d92-371482332b1b", - "defaultValue": "image", - "type": "string" - } - }, - "node": { - "type": "element", - "content": { - "elementType": "container", - "name": "Features", - "referencedStyles": { - "ad9612bd-ec75-480c-8417-19671e52fff1": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "alignItems": { - "type": "static", - "content": "center" - } - } - } - }, - "ba704fca-79aa-4493-a423-6ac23ede10e2": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "paddingTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - }, - "paddingBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - }, - "5083ce47-bf77-4008-b0da-d836a78852ef": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "paddingLeft": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "paddingRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-threeunits" - } - }, - "maxWidth": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-size-size-maxwidth" - } - }, - "flexDirection": { - "type": "static", - "content": "column" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "603e1818-4003-4784-b288-fee57e7d0f5e": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "textAlign": { - "type": "static", - "content": "center" - } - } - } - } - }, - "abilities": {}, - "style": { - "fontSize": { - "type": "static", - "content": "3rem" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "Discover our" - } - ], - "semanticType": "span" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [], - "semanticType": "br" - } - }, - { + { + "type": "script", + "content": "https://unpkg.com/@teleporthq/teleport-custom-scripts" + } + ], + "meta": [ + { + "name": "viewport", + "content": "width=device-width, initial-scale=1.0" + }, + { + "charSet": "utf-8" + }, + { + "property": "twitter:card", + "content": "summary_large_image" + } + ], + "customCode": { + "head": "\n\n" + } + }, + "root": { + "name": "App", + "designLanguage": { + "tokens": { + "--dl-space-space-fourunits": { + "type": "static", + "content": "64px" + }, + "--dl-space-space-threeunits": { + "type": "static", + "content": "48px" + }, + "--dl-space-space-twounits": { + "type": "static", + "content": "32px" + }, + "--dl-color-success-500": { + "type": "static", + "content": "#32A94C" + }, + "--dl-color-danger-700": { + "type": "static", + "content": "#E14747" + }, + "--dl-color-danger-500": { + "type": "static", + "content": "#BF2626" + }, + "--dl-color-primary-100": { + "type": "static", + "content": "#003EB3" + }, + "--dl-radius-radius-round": { + "type": "static", + "content": "50%" + }, + "--dl-color-success-300": { + "type": "static", + "content": "#199033" + }, + "--dl-size-size-small": { + "type": "static", + "content": "48px" + }, + "--dl-color-danger-300": { + "type": "static", + "content": "#A22020" + }, + "--dl-size-size-medium": { + "type": "static", + "content": "96px" + }, + "--dl-size-size-xsmall": { + "type": "static", + "content": "16px" + }, + "--dl-radius-radius-radius8": { + "type": "static", + "content": "8px" + }, + "--dl-color-gray-white": { + "type": "static", + "content": "#FFFFFF" + }, + "--dl-color-gray-700": { + "type": "static", + "content": "#999999" + }, + "--dl-size-size-maxwidth": { + "type": "static", + "content": "1400px" + }, + "--dl-radius-radius-radius4": { + "type": "static", + "content": "4px" + }, + "--dl-color-primary-300": { + "type": "static", + "content": "#0074F0" + }, + "--dl-color-primary-500": { + "type": "static", + "content": "#14A9FF" + }, + "--dl-size-size-xlarge": { + "type": "static", + "content": "192px" + }, + "--dl-color-success-700": { + "type": "static", + "content": "#4CC366" + }, + "--dl-space-space-unit": { + "type": "static", + "content": "16px" + }, + "--dl-color-primary-700": { + "type": "static", + "content": "#85DCFF" + }, + "--dl-space-space-oneandhalfunits": { + "type": "static", + "content": "24px" + }, + "--dl-color-gray-900": { + "type": "static", + "content": "#D9D9D9" + }, + "--dl-space-space-sixunits": { + "type": "static", + "content": "96px" + }, + "--dl-radius-radius-radius2": { + "type": "static", + "content": "2px" + }, + "--dl-color-gray-500": { + "type": "static", + "content": "#595959" + }, + "--dl-color-gray-black": { + "type": "static", + "content": "#000000" + }, + "--dl-size-size-large": { + "type": "static", + "content": "144px" + }, + "--dl-space-space-halfunit": { + "type": "static", + "content": "8px" + }, + "--dl-space-space-fiveunits": { + "type": "static", + "content": "80px" + }, + "--dl-size-size-xxlarge": { + "type": "static", + "content": "288px" + } + } + }, + "styleSetDefinitions": { + "button": { + "type": "reusable-project-style-map", + "conditions": [ + { "type": "screen-size", + "meta": { + "maxWidth": 991 + }, + "content": { + "fontFamily": { + "type": "static", + "content": "Inter" + } + } + } + ], + "content": { + "fontSize": { + "type": "static", + "content": "14px" + }, + "fontFamily": { + "type": "static", + "content": "Arial" + }, + "fontWeight": { + "type": "static", + "content": "500" + }, + "textTransform": { + "type": "static", + "content": "none" + }, + "textDecoration": { + "type": "static", + "content": "none" + } + } + }, + "input": { + "type": "reusable-project-style-map", + "content": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + }, + "cursor": { + "type": "static", + "content": "auto" + }, + "padding": { + "type": "static", + "content": "0.5rem 1rem" + }, + "borderColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + }, + "borderWidth": { + "type": "static", + "content": "1px" + }, + "borderRadius": { + "type": "static", + "content": "4px" + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + } + }, + "conditions": [] + }, + "textarea": { + "type": "reusable-project-style-map", + "content": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + }, + "cursor": { + "type": "static", + "content": "auto" + }, + "padding": { + "type": "static", + "content": "0.5rem" + }, + "borderColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + }, + "borderWidth": { + "type": "static", + "content": "1px" + }, + "borderRadius": { + "type": "static", + "content": "4px" + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + } + }, + "conditions": [] + }, + "list": { + "type": "reusable-project-style-map", + "content": { + "width": { + "type": "static", + "content": "100%" + }, + "margin": { + "type": "static", + "content": "1em 0px 1em 0px" + }, + "display": { + "type": "static", + "content": "block" + }, + "padding": { + "type": "static", + "content": "0px 0px 0px 1.5rem" + }, + "listStyleType": { + "type": "static", + "content": "none" + }, + "listStylePosition": { + "type": "static", + "content": "outside" + } + }, + "conditions": [] + }, + "list-item": { + "type": "reusable-project-style-map", + "content": { + "display": { + "type": "static", + "content": "list-item" + } + }, + "conditions": [] + }, + "teleport-show": { + "type": "reusable-project-style-map", + "content": { + "display": { + "type": "static", + "content": "flex !important" + } + }, + "conditions": [] + }, + "primary-button": { + "type": "reusable-project-style-map", + "content": { + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + }, + "color": { + "type": "static", + "content": "white" + } + }, + "conditions": [] + }, + "secondary-button": { + "type": "reusable-project-style-map", + "content": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + }, + "border": { + "type": "static", + "content": "1px solid" + } + }, + "conditions": [] + }, + "content": { + "type": "reusable-project-style-map", + "content": { + "fontSize": { + "type": "static", + "content": "16px" + }, + "fontFamily": { + "type": "static", + "content": "Inter" + }, + "fontWeight": { + "type": "static", + "content": "400" + }, + "lineHeight": { + "type": "static", + "content": "1.15" + }, + "textTransform": { + "type": "static", + "content": "none" + }, + "textDecoration": { + "type": "static", + "content": "none" + } + } + }, + "heading": { + "type": "reusable-project-style-map", + "content": { + "fontSize": { + "type": "static", + "content": "32px" + }, + "fontFamily": { + "type": "static", + "content": "Inter" + }, + "fontWeight": { + "type": "static", + "content": "700" + }, + "lineHeight": { + "type": "static", + "content": "1.15" + }, + "textTransform": { + "type": "static", + "content": "none" + }, + "textDecoration": { + "type": "static", + "content": "none" + } + } + } + }, + "stateDefinitions": { + "route": { + "type": "string", + "defaultValue": "Home", + "values": [ + { + "value": "Home", + "seo": { + "title": "New Project3", + "metaTags": [ + { + "property": "og:title", + "content": "New Project3" + } + ] + } + }, + { + "value": "About", + "seo": { + "title": "About - New Project3", + "metaTags": [ + { + "property": "og:title", + "content": "About - New Project3" + } + ] + } + }, + { + "value": "Fallback", + "seo": { + "title": "Fallback Page" + }, + "pageOptions": { + "fallback": true + } + } + ] + } + }, + "node": { + "type": "element", + "content": { + "elementType": "Router", + "children": [ + { + "type": "conditional", + "content": { + "node": { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "9f75e760-4477-44cd-8532-36c760cbc8aa": { + "type": "style-map", + "content": { + "conditions": [ + { + "maxWidth": 479, + "conditionType": "screen-size" + } + ], + "mapType": "inlined", + "styles": { + "color": { + "type": "static", + "content": "blue" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "overflow": { + "type": "static", + "content": "auto" + }, + "minHeight": { + "type": "static", + "content": "100vh" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "Header" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "Hero" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "Features" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "Footer" + } + }, + { "type": "element", "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "children": [ - { - "type": "static", - "content": "unique features" - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "h1" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "name": "Separator", - "referencedStyles": {}, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100px" - }, - "height": { - "type": "static", - "content": "2px" - }, - "backgroundColor": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-500" - } - } - }, - "children": [], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "cd040f33-67a8-4194-a378-740a0f93b777": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 767 - } - ], - "mapType": "inlined", - "styles": { - "flexDirection": { - "type": "static", - "content": "column" - } - } - } - }, - "5a18df2a-e0ec-4d76-b136-d24f02d33bb1": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "flexDirection": { - "type": "static", - "content": "column" + "elementType": "html-node", + "attrs": { + "html": { + "type": "raw", + "content": "

Feels like the last 20 mins of Don’t Look Up right about now…

— Netflix (@netflix) November 18, 2022
" } } } - } - }, - "abilities": {}, - "style": { - "flex": { - "type": "static", - "content": "0 0 auto" - }, - "width": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "alignItems": { - "type": "static", - "content": "center" }, - "flexDirection": { - "type": "static", - "content": "row-reverse" - }, - "justifyContent": { - "type": "static", - "content": "space-between" - } - }, - "children": [ { "type": "element", "content": { - "elementType": "container", - "referencedStyles": { - "c3acd586-d5a6-4e65-bfe1-203641c5e037": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "gridTemplateColumns": { - "type": "static", - "content": "1fr" - } - } - } - } - }, - "abilities": {}, + "elementType": "lottie-node", "style": { - "display": { + "width": "200px", + "height": "200px" + }, + "attrs": { + "src": { "type": "static", - "content": "grid" + "content": "https://assets9.lottiefiles.com/datafiles/gUENLc1262ccKIO/data.json" }, - "gridTemplateColumns": { + "autoplay": { "type": "static", - "content": "1fr 1fr" + "content": "true" } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "rootClassName": { - "type": "comp-style", - "content": "rootClassName1" - } - }, - "children": [], - "semanticType": "FeatureCard4" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "rootClassName": { - "type": "comp-style", - "content": "root-class-name-4" - } - }, - "children": [], - "semanticType": "FeatureCard4" - } - }, - { - "type": "element", - "content": { - "elementType": "component", - "dependency": { - "type": "local" - }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "rootClassName": { - "type": "comp-style", - "content": "rootClassName3" - } - }, - "children": [], - "semanticType": "FeatureCard4" - } - }, + } + } + } + ], + "semanticType": "div" + } + }, + "value": "Home", + "reference": { + "type": "dynamic", + "content": { + "referenceType": "state", + "id": "route" + } + } + } + }, + { + "type": "conditional", + "content": { + "node": { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "overflow": { + "type": "static", + "content": "auto" + }, + "minHeight": { + "type": "static", + "content": "100vh" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "rootClassName": { + "type": "comp-style", + "content": "rootClassName" + } + }, + "children": [], + "semanticType": "Header" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "Gallery", + "referencedStyles": { + "785deea7-5086-40af-9e41-9a53bbb0fa28": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + }, + "ff5caa9e-fea4-44a8-900e-a4fc4f90d3e4": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ { "type": "element", "content": { @@ -9883,542 +841,9699 @@ "dependency": { "type": "local" }, - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "rootClassName": { - "type": "comp-style", - "content": "rootClassName2" - } - }, - "children": [], - "semanticType": "FeatureCard4" - } - } - ], - "semanticType": "div" - } - }, - { - "type": "element", - "content": { - "elementType": "image", - "referencedStyles": { - "87b49545-ec8d-49c9-a881-9c5a6267e092": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 991 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "300px" - }, - "height": { - "type": "static", - "content": "300px" - }, - "marginTop": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "marginLeft": { - "type": "static", - "content": "0px" - } - } - } - }, - "18452aa5-5c13-452c-bbe8-07c2cf98f395": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "width": { - "type": "static", - "content": "250px" - }, - "height": { - "type": "static", - "content": "250px" - } - } - } - } - }, - "abilities": {}, - "attrs": { - "alt": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_alt" - } - }, - "src": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_src" - } - } - }, - "style": { - "width": { - "type": "static", - "content": "450px" - }, - "height": { - "type": "static", - "content": "450px" - }, - "objectFit": { - "type": "static", - "content": "cover" - }, - "flexShrink": { - "type": "static", - "content": "0" - }, - "marginLeft": { - "type": "static", - "content": "0px" - }, - "borderRadius": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-radius-radius-round" + "semanticType": "Component" } }, - "objectPosition": { - "type": "static", - "content": "left" - }, - "marginRight": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-fourunits" - } - } - }, - "children": [] - } - } - ], - "semanticType": "div" - } - } - ], - "semanticType": "div" - } - }, - "name": "Features", - "styleSetDefinitions": {} - }, - "GalleryCard3": { - "propDefinitions": { - "subtitle": { - "id": "dfaa53cc-2d2f-4672-9835-167a686aa7db", - "defaultValue": "Lorem ipsum dolor sit amet, consectetur adipiscing elit", - "type": "string" - }, - "image_alt": { - "id": "23e30595-cd74-4996-a201-d8453ffe7de9", - "defaultValue": "image", - "type": "string" - }, - "rootClassName": { - "id": "4140c6dc-ca25-4fba-925a-80baeef3e6f8", - "defaultValue": "", - "type": "string" - }, - "projectTitle": { - "id": "b3987a75-4d70-46ba-ae96-e78d62b7491f", - "defaultValue": "Project Title", - "type": "string" - }, - "image_src": { - "id": "a312f0f9-333b-4aad-86bd-c8e025a81973", - "defaultValue": "https://images.unsplash.com/photo-1523755231516-e43fd2e8dca5?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDF8fG1pbmltYWxpc20lMjBjb3VjaHxlbnwwfHx8fDE2MjY0NDg1NTk&ixlib=rb-1.2.1&h=1000", - "type": "string" - } - }, - "node": { - "type": "element", + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "3rem" + }, + "textAlign": { + "type": "static", + "content": "center" + } + }, + "children": [ + { + "type": "static", + "content": "Our portfolio" + } + ], + "semanticType": "h1" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "f4a07a8b-08f2-46d4-a47b-33b57e57e16e": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + }, + "088b3180-ba7f-4d85-9124-4007789b5d1d": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "textAlign": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-700" + } + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "textAlign": { + "type": "static", + "content": "center" + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non volutpat turpis. " + }, + { + "type": "raw", + "content": " " + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": " " + }, + { + "type": "raw", + "content": " " + } + ] + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "br", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "br" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Mauris luctus rutrum mi ut rhoncus. Integer in dignissim tortor. " + }, + { + "type": "raw", + "content": " " + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": " " + }, + { + "type": "raw", + "content": " " + } + ] + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "111ff2d1-7b22-440d-b9f6-30946dca9598": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "gridTemplateColumns": { + "type": "static", + "content": "1fr" + } + } + } + }, + "4a8a977c-5afe-45e9-bf32-3667e2789650": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "gridTemplateColumns": { + "type": "static", + "content": "1fr 1fr 1fr" + } + } + } + }, + "a819dc66-7304-4c70-864c-f4288dc360c0": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "gridTemplateColumns": { + "type": "static", + "content": "1fr 1fr" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "grid" + }, + "gridGap": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "gridTemplateColumns": { + "type": "static", + "content": "1fr 1fr 1fr 1fr" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "rootClassName": { + "type": "comp-style", + "content": "rootClassName" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1501127122-f385ca6ddd9d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDExfHxtaW5pbWFsaXNtJTIwaG9tZXxlbnwwfHx8fDE2MjY0NDg1Mjc&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName1" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1467043153537-a4fba2cd39ef?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDR8fG1pbmltYWxpc20lMjBob21lfGVufDB8fHx8MTYyNjQ0ODUyNw&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName3" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1531829039722-d3fb3e705a4b?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDE4fHxtaW5pbWFsaXNtJTIwaG9tZXxlbnwwfHx8fDE2MjY0NDg1Mjc&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName2" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1519710164239-da123dc03ef4?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDExfHxtaW5pbWFsaXNtfGVufDB8fHx8MTYyNjQ0NTY1Nw&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName4" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1494438639946-1ebd1d20bf85?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDJ8fG1pbmltYWxpc218ZW58MHx8fHwxNjI2NDQ1NjU3&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName5" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1504198458649-3128b932f49e?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDN8fG1pbmltYWxpc20lMjBob21lfGVufDB8fHx8MTYyNjQ0ODUyNw&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName6" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1453904300235-0f2f60b15b5d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDE3fHxtaW5pbWFsaXNtJTIwaG9tZXxlbnwwfHx8fDE2MjY0NDg1Mjc&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName7" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1493552152660-f915ab47ae9d?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDd8fG1pbmltYWxpc20lMjBob21lfGVufDB8fHx8MTYyNjQ0ODUyNw&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName8" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1510172951991-856a654063f9?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDIwfHxtaW5pbWFsaXNtJTIwaG9tZXxlbnwwfHx8fDE2MjY0NDg1Mjc&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName9" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1449247709967-d4461a6a6103?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDN8fG1pbmltYWxpc218ZW58MHx8fHwxNjI2NDQ1NjU3&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName10" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "image_src": { + "type": "static", + "content": "https://images.unsplash.com/photo-1472157510410-64a053cbc39f?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDh8fG1pbmltYWxpc20lMjBob21lfGVufDB8fHx8MTYyNjQ0ODUyNw&ixlib=rb-1.2.1&h=1000" + }, + "rootClassName": { + "type": "comp-style", + "content": "rootClassName11" + } + }, + "children": [], + "semanticType": "GalleryCard3" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "Pricing", + "referencedStyles": {}, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "backgroundSize": { + "type": "static", + "content": "cover" + }, + "justifyContent": { + "type": "static", + "content": "center" + }, + "backgroundImage": { + "type": "static", + "content": "url('https://images.unsplash.com/photo-1503149779833-1de50ebe5f8a?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDE2fHxzd2lzcyUyMGNoZWVzZSUyMHBsYW50fGVufDB8fHx8MTYyNTg0MTU0Mg&ixlib=rb-1.2.1&h=1200')" + }, + "backgroundPosition": { + "type": "static", + "content": "center" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "a2125a63-cbeb-43b0-9529-e7ac2c8f9b2a": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "flexFlow": { + "type": "static", + "content": "column" + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "6c080f4f-f43d-4d98-9e8c-06577ec49b16": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "backgroundSize": { + "type": "static", + "content": "cover" + }, + "justifyContent": { + "type": "static", + "content": "center" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "PricingCard", + "referencedStyles": { + "4c7bef1b-4917-4ebc-bd58-ffff46cca3c7": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "element-state", + "content": "hover" + } + ], + "mapType": "inlined", + "styles": { + "transform": { + "type": "static", + "content": "scale(1.02)" + } + } + } + }, + "fbb0f3c6-a5e5-4b66-8864-2aecd48d6e83": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "100%" + }, + "maxWidth": { + "type": "static", + "content": "450px" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "marginRight": { + "type": "static", + "content": "0px" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "24eecf33-f1c7-4451-9bd3-1c5b5b1d5c32": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "100%" + }, + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "maxWidth": { + "type": "static", + "content": "100%" + }, + "alignItems": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "maxWidth": { + "type": "static", + "content": "450px" + }, + "minHeight": { + "type": "static", + "content": "450px" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "transition": { + "type": "static", + "content": "0.3s" + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "justifyContent": { + "type": "static", + "content": "space-between" + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "1.5rem" + }, + "fontWeight": { + "type": "static", + "content": "600" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "textTransform": { + "type": "static", + "content": "uppercase" + } + }, + "children": [ + { + "type": "static", + "content": "Free" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "flexDirection": { + "type": "static", + "content": "row" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "1.15rem" + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "fontWeight": { + "type": "static", + "content": "300" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "$" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "4rem" + }, + "fontWeight": { + "type": "static", + "content": "700" + } + }, + "children": [ + { + "type": "static", + "content": "0" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Full access to design tool" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Publish with Teleport" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Subdomain publish" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Download code" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "button", + "referencedStyles": { + "6bd2b679-67f7-4227-83a3-ea89ec6419e9": { + "type": "style-map", + "content": { + "mapType": "project-referenced", + "referenceId": "button" + } + } + }, + "abilities": {}, + "style": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + }, + "marginTop": { + "type": "static", + "content": "auto" + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + } + }, + "children": [ + { + "type": "static", + "content": "Learn More" + } + ] + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "PricingCard", + "referencedStyles": { + "2eb61348-d9b8-486c-a6da-2d4772461273": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "element-state", + "content": "hover" + } + ], + "mapType": "inlined", + "styles": { + "transform": { + "type": "static", + "content": "scale(1.02)" + } + } + } + }, + "d83eb5db-d509-4d8e-b3ea-ab00555d9bc1": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "100%" + }, + "maxWidth": { + "type": "static", + "content": "100%" + }, + "alignItems": { + "type": "static", + "content": "center" + } + } + } + }, + "1284ff41-ddec-4fff-be50-00d190082788": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "100%" + }, + "maxWidth": { + "type": "static", + "content": "450px" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "marginRight": { + "type": "static", + "content": "0px" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "maxWidth": { + "type": "static", + "content": "450px" + }, + "minHeight": { + "type": "static", + "content": "450px" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "transition": { + "type": "static", + "content": "0.3s" + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "1.5rem" + }, + "fontWeight": { + "type": "static", + "content": "600" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "textTransform": { + "type": "static", + "content": "uppercase" + } + }, + "children": [ + { + "type": "static", + "content": "basic" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "flexDirection": { + "type": "static", + "content": "row" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "1.15rem" + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "fontWeight": { + "type": "static", + "content": "300" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "$" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "4rem" + }, + "fontWeight": { + "type": "static", + "content": "700" + } + }, + "children": [ + { + "type": "static", + "content": "9" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "1.15rem" + }, + "fontStyle": { + "type": "static", + "content": "normal" + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "fontWeight": { + "type": "static", + "content": "300" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "/ monthly" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-500" + } + }, + "fontSize": { + "type": "static", + "content": "0.75rem" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Billed annualy or $12 month-to-month." + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ All features of FREE plan" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Connect to custom domains" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Private projects" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ No project limitations" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Unlimited collabotators" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "button", + "referencedStyles": { + "b04dd5a2-d42d-4b26-8502-a39fb959acd0": { + "type": "style-map", + "content": { + "mapType": "project-referenced", + "referenceId": "button" + } + } + }, + "abilities": {}, + "style": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + }, + "marginTop": { + "type": "static", + "content": "auto" + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + } + }, + "children": [ + { + "type": "static", + "content": "Learn More" + } + ] + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "PricingCard", + "referencedStyles": { + "620ab363-8615-4d67-8466-b1ac334928f4": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "element-state", + "content": "hover" + } + ], + "mapType": "inlined", + "styles": { + "transform": { + "type": "static", + "content": "scale(1.02)" + } + } + } + }, + "daa149de-f2b1-4985-9448-d20e00c20ecd": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "100%" + }, + "maxWidth": { + "type": "static", + "content": "100%" + }, + "alignItems": { + "type": "static", + "content": "center" + } + } + } + }, + "4e543b68-d747-4cfb-98cd-aeefcd8d5e47": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "100%" + }, + "maxWidth": { + "type": "static", + "content": "450px" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "marginRight": { + "type": "static", + "content": "0px" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "9b56b8f5-6ad1-45a9-95b9-d20f51ea92ac": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginBottom": { + "type": "static", + "content": "0px" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "maxWidth": { + "type": "static", + "content": "450px" + }, + "minHeight": { + "type": "static", + "content": "450px" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "transition": { + "type": "static", + "content": "0.3s" + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "1.5rem" + }, + "fontWeight": { + "type": "static", + "content": "600" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "textTransform": { + "type": "static", + "content": "uppercase" + } + }, + "children": [ + { + "type": "static", + "content": "Pro" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "flexDirection": { + "type": "static", + "content": "row" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "1.15rem" + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "fontWeight": { + "type": "static", + "content": "300" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "$" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "4rem" + }, + "fontWeight": { + "type": "static", + "content": "700" + } + }, + "children": [ + { + "type": "static", + "content": "29" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "1.15rem" + }, + "fontStyle": { + "type": "static", + "content": "normal" + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "fontWeight": { + "type": "static", + "content": "300" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "/ monthly" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-500" + } + }, + "fontSize": { + "type": "static", + "content": "0.75rem" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Billed annualy or $32 month-to-month." + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ All features of BASIC plan" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Priority support" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Premium analytics" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "✔ Version history" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "button", + "referencedStyles": { + "6aca2dba-b64d-4717-bfe3-f878117af483": { + "type": "style-map", + "content": { + "mapType": "project-referenced", + "referenceId": "button" + } + } + }, + "abilities": {}, + "style": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + }, + "marginTop": { + "type": "static", + "content": "auto" + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + } + }, + "children": [ + { + "type": "static", + "content": "Learn More" + } + ] + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "Footer", + "referencedStyles": { + "ac03a616-c920-4c7a-aa56-b28289887daa": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "4869893b-b47d-45e1-b57b-fb13aa372fac": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + }, + "fd48bb4d-c79b-4f00-aae6-bc08cd53ad18": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "c7971a8b-e181-4297-8ddb-877b1aab505a": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + }, + "137f4fca-36bf-4e77-89c7-6c24bc723820": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "Logo", + "referencedStyles": { + "8f4de6e2-9707-4df7-8a04-f45a03d07430": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "image", + "referencedStyles": { + "47a078fc-35c7-4d8f-be4c-4edcc8006e14": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + } + } + }, + "b97a5c46-575e-4c9d-a973-0c206c237762": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginBottom": { + "type": "static", + "content": "0px" + } + } + } + } + }, + "abilities": {}, + "attrs": { + "alt": { + "type": "static", + "content": "logo" + }, + "src": { + "type": "static", + "content": "https://presentation-website-assets.teleporthq.io/logos/logo.png" + } + }, + "style": { + "height": { + "type": "static", + "content": "2rem" + } + }, + "children": [] + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "29d15ccf-cae9-4d9a-b4b5-350f476359d4": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "e6eced16-ecd0-4396-b8a0-1cf603eb6ceb": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "textAlign": { + "type": "static", + "content": "center" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Professional website builder " + }, + { + "type": "raw", + "content": " " + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": " " + }, + { + "type": "raw", + "content": " " + } + ] + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "br" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "for developers." + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "LinksContainer", + "referencedStyles": { + "2d142f86-2ea7-4bec-aa82-418bfe09a54f": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + }, + "962cef9c-1756-4da5-bf80-309cc72b6864": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "100%" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "Container", + "referencedStyles": { + "c53b00de-c77c-4f19-8bf4-89aa3fe9216a": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-fourunits" + } + } + } + } + }, + "6723537b-7ded-40a3-9f16-75cd103aa0e3": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-fourunits" + } + } + } + } + }, + "8060ddd8-d94f-4c71-bf1c-408f4e96b802": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "static", + "content": "0px" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginRight": { + "type": "static", + "content": "10rem" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "ProductContainer", + "referencedStyles": { + "37ae652f-131d-4e50-964a-261df0b833eb": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-fourunits" + } + } + } + } + }, + "8298ad80-e1ce-4251-8650-35811caab8d1": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-fourunits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "flex": { + "type": "static", + "content": "0 0 auto" + }, + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginRight": { + "type": "static", + "content": "10rem" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontWeight": { + "type": "static", + "content": "700" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "static", + "content": "Product" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "static", + "content": "Features" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "static", + "content": "Pricing" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "static", + "content": "Tutorials" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Releases" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "CompanyContainer", + "referencedStyles": {}, + "abilities": {}, + "style": { + "flex": { + "type": "static", + "content": "0 0 auto" + }, + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontWeight": { + "type": "static", + "content": "700" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "static", + "content": "Company" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "static", + "content": "About" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "static", + "content": "Careers" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "static", + "content": "Contact" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Blog" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "c859d78c-4ef7-4149-8467-fbb930cf7444": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginBottom": { + "type": "static", + "content": "0px" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "Contact", + "referencedStyles": { + "ffd9b25a-4d04-487a-bf86-e7711e63e02d": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontWeight": { + "type": "static", + "content": "700" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "static", + "content": "Contact Us" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "static", + "content": "hello@teleporthq.io" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "+123 (4567) 890" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "Socials", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontWeight": { + "type": "static", + "content": "700" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "static", + "content": "Follow Us" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "IconGroup", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 950.8571428571428 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 877.7142857142857 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M585.143 512c0-80.571-65.714-146.286-146.286-146.286s-146.286 65.714-146.286 146.286 65.714 146.286 146.286 146.286 146.286-65.714 146.286-146.286zM664 512c0 124.571-100.571 225.143-225.143 225.143s-225.143-100.571-225.143-225.143 100.571-225.143 225.143-225.143 225.143 100.571 225.143 225.143zM725.714 277.714c0 29.143-23.429 52.571-52.571 52.571s-52.571-23.429-52.571-52.571 23.429-52.571 52.571-52.571 52.571 23.429 52.571 52.571zM438.857 152c-64 0-201.143-5.143-258.857 17.714-20 8-34.857 17.714-50.286 33.143s-25.143 30.286-33.143 50.286c-22.857 57.714-17.714 194.857-17.714 258.857s-5.143 201.143 17.714 258.857c8 20 17.714 34.857 33.143 50.286s30.286 25.143 50.286 33.143c57.714 22.857 194.857 17.714 258.857 17.714s201.143 5.143 258.857-17.714c20-8 34.857-17.714 50.286-33.143s25.143-30.286 33.143-50.286c22.857-57.714 17.714-194.857 17.714-258.857s5.143-201.143-17.714-258.857c-8-20-17.714-34.857-33.143-50.286s-30.286-25.143-50.286-33.143c-57.714-22.857-194.857-17.714-258.857-17.714zM877.714 512c0 60.571 0.571 120.571-2.857 181.143-3.429 70.286-19.429 132.571-70.857 184s-113.714 67.429-184 70.857c-60.571 3.429-120.571 2.857-181.143 2.857s-120.571 0.571-181.143-2.857c-70.286-3.429-132.571-19.429-184-70.857s-67.429-113.714-70.857-184c-3.429-60.571-2.857-120.571-2.857-181.143s-0.571-120.571 2.857-181.143c3.429-70.286 19.429-132.571 70.857-184s113.714-67.429 184-70.857c60.571-3.429 120.571-2.857 181.143-2.857s120.571-0.571 181.143 2.857c70.286 3.429 132.571 19.429 184 70.857s67.429 113.714 70.857 184c3.429 60.571 2.857 120.571 2.857 181.143z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 602.2582857142856 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M548 6.857v150.857h-89.714c-70.286 0-83.429 33.714-83.429 82.286v108h167.429l-22.286 169.143h-145.143v433.714h-174.857v-433.714h-145.714v-169.143h145.714v-124.571c0-144.571 88.571-223.429 217.714-223.429 61.714 0 114.857 4.571 130.286 6.857z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "Separator", + "referencedStyles": {}, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "height": { + "type": "static", + "content": "1px" + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-900" + } + } + }, + "children": [], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "f9c6c553-e5ec-40ef-b8be-e53ea85a5a5d": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "textAlign": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "alignSelf": { + "type": "static", + "content": "center" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "© 2021 teleportHQ, All Rights Reserved." + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "textAlign": { + "type": "static", + "content": "left" + } + }, + "children": [], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "footer" + } + }, + { + "type": "element", + "content": { + "elementType": "image", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "src": { + "type": "static", + "content": "/kitten.png" + }, + "alt": { + "type": "static", + "content": "image" + } + }, + "style": { + "width": { + "type": "static", + "content": "100px" + }, + "objectFit": { + "type": "static", + "content": "cover" + } + }, + "children": [] + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "width": { + "type": "static", + "content": "100px" + }, + "height": { + "type": "static", + "content": "50px" + }, + "border": { + "type": "static", + "content": "2px dashed rgba(120, 120, 120, 0.4)" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flex": { + "type": "static", + "content": "0 0 auto" + }, + "backgroundImage": { + "type": "static", + "content": "url(\"/kitten.png\")" + }, + "backgroundSize": { + "type": "static", + "content": "cover" + } + }, + "children": [ + { + "type": "static", + "content": "Bg Image" + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "width": { + "type": "static", + "content": "100px" + }, + "height": { + "type": "static", + "content": "50px" + }, + "border": { + "type": "static", + "content": "2px dashed rgba(120, 120, 120, 0.4)" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flex": { + "type": "static", + "content": "0 0 auto" + }, + "backgroundImage": { + "type": "static", + "content": "url(\"/playground_assets/kitten.png\")" + }, + "backgroundSize": { + "type": "static", + "content": "cover" + } + }, + "children": [ + { + "type": "static", + "content": "Bg Image" + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + "value": "About", + "reference": { + "type": "dynamic", + "content": { + "referenceType": "state", + "id": "route" + } + } + } + }, + { + "type": "conditional", + "content": { + "node": { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "overflow": { + "type": "static", + "content": "auto" + }, + "minHeight": { + "type": "static", + "content": "100vh" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "children": [ + { + "type": "static", + "content": "This is a fallback page" + } + ] + } + } + ], + "semanticType": "div" + } + }, + "value": "Fallback", + "reference": { + "type": "dynamic", + "content": { + "referenceType": "state", + "id": "route" + } + } + } + } + ] + } + } + }, + "components": { + "Component": { + "styleSetDefinitions": { + "primaryButton": { "content": { - "elementType": "container", - "name": "GalleryCard", - "referencedStyles": { - "e974b09c-9a78-4e9d-b7cb-2e9fa6ecc430": { - "type": "style-map", - "content": { - "mapType": "component-referenced", - "content": { - "type": "dynamic", + "fontFamily": "Nova Oval", + "fontWeight": 400, + "marginTop": "100px" + }, + "conditions": [], + "type": "reusable-component-style-override" + } + }, + "propDefinitions": {}, + "node": { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "height": { + "type": "static", + "content": "400px" + }, + "display": { + "type": "static", + "content": "flex" + }, + "position": { + "type": "static", + "content": "relative" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "style": { + "fontFamily": { + "type": "static", + "content": "Inter" + } + }, + "referencedStyles": { + "1284ff41-ddec-4fff-be50-00d190082788": { + "type": "style-map", "content": { - "referenceType": "prop", - "id": "rootClassName" + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "fontFamily": { + "type": "static", + "content": "Chivo Mono" + } + } } } - } + }, + "children": [ + "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book." + ] } }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "height": { - "type": "static", - "content": "100%" - }, - "display": { - "type": "static", - "content": "flex" - }, - "position": { - "type": "static", - "content": "relative" - }, - "alignItems": { - "type": "static", - "content": "flex-start" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "center" + { + "type": "element", + "content": { + "elementType": "container", + "style": { + "fontFamily": { + "type": "static", + "content": "Sedgwick Ave Display" + }, + "fontWeight": "400", + "marginTop": "100px" + }, + "children": [ + "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book." + ] } }, - "children": [ - { - "type": "element", - "content": { - "elementType": "image", - "referencedStyles": {}, - "abilities": {}, - "attrs": { - "alt": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_alt" - } - }, - "src": { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "image_src" - } - } - }, - "style": { - "top": { - "type": "static", - "content": "0px" - }, - "left": { - "type": "static", - "content": "0px" - }, - "right": { - "type": "static", - "content": "auto" - }, - "width": { - "type": "static", - "content": "100%" - }, - "bottom": { - "type": "static", - "content": "auto" - }, - "height": { - "type": "static", - "content": "100%" - }, - "position": { - "type": "static", - "content": "absolute" - }, - "objectFit": { - "type": "static", - "content": "cover" - } - }, - "children": [] - } - }, - { - "type": "element", - "content": { - "elementType": "container", - "referencedStyles": { - "c4899df3-f64e-4e84-8b51-15b5c84547f4": { - "type": "style-map", + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "c1964328-5a00-4e1e-a118-f395998202c1": { + "type": "style-map", + "content": { + "mapType": "component-referenced", "content": { - "conditions": [ - { - "conditionType": "element-state", - "content": "hover" - } - ], - "mapType": "inlined", - "styles": { - "opacity": { - "type": "static", - "content": "1" - } + "type": "dynamic", + "content": { + "referenceType": "comp", + "id": "primaryButton" } } } - }, - "abilities": {}, - "style": { - "width": { - "type": "static", - "content": "100%" - }, - "height": { - "type": "static", - "content": "300px" - }, - "zIndex": { - "type": "static", - "content": "1" - }, - "display": { - "type": "static", - "content": "flex" - }, - "opacity": { - "type": "static", - "content": "0" - }, - "padding": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-twounits" - } - }, - "alignItems": { - "type": "static", - "content": "center" - }, - "transition": { - "type": "static", - "content": "0.3s" - }, - "flexDirection": { - "type": "static", - "content": "column" - }, - "justifyContent": { - "type": "static", - "content": "center" - }, - "backgroundImage": { - "type": "static", - "content": "linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.9));" - } - }, - "children": [ - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": { - "55294827-55af-4fb6-a2af-916354a2c3a7": { - "type": "style-map", - "content": { - "conditions": [ - { - "conditionType": "screen-size", - "maxWidth": 479 - } - ], - "mapType": "inlined", - "styles": { - "alignSelf": { - "type": "static", - "content": "center" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-unit" - } - } - } - } - } - }, - "abilities": {}, - "style": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - }, - "fontSize": { - "type": "static", - "content": "1.5rem" - }, - "textAlign": { - "type": "static", - "content": "center" - }, - "fontWeight": { - "type": "static", - "content": "500" - }, - "marginBottom": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-space-space-oneandhalfunits" - } - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "projectTitle" - } - } - ], - "semanticType": "h1" - } - }, - { - "type": "element", - "content": { - "elementType": "text", - "referencedStyles": {}, - "abilities": {}, - "style": { - "color": { - "type": "dynamic", - "content": { - "referenceType": "token", - "id": "--dl-color-gray-white" - } - }, - "textAlign": { - "type": "static", - "content": "center" - } - }, - "children": [ - { - "type": "dynamic", - "content": { - "referenceType": "prop", - "id": "subtitle" - } - } - ], - "semanticType": "span" - } - } - ], - "semanticType": "div" - } + } + }, + "children": [ + "Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book." + ] } - ], - "semanticType": "div" - } - }, - "name": "GalleryCard3", - "styleSetDefinitions": { - "rootClassName": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName1": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName2": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName3": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName4": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName5": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName6": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName7": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName8": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName9": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName10": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - }, - "rootClassName11": { - "content": {}, - "conditions": [], - "type": "reusable-component-style-override" - } - } - } - } + } + ], + "semanticType": "div" + } + }, + "name": "Component" + }, + "NavigationLinks": { + "propDefinitions": { + "text": { + "id": "aabae333-9120-42d3-9e36-525fb14689aa", + "defaultValue": "About", + "type": "string" + }, + "text3": { + "id": "5361ad50-a4f4-4c08-99b9-165314e12824", + "defaultValue": "Team", + "type": "string" + }, + "text4": { + "id": "0b56039c-7529-41ba-a510-a84252dff14c", + "defaultValue": "Blog", + "type": "string" + }, + "text1": { + "id": "717f2fc1-a3fe-4899-b7c2-1fb7d6c102f6", + "defaultValue": "Features", + "type": "string" + }, + "rootClassName": { + "id": "5f6c32bd-c13a-420a-944d-19e76359ea81", + "defaultValue": "", + "type": "string" + }, + "text2": { + "id": "cdbb8227-1e43-4506-abf0-538fcfc28eb3", + "defaultValue": "Pricing", + "type": "string" + } + }, + "node": { + "type": "element", + "content": { + "elementType": "container", + "name": "Nav", + "referencedStyles": { + "2f4a08a2-f790-49da-8dd3-658cf6d92000": { + "type": "style-map", + "content": { + "mapType": "component-referenced", + "content": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "rootClassName" + } + } + } + }, + "b347ca72-94de-4cfb-80f1-961cdac81b93": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + } + }, + "abilities": {}, + "style": { + "flex": { + "type": "static", + "content": "0 0 auto" + }, + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "row" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "db1acee6-818e-4ae8-b7e0-dd1637733a28": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + } + }, + "abilities": { + "link": { + "type": "navlink", + "content": { + "routeName": "About" + } + } + }, + "style": { + "textDecoration": { + "type": "static", + "content": "none" + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "f0040a92-5fc6-4367-99b6-ed0d915450a6": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginLeft": { + "type": "static", + "content": "0" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "marginLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text1" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "7a317b89-1ff8-4904-8e39-cd3596864c32": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginLeft": { + "type": "static", + "content": "0" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "marginLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text2" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "a4ccfeca-7315-43b8-9c59-2a32cbaac84f": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginLeft": { + "type": "static", + "content": "0" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "marginLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text3" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "0c8b2e95-0504-40e8-accf-bb8834a13069": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginLeft": { + "type": "static", + "content": "0" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "marginLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text4" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "nav" + } + }, + "name": "NavigationLinks", + "styleSetDefinitions": { + "rootClassName": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName1": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName2": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName3": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName4": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName5": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName6": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName7": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + } + } + }, + "Header": { + "propDefinitions": { + "image_src": { + "id": "601323c3-d5dc-4b10-80ad-c525b657b1f5", + "defaultValue": "https://presentation-website-assets.teleporthq.io/logos/logo.png", + "type": "string" + }, + "image_alt": { + "id": "cc962a83-18b6-4726-a48e-76e052f2c185", + "defaultValue": "logo", + "type": "string" + }, + "Login": { + "id": "86ba5e4e-f72c-4a5e-8ea9-062cee745891", + "defaultValue": "Login", + "type": "string" + }, + "Register": { + "id": "2236a64f-65fb-4c6e-bad4-0b49edbab440", + "defaultValue": "Register", + "type": "string" + }, + "image_src1": { + "id": "96165675-8961-4677-a985-1009731609c3", + "defaultValue": "https://presentation-website-assets.teleporthq.io/logos/logo.png", + "type": "string" + }, + "image_alt1": { + "id": "0fc7986b-0f08-497d-b6c5-089ed630cb86", + "defaultValue": "image", + "type": "string" + }, + "rootClassName": { + "id": "6e03e757-c9ee-4826-ac1c-3bab4a847b2c", + "defaultValue": "", + "type": "string" + } + }, + "node": { + "type": "element", + "content": { + "elementType": "container", + "name": "Header", + "referencedStyles": { + "f7a70914-a93d-42b6-8e08-d7308f987005": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + }, + "7ce7d4c6-65a0-42ef-92b1-533545d32ecb": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "c1964328-5a00-4e1e-a118-f395998202c1": { + "type": "style-map", + "content": { + "mapType": "component-referenced", + "content": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "rootClassName" + } + } + } + } + }, + "abilities": {}, + "attrs": { + "data-role": { + "type": "static", + "content": "Header" + } + }, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "image", + "referencedStyles": {}, + "abilities": { + "link": { + "type": "navlink", + "content": { + "routeName": "Home" + } + } + }, + "attrs": { + "alt": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_alt" + } + }, + "src": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_src" + } + } + }, + "style": { + "height": { + "type": "static", + "content": "2rem" + }, + "textDecoration": { + "type": "static", + "content": "none" + } + }, + "children": [] + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "Nav", + "referencedStyles": { + "2a26b67b-d08e-48f6-ac60-32f02dc0f471": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "display": { + "type": "static", + "content": "none" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "name": "NavigationLinks", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "rootClassName": { + "type": "comp-style", + "content": "rootClassName10" + } + }, + "children": [], + "semanticType": "NavigationLinks" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "BtnGroup", + "referencedStyles": { + "10826acb-433c-4b96-a5a0-d597b3b7d44a": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "display": { + "type": "static", + "content": "none" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "button", + "name": "Login", + "referencedStyles": { + "1c601ebb-ac3d-4b4a-b28e-eeadc638127a": { + "type": "style-map", + "content": { + "mapType": "project-referenced", + "referenceId": "button" + } + } + }, + "abilities": {}, + "style": { + "borderWidth": { + "type": "static", + "content": "0px" + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "Login" + } + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "button", + "name": "Register", + "referencedStyles": { + "cea81a34-4ba7-4d42-a34d-ee567ffc9432": { + "type": "style-map", + "content": { + "mapType": "project-referenced", + "referenceId": "button" + } + } + }, + "abilities": {}, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "Register" + } + } + ] + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "BurgerMenu", + "referencedStyles": { + "e77c96cc-f59e-47c8-8c4d-c96a425741b9": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "justifyContent": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "attrs": { + "data-type": { + "type": "static", + "content": "BurgerMenu" + } + }, + "style": { + "display": { + "type": "static", + "content": "none" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 1024 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M128 554.667h768c23.552 0 42.667-19.115 42.667-42.667s-19.115-42.667-42.667-42.667h-768c-23.552 0-42.667 19.115-42.667 42.667s19.115 42.667 42.667 42.667zM128 298.667h768c23.552 0 42.667-19.115 42.667-42.667s-19.115-42.667-42.667-42.667h-768c-23.552 0-42.667 19.115-42.667 42.667s19.115 42.667 42.667 42.667zM128 810.667h768c23.552 0 42.667-19.115 42.667-42.667s-19.115-42.667-42.667-42.667h-768c-23.552 0-42.667 19.115-42.667 42.667s19.115 42.667 42.667 42.667z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "MobileMenu", + "referencedStyles": { + "1d4e9d28-28c5-4ccc-982e-ecfc69bb5152": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "padding": { + "type": "static", + "content": "16px" + } + } + } + } + }, + "abilities": {}, + "attrs": { + "data-type": { + "type": "static", + "content": "MobileMenu" + } + }, + "style": { + "top": { + "type": "static", + "content": "0px" + }, + "left": { + "type": "static", + "content": "0px" + }, + "width": { + "type": "static", + "content": "100%" + }, + "height": { + "type": "static", + "content": "100vh" + }, + "zIndex": { + "type": "static", + "content": "100" + }, + "display": { + "type": "static", + "content": "none" + }, + "padding": { + "type": "static", + "content": "32px" + }, + "position": { + "type": "static", + "content": "absolute" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + }, + "backgroundColor": { + "type": "static", + "content": "#fff" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "Nav", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "Container", + "referencedStyles": {}, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "image", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "alt": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_alt1" + } + }, + "src": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_src1" + } + } + }, + "style": { + "height": { + "type": "static", + "content": "2rem" + } + }, + "children": [] + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "MenuClose", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "data-type": { + "type": "static", + "content": "CloseMobileMenu" + } + }, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "justifyContent": { + "type": "static", + "content": "center" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 1024 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M810 274l-238 238 238 238-60 60-238-238-238 238-60-60 238-238-238-238 60-60 238 238 238-238z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "name": "NavigationLinks", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "rootClassName": { + "type": "comp-style", + "content": "rootClassName11" + } + }, + "children": [], + "semanticType": "NavigationLinks" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "IconGroup", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 950.8571428571428 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 877.7142857142857 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M585.143 512c0-80.571-65.714-146.286-146.286-146.286s-146.286 65.714-146.286 146.286 65.714 146.286 146.286 146.286 146.286-65.714 146.286-146.286zM664 512c0 124.571-100.571 225.143-225.143 225.143s-225.143-100.571-225.143-225.143 100.571-225.143 225.143-225.143 225.143 100.571 225.143 225.143zM725.714 277.714c0 29.143-23.429 52.571-52.571 52.571s-52.571-23.429-52.571-52.571 23.429-52.571 52.571-52.571 52.571 23.429 52.571 52.571zM438.857 152c-64 0-201.143-5.143-258.857 17.714-20 8-34.857 17.714-50.286 33.143s-25.143 30.286-33.143 50.286c-22.857 57.714-17.714 194.857-17.714 258.857s-5.143 201.143 17.714 258.857c8 20 17.714 34.857 33.143 50.286s30.286 25.143 50.286 33.143c57.714 22.857 194.857 17.714 258.857 17.714s201.143 5.143 258.857-17.714c20-8 34.857-17.714 50.286-33.143s25.143-30.286 33.143-50.286c22.857-57.714 17.714-194.857 17.714-258.857s5.143-201.143-17.714-258.857c-8-20-17.714-34.857-33.143-50.286s-30.286-25.143-50.286-33.143c-57.714-22.857-194.857-17.714-258.857-17.714zM877.714 512c0 60.571 0.571 120.571-2.857 181.143-3.429 70.286-19.429 132.571-70.857 184s-113.714 67.429-184 70.857c-60.571 3.429-120.571 2.857-181.143 2.857s-120.571 0.571-181.143-2.857c-70.286-3.429-132.571-19.429-184-70.857s-67.429-113.714-70.857-184c-3.429-60.571-2.857-120.571-2.857-181.143s-0.571-120.571 2.857-181.143c3.429-70.286 19.429-132.571 70.857-184s113.714-67.429 184-70.857c60.571-3.429 120.571-2.857 181.143-2.857s120.571-0.571 181.143 2.857c70.286 3.429 132.571 19.429 184 70.857s67.429 113.714 70.857 184c3.429 60.571 2.857 120.571 2.857 181.143z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 602.2582857142856 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M548 6.857v150.857h-89.714c-70.286 0-83.429 33.714-83.429 82.286v108h167.429l-22.286 169.143h-145.143v433.714h-174.857v-433.714h-145.714v-169.143h145.714v-124.571c0-144.571 88.571-223.429 217.714-223.429 61.714 0 114.857 4.571 130.286 6.857z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "header" + } + }, + "name": "Header", + "styleSetDefinitions": { + "rootClassName": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + } + } + }, + "Hero": { + "propDefinitions": { + "image_src": { + "id": "09427368-90c9-497c-907e-754b8ba0b139", + "defaultValue": "https://images.unsplash.com/photo-1525498128493-380d1990a112?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDI0fHxtaW5pbWFsaXNtJTIwZ3JlZW58ZW58MHx8fHwxNjI1ODQxMDcw&ixlib=rb-1.2.1&h=1200", + "type": "string" + }, + "image_alt": { + "id": "2bad8f83-542b-448b-90de-314212b2b334", + "defaultValue": "image", + "type": "string" + }, + "heading": { + "id": "9e1857ce-9f52-4dcd-9000-ddaab6af0a53", + "defaultValue": "Magnificent things are very simple", + "type": "string" + }, + "button": { + "id": "f4abacea-00b2-4c0b-8ccf-c23d0f0c7700", + "defaultValue": "Get Started", + "type": "string" + }, + "button1": { + "id": "1b3866f9-5667-4b4f-97c4-5ca79f8254a4", + "defaultValue": "Learn More", + "type": "string" + } + }, + "node": { + "type": "element", + "content": { + "elementType": "container", + "name": "Hero", + "referencedStyles": { + "3ffdd7c0-6c8f-4139-9d57-9cd88f43cf27": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "5936298f-80ab-4221-83f8-90ce5984b023": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + }, + "86ca7cf7-0b5b-4453-9e30-c15e16c6165b": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "minHeight": { + "type": "static", + "content": "80vh" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "344948ea-fea3-42a4-8fc0-d3a4e382744b": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + }, + "marginRight": { + "type": "static", + "content": "0px" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "static", + "content": "0px" + } + } + } + }, + "6776dbcd-58b2-4513-bcb8-25761c12a4c7": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "78d44ec5-87ca-4329-b211-c840c24bd2ce": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "textAlign": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "3rem" + }, + "maxWidth": { + "type": "static", + "content": "450px" + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "heading" + } + } + ], + "semanticType": "h1" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "3eb02776-c341-43c5-abc4-73114f485316": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + }, + "0d41a2f4-38bc-40bd-b7ac-bcebe032d0f3": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "textAlign": { + "type": "static", + "content": "center" + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non volutpat turpis. " + }, + { + "type": "raw", + "content": " " + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": " " + }, + { + "type": "raw", + "content": " " + } + ] + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Mauris luctus rutrum mi ut rhoncus. Integer in dignissim tortor. " + }, + { + "type": "raw", + "content": " " + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": " " + }, + { + "type": "raw", + "content": " " + } + ] + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "BtnGroup", + "referencedStyles": { + "a8f29e6c-4bf5-460a-9d21-2680a2c1c1a4": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "row" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "button", + "referencedStyles": { + "587387e6-9e19-499b-a10b-25e16c26f942": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "element-state", + "content": "hover" + } + ], + "mapType": "inlined", + "styles": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + } + } + } + }, + "059c93d1-c3d3-4662-9c6c-d2a861154c5d": { + "type": "style-map", + "content": { + "mapType": "project-referenced", + "referenceId": "button" + } + }, + "0552c021-5ab1-4d40-99b8-04d3fa063d10": { + "id": "0552c021-5ab1-4d40-99b8-04d3fa063d10", + "type": "style-map", + "content": { + "mapType": "project-referenced", + "referenceId": "primary-button" + } + } + }, + "abilities": {}, + "style": { + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "transition": { + "type": "static", + "content": "0.3s" + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "button" + } + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "button", + "referencedStyles": { + "20c40652-8f4b-4675-989c-8485b2f3f1b7": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "element-state", + "content": "hover" + } + ], + "mapType": "inlined", + "styles": { + "borderColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + }, + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-black" + } + } + } + } + }, + "06670c8b-a0c0-491d-83f1-56c73d7ae213": { + "type": "style-map", + "content": { + "mapType": "project-referenced", + "referenceId": "button" + } + }, + "49c3aaf7-2ca0-4cf4-a9cd-c6582c629dc7": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "marginLeft": { + "type": "static", + "content": "0px" + } + } + } + }, + "9e7b7ffa-1ad3-42f3-9535-76a6d74b5691": { + "id": "9e7b7ffa-1ad3-42f3-9535-76a6d74b5691", + "type": "style-map", + "content": { + "mapType": "project-referenced", + "referenceId": "secondary-button" + } + } + }, + "abilities": {}, + "style": { + "marginLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "transition": { + "type": "static", + "content": "0.3s" + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "button1" + } + } + ] + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "image", + "referencedStyles": { + "885d62f9-2b10-4b14-8373-daa3ee90391b": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "80%" + } + } + } + } + }, + "abilities": {}, + "attrs": { + "alt": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_alt" + } + }, + "src": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_src" + } + } + }, + "style": { + "width": { + "type": "static", + "content": "400px" + }, + "objectFit": { + "type": "static", + "content": "cover" + } + }, + "children": [] + } + } + ], + "semanticType": "div" + } + }, + "name": "Hero", + "styleSetDefinitions": {} + }, + "FeatureCard4": { + "propDefinitions": { + "rootClassName": { + "id": "636d6f8e-21c7-45e6-9cf9-32fc692a69a8", + "defaultValue": "rootClassName", + "type": "string" + }, + "content": { + "id": "d94491db-94d1-4835-9934-0c3ff6b67840", + "defaultValue": "Lorem ipsum", + "type": "string" + }, + "description": { + "id": "6dc72a07-1492-4860-89f3-0e8b6d2e4a73", + "defaultValue": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. In lorem lorem, malesuada in metus vitae, scelerisque accumsan ipsum.", + "type": "string" + } + }, + "node": { + "type": "element", + "content": { + "elementType": "container", + "name": "FeatureCard", + "referencedStyles": { + "0a40e87e-9c79-4469-a141-6abb2801ebe9": { + "type": "style-map", + "content": { + "mapType": "component-referenced", + "content": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "rootClassName" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + }, + "backgroundColor": { + "type": "static", + "content": "#fff" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 1024 1024" + } + }, + "style": { + "fill": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-500" + } + }, + "width": { + "type": "static", + "content": "2rem" + }, + "height": { + "type": "static", + "content": "2rem" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M809.003 291.328l-297.003 171.819-297.003-171.819 275.456-157.397c4.779-2.731 9.899-4.48 15.147-5.333 9.301-1.451 18.987 0.128 27.904 5.291zM491.776 979.669c6.016 3.243 12.928 5.077 20.224 5.077 7.381 0 14.336-1.877 20.395-5.163 15.189-2.475 29.909-7.68 43.392-15.36l298.709-170.709c26.368-15.232 45.269-38.315 55.424-64.597 5.675-14.592 8.619-30.165 8.747-46.251v-341.333c0-20.395-4.821-39.723-13.397-56.917-0.939-3.029-2.219-5.973-3.883-8.832-1.963-3.371-4.267-6.357-6.912-8.96-1.323-1.835-2.731-3.669-4.139-5.419-9.813-12.203-21.845-22.528-35.456-30.507l-299.051-170.88c-26.027-15.019-55.467-19.84-83.328-15.531-15.531 2.432-30.507 7.637-44.288 15.488l-298.709 170.709c-16.341 9.429-29.824 21.888-40.149 36.267-2.56 2.56-4.864 5.547-6.784 8.832-1.664 2.901-2.987 5.888-3.925 8.96-1.707 3.456-3.243 6.955-4.608 10.496-5.632 14.635-8.576 30.208-8.704 45.995v341.632c0.043 30.293 10.581 58.197 28.331 80.128 9.813 12.203 21.845 22.528 35.456 30.507l299.051 170.88c13.824 7.979 28.587 13.099 43.605 15.445zM469.333 537.045v340.949l-277.12-158.336c-4.736-2.773-8.832-6.315-12.16-10.411-5.931-7.381-9.387-16.512-9.387-26.581v-318.379zM554.667 877.995v-340.949l298.667-172.757v318.379c-0.043 5.163-1.067 10.496-2.987 15.445-3.413 8.789-9.6 16.384-18.176 21.333z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "4861a50b-badf-4395-969d-f0d2d597a7f8": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "fontStyle": { + "type": "static", + "content": "normal" + }, + "fontWeight": { + "type": "static", + "content": "600" + } + } + } + }, + "4861a50b-badf-4395-969d-f0d2d597a7f9": { + "type": "style-map", + "content": { + "mapType": "component-referenced", + "content": { + "type": "dynamic", + "content": { + "referenceType": "comp", + "id": "root-class-name-4" + } + } + } + } + }, + "abilities": {}, + "style": { + "fontWeight": { + "type": "static", + "content": "600" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "content" + } + } + ], + "semanticType": "h2" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-700" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "description" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + "name": "FeatureCard4", + "styleSetDefinitions": { + "rootClassName": { + "content": { + "width": { + "type": "static", + "content": "100%" + } + }, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName1": { + "content": { + "backgroundColor": { + "type": "static", + "content": "#D9D9D9" + } + }, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName2": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName3": { + "content": { + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-500" + } + } + }, + "conditions": [], + "type": "reusable-component-style-override" + }, + "root-class-name-4": { + "content": { + "backgroundColor": { + "type": "static", + "content": "#1e622e" + } + }, + "conditions": [], + "type": "reusable-component-style-override" + } + } + }, + "Footer": { + "propDefinitions": { + "image_src": { + "id": "6d430ad8-cb40-4250-b292-0f9347922fd4", + "defaultValue": "https://presentation-website-assets.teleporthq.io/logos/logo.png", + "type": "string" + }, + "image_alt": { + "id": "35f73ad8-b02b-499a-a50f-a2a4ae261041", + "defaultValue": "logo", + "type": "string" + }, + "text": { + "id": "f439a1c6-dc7e-4c0b-953e-164f500ea79a", + "defaultValue": "Product", + "type": "string" + }, + "text1": { + "id": "769f76f8-465b-44e5-93a0-7ebfade13735", + "defaultValue": "Features", + "type": "string" + }, + "text2": { + "id": "32e8d12d-84ec-409c-82d5-ef77113c72f3", + "defaultValue": "Pricing", + "type": "string" + }, + "text3": { + "id": "5d23b5af-a1a2-4333-9918-46c68e6f5eba", + "defaultValue": "Tutorials", + "type": "string" + }, + "text4": { + "id": "afba6e7d-307b-45b6-ab0a-d014282b9268", + "defaultValue": "Releases", + "type": "string" + }, + "text5": { + "id": "215a600d-7431-480e-96d5-0205369937d9", + "defaultValue": "Company", + "type": "string" + }, + "text6": { + "id": "2ee23e1a-5866-4e9f-ac6c-a72377bca4dc", + "defaultValue": "About", + "type": "string" + }, + "text7": { + "id": "2338ebbd-abc8-455e-b1d6-ab408da34684", + "defaultValue": "Careers", + "type": "string" + }, + "text8": { + "id": "b731f788-58ce-4d92-b927-67c5874962d4", + "defaultValue": "Contact", + "type": "string" + }, + "text9": { + "id": "d9ea966f-047a-400f-8931-3a2e16d71546", + "defaultValue": "Blog", + "type": "string" + }, + "text10": { + "id": "62ac6502-a643-4d9a-b713-3bff2478ce29", + "defaultValue": "Contact Us", + "type": "string" + }, + "text11": { + "id": "21306fb7-5805-4139-8336-adf6cd681ddc", + "defaultValue": "hello@teleporthq.io", + "type": "string" + }, + "text12": { + "id": "0d56149b-47f9-4c63-9076-012f45e04c3c", + "defaultValue": "+123 (4567) 890", + "type": "string" + }, + "text13": { + "id": "54425500-d989-421d-b417-6bc76bb82da1", + "defaultValue": "Follow Us", + "type": "string" + } + }, + "node": { + "type": "element", + "content": { + "elementType": "container", + "name": "Footer", + "referencedStyles": { + "c231f77e-4ec0-4a78-b2f4-ee069175f2e2": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "d591d1fb-aa7f-4b65-8d81-3d292f60ea8f": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + }, + "d818d218-816a-4881-bc89-00aa79c1d182": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "d7de3cf9-1305-4fd9-8b37-4efa8edc8ec5": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + }, + "c80f767b-f98d-4532-aa21-6f1ea7e46836": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "Logo", + "referencedStyles": { + "9882a10b-2511-41ca-abc1-2a37a3c6c373": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "image", + "referencedStyles": { + "d240470c-85db-475e-98e8-1c1d24ec6671": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + } + } + }, + "e7e77db5-9bd9-4ce2-b392-8221ea397711": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginBottom": { + "type": "static", + "content": "0px" + } + } + } + } + }, + "abilities": {}, + "attrs": { + "alt": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_alt" + } + }, + "src": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_src" + } + } + }, + "style": { + "height": { + "type": "static", + "content": "2rem" + } + }, + "children": [] + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "626b0960-401a-4da9-b49a-448e5238a70b": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "c5a0e725-e23a-46a5-8126-957e5af046ff": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "textAlign": { + "type": "static", + "content": "center" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Professional website builder " + }, + { + "type": "raw", + "content": " " + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": " " + }, + { + "type": "raw", + "content": " " + } + ] + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "br" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "for developers." + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "LinksContainer", + "referencedStyles": { + "cfe534c9-3e1f-4491-a3c9-a481dabba616": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + }, + "b2c5c473-2dec-4e76-911c-e71b0f248ea8": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "100%" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "Container", + "referencedStyles": { + "92317702-2334-442c-a33c-f590e61cb8e6": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-fourunits" + } + } + } + } + }, + "2296ba24-e475-4425-9efe-b60fe3ee138b": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-fourunits" + } + } + } + } + }, + "dce7778b-c389-45ed-85ce-635f74022422": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "static", + "content": "0px" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginRight": { + "type": "static", + "content": "10rem" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "ProductContainer", + "referencedStyles": { + "d2eb228c-3fe0-4b71-abe1-a8f930a3e9be": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-fourunits" + } + } + } + } + }, + "75c35b91-d1e2-453a-bbe4-515319b5057d": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-fourunits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "flex": { + "type": "static", + "content": "0 0 auto" + }, + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginRight": { + "type": "static", + "content": "10rem" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontWeight": { + "type": "static", + "content": "700" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text1" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text2" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text3" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text4" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "CompanyContainer", + "referencedStyles": {}, + "abilities": {}, + "style": { + "flex": { + "type": "static", + "content": "0 0 auto" + }, + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontWeight": { + "type": "static", + "content": "700" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text5" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text6" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text7" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text8" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text9" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "efc6020d-7bec-4b57-94be-cac257605d54": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginBottom": { + "type": "static", + "content": "0px" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "name": "Contact", + "referencedStyles": { + "1abbd246-985f-4fd9-bf80-5af756e5bb72": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontWeight": { + "type": "static", + "content": "700" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text10" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text11" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text12" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "Socials", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "flex-start" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "fontWeight": { + "type": "static", + "content": "700" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "text13" + } + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "IconGroup", + "referencedStyles": {}, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "flex" + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "row" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 950.8571428571428 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M925.714 233.143c-25.143 36.571-56.571 69.143-92.571 95.429 0.571 8 0.571 16 0.571 24 0 244-185.714 525.143-525.143 525.143-104.571 0-201.714-30.286-283.429-82.857 14.857 1.714 29.143 2.286 44.571 2.286 86.286 0 165.714-29.143 229.143-78.857-81.143-1.714-149.143-54.857-172.571-128 11.429 1.714 22.857 2.857 34.857 2.857 16.571 0 33.143-2.286 48.571-6.286-84.571-17.143-148-91.429-148-181.143v-2.286c24.571 13.714 53.143 22.286 83.429 23.429-49.714-33.143-82.286-89.714-82.286-153.714 0-34.286 9.143-65.714 25.143-93.143 90.857 112 227.429 185.143 380.571 193.143-2.857-13.714-4.571-28-4.571-42.286 0-101.714 82.286-184.571 184.571-184.571 53.143 0 101.143 22.286 134.857 58.286 41.714-8 81.714-23.429 117.143-44.571-13.714 42.857-42.857 78.857-81.143 101.714 37.143-4 73.143-14.286 106.286-28.571z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 877.7142857142857 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M585.143 512c0-80.571-65.714-146.286-146.286-146.286s-146.286 65.714-146.286 146.286 65.714 146.286 146.286 146.286 146.286-65.714 146.286-146.286zM664 512c0 124.571-100.571 225.143-225.143 225.143s-225.143-100.571-225.143-225.143 100.571-225.143 225.143-225.143 225.143 100.571 225.143 225.143zM725.714 277.714c0 29.143-23.429 52.571-52.571 52.571s-52.571-23.429-52.571-52.571 23.429-52.571 52.571-52.571 52.571 23.429 52.571 52.571zM438.857 152c-64 0-201.143-5.143-258.857 17.714-20 8-34.857 17.714-50.286 33.143s-25.143 30.286-33.143 50.286c-22.857 57.714-17.714 194.857-17.714 258.857s-5.143 201.143 17.714 258.857c8 20 17.714 34.857 33.143 50.286s30.286 25.143 50.286 33.143c57.714 22.857 194.857 17.714 258.857 17.714s201.143 5.143 258.857-17.714c20-8 34.857-17.714 50.286-33.143s25.143-30.286 33.143-50.286c22.857-57.714 17.714-194.857 17.714-258.857s5.143-201.143-17.714-258.857c-8-20-17.714-34.857-33.143-50.286s-30.286-25.143-50.286-33.143c-57.714-22.857-194.857-17.714-258.857-17.714zM877.714 512c0 60.571 0.571 120.571-2.857 181.143-3.429 70.286-19.429 132.571-70.857 184s-113.714 67.429-184 70.857c-60.571 3.429-120.571 2.857-181.143 2.857s-120.571 0.571-181.143-2.857c-70.286-3.429-132.571-19.429-184-70.857s-67.429-113.714-70.857-184c-3.429-60.571-2.857-120.571-2.857-181.143s-0.571-120.571 2.857-181.143c3.429-70.286 19.429-132.571 70.857-184s113.714-67.429 184-70.857c60.571-3.429 120.571-2.857 181.143-2.857s120.571-0.571 181.143 2.857c70.286 3.429 132.571 19.429 184 70.857s67.429 113.714 70.857 184c3.429 60.571 2.857 120.571 2.857 181.143z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + }, + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "viewBox": { + "type": "static", + "content": "0 0 602.2582857142856 1024" + } + }, + "style": { + "width": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + }, + "height": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-xsmall" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "icon", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "d": { + "type": "static", + "content": "M548 6.857v150.857h-89.714c-70.286 0-83.429 33.714-83.429 82.286v108h167.429l-22.286 169.143h-145.143v433.714h-174.857v-433.714h-145.714v-169.143h145.714v-124.571c0-144.571 88.571-223.429 217.714-223.429 61.714 0 114.857 4.571 130.286 6.857z" + } + }, + "children": [], + "semanticType": "path" + } + } + ] + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "Separator", + "referencedStyles": {}, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "height": { + "type": "static", + "content": "1px" + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-900" + } + } + }, + "children": [], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "02e79181-ec5c-485d-8f0b-eb886d79949d": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "textAlign": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "alignSelf": { + "type": "static", + "content": "center" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "© 2021 teleportHQ, All Rights Reserved." + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "textAlign": { + "type": "static", + "content": "left" + } + }, + "children": [], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "span" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "footer" + } + }, + "name": "Footer", + "styleSetDefinitions": {} + }, + "Features": { + "propDefinitions": { + "image_src": { + "id": "7e747fc8-782e-4142-8bab-b2b81aeda5a7", + "defaultValue": "https://images.unsplash.com/photo-1471086569966-db3eebc25a59?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDIzfHxtaW5pbWFsaXNtfGVufDB8fHx8MTYyNjQ0NTY1Nw&ixlib=rb-1.2.1&h=1000", + "type": "string" + }, + "image_alt": { + "id": "f7b922dc-255c-4f10-9d92-371482332b1b", + "defaultValue": "image", + "type": "string" + } + }, + "node": { + "type": "element", + "content": { + "elementType": "container", + "name": "Features", + "referencedStyles": { + "ad9612bd-ec75-480c-8417-19671e52fff1": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "alignItems": { + "type": "static", + "content": "center" + } + } + } + }, + "ba704fca-79aa-4493-a423-6ac23ede10e2": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "paddingTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + }, + "paddingBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + }, + "5083ce47-bf77-4008-b0da-d836a78852ef": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "paddingLeft": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "paddingRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-threeunits" + } + }, + "maxWidth": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-size-size-maxwidth" + } + }, + "flexDirection": { + "type": "static", + "content": "column" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "603e1818-4003-4784-b288-fee57e7d0f5e": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "textAlign": { + "type": "static", + "content": "center" + } + } + } + } + }, + "abilities": {}, + "style": { + "fontSize": { + "type": "static", + "content": "3rem" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "Discover our" + } + ], + "semanticType": "span" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [], + "semanticType": "br" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "children": [ + { + "type": "static", + "content": "unique features" + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "h1" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "name": "Separator", + "referencedStyles": {}, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100px" + }, + "height": { + "type": "static", + "content": "2px" + }, + "backgroundColor": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-500" + } + } + }, + "children": [], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "cd040f33-67a8-4194-a378-740a0f93b777": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 767 + } + ], + "mapType": "inlined", + "styles": { + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + }, + "5a18df2a-e0ec-4d76-b136-d24f02d33bb1": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "flexDirection": { + "type": "static", + "content": "column" + } + } + } + } + }, + "abilities": {}, + "style": { + "flex": { + "type": "static", + "content": "0 0 auto" + }, + "width": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "flexDirection": { + "type": "static", + "content": "row-reverse" + }, + "justifyContent": { + "type": "static", + "content": "space-between" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "c3acd586-d5a6-4e65-bfe1-203641c5e037": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "gridTemplateColumns": { + "type": "static", + "content": "1fr" + } + } + } + } + }, + "abilities": {}, + "style": { + "display": { + "type": "static", + "content": "grid" + }, + "gridTemplateColumns": { + "type": "static", + "content": "1fr 1fr" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "rootClassName": { + "type": "comp-style", + "content": "rootClassName1" + } + }, + "children": [], + "semanticType": "FeatureCard4" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "rootClassName": { + "type": "comp-style", + "content": "root-class-name-4" + } + }, + "children": [], + "semanticType": "FeatureCard4" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "rootClassName": { + "type": "comp-style", + "content": "rootClassName3" + } + }, + "children": [], + "semanticType": "FeatureCard4" + } + }, + { + "type": "element", + "content": { + "elementType": "component", + "dependency": { + "type": "local" + }, + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "rootClassName": { + "type": "comp-style", + "content": "rootClassName2" + } + }, + "children": [], + "semanticType": "FeatureCard4" + } + } + ], + "semanticType": "div" + } + }, + { + "type": "element", + "content": { + "elementType": "image", + "referencedStyles": { + "87b49545-ec8d-49c9-a881-9c5a6267e092": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 991 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "300px" + }, + "height": { + "type": "static", + "content": "300px" + }, + "marginTop": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "marginLeft": { + "type": "static", + "content": "0px" + } + } + } + }, + "18452aa5-5c13-452c-bbe8-07c2cf98f395": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "width": { + "type": "static", + "content": "250px" + }, + "height": { + "type": "static", + "content": "250px" + } + } + } + } + }, + "abilities": {}, + "attrs": { + "alt": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_alt" + } + }, + "src": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_src" + } + } + }, + "style": { + "width": { + "type": "static", + "content": "450px" + }, + "height": { + "type": "static", + "content": "450px" + }, + "objectFit": { + "type": "static", + "content": "cover" + }, + "flexShrink": { + "type": "static", + "content": "0" + }, + "marginLeft": { + "type": "static", + "content": "0px" + }, + "borderRadius": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-radius-radius-round" + } + }, + "objectPosition": { + "type": "static", + "content": "left" + }, + "marginRight": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-fourunits" + } + } + }, + "children": [] + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + "name": "Features", + "styleSetDefinitions": {} + }, + "GalleryCard3": { + "propDefinitions": { + "subtitle": { + "id": "dfaa53cc-2d2f-4672-9835-167a686aa7db", + "defaultValue": "Lorem ipsum dolor sit amet, consectetur adipiscing elit", + "type": "string" + }, + "image_alt": { + "id": "23e30595-cd74-4996-a201-d8453ffe7de9", + "defaultValue": "image", + "type": "string" + }, + "rootClassName": { + "id": "4140c6dc-ca25-4fba-925a-80baeef3e6f8", + "defaultValue": "", + "type": "string" + }, + "projectTitle": { + "id": "b3987a75-4d70-46ba-ae96-e78d62b7491f", + "defaultValue": "Project Title", + "type": "string" + }, + "image_src": { + "id": "a312f0f9-333b-4aad-86bd-c8e025a81973", + "defaultValue": "https://images.unsplash.com/photo-1523755231516-e43fd2e8dca5?ixid=Mnw5MTMyMXwwfDF8c2VhcmNofDF8fG1pbmltYWxpc20lMjBjb3VjaHxlbnwwfHx8fDE2MjY0NDg1NTk&ixlib=rb-1.2.1&h=1000", + "type": "string" + } + }, + "node": { + "type": "element", + "content": { + "elementType": "container", + "name": "GalleryCard", + "referencedStyles": { + "e974b09c-9a78-4e9d-b7cb-2e9fa6ecc430": { + "type": "style-map", + "content": { + "mapType": "component-referenced", + "content": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "rootClassName" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "height": { + "type": "static", + "content": "100%" + }, + "display": { + "type": "static", + "content": "flex" + }, + "position": { + "type": "static", + "content": "relative" + }, + "alignItems": { + "type": "static", + "content": "flex-start" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "center" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "image", + "referencedStyles": {}, + "abilities": {}, + "attrs": { + "alt": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_alt" + } + }, + "src": { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "image_src" + } + } + }, + "style": { + "top": { + "type": "static", + "content": "0px" + }, + "left": { + "type": "static", + "content": "0px" + }, + "right": { + "type": "static", + "content": "auto" + }, + "width": { + "type": "static", + "content": "100%" + }, + "bottom": { + "type": "static", + "content": "auto" + }, + "height": { + "type": "static", + "content": "100%" + }, + "position": { + "type": "static", + "content": "absolute" + }, + "objectFit": { + "type": "static", + "content": "cover" + } + }, + "children": [] + } + }, + { + "type": "element", + "content": { + "elementType": "container", + "referencedStyles": { + "c4899df3-f64e-4e84-8b51-15b5c84547f4": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "element-state", + "content": "hover" + } + ], + "mapType": "inlined", + "styles": { + "opacity": { + "type": "static", + "content": "1" + } + } + } + } + }, + "abilities": {}, + "style": { + "width": { + "type": "static", + "content": "100%" + }, + "height": { + "type": "static", + "content": "300px" + }, + "zIndex": { + "type": "static", + "content": "1" + }, + "display": { + "type": "static", + "content": "flex" + }, + "opacity": { + "type": "static", + "content": "0" + }, + "padding": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-twounits" + } + }, + "alignItems": { + "type": "static", + "content": "center" + }, + "transition": { + "type": "static", + "content": "0.3s" + }, + "flexDirection": { + "type": "static", + "content": "column" + }, + "justifyContent": { + "type": "static", + "content": "center" + }, + "backgroundImage": { + "type": "static", + "content": "linear-gradient(180deg, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.9));" + } + }, + "children": [ + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": { + "55294827-55af-4fb6-a2af-916354a2c3a7": { + "type": "style-map", + "content": { + "conditions": [ + { + "conditionType": "screen-size", + "maxWidth": 479 + } + ], + "mapType": "inlined", + "styles": { + "alignSelf": { + "type": "static", + "content": "center" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-unit" + } + } + } + } + } + }, + "abilities": {}, + "style": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + }, + "fontSize": { + "type": "static", + "content": "1.5rem" + }, + "textAlign": { + "type": "static", + "content": "center" + }, + "fontWeight": { + "type": "static", + "content": "500" + }, + "marginBottom": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-space-space-oneandhalfunits" + } + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "projectTitle" + } + } + ], + "semanticType": "h1" + } + }, + { + "type": "element", + "content": { + "elementType": "text", + "referencedStyles": {}, + "abilities": {}, + "style": { + "color": { + "type": "dynamic", + "content": { + "referenceType": "token", + "id": "--dl-color-gray-white" + } + }, + "textAlign": { + "type": "static", + "content": "center" + } + }, + "children": [ + { + "type": "dynamic", + "content": { + "referenceType": "prop", + "id": "subtitle" + } + } + ], + "semanticType": "span" + } + } + ], + "semanticType": "div" + } + } + ], + "semanticType": "div" + } + }, + "name": "GalleryCard3", + "styleSetDefinitions": { + "rootClassName": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName1": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName2": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName3": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName4": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName5": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName6": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName7": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName8": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName9": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName10": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + }, + "rootClassName11": { + "content": {}, + "conditions": [], + "type": "reusable-component-style-override" + } + } + } + } } diff --git a/packages/teleport-component-generator-react/src/index.ts b/packages/teleport-component-generator-react/src/index.ts index 2c0eba912..6e1230147 100644 --- a/packages/teleport-component-generator-react/src/index.ts +++ b/packages/teleport-component-generator-react/src/index.ts @@ -55,10 +55,10 @@ const createReactComponentGenerator: ComponentGeneratorInstance = ({ mappings.forEach((mapping) => generator.addMapping(mapping)) generator.addPlugin(reactComponentPlugin) - generator.addPlugin(stylePlugin) generator.addPlugin(propTypesPlugin) plugins.forEach((plugin) => generator.addPlugin(plugin)) + generator.addPlugin(stylePlugin) // Import plugin needs to be last to handle all dependencies // TODO: use a different function to set/interact with the import plugin generator.addPlugin(importStatementsPlugin) diff --git a/packages/teleport-plugin-common/__tests__/utils/ast-utils.ts b/packages/teleport-plugin-common/__tests__/utils/ast-utils.ts index 3ede93bca..3a8f5cf75 100644 --- a/packages/teleport-plugin-common/__tests__/utils/ast-utils.ts +++ b/packages/teleport-plugin-common/__tests__/utils/ast-utils.ts @@ -49,7 +49,7 @@ describe('addClassStringOnJSXTag', () => { it('adds a class on an element with no classes', () => { const tag = createJSXTag('button') - addClassStringOnJSXTag(tag, 'primary') + addClassStringOnJSXTag(tag, ['primary']) expect(tag.openingElement.attributes[0].type).toBe('JSXAttribute') const classAttr = tag.openingElement.attributes[0] as types.JSXAttribute @@ -61,7 +61,7 @@ describe('addClassStringOnJSXTag', () => { const tag = createJSXTag('button') addAttributeToJSXTag(tag, 'className', 'button') - addClassStringOnJSXTag(tag, 'primary') + addClassStringOnJSXTag(tag, ['primary']) expect(tag.openingElement.attributes[0].type).toBe('JSXAttribute') const classAttr = tag.openingElement.attributes[0] as types.JSXAttribute diff --git a/packages/teleport-plugin-common/src/utils/ast-utils.ts b/packages/teleport-plugin-common/src/utils/ast-utils.ts index 20bffa688..b9886ae68 100644 --- a/packages/teleport-plugin-common/src/utils/ast-utils.ts +++ b/packages/teleport-plugin-common/src/utils/ast-utils.ts @@ -7,16 +7,40 @@ import { UIDLStateDefinition, UIDLPropDefinition, UIDLRawValue } from '@teleport */ export const addClassStringOnJSXTag = ( jsxNode: types.JSXElement, - classString: string, - classAttributeName?: string, - dynamicValues: Array = [] + classString: string[] = [], + dynamicValues: Array = [], + classAttributeName = 'className' ) => { + const hasExistingClassNames = jsxNode.openingElement.attributes.find( + (attr) => attr.type === 'JSXAttribute' && attr.name.name === classAttributeName + ) as types.JSXAttribute + + if (hasExistingClassNames) { + const attrValue = hasExistingClassNames.value + jsxNode.openingElement.attributes = jsxNode.openingElement.attributes.filter( + (attr) => attr.type === 'JSXAttribute' && attr.name.name !== classAttributeName + ) + + if (attrValue.type === 'StringLiteral') { + classString.unshift(attrValue.value) + } + + if ( + attrValue.type === 'JSXExpressionContainer' && + attrValue.expression.type === 'TemplateLiteral' + ) { + attrValue.expression.expressions.forEach((exp) => { + dynamicValues.push(exp as types.MemberExpression) + }) + } + } + const classAttribute = getClassAttribute(jsxNode, { createIfNotFound: true, classAttributeName }) if (dynamicValues.length === 0) { if (classAttribute.value && classAttribute.value.type === 'StringLiteral') { const classArray = classAttribute.value.value.split(' ') - classArray.push(classString) + classArray.push(...classString) classAttribute.value.value = classArray.join(' ').trim() } else { throw new Error( diff --git a/packages/teleport-plugin-css/__tests__/component-scoped.ts b/packages/teleport-plugin-css/__tests__/component-scoped.ts index 497c10fb6..06ea82e64 100644 --- a/packages/teleport-plugin-css/__tests__/component-scoped.ts +++ b/packages/teleport-plugin-css/__tests__/component-scoped.ts @@ -90,7 +90,7 @@ describe('Component Scoped Styles', () => { expect( jsxComponent.meta.nodesLookup.container.openingElement.attributes[0].value.expression .quasis[0].value.raw - ).toBe('md-8 primary-navbar ') + ).toBe('md-8,primary-navbar ') expect( jsxComponent.meta.nodesLookup.container.openingElement.attributes[0].value.expression .expressions[0].property.name diff --git a/packages/teleport-plugin-css/src/index.ts b/packages/teleport-plugin-css/src/index.ts index e56d8fdbd..80ab8ac9b 100644 --- a/packages/teleport-plugin-css/src/index.ts +++ b/packages/teleport-plugin-css/src/index.ts @@ -289,15 +289,15 @@ const createCSSPlugin: ComponentPluginFactory = (config) => { } else { ASTUtils.addClassStringOnJSXTag( root as types.JSXElement, - Array.from(classNamesToAppend).join(' '), - classAttributeName, + Array.from(classNamesToAppend), Array.from(dynamicVariantsToAppend).map((variant) => { const dynamicAttrValueIdentifier: types.Identifier = dynamicVariantPrefix ? types.identifier(dynamicVariantPrefix) : types.identifier(propsPrefix) return types.memberExpression(dynamicAttrValueIdentifier, types.identifier(variant)) - }) + }), + classAttributeName ) } }) diff --git a/packages/teleport-plugin-react-styled-jsx/__tests__/component-scoped.ts b/packages/teleport-plugin-react-styled-jsx/__tests__/component-scoped.ts index 0a20d7049..e409ebec1 100644 --- a/packages/teleport-plugin-react-styled-jsx/__tests__/component-scoped.ts +++ b/packages/teleport-plugin-react-styled-jsx/__tests__/component-scoped.ts @@ -91,7 +91,7 @@ describe('Component Scoped Styles', () => { const dynamicExpression = jsxExpression.attributes[0].value.expression.expressions[0] expect(jsxExpression.attributes[0].value.expression.quasis[0].value.raw).toContain( - 'md-8 primary-navbar ' + 'md-8,primary-navbar ' ) expect(dynamicExpression.object.name).toBe('props') expect(dynamicExpression.property.name).toBe('variant') diff --git a/packages/teleport-plugin-react-styled-jsx/src/index.ts b/packages/teleport-plugin-react-styled-jsx/src/index.ts index f151ce4d4..4b2378936 100644 --- a/packages/teleport-plugin-react-styled-jsx/src/index.ts +++ b/packages/teleport-plugin-react-styled-jsx/src/index.ts @@ -177,8 +177,7 @@ export const createReactStyledJSXPlugin: ComponentPluginFactory ASTUtils.addClassStringOnJSXTag( root as types.JSXElement, - Array.from(classNamesToAppend).join(' '), - 'className', + Array.from(classNamesToAppend), Array.from(dynamicVariantsToAppend) ) }) diff --git a/packages/teleport-project-generator-next/src/index.ts b/packages/teleport-project-generator-next/src/index.ts index 378cde5df..f0c4b27d2 100644 --- a/packages/teleport-project-generator-next/src/index.ts +++ b/packages/teleport-project-generator-next/src/index.ts @@ -7,7 +7,6 @@ import { ReactStyleVariation, FileType } from '@teleporthq/teleport-types' import { createStyleSheetPlugin } from '@teleporthq/teleport-plugin-css' import importStatementsPlugin from '@teleporthq/teleport-plugin-import-statements' import nextImagePlugin from '@teleporthq/teleport-plugin-jsx-next-image' - import { createDocumentFileChunks, configContentGenerator } from './utils' import { NextProjectMapping } from './next-project-mapping' import NextTemplate from './project-template' diff --git a/packages/teleport-project-generator-next/src/next-project-mapping.ts b/packages/teleport-project-generator-next/src/next-project-mapping.ts index 3790b3216..6de77aac2 100644 --- a/packages/teleport-project-generator-next/src/next-project-mapping.ts +++ b/packages/teleport-project-generator-next/src/next-project-mapping.ts @@ -11,6 +11,7 @@ export const NextProjectMapping: Mapping = { }, attrs: { href: { type: 'dynamic', content: { referenceType: 'attr', id: 'transitionTo' } }, + legacyBehavior: { type: 'static', content: true }, }, children: [ { diff --git a/packages/teleport-project-generator-next/src/utils.ts b/packages/teleport-project-generator-next/src/utils.ts index 0edfc153f..8808b1ffb 100644 --- a/packages/teleport-project-generator-next/src/utils.ts +++ b/packages/teleport-project-generator-next/src/utils.ts @@ -144,8 +144,13 @@ export const configContentGenerator = (options: FrameWorkConfigOptions, t = type t.callExpression(t.memberExpression(t.identifier('React'), t.identifier('useEffect')), [ t.arrowFunctionExpression( [], - t.callExpression(t.identifier('import'), [ - t.stringLiteral('@lottiefiles/lottie-player'), + t.blockStatement([ + t.expressionStatement( + t.callExpression(t.identifier('import'), [ + t.stringLiteral('@lottiefiles/lottie-player'), + ]) + ), + t.returnStatement(), ]) ), ]) diff --git a/packages/teleport-project-generator/__tests__/index.ts b/packages/teleport-project-generator/__tests__/index.ts index 6ac2da713..2cc8511d4 100644 --- a/packages/teleport-project-generator/__tests__/index.ts +++ b/packages/teleport-project-generator/__tests__/index.ts @@ -116,6 +116,18 @@ describe('Generic Project Generator', () => { prefix: '/static', }, designLanguage: undefined, + fonts: [ + { + attrs: { + 'data-type': { + content: 'default-font', + type: 'static', + }, + }, + path: 'https://fonts.googleapis.com/css?family=Roboto', + type: 'font', + }, + ], projectRouteDefinition: uidl.root.stateDefinitions.route, mapping: {}, skipValidation: true, @@ -133,6 +145,18 @@ describe('Generic Project Generator', () => { prefix: '/static', }, designLanguage: undefined, + fonts: [ + { + attrs: { + 'data-type': { + content: 'default-font', + type: 'static', + }, + }, + path: 'https://fonts.googleapis.com/css?family=Roboto', + type: 'font', + }, + ], projectRouteDefinition: uidl.root.stateDefinitions.route, mapping: {}, skipValidation: true, @@ -184,6 +208,18 @@ describe('Generic Project Generator', () => { mappings: {}, prefix: '/test/static', }, + fonts: [ + { + attrs: { + 'data-type': { + content: 'default-font', + type: 'static', + }, + }, + path: 'https://fonts.googleapis.com/css?family=Roboto', + type: 'font', + }, + ], designLanguage: undefined, projectRouteDefinition: uidl.root.stateDefinitions.route, mapping: {}, diff --git a/packages/teleport-project-generator/src/index.ts b/packages/teleport-project-generator/src/index.ts index e33c2aa5b..1f6f377d3 100644 --- a/packages/teleport-project-generator/src/index.ts +++ b/packages/teleport-project-generator/src/index.ts @@ -15,6 +15,7 @@ import { GeneratorFactoryParams, HTMLComponentGenerator, ProjectGenerator as ProjectGeneratorType, + UIDLFontAsset, } from '@teleporthq/teleport-types' import { injectFilesToPath, @@ -242,6 +243,7 @@ export class ProjectGenerator implements ProjectGeneratorType { mapping, skipValidation: true, designLanguage: uidl.root?.designLanguage, + fonts: uidl.globals.assets.filter((asset) => asset.type === 'font') as UIDLFontAsset[], } // Handling project style sheet @@ -252,6 +254,7 @@ export class ProjectGenerator implements ProjectGeneratorType { const { files, dependencies } = await this.styleSheetGenerator.generateComponent(uidl.root, { isRootComponent: true, assets: options.assets, + fonts: options.fonts, }) inMemoryFilesMap.set('projectStyleSheet', { path: this.strategy.projectStyleSheet.path, diff --git a/packages/teleport-project-plugin-custom-files/__tests__/index.ts b/packages/teleport-project-plugin-custom-files/__tests__/index.ts index b28830ffa..4de9aab06 100644 --- a/packages/teleport-project-plugin-custom-files/__tests__/index.ts +++ b/packages/teleport-project-plugin-custom-files/__tests__/index.ts @@ -80,7 +80,7 @@ export default Welcome`, const pagesFolder = subFolders.find((file) => file.name === 'pages') const customFolder = pagesFolder.subFolders.find((file) => file.name === 'custom-folder') - expect(files.length).toBe(3) + expect(files.length).toBe(4) expect(pagesFolder).toBeDefined() expect(customFolder).toBeDefined() expect(customFolder.files.length).toBe(1) diff --git a/packages/teleport-project-plugin-next-fonts/Readme.md b/packages/teleport-project-plugin-next-fonts/Readme.md new file mode 100644 index 000000000..e69de29bb diff --git a/packages/teleport-project-plugin-next-fonts/package.json b/packages/teleport-project-plugin-next-fonts/package.json new file mode 100644 index 000000000..45bf1a1a7 --- /dev/null +++ b/packages/teleport-project-plugin-next-fonts/package.json @@ -0,0 +1,33 @@ +{ + "name": "@teleporthq/teleport-project-plugin-next-fonts", + "version": "0.27.2", + "description": "A Next-JS plugin for using next/font for google fonts", + "author": "teleportHQ", + "license": "MIT", + "homepage": "https://teleporthq.io/", + "main": "dist/cjs/index.js", + "module": "dist/esm/index.js", + "types": "dist/cjs/index.d.ts", + "sideEffects": false, + "repository": { + "type": "git", + "url": "git+ssh://git@github.com/teleporthq/teleport-code-generators.git" + }, + "bugs": { + "url": "https://github.com/teleporthq/teleport-code-generators/issues" + }, + "publishConfig": { + "access": "public" + }, + "scripts": { + "clean": "rimraf dist", + "build": "tsc -p tsconfig.json && tsc -p tsconfig.json --module commonjs --outDir dist/cjs" + }, + "dependencies": { + "@babel/types": "^7.5.5", + "@teleporthq/teleport-shared": "^0.27.2", + "@teleporthq/teleport-types": "^0.27.0", + "@types/css": "^0.0.33", + "css": "^3.0.0" + } +} diff --git a/packages/teleport-project-plugin-next-fonts/src/component-plugin.ts b/packages/teleport-project-plugin-next-fonts/src/component-plugin.ts new file mode 100644 index 000000000..70db5b5af --- /dev/null +++ b/packages/teleport-project-plugin-next-fonts/src/component-plugin.ts @@ -0,0 +1,196 @@ +import { UIDLUtils } from '@teleporthq/teleport-shared' +import { ComponentPlugin, ChunkType, FileType, UIDLElement } from '@teleporthq/teleport-types' +import { ASTUtils } from '@teleporthq/teleport-plugin-common' +import * as types from '@babel/types' +import { + NEXT_FONT_DEPENDENCY, + generateFontDeclerationChunk, + getFontAndVariable, + isGoogleFont, +} from './utils' + +export const createNextGoogleFontPlugin = () => { + const googleFontPlugin: ComponentPlugin = async (structure) => { + const { chunks, uidl } = structure + const { styleSetDefinitions = {} } = uidl + const importSpecifiers: types.ImportSpecifier[] = [] + + const componentChunk = chunks.find((chunk) => chunk.name === 'jsx-component') + const fontDeclerationMap: Record = {} + if (!componentChunk) { + return structure + } + + const rootNode = componentChunk.meta.nodesLookup[uidl.node.content.key] as types.JSXElement + if (rootNode) { + const generateFontDeclerationChunkAndAddToNode = ( + content: string, + params: { weight?: string } + ): string => { + const [font, fontDecleration, variable] = getFontAndVariable(content) + ASTUtils.addClassStringOnJSXTag( + rootNode, + [], + [types.memberExpression(types.identifier(fontDecleration), types.identifier('variable'))] + ) + + if (!fontDeclerationMap[font]) { + importSpecifiers.push( + types.importSpecifier(types.identifier(font), types.identifier(font)) + ) + chunks.unshift( + generateFontDeclerationChunk(font, fontDecleration, variable, params.weight) + ) + } + + return variable + } + + Object.values(styleSetDefinitions).forEach((style) => { + if (style.content?.fontFamily && isGoogleFont(style.content.fontFamily.content as string)) { + const variable = generateFontDeclerationChunkAndAddToNode( + style.content.fontFamily.content as string, + { + weight: style.content?.fontWeight?.content as string, + } + ) + style.content.fontFamily = { type: 'static', content: `var(${variable})` } + } + + style?.conditions?.forEach((cond) => { + const { content } = cond + if ( + content?.fontFamily?.type === 'static' && + isGoogleFont(content.fontFamily.content as string) + ) { + const variable = generateFontDeclerationChunkAndAddToNode( + content.fontFamily.content as string, + { + weight: content?.fontWeight?.content as string, + } + ) + content.fontFamily = { type: 'static', content: `var(${variable})` } + } + }) + }) + } + + UIDLUtils.traverseElements(uidl.node, (node, parent) => { + const { style = {}, referencedStyles = {} } = node + + const parentJSXNode = componentChunk.meta.nodesLookup[ + (parent?.content as UIDLElement)?.key + ] as types.JSXElement + if (!parentJSXNode) { + return + } + + /** + * `style` are direclty applied on the node. So they can be applied using + * style = { fontFamily: inter.style.fontFamily} + * https://nextjs.org/docs/api-reference/next/font#style-1 + */ + + if ( + style?.fontFamily?.type === 'static' && + isGoogleFont(style.fontFamily.content as string) + ) { + const [font, fontDecleration, variable] = getFontAndVariable( + style.fontFamily.content as string + ) + + ASTUtils.addClassStringOnJSXTag( + parentJSXNode, + [], + [types.memberExpression(types.identifier(fontDecleration), types.identifier('variable'))] + ) + style.fontFamily = { type: 'static', content: `var(${variable})` } + + if (!fontDeclerationMap[fontDecleration]) { + fontDeclerationMap[fontDecleration] = true + importSpecifiers.push( + types.importSpecifier(types.identifier(font), types.identifier(font)) + ) + chunks.unshift( + generateFontDeclerationChunk( + font, + fontDecleration, + variable, + (style?.fontWeight?.content as string) || null + ) + ) + } + } + + /** + * Referenced styles are only applied under a specific condition. + * So, they need to be applied only using `var(--font)` method. + * Or else the styles are overwritten all the time. + * https://nextjs.org/docs/api-reference/next/font#css-variables + */ + + Object.keys(referencedStyles).forEach((styleRef) => { + const refStyle = referencedStyles[styleRef] + if (refStyle.content.mapType === 'inlined') { + const { styles } = refStyle.content + if ( + styles?.fontFamily?.type === 'static' && + isGoogleFont(styles.fontFamily.content as string) + ) { + if (!parent || parent.type !== 'element') { + /** + * TODO: using next/font/google in variable mode, works only by wrapping the variable + * to the parent node. But, where there is no parent node. It's a edge case and we need to + * figure out how to handle this use-case. Most probably this can be acheived by wrapping the node + * with a root node with display-contents. + */ + } + + const [font, fontDecleration, variable] = getFontAndVariable( + styles.fontFamily.content as string + ) + + ASTUtils.addClassStringOnJSXTag( + parentJSXNode, + [], + [ + types.memberExpression( + types.identifier(fontDecleration), + types.identifier('variable') + ), + ] + ) + styles.fontFamily = { type: 'static', content: `var(${variable})` } + + if (!fontDeclerationMap[fontDecleration]) { + fontDeclerationMap[fontDecleration] = true + importSpecifiers.push( + types.importSpecifier(types.identifier(font), types.identifier(font)) + ) + chunks.unshift(generateFontDeclerationChunk(font, fontDecleration, variable)) + } + } + } + }) + }) + + if (importSpecifiers.length) { + chunks.unshift({ + type: ChunkType.AST, + name: 'google-font-import-chunk', + fileType: FileType.JS, + content: types.importDeclaration( + importSpecifiers, + types.stringLiteral(NEXT_FONT_DEPENDENCY.path) + ), + linkAfter: ['import-lib', 'import-pack', 'import-local'], + }) + } + + return structure + } + + return googleFontPlugin +} + +export default createNextGoogleFontPlugin() diff --git a/packages/teleport-project-plugin-next-fonts/src/fonts.ts b/packages/teleport-project-plugin-next-fonts/src/fonts.ts new file mode 100644 index 000000000..09ccec68d --- /dev/null +++ b/packages/teleport-project-plugin-next-fonts/src/fonts.ts @@ -0,0 +1,1504 @@ +/** + * The list of google fonts are auto-generated + */ + +export const GOOGLE_FONTS = [ + 'ABeeZee', + 'Abel', + 'Abhaya Libre', + 'Aboreto', + 'Abril Fatface', + 'Abyssinica SIL', + 'Aclonica', + 'Acme', + 'Actor', + 'Adamina', + 'Advent Pro', + 'Aguafina Script', + 'Akaya Kanadaka', + 'Akaya Telivigala', + 'Akronim', + 'Akshar', + 'Aladin', + 'Alata', + 'Alatsi', + 'Albert Sans', + 'Aldrich', + 'Alef', + 'Alegreya', + 'Alegreya SC', + 'Alegreya Sans', + 'Alegreya Sans SC', + 'Aleo', + 'Alex Brush', + 'Alexandria', + 'Alfa Slab One', + 'Alice', + 'Alike', + 'Alike Angular', + 'Alkalami', + 'Alkatra', + 'Allan', + 'Allerta', + 'Allerta Stencil', + 'Allison', + 'Allura', + 'Almarai', + 'Almendra', + 'Almendra Display', + 'Almendra SC', + 'Alumni Sans', + 'Alumni Sans Collegiate One', + 'Alumni Sans Inline One', + 'Alumni Sans Pinstripe', + 'Amarante', + 'Amaranth', + 'Amatic SC', + 'Amethysta', + 'Amiko', + 'Amiri', + 'Amiri Quran', + 'Amita', + 'Anaheim', + 'Andada Pro', + 'Andika', + 'Anek Bangla', + 'Anek Devanagari', + 'Anek Gujarati', + 'Anek Gurmukhi', + 'Anek Kannada', + 'Anek Latin', + 'Anek Malayalam', + 'Anek Odia', + 'Anek Tamil', + 'Anek Telugu', + 'Angkor', + 'Annie Use Your Telescope', + 'Anonymous Pro', + 'Antic', + 'Antic Didone', + 'Antic Slab', + 'Anton', + 'Antonio', + 'Anuphan', + 'Anybody', + 'Arapey', + 'Arbutus', + 'Arbutus Slab', + 'Architects Daughter', + 'Archivo', + 'Archivo Black', + 'Archivo Narrow', + 'Are You Serious', + 'Aref Ruqaa', + 'Aref Ruqaa Ink', + 'Arima', + 'Arimo', + 'Arizonia', + 'Armata', + 'Arsenal', + 'Artifika', + 'Arvo', + 'Arya', + 'Asap', + 'Asap Condensed', + 'Asar', + 'Asset', + 'Assistant', + 'Astloch', + 'Asul', + 'Athiti', + 'Atkinson Hyperlegible', + 'Atma', + 'Atomic Age', + 'Aubrey', + 'Audiowide', + 'Autour One', + 'Average', + 'Average Sans', + 'Averia Gruesa Libre', + 'Averia Libre', + 'Averia Sans Libre', + 'Averia Serif Libre', + 'Azeret Mono', + 'B612', + 'B612 Mono', + 'BIZ UDGothic', + 'BIZ UDMincho', + 'BIZ UDPGothic', + 'BIZ UDPMincho', + 'Babylonica', + 'Bad Script', + 'Bahiana', + 'Bahianita', + 'Bai Jamjuree', + 'Bakbak One', + 'Ballet', + 'Baloo 2', + 'Baloo Bhai 2', + 'Baloo Bhaijaan 2', + 'Baloo Bhaina 2', + 'Baloo Chettan 2', + 'Baloo Da 2', + 'Baloo Paaji 2', + 'Baloo Tamma 2', + 'Baloo Tammudu 2', + 'Baloo Thambi 2', + 'Balsamiq Sans', + 'Balthazar', + 'Bangers', + 'Barlow', + 'Barlow Condensed', + 'Barlow Semi Condensed', + 'Barriecito', + 'Barrio', + 'Basic', + 'Baskervville', + 'Battambang', + 'Baumans', + 'Bayon', + 'Be Vietnam Pro', + 'Beau Rivage', + 'Bebas Neue', + 'Belgrano', + 'Bellefair', + 'Belleza', + 'Bellota', + 'Bellota Text', + 'BenchNine', + 'Benne', + 'Bentham', + 'Berkshire Swash', + 'Besley', + 'Beth Ellen', + 'Bevan', + 'BhuTuka Expanded One', + 'Big Shoulders Display', + 'Big Shoulders Inline Display', + 'Big Shoulders Inline Text', + 'Big Shoulders Stencil Display', + 'Big Shoulders Stencil Text', + 'Big Shoulders Text', + 'Bigelow Rules', + 'Bigshot One', + 'Bilbo', + 'Bilbo Swash Caps', + 'BioRhyme', + 'BioRhyme Expanded', + 'Birthstone', + 'Birthstone Bounce', + 'Biryani', + 'Bitter', + 'Black And White Picture', + 'Black Han Sans', + 'Black Ops One', + 'Blaka', + 'Blaka Hollow', + 'Blaka Ink', + 'Blinker', + 'Bodoni Moda', + 'Bokor', + 'Bona Nova', + 'Bonbon', + 'Bonheur Royale', + 'Boogaloo', + 'Bowlby One', + 'Bowlby One SC', + 'Brawler', + 'Bree Serif', + 'Brygada 1918', + 'Bubblegum Sans', + 'Bubbler One', + 'Buda', + 'Buenard', + 'Bungee', + 'Bungee Hairline', + 'Bungee Inline', + 'Bungee Outline', + 'Bungee Shade', + 'Bungee Spice', + 'Butcherman', + 'Butterfly Kids', + 'Cabin', + 'Cabin Condensed', + 'Cabin Sketch', + 'Caesar Dressing', + 'Cagliostro', + 'Cairo', + 'Cairo Play', + 'Caladea', + 'Calistoga', + 'Calligraffitti', + 'Cambay', + 'Cambo', + 'Candal', + 'Cantarell', + 'Cantata One', + 'Cantora One', + 'Capriola', + 'Caramel', + 'Carattere', + 'Cardo', + 'Carme', + 'Carrois Gothic', + 'Carrois Gothic SC', + 'Carter One', + 'Castoro', + 'Catamaran', + 'Caudex', + 'Caveat', + 'Caveat Brush', + 'Cedarville Cursive', + 'Ceviche One', + 'Chakra Petch', + 'Changa', + 'Changa One', + 'Chango', + 'Charis SIL', + 'Charm', + 'Charmonman', + 'Chathura', + 'Chau Philomene One', + 'Chela One', + 'Chelsea Market', + 'Chenla', + 'Cherish', + 'Cherry Cream Soda', + 'Cherry Swash', + 'Chewy', + 'Chicle', + 'Chilanka', + 'Chivo', + 'Chivo Mono', + 'Chonburi', + 'Cinzel', + 'Cinzel Decorative', + 'Clicker Script', + 'Climate Crisis', + 'Coda', + 'Coda Caption', + 'Codystar', + 'Coiny', + 'Combo', + 'Comfortaa', + 'Comforter', + 'Comforter Brush', + 'Comic Neue', + 'Coming Soon', + 'Commissioner', + 'Concert One', + 'Condiment', + 'Content', + 'Contrail One', + 'Convergence', + 'Cookie', + 'Copse', + 'Corben', + 'Corinthia', + 'Cormorant', + 'Cormorant Garamond', + 'Cormorant Infant', + 'Cormorant SC', + 'Cormorant Unicase', + 'Cormorant Upright', + 'Courgette', + 'Courier Prime', + 'Cousine', + 'Coustard', + 'Covered By Your Grace', + 'Crafty Girls', + 'Creepster', + 'Crete Round', + 'Crimson Pro', + 'Crimson Text', + 'Croissant One', + 'Crushed', + 'Cuprum', + 'Cute Font', + 'Cutive', + 'Cutive Mono', + 'DM Mono', + 'DM Sans', + 'DM Serif Display', + 'DM Serif Text', + 'Damion', + 'Dancing Script', + 'Dangrek', + 'Darker Grotesque', + 'David Libre', + 'Dawning of a New Day', + 'Days One', + 'Dekko', + 'Dela Gothic One', + 'Delicious Handrawn', + 'Delius', + 'Delius Swash Caps', + 'Delius Unicase', + 'Della Respira', + 'Denk One', + 'Devonshire', + 'Dhurjati', + 'Didact Gothic', + 'Diplomata', + 'Diplomata SC', + 'Do Hyeon', + 'Dokdo', + 'Domine', + 'Donegal One', + 'Dongle', + 'Doppio One', + 'Dorsa', + 'Dosis', + 'DotGothic16', + 'Dr Sugiyama', + 'Duru Sans', + 'DynaPuff', + 'Dynalight', + 'EB Garamond', + 'Eagle Lake', + 'East Sea Dokdo', + 'Eater', + 'Economica', + 'Eczar', + 'Edu NSW ACT Foundation', + 'Edu QLD Beginner', + 'Edu SA Beginner', + 'Edu TAS Beginner', + 'Edu VIC WA NT Beginner', + 'El Messiri', + 'Electrolize', + 'Elsie', + 'Elsie Swash Caps', + 'Emblema One', + 'Emilys Candy', + 'Encode Sans', + 'Encode Sans Condensed', + 'Encode Sans Expanded', + 'Encode Sans SC', + 'Encode Sans Semi Condensed', + 'Encode Sans Semi Expanded', + 'Engagement', + 'Englebert', + 'Enriqueta', + 'Ephesis', + 'Epilogue', + 'Erica One', + 'Esteban', + 'Estonia', + 'Euphoria Script', + 'Ewert', + 'Exo', + 'Exo 2', + 'Expletus Sans', + 'Explora', + 'Fahkwang', + 'Familjen Grotesk', + 'Fanwood Text', + 'Farro', + 'Farsan', + 'Fascinate', + 'Fascinate Inline', + 'Faster One', + 'Fasthand', + 'Fauna One', + 'Faustina', + 'Federant', + 'Federo', + 'Felipa', + 'Fenix', + 'Festive', + 'Figtree', + 'Finger Paint', + 'Finlandica', + 'Fira Code', + 'Fira Mono', + 'Fira Sans', + 'Fira Sans Condensed', + 'Fira Sans Extra Condensed', + 'Fjalla One', + 'Fjord One', + 'Flamenco', + 'Flavors', + 'Fleur De Leah', + 'Flow Block', + 'Flow Circular', + 'Flow Rounded', + 'Fondamento', + 'Fontdiner Swanky', + 'Forum', + 'Fragment Mono', + 'Francois One', + 'Frank Ruhl Libre', + 'Fraunces', + 'Freckle Face', + 'Fredericka the Great', + 'Fredoka', + 'Freehand', + 'Fresca', + 'Frijole', + 'Fruktur', + 'Fugaz One', + 'Fuggles', + 'Fuzzy Bubbles', + 'GFS Didot', + 'GFS Neohellenic', + 'Gabriela', + 'Gaegu', + 'Gafata', + 'Gajraj One', + 'Galada', + 'Galdeano', + 'Galindo', + 'Gamja Flower', + 'Gantari', + 'Gayathri', + 'Gelasio', + 'Gemunu Libre', + 'Genos', + 'Gentium Book Plus', + 'Gentium Plus', + 'Geo', + 'Georama', + 'Geostar', + 'Geostar Fill', + 'Germania One', + 'Gideon Roman', + 'Gidugu', + 'Gilda Display', + 'Girassol', + 'Give You Glory', + 'Glass Antiqua', + 'Glegoo', + 'Gloock', + 'Gloria Hallelujah', + 'Glory', + 'Gluten', + 'Goblin One', + 'Gochi Hand', + 'Goldman', + 'Golos Text', + 'Gorditas', + 'Gothic A1', + 'Gotu', + 'Goudy Bookletter 1911', + 'Gowun Batang', + 'Gowun Dodum', + 'Graduate', + 'Grand Hotel', + 'Grandstander', + 'Grape Nuts', + 'Gravitas One', + 'Great Vibes', + 'Grechen Fuemen', + 'Grenze', + 'Grenze Gotisch', + 'Grey Qo', + 'Griffy', + 'Gruppo', + 'Gudea', + 'Gugi', + 'Gulzar', + 'Gupter', + 'Gurajada', + 'Gwendolyn', + 'Habibi', + 'Hachi Maru Pop', + 'Hahmlet', + 'Halant', + 'Hammersmith One', + 'Hanalei', + 'Hanalei Fill', + 'Handlee', + 'Hanken Grotesk', + 'Hanuman', + 'Happy Monkey', + 'Harmattan', + 'Headland One', + 'Heebo', + 'Henny Penny', + 'Hepta Slab', + 'Herr Von Muellerhoff', + 'Hi Melody', + 'Hina Mincho', + 'Hind', + 'Hind Guntur', + 'Hind Madurai', + 'Hind Siliguri', + 'Hind Vadodara', + 'Holtwood One SC', + 'Homemade Apple', + 'Homenaje', + 'Hubballi', + 'Hurricane', + 'IBM Plex Mono', + 'IBM Plex Sans', + 'IBM Plex Sans Arabic', + 'IBM Plex Sans Condensed', + 'IBM Plex Sans Devanagari', + 'IBM Plex Sans Hebrew', + 'IBM Plex Sans JP', + 'IBM Plex Sans KR', + 'IBM Plex Sans Thai', + 'IBM Plex Sans Thai Looped', + 'IBM Plex Serif', + 'IM Fell DW Pica', + 'IM Fell DW Pica SC', + 'IM Fell Double Pica', + 'IM Fell Double Pica SC', + 'IM Fell English', + 'IM Fell English SC', + 'IM Fell French Canon', + 'IM Fell French Canon SC', + 'IM Fell Great Primer', + 'IM Fell Great Primer SC', + 'Ibarra Real Nova', + 'Iceberg', + 'Iceland', + 'Imbue', + 'Imperial Script', + 'Imprima', + 'Inconsolata', + 'Inder', + 'Indie Flower', + 'Ingrid Darling', + 'Inika', + 'Inknut Antiqua', + 'Inria Sans', + 'Inria Serif', + 'Inspiration', + 'Inter', + 'Inter Tight', + 'Irish Grover', + 'Island Moments', + 'Istok Web', + 'Italiana', + 'Italianno', + 'Itim', + 'Jacques Francois', + 'Jacques Francois Shadow', + 'Jaldi', + 'JetBrains Mono', + 'Jim Nightshade', + 'Joan', + 'Jockey One', + 'Jolly Lodger', + 'Jomhuria', + 'Jomolhari', + 'Josefin Sans', + 'Josefin Slab', + 'Jost', + 'Joti One', + 'Jua', + 'Judson', + 'Julee', + 'Julius Sans One', + 'Junge', + 'Jura', + 'Just Another Hand', + 'Just Me Again Down Here', + 'K2D', + 'Kadwa', + 'Kaisei Decol', + 'Kaisei HarunoUmi', + 'Kaisei Opti', + 'Kaisei Tokumin', + 'Kalam', + 'Kameron', + 'Kanit', + 'Kantumruy Pro', + 'Karantina', + 'Karla', + 'Karma', + 'Katibeh', + 'Kaushan Script', + 'Kavivanar', + 'Kavoon', + 'Kdam Thmor Pro', + 'Keania One', + 'Kelly Slab', + 'Kenia', + 'Khand', + 'Khmer', + 'Khula', + 'Kings', + 'Kirang Haerang', + 'Kite One', + 'Kiwi Maru', + 'Klee One', + 'Knewave', + 'KoHo', + 'Kodchasan', + 'Koh Santepheap', + 'Kolker Brush', + 'Kosugi', + 'Kosugi Maru', + 'Kotta One', + 'Koulen', + 'Kranky', + 'Kreon', + 'Kristi', + 'Krona One', + 'Krub', + 'Kufam', + 'Kulim Park', + 'Kumar One', + 'Kumar One Outline', + 'Kumbh Sans', + 'Kurale', + 'La Belle Aurore', + 'Labrada', + 'Lacquer', + 'Laila', + 'Lakki Reddy', + 'Lalezar', + 'Lancelot', + 'Langar', + 'Lateef', + 'Lato', + 'Lavishly Yours', + 'League Gothic', + 'League Script', + 'League Spartan', + 'Leckerli One', + 'Ledger', + 'Lekton', + 'Lemon', + 'Lemonada', + 'Lexend', + 'Lexend Deca', + 'Lexend Exa', + 'Lexend Giga', + 'Lexend Mega', + 'Lexend Peta', + 'Lexend Tera', + 'Lexend Zetta', + 'Libre Barcode 128', + 'Libre Barcode 128 Text', + 'Libre Barcode 39', + 'Libre Barcode 39 Extended', + 'Libre Barcode 39 Extended Text', + 'Libre Barcode 39 Text', + 'Libre Barcode EAN13 Text', + 'Libre Baskerville', + 'Libre Bodoni', + 'Libre Caslon Display', + 'Libre Caslon Text', + 'Libre Franklin', + 'Licorice', + 'Life Savers', + 'Lilita One', + 'Lily Script One', + 'Limelight', + 'Linden Hill', + 'Literata', + 'Liu Jian Mao Cao', + 'Livvic', + 'Lobster', + 'Lobster Two', + 'Londrina Outline', + 'Londrina Shadow', + 'Londrina Sketch', + 'Londrina Solid', + 'Long Cang', + 'Lora', + 'Love Light', + 'Love Ya Like A Sister', + 'Loved by the King', + 'Lovers Quarrel', + 'Luckiest Guy', + 'Lusitana', + 'Lustria', + 'Luxurious Roman', + 'Luxurious Script', + 'M PLUS 1', + 'M PLUS 1 Code', + 'M PLUS 1p', + 'M PLUS 2', + 'M PLUS Code Latin', + 'M PLUS Rounded 1c', + 'Ma Shan Zheng', + 'Macondo', + 'Macondo Swash Caps', + 'Mada', + 'Magra', + 'Maiden Orange', + 'Maitree', + 'Major Mono Display', + 'Mako', + 'Mali', + 'Mallanna', + 'Mandali', + 'Manjari', + 'Manrope', + 'Mansalva', + 'Manuale', + 'Marcellus', + 'Marcellus SC', + 'Marck Script', + 'Margarine', + 'Marhey', + 'Markazi Text', + 'Marko One', + 'Marmelad', + 'Martel', + 'Martel Sans', + 'Martian Mono', + 'Marvel', + 'Mate', + 'Mate SC', + 'Material Icons', + 'Material Icons Outlined', + 'Material Icons Round', + 'Material Icons Sharp', + 'Material Icons Two Tone', + 'Material Symbols Outlined', + 'Material Symbols Rounded', + 'Material Symbols Sharp', + 'Maven Pro', + 'McLaren', + 'Mea Culpa', + 'Meddon', + 'MedievalSharp', + 'Medula One', + 'Meera Inimai', + 'Megrim', + 'Meie Script', + 'Meow Script', + 'Merienda', + 'Merriweather', + 'Merriweather Sans', + 'Metal', + 'Metal Mania', + 'Metamorphous', + 'Metrophobic', + 'Michroma', + 'Milonga', + 'Miltonian', + 'Miltonian Tattoo', + 'Mina', + 'Mingzat', + 'Miniver', + 'Miriam Libre', + 'Mirza', + 'Miss Fajardose', + 'Mitr', + 'Mochiy Pop One', + 'Mochiy Pop P One', + 'Modak', + 'Modern Antiqua', + 'Mogra', + 'Mohave', + 'Molengo', + 'Molle', + 'Monda', + 'Monofett', + 'Monoton', + 'Monsieur La Doulaise', + 'Montaga', + 'Montagu Slab', + 'MonteCarlo', + 'Montez', + 'Montserrat', + 'Montserrat Alternates', + 'Montserrat Subrayada', + 'Moo Lah Lah', + 'Moon Dance', + 'Moul', + 'Moulpali', + 'Mountains of Christmas', + 'Mouse Memoirs', + 'Mr Bedfort', + 'Mr Dafoe', + 'Mr De Haviland', + 'Mrs Saint Delafield', + 'Mrs Sheppards', + 'Ms Madi', + 'Mukta', + 'Mukta Mahee', + 'Mukta Malar', + 'Mukta Vaani', + 'Mulish', + 'Murecho', + 'MuseoModerno', + 'My Soul', + 'Mynerve', + 'Mystery Quest', + 'NTR', + 'Nabla', + 'Nanum Brush Script', + 'Nanum Gothic', + 'Nanum Gothic Coding', + 'Nanum Myeongjo', + 'Nanum Pen Script', + 'Neonderthaw', + 'Nerko One', + 'Neucha', + 'Neuton', + 'New Rocker', + 'New Tegomin', + 'News Cycle', + 'Newsreader', + 'Niconne', + 'Niramit', + 'Nixie One', + 'Nobile', + 'Nokora', + 'Norican', + 'Nosifer', + 'Notable', + 'Nothing You Could Do', + 'Noticia Text', + 'Noto Color Emoji', + 'Noto Emoji', + 'Noto Kufi Arabic', + 'Noto Music', + 'Noto Naskh Arabic', + 'Noto Nastaliq Urdu', + 'Noto Rashi Hebrew', + 'Noto Sans', + 'Noto Sans Adlam', + 'Noto Sans Adlam Unjoined', + 'Noto Sans Anatolian Hieroglyphs', + 'Noto Sans Arabic', + 'Noto Sans Armenian', + 'Noto Sans Avestan', + 'Noto Sans Balinese', + 'Noto Sans Bamum', + 'Noto Sans Bassa Vah', + 'Noto Sans Batak', + 'Noto Sans Bengali', + 'Noto Sans Bhaiksuki', + 'Noto Sans Brahmi', + 'Noto Sans Buginese', + 'Noto Sans Buhid', + 'Noto Sans Canadian Aboriginal', + 'Noto Sans Carian', + 'Noto Sans Caucasian Albanian', + 'Noto Sans Chakma', + 'Noto Sans Cham', + 'Noto Sans Cherokee', + 'Noto Sans Coptic', + 'Noto Sans Cuneiform', + 'Noto Sans Cypriot', + 'Noto Sans Deseret', + 'Noto Sans Devanagari', + 'Noto Sans Display', + 'Noto Sans Duployan', + 'Noto Sans Egyptian Hieroglyphs', + 'Noto Sans Elbasan', + 'Noto Sans Elymaic', + 'Noto Sans Ethiopic', + 'Noto Sans Georgian', + 'Noto Sans Glagolitic', + 'Noto Sans Gothic', + 'Noto Sans Grantha', + 'Noto Sans Gujarati', + 'Noto Sans Gunjala Gondi', + 'Noto Sans Gurmukhi', + 'Noto Sans HK', + 'Noto Sans Hanifi Rohingya', + 'Noto Sans Hanunoo', + 'Noto Sans Hatran', + 'Noto Sans Hebrew', + 'Noto Sans Imperial Aramaic', + 'Noto Sans Indic Siyaq Numbers', + 'Noto Sans Inscriptional Pahlavi', + 'Noto Sans Inscriptional Parthian', + 'Noto Sans JP', + 'Noto Sans Javanese', + 'Noto Sans KR', + 'Noto Sans Kaithi', + 'Noto Sans Kannada', + 'Noto Sans Kayah Li', + 'Noto Sans Kharoshthi', + 'Noto Sans Khmer', + 'Noto Sans Khojki', + 'Noto Sans Khudawadi', + 'Noto Sans Lao', + 'Noto Sans Lao Looped', + 'Noto Sans Lepcha', + 'Noto Sans Limbu', + 'Noto Sans Linear A', + 'Noto Sans Linear B', + 'Noto Sans Lisu', + 'Noto Sans Lycian', + 'Noto Sans Lydian', + 'Noto Sans Mahajani', + 'Noto Sans Malayalam', + 'Noto Sans Mandaic', + 'Noto Sans Manichaean', + 'Noto Sans Marchen', + 'Noto Sans Masaram Gondi', + 'Noto Sans Math', + 'Noto Sans Mayan Numerals', + 'Noto Sans Medefaidrin', + 'Noto Sans Meetei Mayek', + 'Noto Sans Mende Kikakui', + 'Noto Sans Meroitic', + 'Noto Sans Miao', + 'Noto Sans Modi', + 'Noto Sans Mongolian', + 'Noto Sans Mono', + 'Noto Sans Mro', + 'Noto Sans Multani', + 'Noto Sans Myanmar', + 'Noto Sans NKo', + 'Noto Sans Nabataean', + 'Noto Sans New Tai Lue', + 'Noto Sans Newa', + 'Noto Sans Nushu', + 'Noto Sans Ogham', + 'Noto Sans Ol Chiki', + 'Noto Sans Old Hungarian', + 'Noto Sans Old Italic', + 'Noto Sans Old North Arabian', + 'Noto Sans Old Permic', + 'Noto Sans Old Persian', + 'Noto Sans Old Sogdian', + 'Noto Sans Old South Arabian', + 'Noto Sans Old Turkic', + 'Noto Sans Oriya', + 'Noto Sans Osage', + 'Noto Sans Osmanya', + 'Noto Sans Pahawh Hmong', + 'Noto Sans Palmyrene', + 'Noto Sans Pau Cin Hau', + 'Noto Sans Phags Pa', + 'Noto Sans Phoenician', + 'Noto Sans Psalter Pahlavi', + 'Noto Sans Rejang', + 'Noto Sans Runic', + 'Noto Sans SC', + 'Noto Sans Samaritan', + 'Noto Sans Saurashtra', + 'Noto Sans Sharada', + 'Noto Sans Shavian', + 'Noto Sans Siddham', + 'Noto Sans SignWriting', + 'Noto Sans Sinhala', + 'Noto Sans Sogdian', + 'Noto Sans Sora Sompeng', + 'Noto Sans Soyombo', + 'Noto Sans Sundanese', + 'Noto Sans Syloti Nagri', + 'Noto Sans Symbols', + 'Noto Sans Symbols 2', + 'Noto Sans Syriac', + 'Noto Sans TC', + 'Noto Sans Tagalog', + 'Noto Sans Tagbanwa', + 'Noto Sans Tai Le', + 'Noto Sans Tai Tham', + 'Noto Sans Tai Viet', + 'Noto Sans Takri', + 'Noto Sans Tamil', + 'Noto Sans Tamil Supplement', + 'Noto Sans Tangsa', + 'Noto Sans Telugu', + 'Noto Sans Thaana', + 'Noto Sans Thai', + 'Noto Sans Thai Looped', + 'Noto Sans Tifinagh', + 'Noto Sans Tirhuta', + 'Noto Sans Ugaritic', + 'Noto Sans Vai', + 'Noto Sans Wancho', + 'Noto Sans Warang Citi', + 'Noto Sans Yi', + 'Noto Sans Zanabazar Square', + 'Noto Serif', + 'Noto Serif Ahom', + 'Noto Serif Armenian', + 'Noto Serif Balinese', + 'Noto Serif Bengali', + 'Noto Serif Devanagari', + 'Noto Serif Display', + 'Noto Serif Dogra', + 'Noto Serif Ethiopic', + 'Noto Serif Georgian', + 'Noto Serif Grantha', + 'Noto Serif Gujarati', + 'Noto Serif Gurmukhi', + 'Noto Serif HK', + 'Noto Serif Hebrew', + 'Noto Serif JP', + 'Noto Serif KR', + 'Noto Serif Kannada', + 'Noto Serif Khmer', + 'Noto Serif Khojki', + 'Noto Serif Lao', + 'Noto Serif Malayalam', + 'Noto Serif Myanmar', + 'Noto Serif NP Hmong', + 'Noto Serif Oriya', + 'Noto Serif SC', + 'Noto Serif Sinhala', + 'Noto Serif TC', + 'Noto Serif Tamil', + 'Noto Serif Tangut', + 'Noto Serif Telugu', + 'Noto Serif Thai', + 'Noto Serif Tibetan', + 'Noto Serif Toto', + 'Noto Serif Yezidi', + 'Noto Traditional Nushu', + 'Nova Cut', + 'Nova Flat', + 'Nova Mono', + 'Nova Oval', + 'Nova Round', + 'Nova Script', + 'Nova Slim', + 'Nova Square', + 'Numans', + 'Nunito', + 'Nunito Sans', + 'Nuosu SIL', + 'Odibee Sans', + 'Odor Mean Chey', + 'Offside', + 'Oi', + 'Old Standard TT', + 'Oldenburg', + 'Ole', + 'Oleo Script', + 'Oleo Script Swash Caps', + 'Oooh Baby', + 'Open Sans', + 'Oranienbaum', + 'Orbitron', + 'Oregano', + 'Orelega One', + 'Orienta', + 'Original Surfer', + 'Oswald', + 'Outfit', + 'Over the Rainbow', + 'Overlock', + 'Overlock SC', + 'Overpass', + 'Overpass Mono', + 'Ovo', + 'Oxanium', + 'Oxygen', + 'Oxygen Mono', + 'PT Mono', + 'PT Sans', + 'PT Sans Caption', + 'PT Sans Narrow', + 'PT Serif', + 'PT Serif Caption', + 'Pacifico', + 'Padauk', + 'Padyakke Expanded One', + 'Palanquin', + 'Palanquin Dark', + 'Pangolin', + 'Paprika', + 'Parisienne', + 'Passero One', + 'Passion One', + 'Passions Conflict', + 'Pathway Gothic One', + 'Patrick Hand', + 'Patrick Hand SC', + 'Pattaya', + 'Patua One', + 'Pavanam', + 'Paytone One', + 'Peddana', + 'Peralta', + 'Permanent Marker', + 'Petemoss', + 'Petit Formal Script', + 'Petrona', + 'Philosopher', + 'Phudu', + 'Piazzolla', + 'Piedra', + 'Pinyon Script', + 'Pirata One', + 'Plaster', + 'Play', + 'Playball', + 'Playfair Display', + 'Playfair Display SC', + 'Plus Jakarta Sans', + 'Podkova', + 'Poiret One', + 'Poller One', + 'Poly', + 'Pompiere', + 'Pontano Sans', + 'Poor Story', + 'Poppins', + 'Port Lligat Sans', + 'Port Lligat Slab', + 'Potta One', + 'Pragati Narrow', + 'Praise', + 'Prata', + 'Preahvihear', + 'Press Start 2P', + 'Pridi', + 'Princess Sofia', + 'Prociono', + 'Prompt', + 'Prosto One', + 'Proza Libre', + 'Public Sans', + 'Puppies Play', + 'Puritan', + 'Purple Purse', + 'Qahiri', + 'Quando', + 'Quantico', + 'Quattrocento', + 'Quattrocento Sans', + 'Questrial', + 'Quicksand', + 'Quintessential', + 'Qwigley', + 'Qwitcher Grypen', + 'Racing Sans One', + 'Radio Canada', + 'Radley', + 'Rajdhani', + 'Rakkas', + 'Raleway', + 'Raleway Dots', + 'Ramabhadra', + 'Ramaraja', + 'Rambla', + 'Rammetto One', + 'Rampart One', + 'Ranchers', + 'Rancho', + 'Ranga', + 'Rasa', + 'Rationale', + 'Ravi Prakash', + 'Readex Pro', + 'Recursive', + 'Red Hat Display', + 'Red Hat Mono', + 'Red Hat Text', + 'Red Rose', + 'Redacted', + 'Redacted Script', + 'Redressed', + 'Reem Kufi', + 'Reem Kufi Fun', + 'Reem Kufi Ink', + 'Reenie Beanie', + 'Reggae One', + 'Revalia', + 'Rhodium Libre', + 'Ribeye', + 'Ribeye Marrow', + 'Righteous', + 'Risque', + 'Road Rage', + 'Roboto', + 'Roboto Condensed', + 'Roboto Flex', + 'Roboto Mono', + 'Roboto Serif', + 'Roboto Slab', + 'Rochester', + 'Rock Salt', + 'RocknRoll One', + 'Rokkitt', + 'Romanesco', + 'Ropa Sans', + 'Rosario', + 'Rosarivo', + 'Rouge Script', + 'Rowdies', + 'Rozha One', + 'Rubik', + 'Rubik 80s Fade', + 'Rubik Beastly', + 'Rubik Bubbles', + 'Rubik Burned', + 'Rubik Dirt', + 'Rubik Distressed', + 'Rubik Gemstones', + 'Rubik Glitch', + 'Rubik Iso', + 'Rubik Marker Hatch', + 'Rubik Maze', + 'Rubik Microbe', + 'Rubik Mono One', + 'Rubik Moonrocks', + 'Rubik Pixels', + 'Rubik Puddles', + 'Rubik Spray Paint', + 'Rubik Storm', + 'Rubik Vinyl', + 'Rubik Wet Paint', + 'Ruda', + 'Rufina', + 'Ruge Boogie', + 'Ruluko', + 'Rum Raisin', + 'Ruslan Display', + 'Russo One', + 'Ruthie', + 'Rye', + 'STIX Two Text', + 'Sacramento', + 'Sahitya', + 'Sail', + 'Saira', + 'Saira Condensed', + 'Saira Extra Condensed', + 'Saira Semi Condensed', + 'Saira Stencil One', + 'Salsa', + 'Sanchez', + 'Sancreek', + 'Sansita', + 'Sansita Swashed', + 'Sarabun', + 'Sarala', + 'Sarina', + 'Sarpanch', + 'Sassy Frass', + 'Satisfy', + 'Sawarabi Gothic', + 'Sawarabi Mincho', + 'Scada', + 'Scheherazade New', + 'Schibsted Grotesk', + 'Schoolbell', + 'Scope One', + 'Seaweed Script', + 'Secular One', + 'Sedgwick Ave', + 'Sedgwick Ave Display', + 'Sen', + 'Send Flowers', + 'Sevillana', + 'Seymour One', + 'Shadows Into Light', + 'Shadows Into Light Two', + 'Shalimar', + 'Shantell Sans', + 'Shanti', + 'Share', + 'Share Tech', + 'Share Tech Mono', + 'Shippori Antique', + 'Shippori Antique B1', + 'Shippori Mincho', + 'Shippori Mincho B1', + 'Shojumaru', + 'Short Stack', + 'Shrikhand', + 'Siemreap', + 'Sigmar One', + 'Signika', + 'Signika Negative', + 'Silkscreen', + 'Simonetta', + 'Single Day', + 'Sintony', + 'Sirin Stencil', + 'Six Caps', + 'Skranji', + 'Slabo 13px', + 'Slabo 27px', + 'Slackey', + 'Smokum', + 'Smooch', + 'Smooch Sans', + 'Smythe', + 'Sniglet', + 'Snippet', + 'Snowburst One', + 'Sofadi One', + 'Sofia', + 'Sofia Sans', + 'Sofia Sans Condensed', + 'Sofia Sans Extra Condensed', + 'Sofia Sans Semi Condensed', + 'Solitreo', + 'Solway', + 'Song Myung', + 'Sono', + 'Sonsie One', + 'Sora', + 'Sorts Mill Goudy', + 'Source Code Pro', + 'Source Sans 3', + 'Source Sans Pro', + 'Source Serif 4', + 'Source Serif Pro', + 'Space Grotesk', + 'Space Mono', + 'Special Elite', + 'Spectral', + 'Spectral SC', + 'Spicy Rice', + 'Spinnaker', + 'Spirax', + 'Splash', + 'Spline Sans', + 'Spline Sans Mono', + 'Squada One', + 'Square Peg', + 'Sree Krushnadevaraya', + 'Sriracha', + 'Srisakdi', + 'Staatliches', + 'Stalemate', + 'Stalinist One', + 'Stardos Stencil', + 'Stick', + 'Stick No Bills', + 'Stint Ultra Condensed', + 'Stint Ultra Expanded', + 'Stoke', + 'Strait', + 'Style Script', + 'Stylish', + 'Sue Ellen Francisco', + 'Suez One', + 'Sulphur Point', + 'Sumana', + 'Sunflower', + 'Sunshiney', + 'Supermercado One', + 'Sura', + 'Suranna', + 'Suravaram', + 'Suwannaphum', + 'Swanky and Moo Moo', + 'Syncopate', + 'Syne', + 'Syne Mono', + 'Syne Tactile', + 'Tai Heritage Pro', + 'Tajawal', + 'Tangerine', + 'Tapestry', + 'Taprom', + 'Tauri', + 'Taviraj', + 'Teko', + 'Telex', + 'Tenali Ramakrishna', + 'Tenor Sans', + 'Text Me One', + 'Texturina', + 'Thasadith', + 'The Girl Next Door', + 'The Nautigal', + 'Tienne', + 'Tillana', + 'Timmana', + 'Tinos', + 'Tiro Bangla', + 'Tiro Devanagari Hindi', + 'Tiro Devanagari Marathi', + 'Tiro Devanagari Sanskrit', + 'Tiro Gurmukhi', + 'Tiro Kannada', + 'Tiro Tamil', + 'Tiro Telugu', + 'Titan One', + 'Titillium Web', + 'Tomorrow', + 'Tourney', + 'Trade Winds', + 'Train One', + 'Trirong', + 'Trispace', + 'Trocchi', + 'Trochut', + 'Truculenta', + 'Trykker', + 'Tulpen One', + 'Turret Road', + 'Twinkle Star', + 'Ubuntu', + 'Ubuntu Condensed', + 'Ubuntu Mono', + 'Uchen', + 'Ultra', + 'Unbounded', + 'Uncial Antiqua', + 'Underdog', + 'Unica One', + 'UnifrakturCook', + 'UnifrakturMaguntia', + 'Unkempt', + 'Unlock', + 'Unna', + 'Updock', + 'Urbanist', + 'VT323', + 'Vampiro One', + 'Varela', + 'Varela Round', + 'Varta', + 'Vast Shadow', + 'Vazirmatn', + 'Vesper Libre', + 'Viaoda Libre', + 'Vibes', + 'Vibur', + 'Vidaloka', + 'Viga', + 'Voces', + 'Volkhov', + 'Vollkorn', + 'Vollkorn SC', + 'Voltaire', + 'Vujahday Script', + 'Waiting for the Sunrise', + 'Wallpoet', + 'Walter Turncoat', + 'Warnes', + 'Water Brush', + 'Waterfall', + 'Wellfleet', + 'Wendy One', + 'Whisper', + 'WindSong', + 'Wire One', + 'Work Sans', + 'Xanh Mono', + 'Yaldevi', + 'Yanone Kaffeesatz', + 'Yantramanav', + 'Yatra One', + 'Yellowtail', + 'Yeon Sung', + 'Yeseva One', + 'Yesteryear', + 'Yomogi', + 'Yrsa', + 'Yuji Boku', + 'Yuji Mai', + 'Yuji Syuku', + 'Yusei Magic', + 'ZCOOL KuaiLe', + 'ZCOOL QingKe HuangYou', + 'ZCOOL XiaoWei', + 'Zen Antique', + 'Zen Antique Soft', + 'Zen Dots', + 'Zen Kaku Gothic Antique', + 'Zen Kaku Gothic New', + 'Zen Kurenaido', + 'Zen Loop', + 'Zen Maru Gothic', + 'Zen Old Mincho', + 'Zen Tokyo Zoo', + 'Zeyada', + 'Zhi Mang Xing', + 'Zilla Slab', + 'Zilla Slab Highlight', +] diff --git a/packages/teleport-project-plugin-next-fonts/src/index.ts b/packages/teleport-project-plugin-next-fonts/src/index.ts new file mode 100644 index 000000000..02f8a4cb0 --- /dev/null +++ b/packages/teleport-project-plugin-next-fonts/src/index.ts @@ -0,0 +1,239 @@ +import { + ChunkDefinition, + ChunkType, + FileType, + FrameWorkConfigOptions, + ProjectPlugin, + ProjectPluginStructure, + UIDLStyleInlineAsset, +} from '@teleporthq/teleport-types' +import pluginNextFonts from './component-plugin' +import { + generateFontDeclerationChunk, + getFontAndVariable, + isGoogleFont, + NEXT_FONT_DEPENDENCY, +} from './utils' +import * as types from '@babel/types' +import { ASTUtils } from '@teleporthq/teleport-plugin-common' +import css from 'css' + +const declerationChunks: ChunkDefinition[] = [] +const importSpecifiers: types.ImportSpecifier[] = [] +const isFontDeclared: Record = {} + +const generateFontAndFontDeclerationChunk = ( + content: string, + statement: types.JSXElement | null, + params: { weight: number | string } +): [string, string, string] => { + const [font, fontDecleration, variable] = getFontAndVariable(content) + if (isFontDeclared[fontDecleration] && statement) { + return [font, fontDecleration, variable] + } + + const chunk: ChunkDefinition = generateFontDeclerationChunk( + font, + fontDecleration, + variable, + params?.weight + ) + + if (statement) { + ASTUtils.addClassStringOnJSXTag( + statement, + [], + [types.memberExpression(types.identifier(fontDecleration), types.identifier('variable'))] + ) + importSpecifiers.push(types.importSpecifier(types.identifier(font), types.identifier(font))) + declerationChunks.push(chunk) + isFontDeclared[font] = true + } + + return [font, fontDecleration, variable] +} + +export class ProjectPluginNextFonts implements ProjectPlugin { + async runBefore(structure: ProjectPluginStructure) { + const { strategy, uidl } = structure + const defaultStyles: UIDLStyleInlineAsset[] = [] + + /** + * Handling project-styles, and updating fonts and font variables respectively + */ + Object.values(uidl.root?.styleSetDefinitions || {}).forEach((style) => { + if (style.type !== 'reusable-project-style-map') { + return + } + + if ( + style.content?.fontFamily?.type === 'static' && + isGoogleFont(style.content?.fontFamily.content as string) + ) { + const [, , variable] = generateFontAndFontDeclerationChunk( + style.content.fontFamily.content as string, + null, + { weight: style.content?.fontWeight?.content as string } + ) + style.content.fontFamily = { type: 'static', content: `var(${variable})` } + } + + style?.conditions?.forEach((cond) => { + const { content } = cond + if ( + content?.fontFamily?.type !== 'static' || + !isGoogleFont(content.fontFamily.content as string) + ) { + return + } + + const [, , variable] = generateFontAndFontDeclerationChunk( + content.fontFamily.content as string, + null, + { weight: content?.fontWeight?.content as string } + ) + content.fontFamily = { type: 'static', content: `var(${variable})` } + }) + }) + + uidl.globals.assets = uidl.globals.assets.filter((asset) => { + if (asset.type === 'font' && asset.path.indexOf('google')) { + return + } + + if (asset.type === 'style' && 'content' in asset) { + defaultStyles.push(asset) + return + } + + return asset + }) + + strategy.pages.plugins.unshift(pluginNextFonts) + strategy.components.plugins.unshift(pluginNextFonts) + strategy.projectStyleSheet.plugins.unshift(pluginNextFonts) + strategy.framework.config.plugins.unshift(pluginNextFonts) + + const oldConfigContentGenerator = strategy.framework.config.configContentGenerator + strategy.framework.config.configContentGenerator = (opts: FrameWorkConfigOptions) => { + const result = oldConfigContentGenerator(opts) + + const appJSChunk = result.chunks.js.find((chunk) => chunk.name === 'app-js-chunk') + + const exportDefaultChunk = (appJSChunk.content as types.ExportDefaultDeclaration[]).find( + (chunk) => chunk.type === 'ExportDefaultDeclaration' + ) as types.ExportDefaultDeclaration + + const funcBody = ( + (exportDefaultChunk.declaration as types.FunctionDeclaration).body as types.BlockStatement + ).body + const oldReturnStatement = funcBody.find( + (item) => item.type === 'ReturnStatement' + ) as types.ReturnStatement + + if (!oldReturnStatement) { + return result + } + + const returnStatement = types.returnStatement( + types.jsxElement( + types.jsxOpeningElement(types.jsxIdentifier('main'), []), + types.jsxClosingElement(types.jsxIdentifier('main')), + [oldReturnStatement.argument as types.JSXElement] + ) + ) + + ;( + (exportDefaultChunk.declaration as types.FunctionDeclaration).body as types.BlockStatement + ).body = funcBody.filter( + (elm) => elm.type !== 'ReturnStatement' + ) as types.BlockStatement['body'] + ;( + (exportDefaultChunk.declaration as types.FunctionDeclaration).body as types.BlockStatement + ).body.push(returnStatement) + appJSChunk.linkAfter = ['font-decleration-chunk'] + + /** + * Handling project style shsets that are added on project level + */ + defaultStyles.forEach((style) => { + const ast = css.parse(style.content) + ast.stylesheet?.rules.forEach((rule) => { + if (!('declarations' in rule)) { + return + } + + const fontWeight = rule.declarations.find( + (item) => 'property' in item && item.property === 'font-weight' + ) + + rule.declarations.forEach((item) => { + if (!('property' in item) || item.property !== 'font-family') { + return + } + + if (!isGoogleFont(item.value)) { + return + } + + const [, fontDecleration] = generateFontAndFontDeclerationChunk( + item.value, + returnStatement.argument as types.JSXElement, + { weight: (fontWeight as css.Declaration)?.value } + ) + item.value = '${' + `${fontDecleration}.style.fontFamily` + '}' + }) + }) + + /** + * Wrapping up default styles that targets tags + * as