@anoki/fse-ui/dist/components/ui/Callout/Callout.css

FSE UI components library

.callout{position:relative;border:2px solid;border-radius:8px;background-color:#fff;font-family:Titillium Web,sans-serif;max-width:498px}.callout .callout-header{position:absolute;top:-.9rem;left:52px;background-color:#fff;font-weight:700;text-transform:uppercase;font-size:.85rem;display:flex;align-items:center;gap:8px;font-weight:600;font-size:18px;line-height:24px;letter-spacing:0px;padding:0 40px}@media (max-width: 498px){.callout .callout-header{max-width:clamp(100px,70%,435px);padding:0 20px}}.callout .callout-header .callout-title{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;white-space:normal}.callout .callout-header svg{flex-shrink:0}.callout .callout-body{font-family:Lora;font-weight:400;font-size:18px;line-height:28px;letter-spacing:0%}.callout.callout-info{border-color:var(--text-primary)}.callout.callout-info .callout-header{color:var(--text-primary)}.callout.callout-info .callout-body{font-style:italic}.callout.callout-warning{border-color:var(--background-status-warning)}.callout.callout-warning .callout-header{color:var(--background-status-warning)}.callout.callout-warning .callout-body{font-style:normal}.callout.callout-danger{border-color:var(--background-status-error)}.callout.callout-danger .callout-header{color:var(--background-status-error)}.callout.callout-danger .callout-body{font-style:normal}.callout.callout-success{border-color:var(--background-status-success)}.callout.callout-success .callout-header{color:var(--background-status-success)}.callout.callout-success .callout-body{font-style:normal}