@limetech/lime-elements
Version:
1 lines • 2.08 kB
JavaScript
import{r as e,h as n}from"./p-DBTJNfo7.js";const a=class{constructor(n){e(this,n),this.isOpen=!1}async open(){this.isOpen=!0}async close(){this.isOpen=!1}render(){return n("div",{key:"4c52de06b1d1710e79d2fbe729c76b49c7a4dae9",class:"lime-banner "+(this.isOpen?"lime-banner--open":"")},n("div",{key:"2085a6a5d07c036642646f6cb9cab56e7f86f48a",class:"lime-banner__surface"},n("div",{key:"0b021548bdee32661d458a88e0472a6a1ef0f195",class:"lime-banner__content"},n("div",{key:"65db98d6d60fdf856871e68c6c3bdaa55fb87526",class:"icon-message"},this.renderIcon(),n("div",{key:"94eb50955800bc6a18c49bed8d6fd949909cf5bd"},this.message)),n("div",{key:"8331420f88b294bb1a21682ca1446704e9dc0ffb",class:"lime-banner__actions"},n("slot",{key:"b784df0968fa19c093c3c0db6de980d6472154d4",name:"buttons"})))))}renderIcon(){if(this.icon)return n("div",{class:"lime-banner__icon"},n("limel-icon",{name:this.icon,badge:!0,size:"large"}))}};a.style=".lime-banner{min-height:3.25rem;display:none;background-color:rgba(var(--contrast-100), 0.7);backdrop-filter:blur(0.3125rem);box-shadow:var(--shadow-depth-16)}.lime-banner.lime-banner--open{display:block}.lime-banner.lime-banner--open .lime-banner__surface{opacity:1}.lime-banner .lime-banner__surface{display:flex;justify-content:center;box-sizing:border-box;opacity:0}.lime-banner .lime-banner__content{display:flex;align-items:center;align-content:stretch;padding:1rem;flex-wrap:wrap}.lime-banner .icon-message{display:flex;align-items:center}.lime-banner div[class^=mdc-typography]{color:rgb(var(--contrast-1200))}.lime-banner .lime-banner__icon{margin:0 0.625rem;align-self:flex-start}.lime-banner .lime-banner__actions{margin-left:3.125rem;display:flex;justify-content:flex-end}.lime-banner limel-icon{color:var(--banner-icon-fill-color, rgb(var(--contrast-100)));background-color:var(--banner-icon-background-color, rgb(var(--contrast-800)))}@media screen and (max-width: 760px){.lime-banner__content{flex-direction:column;gap:0.5rem}.icon-message{display:flex;align-items:center}.lime-banner__actions{margin-left:0}}";export{a as limel_banner}