diff --git a/src/components/Modal/src/index.less b/src/components/Modal/src/index.less index 027556be..10fc7683 100644 --- a/src/components/Modal/src/index.less +++ b/src/components/Modal/src/index.less @@ -1,3 +1,5 @@ +@prefix-cls: ~'@{namespace}-basic-modal-wrap'; + .fullscreen-modal { overflow: hidden; @@ -18,103 +20,105 @@ } } -.ant-modal { - width: 520px; - padding-bottom: 0; +.@{prefix-cls} { + .ant-modal { + width: 520px; + padding-bottom: 0; - .ant-modal-body > .scrollbar { - padding: 14px; - } - - &-title { - font-size: 16px; - font-weight: bold; - - .base-title { - cursor: move !important; + .ant-modal-body > .scrollbar { + padding: 14px; } - } - .ant-modal-body { - padding: 0; + &-title { + font-size: 16px; + font-weight: bold; - > .scrollbar > .scrollbar__bar.is-horizontal { - display: none; - } - } - - &-large { - top: 60px; - - &--mini { - top: 16px; - } - } - - &-header { - padding: 16px; - border-bottom: 1px solid @border-color-base; - } - - &-content { - padding: 0 !important; - box-shadow: - 0 4px 8px 0 rgb(0 0 0 / 20%), - 0 6px 20px 0 rgb(0 0 0 / 19%); - } - - &-footer { - padding: 10px 16px; - border-top: 1px solid @border-color-base; - - button + button { - margin-left: 10px; - } - } - - &-close { - top: 0 !important; - right: 0 !important; - width: auto !important; - outline: none; - background: transparent !important; - font-weight: normal; - } - - &-close-x { - display: inline-block; - width: 96px; - height: 56px; - line-height: 56px !important; - } - - &-confirm-body { - .ant-modal-confirm-content { - > * { - color: @text-color-help-dark; + .base-title { + cursor: move !important; } } - } - &-confirm-confirm.error .ant-modal-confirm-body > .anticon { - color: @error-color; - } + .ant-modal-body { + padding: 0; - &-confirm-btns { - .ant-btn:last-child { - margin-right: 0; + > .scrollbar > .scrollbar__bar.is-horizontal { + display: none; + } } - } - &-confirm-info { - .ant-modal-confirm-body > .anticon { - color: @warning-color; + &-large { + top: 60px; + + &--mini { + top: 16px; + } } - } - &-confirm-confirm.success { - .ant-modal-confirm-body > .anticon { - color: @success-color; + &-header { + padding: 16px; + border-bottom: 1px solid @border-color-base; + } + + &-content { + padding: 0 !important; + box-shadow: + 0 4px 8px 0 rgb(0 0 0 / 20%), + 0 6px 20px 0 rgb(0 0 0 / 19%); + } + + &-footer { + padding: 10px 16px; + border-top: 1px solid @border-color-base; + + button + button { + margin-left: 10px; + } + } + + &-close { + top: 0 !important; + right: 0 !important; + width: auto !important; + outline: none; + background: transparent !important; + font-weight: normal; + } + + &-close-x { + display: inline-block; + width: 96px; + height: 56px; + line-height: 56px !important; + } + + &-confirm-body { + .ant-modal-confirm-content { + > * { + color: @text-color-help-dark; + } + } + } + + &-confirm-confirm.error .ant-modal-confirm-body > .anticon { + color: @error-color; + } + + &-confirm-btns { + .ant-btn:last-child { + margin-right: 0; + } + } + + &-confirm-info { + .ant-modal-confirm-body > .anticon { + color: @warning-color; + } + } + + &-confirm-confirm.success { + .ant-modal-confirm-body > .anticon { + color: @success-color; + } } } }