Skip to content

S
style_tool
Commit d011c378 authored by 刘安琪's avatar 刘安琪
Browse files
Options

修改dialog、form样式

parent 5ac81906
Hide whitespace changes
Inline Side-by-side
Showing with 96 additions and 65 deletions
element-variables.scss
View file @ d011c378
......@@ -126,6 +126,7 @@ $--background-color-lighter: #F8F8F8 !default;
$--background-select-checked: #D1ECFF !default;
$--background-transfer-head: #F7F7F7 !default;
$--background-transfer-disabled-button: #C2E2F2 !default;
$--background-dialog-header: #EFEFEF !default;
/* Link
-------------------------- */
......@@ -803,13 +804,14 @@ $--switch-button-size: 16px !default;
$--dialog-background-color: $--color-white !default;
$--dialog-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3) !default;
/// fontSize||Font|1
$--dialog-title-font-size: $--font-size-large !default;
$--dialog-title-font-size: $--font-size-base !default;
/// fontSize||Font|1
$--dialog-content-font-size: 14px !default;
/// fontLineHeight||LineHeight|2
$--dialog-font-line-height: $--font-line-height-primary !default;
/// padding||Spacing|3
$--dialog-padding-primary: 24px !default;
$--dialog-padding-primary: 20px !default;
$--dialog-padding-footer: 40px !default;
$--dialog-header-padding-primary: 16px !default;
/* Table
-------------------------- */
......
node_module/element-theme-chalk/src/dialog.scss
View file @ d011c378
......@@ -34,6 +34,9 @@
padding: $--dialog-header-padding-primary;
padding-bottom: 8px;
padding-top: 8px;
height: 32px;
line-height: 32px;
background: $--background-dialog-header;
}
@include e(headerbtn) {
......@@ -41,6 +44,7 @@
top: $--dialog-header-padding-primary;
right: 12px;
padding: 0;
top: 8px;
background: transparent;
border: none;
outline: none;
......@@ -57,40 +61,49 @@
}
}
}
@include e(title) {
line-height: 36px;
height: 36px;
line-height: 10px;
height: 32px;
font-size: $--dialog-title-font-size;
font-weight: bold;
color: $--color-text-primary;
position: absolute;
margin-top: 3px;
}
@include e(tip) {
font-size: $--dialog-title-font-size;
height: 40px;
line-height: 40px;
padding: 0 32px;
border-bottom: 1px solid $--background-dialog-header;
margin: -20px -20px 18px -20px;
@include e(infotip){
color: $--color-info;
}
@include e(successtip){
color: $--color-success;
}
}
@include e(body) {
padding: 8px $--dialog-padding-primary;
padding: $--dialog-padding-primary;
color: $--color-text-regular;
font-size: $--dialog-content-font-size;
word-break: break-all;
}
@include e(footer) {
padding: $--dialog-padding-primary;
padding-top: 24px;
padding-right: 16px;
padding: 0 0 $--dialog-padding-footer 0;
text-align: right;
box-sizing: border-box;
& button:nth-child(1) {
color: $--color-text-secondary;
background-color: $--color-white;
border-color: $--color-text-placeholder;
&:focus, &:hover {
color:$--color-primary-text-plain-hover;
background-color: $--color-primary-background-plain-hover;
border-color:$--color-primary-border-plain-hover;
}
}
& button:nth-child(2) {
margin-left: 8px;
margin-left: 20px;
}
}
......
node_module/element-theme-chalk/src/form.scss
View file @ d011c378
......@@ -36,7 +36,7 @@
}
}
@include b(form-item) {
margin-bottom: 18px;
margin-bottom: 16px;
@include utils-clearfix;
& .el-form-item {
......@@ -116,7 +116,7 @@
@include e(error) {
color: $--color-danger;
font-size: 12px;
line-height: 16px;
line-height: 15px;
height: 16px;
white-space:nowrap;
margin-bottom: -20px;
......
theme/dialog.css
View file @ d011c378
......@@ -593,12 +593,16 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
.el-dialog__header {
padding: 16px;
padding-bottom: 8px;
padding-top: 8px; }
padding-top: 8px;
height: 32px;
line-height: 32px;
background: #EFEFEF; }
.el-dialog__headerbtn {
position: absolute;
top: 16px;
right: 12px;
padding: 0;
top: 8px;
background: transparent;
border: none;
outline: none;
......@@ -609,37 +613,41 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
.el-dialog__headerbtn:focus .el-dialog__close, .el-dialog__headerbtn:hover .el-dialog__close {
color: #0994DC; }
.el-dialog__title {
line-height: 36px;
height: 36px;
font-size: 18px;
color: #333333; }
line-height: 10px;
height: 32px;
font-size: 14px;
font-weight: bold;
color: #333333;
position: absolute;
margin-top: 3px; }
.el-dialog__tip {
font-size: 14px;
height: 40px;
line-height: 40px;
padding: 0 32px;
border-bottom: 1px solid #EFEFEF;
margin: -20px -20px 18px -20px; }
.el-dialog__infotip {
color: #00BBF2; }
.el-dialog__successtip {
color: #4EC87C; }
.el-dialog__body {
padding: 8px 24px;
padding: 20px;
color: #666666;
font-size: 14px;
word-break: break-all; }
.el-dialog__footer {
padding: 24px;
padding-top: 24px;
padding-right: 16px;
padding: 0 0 40px 0;
text-align: right;
-webkit-box-sizing: border-box;
box-sizing: border-box; }
.el-dialog__footer button:nth-child(1) {
color: #999999;
background-color: #FFFFFF;
border-color: #CCCCCC; }
.el-dialog__footer button:nth-child(1):focus, .el-dialog__footer button:nth-child(1):hover {
color: #0885C6;
background-color: #EDF6FC;
border-color: #0885C6; }
.el-dialog__footer button:nth-child(2) {
margin-left: 8px; }
margin-left: 20px; }
.el-dialog--center {
text-align: center; }
.el-dialog--center .el-dialog__body {
text-align: initial;
padding: 25px 29px 30px; }
padding: 25px 25px 30px; }
.el-dialog--center .el-dialog__footer {
text-align: inherit; }
......
theme/drawer.css
View file @ d011c378
......@@ -457,7 +457,7 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
display: -ms-flexbox;
display: flex;
margin-bottom: 32px;
padding: 24px;
padding: 20px;
padding-bottom: 0; }
.el-drawer__header > :first-child {
-webkit-box-flex: 1;
......
theme/form.css
View file @ d011c378
......@@ -288,7 +288,7 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
display: block; }
.el-form-item {
margin-bottom: 18px; }
margin-bottom: 16px; }
.el-form-item::before,
.el-form-item::after {
display: table;
......@@ -350,7 +350,7 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
.el-form-item__error {
color: #FF3D33;
font-size: 12px;
line-height: 16px;
line-height: 15px;
height: 16px;
white-space: nowrap;
margin-bottom: -20px; }
......
theme/index.css
View file @ d011c378
......@@ -5271,12 +5271,16 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
.el-dialog__header {
padding: 16px;
padding-bottom: 8px;
padding-top: 8px; }
padding-top: 8px;
height: 32px;
line-height: 32px;
background: #EFEFEF; }
.el-dialog__headerbtn {
position: absolute;
top: 16px;
right: 12px;
padding: 0;
top: 8px;
background: transparent;
border: none;
outline: none;
......@@ -5287,37 +5291,41 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
.el-dialog__headerbtn:focus .el-dialog__close, .el-dialog__headerbtn:hover .el-dialog__close {
color: #0994DC; }
.el-dialog__title {
line-height: 36px;
height: 36px;
font-size: 18px;
color: #333333; }
line-height: 10px;
height: 32px;
font-size: 14px;
font-weight: bold;
color: #333333;
position: absolute;
margin-top: 3px; }
.el-dialog__tip {
font-size: 14px;
height: 40px;
line-height: 40px;
padding: 0 32px;
border-bottom: 1px solid #EFEFEF;
margin: -20px -20px 18px -20px; }
.el-dialog__infotip {
color: #00BBF2; }
.el-dialog__successtip {
color: #4EC87C; }
.el-dialog__body {
padding: 8px 24px;
padding: 20px;
color: #666666;
font-size: 14px;
word-break: break-all; }
.el-dialog__footer {
padding: 24px;
padding-top: 24px;
padding-right: 16px;
padding: 0 0 40px 0;
text-align: right;
-webkit-box-sizing: border-box;
box-sizing: border-box; }
.el-dialog__footer button:nth-child(1) {
color: #999999;
background-color: #FFFFFF;
border-color: #CCCCCC; }
.el-dialog__footer button:nth-child(1):focus, .el-dialog__footer button:nth-child(1):hover {
color: #0885C6;
background-color: #EDF6FC;
border-color: #0885C6; }
.el-dialog__footer button:nth-child(2) {
margin-left: 8px; }
margin-left: 20px; }
.el-dialog--center {
text-align: center; }
.el-dialog--center .el-dialog__body {
text-align: initial;
padding: 25px 29px 30px; }
padding: 25px 25px 30px; }
.el-dialog--center .el-dialog__footer {
text-align: inherit; }
......@@ -32359,7 +32367,7 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
display: block; }
.el-form-item {
margin-bottom: 18px; }
margin-bottom: 16px; }
.el-form-item::before,
.el-form-item::after {
display: table;
......@@ -32421,7 +32429,7 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
.el-form-item__error {
color: #FF3D33;
font-size: 12px;
line-height: 16px;
line-height: 15px;
height: 16px;
white-space: nowrap;
margin-bottom: -20px; }
......@@ -58949,7 +58957,7 @@ $--checkbox-disabled-checked-icon-color: $--disabled-fill-base !default;*/
display: -ms-flexbox;
display: flex;
margin-bottom: 32px;
padding: 24px;
padding: 20px;
padding-bottom: 0; }
.el-drawer__header > :first-child {
-webkit-box-flex: 1;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment