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

update Select size

Browse source
This commit is contained in:
梁灏 2019-09-14 17:49:56 +08:00
parent 8aa6a25014
commit 13279cdddc
2 changed files with 36 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

29
examples/routers/select.vue
View file

@ -54,7 +54,26 @@
<Select v-model="model12" multiple filterable allow-create @on-create="handleCreate" style="width:260px"> <Select v-model="model12" multiple filterable allow-create @on-create="handleCreate" style="width:260px">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option> <Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select> </Select>
<Divider></Divider>
<Select v-model="model31" size="small" style="width:200px">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
<Select v-model="model31" style="width:200px">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
<Select v-model="model31" size="large" style="width:200px">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
<Divider></Divider>
<Select v-model="model34" multiple size="small" style="width:200px">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
<Select v-model="model34" multiple style="width:200px">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
<Select v-model="model34" multiple size="large" style="width:200px">
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
</Select>
</div> </div>
</template> </template>
<script> <script>
@ -90,7 +109,13 @@
model1: '', model1: '',
model10: [], model10: [],
model12: [], model12: [],
model13: '' model13: '',
model31: '',
model32: '',
model33: '',
model34: [],
model35: [],
model36: []
} }
}, },
methods: { methods: {

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

@ -79,7 +79,7 @@
display: block; display: block;
height: @input-height-base - 2px; height: @input-height-base - 2px;
line-height: @input-height-base - 2px; line-height: @input-height-base - 2px;
font-size: @font-size-small; font-size: @font-size-base;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
@ -97,7 +97,7 @@
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; font-size: @font-size-base;
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
@ -112,7 +112,7 @@
.@{select-prefix-cls}-placeholder, .@{select-prefix-cls}-selected-value{ .@{select-prefix-cls}-placeholder, .@{select-prefix-cls}-selected-value{
height: @input-height-large - 2px; height: @input-height-large - 2px;
line-height: @input-height-large - 2px; line-height: @input-height-large - 2px;
font-size: @font-size-base; font-size: @font-size-large;
} }
} }
@ -122,7 +122,7 @@
.@{select-prefix-cls}-placeholder, .@{select-prefix-cls}-selected-value{ .@{select-prefix-cls}-placeholder, .@{select-prefix-cls}-selected-value{
min-height: @input-height-large - 2px; min-height: @input-height-large - 2px;
line-height: @input-height-large - 2px; line-height: @input-height-large - 2px;
font-size: @font-size-base; font-size: @font-size-large;
} }
} }
@ -153,7 +153,7 @@
height: @input-height-base; height: @input-height-base;
line-height: @input-height-base; line-height: @input-height-base;
padding: 0 24px 0 8px; padding: 0 24px 0 8px;
font-size: @font-size-small; font-size: @font-size-base;
outline: none; outline: none;
border: none; border: none;
box-sizing: border-box; box-sizing: border-box;
@ -175,7 +175,7 @@
} }
&-large &-input{ &-large &-input{
font-size: @font-size-base; font-size: @font-size-large;
height: @input-height-large; height: @input-height-large;
} }
@ -226,7 +226,7 @@
&-large&-multiple .@{css-prefix}tag{ &-large&-multiple .@{css-prefix}tag{
height: 28px; height: 28px;
line-height: 26px; line-height: 26px;
font-size: @font-size-base; font-size: @font-size-large;
i{ i{
top: 6px; top: 6px;
} }
@ -235,7 +235,7 @@
&-small&-multiple .@{css-prefix}tag{ &-small&-multiple .@{css-prefix}tag{
height: 17px; height: 17px;
line-height: 15px; line-height: 15px;
font-size: @font-size-small; font-size: @font-size-base;
padding: 0 6px; padding: 0 6px;
margin: 3px 4px 2px 0; margin: 3px 4px 2px 0;
span{ span{
@ -321,7 +321,7 @@
&-title { &-title {
padding-left: 8px; padding-left: 8px;
font-size: 12px; font-size: 14px;
color: @legend-color; color: @legend-color;
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;