@message-prefix-cls: ~"@{css-prefix}message"; @icon-prefix-cls: ~"@{css-prefix}icon"; .@{message-prefix-cls} { font-size: 12px; position: fixed; z-index: @zindex-message; width: 100%; top: 16px; left: 0; &-notice { width: auto; vertical-align: middle; position: absolute; left: 50%; } &-notice-content { position: relative; right: 50%; padding: 8px 16px; border: 1px solid @border-color-split; border-radius: @border-radius-small; box-shadow: @shadow-base; background: #fff; display: block; } &-success .@{icon-prefix-cls} { color: @success-color; } &-error .@{icon-prefix-cls} { color: @error-color; } &-warning .@{icon-prefix-cls} { color: @warning-color; } &-info .@{icon-prefix-cls}, &-loading .@{icon-prefix-cls} { color: @primary-color; } .@{icon-prefix-cls} { margin-right: 8px; font-size: 14px; top: 1px; position: relative; } }