drip-public/iview
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update Modal、Poptip

Browse source 
update Modal、Poptip
This commit is contained in:
梁灏 2016-11-21 11:38:49 +08:00
parent 71d9fc8e45
commit 669937325b
8 changed files with 66 additions and 67 deletions
Download patch file Download diff file Expand all files Collapse all files

8
src/components/modal/confirm.js
View file

@ -19,14 +19,14 @@ Modal.newInstance = properties => {
<Modal${props} :visible.sync="visible" :width="width">
<div class="${prefixCls}">
<div class="${prefixCls}-head">
<div :class="iconTypeCls"><i :class="iconNameCls"></i></div>
<div class="${prefixCls}-head-title">{{{ title }}}</div>
</div>
<div class="${prefixCls}-body">
<div :class="iconTypeCls"><i :class="iconNameCls"></i></div>
{{{ body }}}
</div>
<div class="${prefixCls}-footer">
<i-button type="ghost" size="large" v-if="showCancel" @click="cancel">{{ cancelText }}</i-button>
<i-button type="text" size="large" v-if="showCancel" @click="cancel">{{ cancelText }}</i-button>
<i-button type="primary" size="large" :loading="buttonLoading" @click="ok">{{ okText }}</i-button>
</div>
</div>
@ -53,8 +53,8 @@ Modal.newInstance = properties => {
computed: {
iconTypeCls () {
return [
`${prefixCls}-head-icon`,
`${prefixCls}-head-icon-${this.iconType}`
`${prefixCls}-body-icon`,
`${prefixCls}-body-icon-${this.iconType}`
]
},
iconNameCls () {

2
src/components/modal/modal.vue
View file

@ -12,7 +12,7 @@
<div :class="[prefixCls + '-body']"><slot></slot></div>
<div :class="[prefixCls + '-footer']" v-if="!footerHide">
<slot name="footer">
<i-button type="ghost" size="large" @click="cancel">{{ cancelText }}</i-button>
<i-button type="text" size="large" @click="cancel">{{ cancelText }}</i-button>
<i-button type="primary" size="large" :loading="buttonLoading" @click="ok">{{ okText }}</i-button>
</slot>
</div>

2
src/components/poptip/poptip.vue
View file

@ -21,7 +21,7 @@
<div :class="[prefixCls + '-body-message']"><slot name="title">{{ title }}</slot></div>
</div>
<div :class="[prefixCls + '-footer']">
<i-button type="ghost" size="small" @click="cancel">{{ cancelText }}</i-button>
<i-button type="text" size="small" @click="cancel">{{ cancelText }}</i-button>
<i-button type="primary" size="small" @click="ok">{{ okText }}</i-button>
</div>
</div>

4
src/styles/components/button.less
View file

@ -66,10 +66,6 @@
.btn-color(@info-color);
}
//&-dashed {
// .btn-dashed;
//}
&-circle,
&-circle-outline {
.btn-circle(@btn-prefix-cls);

45
src/styles/components/modal.less
View file

@ -79,15 +79,30 @@
}
.@{confirm-prefix-cls} {
padding: 10px 25px 20px;
padding: 0 4px;
&-head {
&-icon {
&-title {
display: inline-block;
font-size: 28px;
margin-right: 5px;
padding: 0 1px;
position: relative;
top: 5px;
font-size: @font-size-base;
color: @title-color;
font-weight: 700;
}
}
&-body{
margin-top: 6px;
padding-left: 48px;
padding-top: 18px;
font-size: @font-size-small;
color: @text-color;
position: relative;
&-icon {
font-size: 36px;
position: absolute;
top: 0;
left: 0;
&-info {
color: @primary-color;
@ -105,24 +120,10 @@
color: @warning-color;
}
}
&-title {
display: inline-block;
font-size: @font-size-base;
color: @text-color;
font-weight: 700;
}
}
&-body{
margin-left: 35px;
margin-top: 8px;
font-size: 12px;
color: @text-color;
}
&-footer{
margin-top: 20px;
margin-top: 40px;
text-align: right;
button + button {

2
src/styles/mixins/button.less
View file

@ -222,7 +222,7 @@
// Text
.btn-text() {
.button-variant(@link-color, @btn-ghost-bg, transparent);
.button-variant(@btn-ghost-color, @btn-ghost-bg, transparent);
// for disabled
&.disabled,