PK T ": 5 bs-alert.cccomp5PK Te_
component.json
M{"UUID":"281af224-433e-45f0-84c1-cd1ca27ddf6e","additional_states":{"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"}}},"appBuildInfo":"RSD 5.0.3519","appId":"RSD","appVersion":3519,"buildNumber":5973,"component_resources":{"classes":5,"file_sizes_values":[0,0,0],"file_type_values":[0,0,0],"html_elements":0,"ids":1,"links_external":0,"links_internal":1,"local_files":0,"styled_breakpoints":"768px / 992px / 1200px"},"description":"Your component description","element_name":"Container","framework":"bootstrap4","html":"
Add some content to the callout.
Maybe a link?
Or a warning?
Close the callout if it is in your way, click the X.
","htmlembed":{},"mobile_first":true,"name":"bs-alert","resources":{},"stylesheet":".container-grid.callout {\n max-width:400px;\n position:fixed;\n top:35px;\n right:25px;\n width:100%;\n margin-left:20px;\n background-color:rgba(31, 151, 127, 1);\n padding-left:0px;\n box-sizing:border-box;\n}\n\nspan.glyph.font-icon-close {\n position:absolute;\n top:15px;\n right:25px;\n color:rgba(255, 255, 255, 1);\n cursor:pointer;\n}\n\nh4.callout-header {\n font-size:30px;\n color:rgba(255, 255, 255, 1);\n padding-left:20px;\n margin-top:0px;\n margin-bottom:20px;\n}\n\n.container-grid.callout-container {\n padding-top:20px;\n padding-right:20px;\n padding-bottom:20px;\n padding-left:20px;\n background-color:rgba(213, 213, 213, 1);\n}\n\np.paragraph.callout-para {\n padding-left:0px;\n line-height:22px;\n}\n\nh4 span.heading-text-1 {\n font-family:'Roboto', sans-serif;\n}\n\np.paragraph span.paragraph-text-1 {\n color:rgba(241, 17, 31, 1);\n}\n\np.paragraph span.red {\n color:rgba(241, 17, 31, 1);\n font-weight:600;\n}\n\n@media screen and (min-width: 48rem) {\n .container-grid.callout-container {\n background-color:rgba(213, 213, 213, 1);\n }\n}\n\n@media screen and (min-width: 62rem) {\n .container-grid.callout {\n background-color:rgba(22, 147, 121, 1);\n }\n}\n\n@media screen and (min-width: 75rem) {\n span.glyph.font-icon-close {\n cursor:pointer;\n }\n}","timestamp":1659020686432,"type":"Container","units":"rem"}
PK Te_
component.jsonPK <