mirror/element-plus
2
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2024-11-21 01:02:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(components): [el-pagination] adjust component size (#5640)

Browse Source 
* refactor(components): [el-pagination] adjust component size

* fix: background size

* chore: improve doc style
This commit is contained in:
msidolphin 2022-01-26 14:29:48 +08:00 committed by GitHub
parent f860941d8e
commit 77a3d5c7c1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 15 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
docs/en-US/component/select.md
View File

@ -7,12 +7,6 @@ lang: en-US
When there are plenty of options, use a drop-down menu to display and select desired ones.
<style lang="scss">
.example-showcase .el-select {
width: 240px;
}
</style>
## Basic usage
:::demo `v-model` is the value of `el-option` that is currently selected.

8
docs/examples/pagination/small-pagination.vue
View File

@ -1,3 +1,11 @@
<template>
<el-pagination small layout="prev, pager, next" :total="50"> </el-pagination>
<el-pagination
small
background
layout="prev, pager, next"
:total="50"
class="mt-4"
>
</el-pagination>
</template>

6
packages/theme-chalk/src/common/var.scss
View File

@ -700,12 +700,12 @@ $pagination: map.merge(
'text-color': var(--el-text-color-primary),
'border-radius': 3px,
'button-color': var(--el-text-color-primary),
'button-width': 35.5px,
'button-height': 28px,
'button-width': 32px,
'button-height': 32px,
'button-disabled-color': var(--el-text-color-placeholder),
'button-disabled-bg-color': var(--el-color-white),
'hover-color': var(--el-color-primary),
'height-extra-small': 22px,
'height-extra-small': 24px,
'line-height-extra-small': var(--el-pagination-height-extra-small),
),
$pagination

9
packages/theme-chalk/src/pagination.scss
View File

@ -110,7 +110,7 @@
font-size: var(--el-font-size-extra-small);
line-height: var(--el-pagination-line-height-extra-small);
height: var(--el-pagination-height-extra-small);
min-width: 22px;
min-width: 24px;
}
.arrow.disabled {
@ -216,10 +216,10 @@
.btn-prev,
.btn-next,
.#{$namespace}-pager li {
margin: 0 5px;
margin: 0 4px;
background-color: map.get($colors, 'info', 'light-9');
color: var(--el-text-color-regular);
min-width: 30px;
min-width: 32px;
border-radius: 2px;
&.disabled {
@ -251,8 +251,7 @@
.btn-prev,
.btn-next,
.#{$namespace}-pager li {
margin: 0 3px;
min-width: 22px;
min-width: 24px;
}
}
}