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

update some styles

Browse source 
update some styles
This commit is contained in:
梁灏 2017-01-04 14:55:16 +08:00
parent 73d10c280b
commit ba3e34e087
7 changed files with 96 additions and 10 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/styles/components/date-picker.less
View file

@ -5,6 +5,7 @@
.@{date-picker-prefix-cls} { .@{date-picker-prefix-cls} {
position: relative; position: relative;
line-height: normal;
.@{select-dropdown-prefix-cls} { .@{select-dropdown-prefix-cls} {
width: auto; width: auto;
padding: 0; padding: 0;

2
src/styles/components/form.less
View file

@ -35,7 +35,7 @@
.clearfix(); .clearfix();
&-content { &-content {
position: relative; position: relative;
//line-height: 32px; line-height: 32px;
font-size: @font-size-small; font-size: @font-size-small;
} }

6
src/styles/components/select.less
View file

@ -10,6 +10,7 @@
color: @text-color; color: @text-color;
font-size: @font-size-base; font-size: @font-size-base;
position: relative; position: relative;
line-height: normal;
&-selection { &-selection {
display: block; display: block;
@ -123,10 +124,11 @@
height: @input-height-base - 2px; height: @input-height-base - 2px;
line-height: @input-height-base - 2px; line-height: @input-height-base - 2px;
color: @input-placeholder-color; color: @input-placeholder-color;
font-size: @font-size-small;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
padding-left: 8px; padding-left: 4px;
padding-right: 22px; padding-right: 22px;
} }
} }
@ -164,7 +166,7 @@
&-multiple &-input{ &-multiple &-input{
height: @input-height-base - 3px; height: @input-height-base - 3px;
line-height: @input-height-base; line-height: @input-height-base;
padding: 0 0 0 6px; padding: 0 0 0 4px;
} }
&-not-found{ &-not-found{

1
src/styles/components/slider.less
View file

@ -1,6 +1,7 @@
@slider-prefix-cls: ~"@{css-prefix}slider"; @slider-prefix-cls: ~"@{css-prefix}slider";
.@{slider-prefix-cls} { .@{slider-prefix-cls} {
line-height: normal;
&-wrap{ &-wrap{
width: 100%; width: 100%;
height: @slider-height; height: @slider-height;

4
src/styles/mixins/checkbox.less
View file

@ -146,9 +146,7 @@
cursor: pointer; cursor: pointer;
font-size: @font-size-small; font-size: @font-size-small;
display: inline-block; display: inline-block;
& + & { margin-right: 8px;
margin-left: 8px;
}
&-disabled{ &-disabled{
cursor: @cursor-disabled; cursor: @cursor-disabled;
} }

2
src/styles/themes/default/custom.less
View file

@ -155,5 +155,5 @@
@slider-height : 4px; @slider-height : 4px;
@slider-margin : 16px 0; @slider-margin : 16px 0;
@slider-button-wrap-size : 18px; @slider-button-wrap-size : 18px;
@slider-button-wrap-offset : -5px; @slider-button-wrap-offset : -4px;
@slider-disabled-color : #ccc; @slider-disabled-color : #ccc;

90
test/routers/form.vue
View file

@ -48,12 +48,98 @@
<Icon type="social-snapchat"></Icon> <Icon type="social-snapchat"></Icon>
<span>Snapchat</span> <span>Snapchat</span>
</Checkbox> </Checkbox>
<Checkbox value="twitter">
<Icon type="social-twitter"></Icon>
<span>Twitter</span>
</Checkbox>
<Checkbox value="facebook">
<Icon type="social-facebook"></Icon>
<span>Facebook</span>
</Checkbox>
<Checkbox value="github">
<Icon type="social-github"></Icon>
<span>Github</span>
</Checkbox>
<Checkbox value="snapchat">
<Icon type="social-snapchat"></Icon>
<span>Snapchat</span>
</Checkbox>
<Checkbox value="twitter">
<Icon type="social-twitter"></Icon>
<span>Twitter</span>
</Checkbox>
<Checkbox value="facebook">
<Icon type="social-facebook"></Icon>
<span>Facebook</span>
</Checkbox>
<Checkbox value="github">
<Icon type="social-github"></Icon>
<span>Github</span>
</Checkbox>
<Checkbox value="snapchat">
<Icon type="social-snapchat"></Icon>
<span>Snapchat</span>
</Checkbox>
<Checkbox value="twitter">
<Icon type="social-twitter"></Icon>
<span>Twitter</span>
</Checkbox>
<Checkbox value="facebook">
<Icon type="social-facebook"></Icon>
<span>Facebook</span>
</Checkbox>
<Checkbox value="github">
<Icon type="social-github"></Icon>
<span>Github</span>
</Checkbox>
<Checkbox value="snapchat">
<Icon type="social-snapchat"></Icon>
<span>Snapchat</span>
</Checkbox>
<Checkbox value="twitter">
<Icon type="social-twitter"></Icon>
<span>Twitter</span>
</Checkbox>
<Checkbox value="facebook">
<Icon type="social-facebook"></Icon>
<span>Facebook</span>
</Checkbox>
<Checkbox value="github">
<Icon type="social-github"></Icon>
<span>Github</span>
</Checkbox>
<Checkbox value="snapchat">
<Icon type="social-snapchat"></Icon>
<span>Snapchat</span>
</Checkbox>
<Checkbox value="twitter">
<Icon type="social-twitter"></Icon>
<span>Twitter</span>
</Checkbox>
<Checkbox value="facebook">
<Icon type="social-facebook"></Icon>
<span>Facebook</span>
</Checkbox>
<Checkbox value="github">
<Icon type="social-github"></Icon>
<span>Github</span>
</Checkbox>
<Checkbox value="snapchat">
<Icon type="social-snapchat"></Icon>
<span>Snapchat</span>
</Checkbox>
</Checkbox-group> </Checkbox-group>
</form-item> </form-item>
<form-item label="select" prop="select"> <form-item label="select" prop="select">
<i-select :model.sync="form.select" style="width:200px" clearable> <i-select :model.sync="form.select" style="width:200px" clearable>
<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option> <i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>
</i-select> </i-select>
<i-select :model.sync="model11" filterable>
<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>
</i-select>
<i-select :model.sync="model12" filterable multiple>
<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>
</i-select>
</form-item> </form-item>
<form-item label="select多选" prop="selectm"> <form-item label="select多选" prop="selectm">
<i-select :model.sync="form.selectm" multiple style="width:260px"> <i-select :model.sync="form.selectm" multiple style="width:260px">
@ -64,12 +150,10 @@
<Slider :value.sync="form.slider" range></Slider> <Slider :value.sync="form.slider" range></Slider>
</form-item> </form-item>
<form-item label="日期" prop="date"> <form-item label="日期" prop="date">
{{ form.date }}
<Time-picker :value.sync="form.date" type="time" placeholder="选择时间" style="width: 168px"></Time-picker> <Time-picker :value.sync="form.date" type="time" placeholder="选择时间" style="width: 168px"></Time-picker>
</form-item> </form-item>
<form-item label="两个日期" prop="date2"> <form-item label="两个日期" prop="date2">
{{ form.date2 | json}} <Date-picker :value.sync="form.date2" type="daterange" placement="bottom-start" placeholder="选择日期" @on-change="c"></Date-picker>
<Date-picker :value.sync="form.date2" type="daterange" placement="bottom-end" placeholder="选择日期" @on-change="c"></Date-picker>
</form-item> </form-item>
<form-item> <form-item>
<i-button type="primary" @click="onSubmit('form')">提交</i-button> <i-button type="primary" @click="onSubmit('form')">提交</i-button>