PK ©V)gNE 1 bs-modal-overlay.cccomp PK VJܼ component.json:{"UUID":"5c819554-3dc2-46c9-9dfd-5b38e23bfd0c","additional_states":{"Button":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"Container":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"Font Icon":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"Heading 4":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"Paragraph":{"outofview":{"character":".","name":"Out of View","value":"outofview"}},"Picture":{"outofview":{"character":".","name":"Out of View","value":"outofview"}}},"appBuildInfo":"RSD 5.0.3541","appId":"RSD","appVersion":3541,"buildNumber":5982,"component_resources":{"classes":9,"file_sizes_values":[91732,0,0],"file_type_values":[1,0,0],"html_elements":0,"ids":0,"links_external":0,"links_internal":0,"local_files":"1 (local size 89,58 kB)","styled_breakpoints":"992px / 1200px"},"description":"Your component description","element_name":"Container","framework":"bootstrap4","html":"
\nvar mb = document.querySelector(".modal-bkgrnd");\nvar mc = document.querySelector(".modal-content");\nfunction modopen() {mb.style.display = "block";}\nfunction modclose () {mb.style.display = "none";}\n\nwindow.onclick = function(event) {\nif (event.target == mb) {mb.style.display = "none";}\n}\n\" data-outline-closed=\"\">
Here is the modal
Delete this paragraph and pop something more exciting in here! Anything you like. Click on the closing X or anywhere outside the modal to close it.
","htmlembed":{},"mobile_first":true,"name":"bs-modal-overlay","resources":{"./img/black-sheep.jpg":{"breakpoints":{},"elements":{"counter":0},"pictures":{"default":1},"type":"image"}},"stylesheet":".container-grid.modal-wrap {\n display:block;\n justify-content:flex-start;\n align-items:center;\n position:static;\n z-index:0;\n flex-wrap:wrap;\n flex-direction:column;\n width:100%;\n height:100%;\n}\n\nbutton.open-button {\n margin-top:30px;\n margin-left:auto;\n display:block;\n padding-top:8px;\n padding-bottom:8px;\n padding-right:15px;\n padding-left:15px;\n font-size:18px;\n background-color:rgba(248, 237, 17, 1);\n font-weight:600;\n border-top-color:rgba(221, 221, 221, 1);\n border-right-color:rgba(221, 221, 221, 1);\n border-bottom-color:rgba(221, 221, 221, 1);\n border-left-color:rgba(221, 221, 221, 1);\n border-top-left-radius:5px 5px;\n border-top-right-radius:5px 5px;\n border-bottom-right-radius:5px 5px;\n border-bottom-left-radius:5px 5px;\n margin-right:auto;\n position:static;\n z-index:1;\n}\n\n.container-grid.modal-bkgrnd {\n width:100%;\n height:100%;\n padding-right:20px;\n padding-left:20px;\n box-sizing:border-box;\n position:fixed;\n top:0px;\n z-index:1;\n background-color:rgba(0, 0, 0, 0.22);\n display:none;\n box-shadow:rgba(0, 0, 0, 0.5) 4px 4px 8px 0px;\n}\n\n.container-grid.modal-content {\n width:100%;\n max-width:800px;\n margin-right:auto;\n margin-left:auto;\n padding-top:10px;\n margin-top:100px;\n padding-bottom:15px;\n background-color:rgba(250, 193, 224, 1);\n border-top-width:0.0625rem;\n border-top-style:solid;\n border-right-style:solid;\n border-bottom-style:solid;\n border-left-style:solid;\n border-right-width:0.0625rem;\n border-bottom-width:0.0625rem;\n border-left-width:0.0625rem;\n border-top-color:rgba(204, 204, 204, 1);\n border-right-color:rgba(204, 204, 204, 1);\n border-bottom-color:rgba(204, 204, 204, 1);\n border-left-color:rgba(204, 204, 204, 1);\n border-top-left-radius:10px 10px;\n border-top-right-radius:10px 10px;\n border-bottom-right-radius:10px 10px;\n border-bottom-left-radius:10px 10px;\n box-shadow:rgba(0, 0, 0, 0.4) 4px 4px 8px 0px;\n}\n\nspan.glyph.modal-close {\n float:none;\n font-size:26px;\n padding-right:10px;\n position:static;\n top:20px;\n right:20px;\n text-align:right;\n}\n\nh4.modal-heading {\n width:80%;\n margin-right:auto;\n margin-left:auto;\n}\n\np.paragraph.modal-para {\n width:80%;\n margin-right:auto;\n margin-left:auto;\n padding-top:10px;\n padding-right:10px;\n padding-bottom:10px;\n padding-left:10px;\n font-size:16px;\n}\n\ndiv.responsive-picture.picture-1 {\n margin-right:auto;\n margin-left:auto;\n border-top-width:0.1875rem;\n border-top-style:solid;\n border-right-style:solid;\n border-bottom-style:solid;\n border-left-style:solid;\n border-right-width:0.1875rem;\n border-bottom-width:0.1875rem;\n border-left-width:0.1875rem;\n border-top-color:rgba(255, 255, 255, 1);\n border-right-color:rgba(255, 255, 255, 1);\n border-bottom-color:rgba(255, 255, 255, 1);\n border-left-color:rgba(255, 255, 255, 1);\n border-top-left-radius:5px 5px;\n border-top-right-radius:5px 5px;\n border-bottom-right-radius:5px 5px;\n border-bottom-left-radius:5px 5px;\n}\n\n@media screen and (min-width: 62rem) {\n .container-grid.inner-modal-container {\n display:flex;\n width:80%;\n margin-right:auto;\n margin-left:auto;\n }\n\n p.paragraph.modal-para {\n padding-right:20px;\n padding-left:0px;\n padding-top:45px;\n }\n\n div.responsive-picture.picture-1 {\n border-top-width:0.1875rem;\n border-top-style:solid;\n border-right-style:solid;\n border-bottom-style:solid;\n border-left-style:solid;\n border-right-width:0.1875rem;\n border-bottom-width:0.1875rem;\n border-left-width:0.1875rem;\n border-top-color:rgba(255, 255, 255, 1);\n border-right-color:rgba(255, 255, 255, 1);\n border-bottom-color:rgba(255, 255, 255, 1);\n border-left-color:rgba(255, 255, 255, 1);\n border-top-left-radius:5px 5px;\n border-top-right-radius:5px 5px;\n border-bottom-right-radius:5px 5px;\n border-bottom-left-radius:5px 5px;\n }\n}\n\n@media screen and (min-width: 75rem) {\n .container-grid.modal-content {\n background-color:rgba(250, 193, 224, 1);\n }\n\n p.paragraph.modal-para {\n padding-left:0px;\n }\n}","timestamp":1687633957627,"type":"Container","units":"rem"}
PK VE7cf Tf resources/img/black-sheep.jpg XICC_PROFILE HLino mntrRGB XYZ 1 acspMSFT IEC sRGB -HP cprt P 3desc lwtpt bkpt rXYZ gXYZ , bXYZ @ dmnd T pdmdd vued L view $lumi meas $tech 0 rTRC <