{"__browser":{"country":"US","device":"unknown_device","mobile":false,"name":"unknown browser","platform":"unknown_platform","version":"0"},"__constants":{},"__CPDATA":{"domain_iframe":"https://cdpn.io","environment":"production","host":"codepen.io","iframe_allow":"accelerometer *; ambient-light-sensor *; camera *; display-capture *; encrypted-media *; geolocation *; gyroscope *; microphone *; midi *; payment *; vr *; web-share *; serial *; xr-spatial-tracking *","iframe_sandbox":"allow-downloads allow-forms allow-modals allow-pointer-lock allow-popups-to-escape-sandbox allow-popups allow-presentation allow-same-origin allow-scripts allow-top-navigation-by-user-activation"},"__graphql":{"data":{"data":{"sessionUser":{"id":"VoDkNZ","name":"Captain Anonymous","title":"Captain Anonymous","avatar":"https://assets.codepen.io/t-1/user-default-avatar.jpg?format=auto&version=0","currentContext":{"id":"VoDkNZ","title":"Captain Anonymous","name":"Captain Anonymous","avatar":"https://assets.codepen.io/t-1/user-default-avatar.jpg?format=auto&version=0","username":"anon","__typename":"User"},"currentTeamId":null,"username":"anon","admin":false,"anon":true,"pro":false,"verified":false,"featureFlags":[],"teams":[],"__typename":"User"}}},"url":"https://codepen.io/graphql","api":"cprails"},"__user":{"anon":true,"base_url":"/anon/","cohorts":[],"current_team_hashid":null,"current_team_id":0,"hashid":"VoDkNZ","id":1,"itemType":"user","name":"Captain Anonymous","paid":false,"tier":0,"username":"anon","created_at":null,"email_verified":null,"collections_count":0,"collections_private_count":0,"followers_count":0,"followings_count":0,"pens_count":0,"pens_private_count":0,"projects_count":0,"projects_private_count":0},"__firebase":{"config":{"apiKey":"AIzaSyBgLAe7N_MdFpuVofMkcQLGwwhUu5tuxls","authDomain":"codepen-store-production.firebaseapp.com","databaseURL":"https://codepen-store-production.firebaseio.com","disabled":false,"projectId":"codepen-store-production"},"token":"eyJhbGciOiJSUzI1NiJ9.eyJhdWQiOiJodHRwczovL2lkZW50aXR5dG9vbGtpdC5nb29nbGVhcGlzLmNvbS9nb29nbGUuaWRlbnRpdHkuaWRlbnRpdHl0b29sa2l0LnYxLklkZW50aXR5VG9vbGtpdCIsImNsYWltcyI6eyJvd25lcklkIjoiVm9Ea05aIiwiYWRtaW4iOmZhbHNlfSwiZXhwIjoxNzM3ODQxNzU1LCJpYXQiOjE3Mzc4MzgxNTUsImlzcyI6ImZpcmViYXNlLWFkbWluc2RrLThva3lsQGNvZGVwZW4tc3RvcmUtcHJvZHVjdGlvbi5pYW0uZ3NlcnZpY2VhY2NvdW50LmNvbSIsInN1YiI6ImZpcmViYXNlLWFkbWluc2RrLThva3lsQGNvZGVwZW4tc3RvcmUtcHJvZHVjdGlvbi5pYW0uZ3NlcnZpY2VhY2NvdW50LmNvbSIsInVpZCI6IlZvRGtOWiJ9.UYUGD8NryAYCb5PiuLt6WlpHKyfsAw34Br4qJbFOwky02HUA9g7TUexTNT93F7HhPvoqUbn5OU5Q_58viVazkbUwe0rD2rz6aqq6RRC7kq9YAvp_D0aCK7VW1NNTRVPZEe3ipFn-Rmf_zwH8xuWCvc9XM3bsiRG31fTzxq7br4kwqPqaGIOKsKmcGX_BI-bWyiDKUai81sEuKBBKPJNiQdAbbYoKTcWK9umFeSyJhWZfw_KgYwnrLfzMfUwEOQdcj5XAzJc5jOLPZL6O4VEc-ba9H7kgqpokYODfkb_VNBwmp4RK5nrQHGhYGMYE2x3qvRkNFPW7euIMOyAlD298rA"},"__pay_stripe_public_key":"pk_live_2GndomDfiklqpSNQn8FrGuwZSMIMzha7DkLJqlYe7IR0ihKAlKdiHg68JJc5eVPt68rzAjzAAVXcUwjySHRCsgjQQ00gtRBUFNH","__pay_braintree_env":"production","__item":"{\"id\":60426015,\"user_id\":1887094,\"html\":\"<html>\\n <body>\\n <!-- This div will host the builder -->\\n <div id=\\\"builder\\\"><\\/div>\\n <!-- This div will host the runner -->\\n <div id=\\\"runner\\\"><\\/div>\\n <\\/body>\\n<\\/html>\",\"css\":\"#builder {\\n position: absolute;\\n left: 0px;\\n width: 50%;\\n top: 0px;\\n bottom: 0px;\\n}\\n\\n#runner {\\n position: absolute;\\n right: 0px;\\n width: calc(50% - 1px);\\n top: 0px;\\n bottom: 0px;\\n border-left: 1px solid rgb(216,229,238);\\n}\\n\\nbody {\\n overflow: hidden;\\n}\\n\",\"js\":\"Tripetto.Namespaces.include(\\\"@tripetto\\/block-device\\\");\\n\\n\\/\\/ Create a new builder instance\\nTripetto.Builder.open(\\n {\\n sections: [\\n {\\n id: \\\"ec7d180aecd099aea6dac9d6ec643e0d39363e3f62f3cfda71d88ca0fa2d2eb1\\\",\\n nodes: [\\n {\\n id:\\n \\\"150f80b826b421af86b144816c88f54f561157790949e388460865d2b5d74826\\\",\\n name: \\\"Device condition example\\\",\\n nameVisible: true\\n }\\n ],\\n branches: [\\n {\\n id:\\n \\\"cedaf470a0e6f99121ab401e01370ce4cc364f471974d31bbe9e943119e76fba\\\",\\n clusters: [\\n {\\n id:\\n \\\"c98750b175f6e8c77e5adeb986b71dc69513e5288ac4502a2ab4f5980aaf05a7\\\",\\n nodes: [\\n {\\n id:\\n \\\"60b849675f1e4c877f9e28b1e503f192b5a0454b2ef92c6d72f5ee3614bc6abc\\\",\\n name: \\\"Branch for desktop device.\\\",\\n nameVisible: true\\n }\\n ]\\n }\\n ],\\n conditions: [\\n {\\n id:\\n \\\"160e7ece83804270e2ee1a8b8e6238f33caa6da2010e5727d5b4b50bc0afa4e3\\\",\\n block: {\\n type: \\\"@tripetto\\/block-device\\\",\\n version: \\\"4.0.1\\\",\\n deviceType: \\\"desktop\\\"\\n }\\n }\\n ]\\n },\\n {\\n id:\\n \\\"7dfdf2120f4f52e9e4e3d9cd142a3de4a793f1816f5d07717232569fdb637f4a\\\",\\n clusters: [\\n {\\n id:\\n \\\"674753caebc5f0e93c66da6dae23ea7096aeb4dfd18f5367bc5a75adefb14000\\\",\\n nodes: [\\n {\\n id:\\n \\\"aa69f682ae136ec506bde38db32f86c0f239adbdab28747745ef59dbad1f83dd\\\",\\n name: \\\"Branch for tablet device.\\\",\\n nameVisible: true\\n }\\n ]\\n }\\n ],\\n conditions: [\\n {\\n id:\\n \\\"bd8f27b62ff1263ce216300f5ab43bae9fafeee02817701ff4f1ce686c47d324\\\",\\n block: {\\n type: \\\"@tripetto\\/block-device\\\",\\n version: \\\"4.0.1\\\",\\n deviceType: \\\"tablet\\\"\\n }\\n }\\n ]\\n },\\n {\\n id:\\n \\\"a7da0fe0ae600376ec204daf1ce0fef37c7ec75f3ad2224c5d633cee0e0d066c\\\",\\n clusters: [\\n {\\n id:\\n \\\"afa838e05db33b438720e32373cd031979ec7cc59ba7d024d1ee4e5f5a2cd698\\\",\\n nodes: [\\n {\\n id:\\n \\\"d49b9a5145df3aadf23eb9df331b266b6aaf5357b224f6c0e2b57c34c91b5bef\\\",\\n name: \\\"Branch for phone device.\\\",\\n nameVisible: true\\n }\\n ]\\n }\\n ],\\n conditions: [\\n {\\n id:\\n \\\"cd62672ecf1a2104815efd7d358e4cdc0e4014cc47eee83905ed6e9d1012b05a\\\",\\n block: {\\n type: \\\"@tripetto\\/block-device\\\",\\n version: \\\"4.0.1\\\",\\n deviceType: \\\"phone\\\"\\n }\\n }\\n ]\\n }\\n ]\\n }\\n ],\\n builder: { name: \\\"tripetto\\\", version: \\\"4.5.0\\\" }\\n },\\n {\\n element: document.getElementById(\\\"builder\\\"),\\n onReady: (builder) =>\\n \\/\\/ Builder is ready, now create the runner for the live preview\\n TripettoAutoscroll.run({\\n element: document.getElementById(\\\"runner\\\"),\\n definition: builder.definition,\\n view: \\\"preview\\\",\\n builder\\n }),\\n disableSaveButton: true,\\n disableCloseButton: true,\\n controls: \\\"left\\\"\\n }\\n);\\n\",\"html_pre_processor\":\"none\",\"css_pre_processor\":\"less\",\"js_pre_processor\":\"typescript\",\"html_classes\":\"\",\"css_starter\":\"neither\",\"js_library\":null,\"created_at\":\"2022-04-26T09:47:49.125Z\",\"updated_at\":\"2023-04-19T13:44:20.054Z\",\"title\":\"Tripetto SDK \\/ Blocks \\/ Stock \\/ Device\",\"description\":\"\",\"slug_hash\":\"YzYoxLV\",\"head\":\"\",\"private\":true,\"slug_hash_private\":\"842c848ca9a65ed0176e6d4528865068\",\"has_animation\":false,\"team_id\":0,\"css_prefix\":\"neither\",\"template\":false,\"parent_id\":56696628,\"comments_count\":0,\"custom_screenshot_filename\":null,\"loves_count\":0,\"pick\":false,\"popularity\":1,\"views_count\":9,\"pick_visible_at\":null,\"cpid\":\"01806545-1a05-7b21-b7f1-e60529cd7b74\",\"is_new_editor_pen\":false,\"protected\":false,\"access\":\"Private\",\"pen_hash\":null,\"hashid\":\"YzYoxLV\"}"}