PK T~ y f-alert.cccompyPK ՒT_
component.json
{"UUID":"0e903795-cb53-499e-b47d-b9e4a28d478d","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":"1024px"},"description":"Your component description","element_name":"Container","framework":"foundation","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":"f-alert","resources":{},"stylesheet":".container.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(176, 19, 114, 1);\n box-sizing:border-box;\n padding-top:0px;\n padding-right:0px;\n padding-bottom:0px;\n padding-left:0px;\n margin-bottom:0px;\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.callout-container {\n padding-top:20px;\n padding-right:20px;\n padding-bottom:20px;\n padding-left:20px;\n background-color:rgba(204, 204, 204, 1);\n}\n\np.paragraph.callout-para {\n padding-left:0px;\n line-height:22px;\n margin-top:16px;\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: 64rem) {\n .container.callout {\n box-sizing:border-box;\n background-color:rgba(176, 19, 114, 1);\n }\n\n span.glyph.font-icon-close {\n cursor:pointer;\n }\n\n .container.callout-container {\n box-sizing:border-box;\n }\n\n p.paragraph.callout-para {\n margin-top:16px;\n margin-bottom:14px;\n }\n}","timestamp":1659025344418,"type":"Container","units":"rem"}
PK ՒT_
component.jsonPK <