@codex-storage/marketplace-ui-components/dist/assets/Toast.css

Marketplace UI components for Codex decentralized storage network.

@property --codex-toast-background-color{syntax: "<color>"; inherits: false; initial-value: rgba(111,203,148,.2);}@property --codex-toast-color{syntax: "<color>"; inherits: true; initial-value: rgb(111,203,148);}.toast{position:fixed;min-width:150px;transition:top .35s;top:50px;display:flex;align-items:center;gap:8px;padding:16px;color:#fff;word-break:break-word;border-radius:6px;border-bottom:2px solid var(--codex-toast-color);background:var(--codex-toast-background-color);z-index:20;-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);left:0;right:0;max-width:450px;margin:auto}@media screen and (max-width: 800px){.toast{max-width:300px}}.toast[aria-hidden]{top:-1000px}.toast.toast--success{--codex-toast-background-color: rgba(111, 203, 148, .2);--codex-toast-color: rgb(111, 203, 148)}.toast.toast--success svg{color:#6fcb94}.toast.toast--error{--codex-toast-background-color: rgba(251, 55, 72, .2);--codex-toast-color: rgb(251, 55, 72)}.toast .button{margin-left:.75rem}.toast b{text-transform:capitalize;display:block;font-size:12px;font-weight:700;line-height:16px}.toast div{display:flex;flex-direction:column;flex:1}.toast span{font-size:12px;font-weight:400;line-height:16px;text-align:left;color:#fffc}.toast svg{cursor:pointer;color:var(--codex-toast-color)}