@sms-frontend/components/lib/Message/style/token.less

SMS Design React UI Library.

@import '../../style/theme/default.less';

@message-wrapper-margin-top: @spacing-12;
@message-wrapper-margin-bottom: @spacing-12;

@message-padding-top: @spacing-5;
@message-padding-bottom: @spacing-5;
@message-padding-left: @spacing-7;
@message-padding-right: @spacing-7;
@message-margin-bottom: @spacing-7;
@message-border-radius: @radius-small;
@message-font-size-icon: 20px;
@message-font-size-content: @font-size-body-3;
@message-icon-margin-right: @spacing-4;

@message-border-width: 1px;
@message-border-style: solid;
@message-box-shadow: @shadow2-down;

@message-color-close-icon: var(--color-text-1);
@message-close-icon-font-size: 12px;
@message-close-icon-top: 14px;
@message-close-icon-right: @spacing-6;
@message-close-icon-left: 14px;

@message-normal-color-bg: var(--color-bg-popup);
@message-normal-color-icon: var(--color-text-1);
@message-normal-color-content: var(--color-text-1);
@message-normal-color-border: var(--color-neutral-3);

@message-info-color-bg: var(--color-bg-popup);
@message-info-color-icon: @color-primary-6;
@message-info-color-content: var(--color-text-1);
@message-info-color-border: var(--color-neutral-3);

@message-success-color-bg: var(--color-bg-popup);
@message-success-color-icon: @color-success-6;
@message-success-color-content: var(--color-text-1);
@message-success-color-border: var(--color-neutral-3);

@message-warning-color-bg: var(--color-bg-popup);
@message-warning-color-icon: @color-warning-6;
@message-warning-color-content: var(--color-text-1);
@message-warning-color-border: var(--color-neutral-3);

@message-error-color-bg: var(--color-bg-popup);
@message-error-color-icon: @color-danger-6;
@message-error-color-content: var(--color-text-1);
@message-error-color-border: var(--color-neutral-3);

@message-loading-color-bg: var(--color-bg-popup);
@message-loading-color-icon: @color-primary-6;
@message-loading-color-content: var(--color-text-1);
@message-loading-color-border: var(--color-neutral-3);