+ {{ countdownText }}
+
+
+
+
+
+
\ No newline at end of file
diff --git a/src/style/theme/common.scss b/src/style/theme/common.scss
index 2d880ce..2df8bc7 100644
--- a/src/style/theme/common.scss
+++ b/src/style/theme/common.scss
@@ -14,6 +14,7 @@ body{
display: flex;
align-items: center;
justify-content: center;
+ transition: all .3s;
}
.el-button--normal{
color: #626573;
@@ -46,6 +47,26 @@ body{
height: 28px;
font-size: 12px;
}
+.el-button--reverseMild{
+ background: #E8F0FE;
+ color: #006AFF;
+ border: none;
+}
+.el-button--reverseMild:hover{
+ border-color: #F2F7FF !important;
+ background-color:#F2F7FF !important;
+}
+.el-button--reverseMild.is-disabled, .el-button--reverseMild.is-disabled:hover{
+ color: #006AFF;
+ border-color: #E8F0FE;
+ background-color:#E8F0FE;
+ opacity: .7;
+}
+.el-button--mild.is-disabled, .el-button--mild.is-disabled:hover{
+ color: #006AFF;
+ opacity: .7;
+ border-color: #006AFF;
+}
/* button==== end */
// radio ---start
@@ -61,7 +82,86 @@ body{
font-weight: normal;
}
// radio ---end
+
// input ---start
+.el-input{
+ border-radius: 2px;
+ border: 1px solid transparent;
+}
+.el-input:focus-within{
+ transition: all .5s;
+ outline: 3px solid #D8E9FA;
+ border-color: #006AFF !important;
+}
+.is-error .hoverclass{
+ border-color: transparent !important;
+}
+.is-error .el-input:focus-within{
+ outline: none !important;
+ border-color: transparent !important;
+}
+.el-input__inner{
+ height: 100%;
+ padding: 10px 12px;
+ border-radius: 2px;
+}
+.el-input__prefix{
+ display: flex;
+ align-items: center;
+ left: 12px;
+ cursor: pointer;
+}
+.el-input__suffix{
+ display: flex;
+ align-items: center;
+ right: 12px;
+ cursor: pointer;
+}
+.el-input__inner:focus{
+ border-color: transparent;
+}
+.el-input__inner:hover{
+ border-color: transparent;
+}
+.el-input--prefix .el-input__inner{
+ padding-left: 36px;
+}
+.el-input--suffix .el-input__inner{
+ padding-right: 36px;
+}
+.el-input.is-disabled .el-input__inner{
+ background: #F6F7FA !important;
+ border-color: #DFE2E6 !important;
+ color: #BABDC2 !important;
+}
+.hoverclass{
+ border-color: #006AFF !important;
+ transition: all .5s;
+}
+// input ---end
+
+// select start
+.el-select:hover .el-input__inner{
+ transition: all .5s;
+ border-color: transparent;
+}
+.el-select .el-input.is-focus .el-input__inner{
+ border-color: transparent;
+ transition: all .5s;
+}
+// select end
-// input ---end
\ No newline at end of file
+// textarea start
+.el-textarea__inner{
+ padding: 10px 12px;
+ border-radius: 2px;
+}
+.el-textarea__inner:hover{
+ border-color: #006AFF;
+}
+.el-textarea__inner:focus{
+ transition: all .5s;
+ outline: 3px solid #D8E9FA;
+}
+// textarea end
\ No newline at end of file
diff --git a/src/views/elementGroups.vue b/src/views/elementGroups.vue
index 66a854f..a4a262f 100644
--- a/src/views/elementGroups.vue
+++ b/src/views/elementGroups.vue
@@ -1,5 +1,7 @@
+
+
+
+
+
+
+
+
-
+
+
+
+ http:
+ 
+
+
+
+
+
+
+
+
+ .checkcopy.com
+
+
+
+
+
+
+
+
+
+
+ .checkcopy.com
+
@@ -50,19 +95,24 @@
默认按钮
轻度按钮
按钮
- 按钮
- 按钮
- 按钮
- 按钮
+ 按钮
+ 按钮
+ 按钮
+ 按钮
+ 按钮
+ 按钮
- 默认按钮
- 按钮
- 按钮
- 按钮
- 按钮
- 按钮
+ 默认按钮
+ 轻度按钮
+
+ 按钮
+ 按钮
+ 按钮
+ 按钮
+ 按钮
+ 按钮
@@ -77,23 +127,116 @@
随便写的
-
-
-
-
+
+
+ 提交
+ 触发错误
+
+
+
+
+
+
+ 表单左右布局
+ +
+
+
+
+
+ 表单上下布局
+
+
+ 这是右侧文案
+
+
+
+ 表单上下布局(带右侧文案)
+
+
+
+
+
+
+
+ 获取手机验证码
+
+ 
+ 手机号码
+
+
+ 手机号码
+
+
+
+
+
+
+
+
+