root
/
Pear-Admin-Layui
mirror of https://gitee.com/zhang_1334717033/Pear-Admin-Layui
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

微调按钮样式

develop
就眠仪式 2021-01-19 09:08:43 +08:00
parent a7c1da825f
commit 5f9391cf4b
2 changed files with 79 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
component/pear/css/pear-module/button.css
View File

@ -52,6 +52,51 @@
.pear-btn[round] {
border-radius: 50px;
}
.pear-btn-primary[plain] {
color: #409eff !important;
background: #ecf5ff !important;
border-color: #b3d8ff !important;
}
.pear-btn-primary[plain]:hover {
color: #fff !important;
background-color: #2d8cf0 !important
}
.pear-btn-success[plain] {
color: #67c23a !important;
background: #f0f9eb !important;
border-color: #c2e7b0 !important;
}
.pear-btn-success[plain]:hover {
color: white !important;
background-color: #67c23a !important
}
.pear-btn-warming[plain] {
color: #e6a23c !important;
background: #fdf6ec !important;
border-color: #f5dab1 !important;
}
.pear-btn-warming[plain]:hover {
color: white !important;
background-color: #e6a23c !important
}
.pear-btn-danger[plain] {
color: #f56c6c !important;
background: #fef0f0 !important;
border-color: #fbc4c4 !important;
}
.pear-btn-danger[plain]:hover {
color: white !important;
background-color: #f56c6c !important
}
/** Button Group */
.pear-btn-group {
display: inline-block;
@ -88,15 +133,15 @@
/** Button Size*/
.pear-btn-sm {
height: 30px;
line-height: 30px;
height: 32px;
line-height: 32px;
padding: 0 10px;
font-size: 12px;
}
.pear-btn-xs {
height: 22px;
line-height: 22px;
padding: 0 5px;
height: 28px;
line-height: 28px;
padding: 0 8px;
font-size: 12px;
}
.pear-btn-lg {

29
view/document/button.html
View File

@ -64,6 +64,35 @@
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">
简约样式
</div>
<div class="layui-card-body">
<button plain class="pear-btn pear-btn-primary"> Button-Primary</button>&nbsp;&nbsp;
<button plain class="pear-btn pear-btn-success"> Button-Success</button>&nbsp;&nbsp;
<button plain class="pear-btn pear-btn-danger"> Button-danger</button>&nbsp;&nbsp;
<button plain class="pear-btn pear-btn-warming"> Button-danger</button>&nbsp;&nbsp;
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-collapse">
<div class="layui-colla-item">
<h2 class="layui-colla-title">显示代码</h2>
<div class="layui-colla-content">
<pre class="layui-code" lay-encode="true">
<button class="pear-btn"> Default Button </button>
<button class="pear-btn" dashed> Dashed Button </button>
<button class="pear-btn pear-btn-primary"> Primary Button </button>
<button class="pear-btn pear-btn-primary"> Button-Primary </button>
<button class="pear-btn pear-btn-success"> Button-Success </button>
</pre>
</div>
</div>
</div>
</div>
<div class="layui-col-md12">
<div class="layui-card">
<div class="layui-card-header">