// styles are inspired by `react-error-overlay` var msgStyles = { error: { backgroundColor: "rgba(206, 17, 38, 0.1)", color: "#fccfcf" }, warning: { backgroundColor: "rgba(251, 245, 180, 0.1)", color: "#fbf5b4" } }; var iframeStyle = { position: "fixed", top: 0, left: 0, right: 0, bottom: 0, width: "100vw", height: "100vh", border: "none", "z-index": 9999999999 }; var containerStyle = { position: "fixed", boxSizing: "border-box", left: 0, top: 0, right: 0, bottom: 0, width: "100vw", height: "100vh", fontSize: "large", padding: "2rem 2rem 4rem 2rem", lineHeight: "1.2", whiteSpace: "pre-wrap", overflow: "auto", backgroundColor: "rgba(0, 0, 0, 0.9)", color: "white" }; var headerStyle = { color: "#e83b46", fontSize: "2em", whiteSpace: "pre-wrap", fontFamily: "sans-serif", margin: "0 2rem 2rem 0", flex: "0 0 auto", maxHeight: "50%", overflow: "auto" }; var dismissButtonStyle = { color: "#ffffff", lineHeight: "1rem", fontSize: "1.5rem", padding: "1rem", cursor: "pointer", position: "absolute", right: 0, top: 0, backgroundColor: "transparent", border: "none" }; var msgTypeStyle = { color: "#e83b46", fontSize: "1.2em", marginBottom: "1rem", fontFamily: "sans-serif" }; var msgTextStyle = { lineHeight: "1.5", fontSize: "1rem", fontFamily: "Menlo, Consolas, monospace" }; export { msgStyles, iframeStyle, containerStyle, headerStyle, dismissButtonStyle, msgTypeStyle, msgTextStyle };