theluyuan/layui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

docs: 更新 button 文档

Browse Source
This commit is contained in:
就眠儀式
2022-03-29 04:46:30 +08:00
parent 1aea44181a
commit ed9ebccf79
4 changed files with 21 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
src/component/button/index.less
View File

@@ -1,19 +1,27 @@
@import "../../theme/variable.less";
@button-primary-color: var(--button-primary-color);
@button-primary-border-color: var(--button-primary-border-color);
@button-normal-color: var(--button-normal-color);
@button-normal-border-color: var(--button-normal-border-color);
@button-warm-color: var(--button-warm-color);
@button-warm-border-color: var(--button-warm-border-color);
@button-danger-color: var(--button-danger-color);
@button-danger-border-color: var(--button-danger-border-color);
@button-border-radius: var(--button-border-radius);
@button-border-color: var(--button-border-color);
@button-normal-color: var(--button-normal-color);
@button-warm-color: var(--button-warm-color);
@button-danger-color: var(--button-danger-color);
:root {
--button-primary-color: @global-primary-color;
--button-primary-border-color: @global-primary-color;
--button-normal-color: @global-normal-color;
--button-normal-border-color: @global-normal-color;
--button-warm-color: @global-warm-color;
--button-warm-border-color: @global-warm-color;
--button-danger-color: @global-danger-color;
--button-danger-border-color: @global-danger-color;
--button-border-radius: @global-border-radius;
--button-border-color: @global-neutral-color-6;
--button-normal-color: @global-normal-color;
--button-warm-color: @global-warm-color;
--button-danger-color: @global-danger-color;
}
.layui-btn {
@@ -54,25 +62,25 @@
.layui-btn-primary {
color: #fff;
background-color: @button-primary-color;
border-color: @button-primary-color;
border-color: @button-primary-border-color;
}
.layui-btn-normal {
color: #fff;
background-color: @button-normal-color;
border-color: @button-normal-color;
border-color: @button-normal-border-color;
}
.layui-btn-warm {
color: #fff;
background-color: @button-warm-color;
border-color: @button-warm-color;
border-color: @button-warm-border-color;
}
.layui-btn-danger {
color: #fff;
background-color: @button-danger-color;
border-color: @button-danger-color;
border-color: @button-danger-border-color;
}
.layui-btn-primary:hover,

15
src/component/button/index.vue
View File

@@ -7,12 +7,7 @@ export default {
<script setup lang="ts">
import "./index.less";
import { computed } from "vue";
import {
ButtonBorder,
ButtonNativeType,
ButtonSize,
ButtonType,
} from "./interface";
import { ButtonBorder, ButtonNativeType, ButtonSize, ButtonType} from "./interface";
import { BooleanOrString, String } from "src/types";
export interface LayButtonProps {
@@ -68,13 +63,7 @@ const classes = computed(() => {
<i v-if="prefixIcon" :class="`layui-icon ${prefixIcon}`"></i>
<i
v-if="loading"
class="
layui-icon
layui-icon-loading-one
layui-anim
layui-anim-rotate
layui-anim-loop
"
class="layui-icon layui-icon-loading-one layui-anim layui-anim-rotate layui-anim-loop"
></i>
<slot v-else></slot>
<i v-if="suffixIcon" :class="`layui-icon ${suffixIcon}`"></i>