@aurolabs/auro-banner
Version:
aurolabs-banner HTML custom element
4 lines (3 loc) • 1.05 kB
JavaScript
import {css} from 'lit-element';
export default css`@media screen and (min-width: 660px){:host([fixed]) .content{padding-right:32px}}:host([fixed]) .graphic{margin-bottom:32px}@media screen and (min-width: 660px){:host([fixed]) .graphic{margin-bottom:0}}:host([fixed]) :host([overlay]) .content{padding-bottom:100px}@media screen and (min-width: 660px){:host([fixed]) :host([overlay]) .content{padding-right:32px}}:host([fixed]) :host([overlay]) .overlayContainer{top:-20px}:host([fixed]) :host([overlay]) .overlayBg{width:120px;height:120px}:host([fixed]) :host([onBackground]) .bannerWrapper{padding:32px}:host([fixed]) :host([inset]) .content{padding:32px}@media screen and (min-width: 660px){:host([fixed]) :host([inset]) .content{padding:48px}}:host([fixed]) :host([roundedBorder]) .bannerWrapper{padding:24px;border-radius:8px}:host([fixed]) :host([row]) .content{padding-left:32px}@media screen and (min-width: 660px){:host([fixed]) :host([flipped]) .content{padding-left:32px}}:host([fixed]) :host([row][flipped]) .content{padding-right:32px}
`;