fix(components): [button] link style and docs (#7996)

* fix(components): [button] link style and docs

* fix(components): [button] link style

Co-authored-by: xiaochenchen <xiaochen.chen@igg.com>
This commit is contained in:
Xc 2022-05-30 21:38:18 +08:00 committed by GitHub
parent efd6c2b2a7
commit 6d73349cc5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 13 additions and 6 deletions

View File

@ -8,8 +8,10 @@
<el-table-column prop="zip" label="Zip" width="120" />
<el-table-column fixed="right" label="Operations" width="120">
<template #default>
<el-button text size="small" @click="handleClick">Detail</el-button>
<el-button text size="small">Edit</el-button>
<el-button link type="primary" size="small" @click="handleClick"
>Detail</el-button
>
<el-button link type="primary" size="small">Edit</el-button>
</template>
</el-table-column>
</el-table>

View File

@ -8,7 +8,12 @@
<el-table-column prop="zip" label="Zip" width="120" />
<el-table-column fixed="right" label="Operations" width="120">
<template #default="scope">
<el-button text size="small" @click.prevent="deleteRow(scope.$index)">
<el-button
link
type="primary"
size="small"
@click.prevent="deleteRow(scope.$index)"
>
Remove
</el-button>
</template>

View File

@ -202,10 +202,12 @@ $button-icon-span-gap: map.merge(
@include when(link) {
border-color: transparent;
// color: getCssVar('color', 'primary');
color: getCssVar('button', 'text-color');
background: transparent;
padding-left: 0;
padding-right: 0;
outline: 0;
outline-offset: 0;
&:hover {
color: getCssVar('button', 'hover', 'link-text-color');
@ -220,13 +222,11 @@ $button-icon-span-gap: map.merge(
&:not(.is-disabled) {
&:hover,
&:focus {
// color: getCssVar('color', 'primary', 'light-3');
border-color: transparent;
background-color: transparent;
}
&:active {
// color: getCssVar('color', 'primary', 'dark-2');
border-color: transparent;
background-color: transparent;
}