quantumai-design-system
Version:
퀀텀에이아이의 디자인 시스템
71 lines (70 loc) • 1.81 kB
JavaScript
import { css } from '@emotion/react';
import { COLORS } from '../../../styles/theme';
export var TOAST_SPACING = '20px';
export var TOAST_POSITIONS = {
topLeft: css({
top: TOAST_SPACING,
left: TOAST_SPACING,
}),
topRight: css({
top: TOAST_SPACING,
right: TOAST_SPACING,
}),
bottomLeft: css({
bottom: TOAST_SPACING,
left: TOAST_SPACING,
}),
bottomRight: css({
bottom: TOAST_SPACING,
right: TOAST_SPACING,
}),
};
export var TOAST_OPTION = {
info: {
primary: COLORS.primary,
secondary: COLORS.blue2,
icon: 'info',
},
success: {
primary: COLORS.green,
secondary: '#F6FDEF',
icon: 'success',
},
warning: {
primary: COLORS.yellow,
secondary: '#FEF9EC',
icon: 'warning',
},
error: {
primary: COLORS.red,
secondary: '#FEF6F6',
icon: 'fail',
},
};
export var getToastColor = function (type, isFill) {
return isFill
? css({
borderColor: TOAST_OPTION[type].primary,
backgroundColor: TOAST_OPTION[type].primary,
color: COLORS.white,
fill: COLORS.white,
'.main_icon': {
fill: COLORS.white,
},
'.progress': {
backgroundColor: COLORS.white + '85',
},
})
: css({
borderColor: TOAST_OPTION[type].primary,
backgroundColor: TOAST_OPTION[type].secondary,
color: COLORS.grey8,
fill: COLORS.grey8,
'.main_icon': {
fill: TOAST_OPTION[type].primary,
},
'.progress': {
backgroundColor: TOAST_OPTION[type].primary,
},
});
};