@shopgate/engage/components/MessageBar/MessageBar.style.js

Shopgate's ENGAGE library.

function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}import{css}from'glamor';import Color from'color';import{responsiveMediaQuery,getCSSCustomProp}from'@shopgate/engage/styles';import{themeColors,themeVariables}from'@shopgate/pwa-common/helpers/config';var containerBase=_defineProperty({background:themeColors.background,display:'flex',flexDirection:'column',flexShrink:0,overflow:'hidden'},responsiveMediaQuery('>xs',{webOnly:true}),{fontWeight:'normal',border:'none',borderRadius:'inherit',margin:themeVariables.gap.big,boxShadow:'none',background:'none'});export var container=css(containerBase).toString();export var containerRaised=css(containerBase,{borderRadius:'0 0 5px 5px',boxShadow:'0px 4px 4px rgba(0, 0, 0, 0.25)',zIndex:10}).toString();var messageBase=_defineProperty({padding:"".concat(themeVariables.gap.big,"px ").concat(themeVariables.gap.big,"px"),fontSize:'0.875rem',lineHeight:1.3,fontWeight:500,':not(:last-child)':{marginBottom:themeVariables.gap.small*0.5},' > svg':{fontSize:'1.5rem !important'}},responsiveMediaQuery('>xs',{webOnly:true}),{padding:"".concat(themeVariables.gap.small*1.5,"px ").concat(themeVariables.gap.big,"px"),fontWeight:'normal',border:'1px solid',borderRadius:4,':not(:last-child)':{marginBottom:themeVariables.gap.small}});/**
 * @param {string|Object} sourceColor The source color.
 * @param {string} [textColor] AN optional text color.
 * @returns {Object}
 */var getMessageColors=function getMessageColors(sourceColor,textColor){var background=Color(sourceColor).fade(0.9);var color=textColor||'var(--color-text-height-emphasis)';var borderColor=sourceColor;return{background:background,color:color,borderColor:borderColor};};/**
 * @returns {string}
 */export var info=function info(){return css(messageBase,_defineProperty({background:"var(--color-secondary, ".concat(themeColors.accent,")"),color:"var(--color-secondary-contrast, ".concat(themeColors.accentContrast,")")},responsiveMediaQuery('>xs',{webOnly:true}),_extends({},getMessageColors(getCSSCustomProp('--color-secondary')||themeColors.accent),{' > svg':{color:"var(--color-secondary, ".concat(themeColors.accent,")")}}))).toString();};/**
 * @returns {string}
 */export var error=function error(){return css(messageBase,_defineProperty({background:themeColors.error,color:themeColors.light},responsiveMediaQuery('>xs',{webOnly:true}),_extends({},getMessageColors(themeColors.error),{' > svg':{color:themeColors.error}}))).toString();};/**
 * @returns {string}
 */export var warning=function warning(){return css(messageBase,_defineProperty({background:themeColors.warning,color:themeColors.light},responsiveMediaQuery('>xs',{webOnly:true}),_extends({},getMessageColors(themeColors.warning),{' > svg':{color:themeColors.warning}}))).toString();};export var withIcon=css({display:'flex',minWidth:'100%',alignItems:'center'}).toString();export var icon=css({flexGrow:0,flexShrink:0}).toString();export var messageToIcon=css({flexGrow:1,paddingLeft:themeVariables.gap.big});