@cloudbase/weda-ui 0.2.9 → 0.2.13

package/src/web/wedatheme/src/styles/theme/_button.scss

@@ -0,0 +1,212 @@
+// @import "../../variables/index";
+// 组件变量
+// 名称可按如下规则定义：
+// <component>-[type]-<attr>-[attrtype]-[status]
+// component:组件名，如button，
+// type: 组件类型，如 button 的次要按钮（line）
+// attr: 属性名称，如color、height、border-radius、font-size 等
+// attrtype: 属性的具体应用场景。如颜色，用于背景（bg）、文本（text）、边框（boder）等
+// status: 表示组件状态或尺寸，如 hover、disabled、s、l 等
+// 如：@button-line-color-bg-hover
+// 如：@button-line-height-s
+
+$btn-font-size: $font-size-default !default;
+$btn-border-radius: $border-radius !default;
+
+// 默认按钮
+$btn-primary-color-text: $color-text-anti-primary !default;
+$btn-primary-color-text-hover: $color-text-anti-primary !default;
+$btn-primary-color-text-active: $color-text-anti-primary !default;
+$btn-primary-color-text-focus: $color-text-anti-primary !default;
+$btn-primary-color-text-disabled: $color-text-anti-primary !default;
+
+$btn-primary-color-bg: $color-primary !default;
+$btn-primary-color-bg-hover: $color-primary-hover !default;
+$btn-primary-color-bg-active: $color-primary-active !default;
+$btn-primary-color-bg-focus: $color-primary-focus !default;
+$btn-primary-color-bg-disabled: $color-primary-disabled !default;
+
+$btn-primary-color-border: $color-primary !default;
+$btn-primary-color-border-hover: $color-primary-hover !default;
+$btn-primary-color-border-active: $color-primary-active !default;
+$btn-primary-color-border-focus: $color-primary-focus !default;
+$btn-primary-color-border-disabled: $color-primary-disabled !default;
+
+// 支付按钮
+$btn-pay-color-text: $color-text-anti-primary !default;
+$btn-pay-color-text-hover: $color-text-anti-primary !default;
+$btn-pay-color-text-active: $color-text-anti-primary !default;
+$btn-pay-color-text-focus: $color-text-anti-primary !default;
+$btn-pay-color-text-disabled: $color-text-anti-primary !default;
+
+$btn-pay-color-bg: $color-warning !default;
+$btn-pay-color-bg-hover: $color-warning-hover !default;
+$btn-pay-color-bg-active: $color-warning-active !default;
+$btn-pay-color-bg-focus: $color-warning-focus !default;
+$btn-pay-color-bg-disabled: $color-warning-disabled !default;
+
+$btn-pay-color-border: $color-warning !default;
+$btn-pay-color-border-hover: $color-warning-hover !default;
+$btn-pay-color-border-active: $color-warning-active !default;
+$btn-pay-color-border-focus: $color-warning-focus !default;
+$btn-pay-color-border-disabled: $color-warning-disabled !default;
+
+// 错误按钮
+$btn-error-color-text: $color-text-anti-primary !default;
+$btn-error-color-text-hover: $color-text-anti-primary !default;
+$btn-error-color-text-active: $color-text-anti-primary !default;
+$btn-error-color-text-focus: $color-text-anti-primary !default;
+$btn-error-color-text-disabled: $color-text-anti-primary !default;
+
+$btn-error-color-bg: $color-error !default;
+$btn-error-color-bg-hover: $color-error-hover !default;
+$btn-error-color-bg-active: $color-error-active !default;
+$btn-error-color-bg-focus: $color-error-focus !default;
+$btn-error-color-bg-disabled: $color-error-disabled !default;
+
+$btn-error-color-border: $color-error !default;
+$btn-error-color-border-hover: $color-error-hover !default;
+$btn-error-color-border-active: $color-error-active !default;
+$btn-error-color-border-focus: $color-error-focus !default;
+$btn-error-color-border-disabled: $color-error-disabled !default;
+
+// 弱按钮
+$btn-weak-color-text: $color-primary !default;
+$btn-weak-color-text-hover: $color-primary !default;
+$btn-weak-color-text-active: $color-primary !default;
+$btn-weak-color-text-focus: $color-primary !default;
+$btn-weak-color-text-disabled: $color-primary-disabled !default;
+
+$btn-weak-color-bg: $color-bg !default;
+$btn-weak-color-bg-hover: $color-bg-hover !default;
+$btn-weak-color-bg-active: $color-bg-active !default;
+$btn-weak-color-bg-focus: $color-bg-focus !default;
+$btn-weak-color-bg-disabled: $color-bg !default;
+
+$btn-weak-color-border: $color-border !default;
+$btn-weak-color-border-hover: $color-border !default;
+$btn-weak-color-border-active: $color-border !default;
+$btn-weak-color-border-focus: $color-border !default;
+$btn-weak-color-border-disabled: $color-border-disabled !default;
+
+// 链接按钮
+$btn-link-color-text: $color-primary !default;
+$btn-link-color-text-hover: $color-primary-hover !default;
+$btn-link-color-text-active: $color-primary !default;
+$btn-link-color-text-focus: $color-primary !default;
+$btn-link-color-text-disabled: $color-primary-disabled !default;
+
+$btn-link-color-bg: transparent !default;
+$btn-link-color-bg-hover: transparent !default;
+$btn-link-color-bg-active: transparent !default;
+$btn-link-color-bg-focus: transparent !default;
+$btn-link-color-bg-disabled: transparent !default;
+
+$btn-link-color-border: transparent !default;
+$btn-link-color-border-hover: transparent !default;
+$btn-link-color-border-active: transparent !default;
+$btn-link-color-border-focus: transparent !default;
+$btn-link-color-border-disabled: transparent !default;
+
+// 文本按钮
+$btn-text-color-text: $color-text !default;
+$btn-text-color-text-hover: $color-text !default;
+$btn-text-color-text-active: $color-text !default;
+$btn-text-color-text-focus: $color-text !default;
+$btn-text-color-text-disabled: $color-text-disabled !default;
+
+$btn-text-color-bg: transparent !default;
+$btn-text-color-bg-hover: $color-bg-hover !default;
+$btn-text-color-bg-active: $color-bg-active !default;
+$btn-text-color-bg-focus: $color-bg-focus !default;
+$btn-text-color-bg-disabled: transparent !default;
+
+$btn-text-color-border: transparent !default;
+$btn-text-color-border-hover: transparent !default;
+$btn-text-color-border-active: transparent !default;
+$btn-text-color-border-focus: transparent !default;
+$btn-text-color-border-disabled: transparent !default;
+
+// icon 按钮
+$btn-icon-color-bg: transparent !default;
+$btn-icon-color-bg-hover: $color-bg-hover !default;
+$btn-icon-color-bg-active: $color-bg-active !default;
+$btn-icon-color-bg-focus: $color-bg-focus !default;
+$btn-icon-color-bg-disabled: transparent !default;
+
+$btn-icon-color-border: transparent !default;
+$btn-icon-color-border-hover: transparent !default;
+$btn-icon-color-border-active: transparent !default;
+$btn-icon-color-border-focus: transparent !default;
+$btn-icon-color-border-disabled: transparent !default;
+
+.#{$prefix}btn{
+  line-height: $form-height - 2;
+  padding:0 $space-base*4;
+}
+
+
+.#{$prefix}btn.is-loading.is-disabled,
+.#{$prefix}btn.is-loading {
+  color:transparent;
+  .#{$prefix}icon-loading {
+    background: conic-gradient(
+      from 90deg at 50% 50%,
+      #fff 0deg,
+      #0052d9 360deg
+    );
+    border-radius: 50%;
+    -webkit-mask: -webkit-radial-gradient(
+      transparent calc(50% - 0.5px),
+      #fff 50%
+    );
+    mask: radial-gradient(transparent calc(50% - 0.5px), #fff 50%);
+  }
+}
+.#{$prefix}btn--icon{
+  padding:5px;
+  line-height: 0;
+  &:not(.is-disabled):focus{
+    background-color: unset;
+  }
+  &:not(.is-disabled):hover{
+    background-color: $color-bg-hover;
+  }
+}
+.#{$prefix}btn--weak{
+  // background-color: $color-neutral-2;
+  // border-color:$color-neutral-2;
+  // color:$color-text;
+  &:not(.is-disabled):focus{
+    background-color: unset;
+    // border-color: $color-border;
+    // color:$color-primary;
+  }
+  &:not(.is-disabled):hover{
+    background-color: $color-bg-hover;
+    // border-color: $color-border;
+    // color:$color-primary;
+  }
+   
+}
+.#{$prefix}btn--weak.is-disabled{
+  background-color: $color-neutral-1;
+  border-color: $color-neutral-1;
+  color:$color-text-disabled;
+}
+
+.#{$prefix}btn--weak.is-loading.is-disabled .#{$prefix}icon-loading,
+.#{$prefix}btn--weak.is-loading .#{$prefix}icon-loading {
+  background: conic-gradient(from 90deg at 50% 50%, #fff 0deg, #0052d9 360deg);
+  border-radius: 50%;
+  -webkit-mask: -webkit-radial-gradient(
+    transparent calc(50% - 0.5px),
+    #fff 50%
+  );
+  mask: radial-gradient(transparent calc(50% - 0.5px), #fff 50%);
+}
+
+.#{$prefix}btn--link{
+  padding:0;
+  line-height: 1.5;
+}

package/src/web/wedatheme/src/styles/theme/_card.scss

@@ -0,0 +1,12 @@
+
+// $card-font-size:$font-size-default !default;
+// $card-box-shadow:$box-shadow-s !default;
+// $card-border-radius:$border-radius !default;
+
+// $card-color-text:$color-text !default;
+// $card-color-text-subtitle:$color-text-label !default;
+
+// $card-color-bg:$color-bg !default;
+
+// $card-color-borde:$color-border !default;
+// $card-color-borde-inner:$color-border-inner !default;

package/src/web/wedatheme/src/styles/theme/_cascader.scss

@@ -0,0 +1,43 @@
+
+// $cascader-font-size:$font-size-default !default;
+// $cascader-border-radius:$border-radius !default;
+
+// $cascader-color-text:$color-text !default;
+// $cascader-color-bg:$color-bg !default;
+// $cascader-color-bg-hover:$color-bg-hover !default;
+
+// $cascader-menu-li-color-bg-hover:$color-bg-hover !default;
+// $cascader-menu-li-color-bg-selected:$color-primary !default;
+// $cascader-menu-li-color-text-disabled:$color-text-disabled !default;
+
+// $cascader-color-border:$color-border !default;
+.#{$prefix}cascader{
+  padding:0 24px 0 8px;
+  &__input .#{$prefix}icon-arrowdown{
+    background-image: url(../assets/arrowright--line.svg);
+  }
+}
+.#{$prefix}cascader-menu{
+  margin:-$space-base*2;
+  .#{$prefix}list--option .#{$prefix}list__submenu:after{
+    margin-top: -8px;
+  }
+}
+.#{$prefix}cascader-menu--thin{
+  .#{$prefix}list{
+    padding:$space-base*2;
+    
+    &>li{
+      padding:10px 8px;
+      min-width: 112px;
+      margin-bottom: $space-base;
+    }
+      &__submenu.is-selected::after{
+          background-image: url(../assets/arrowright-blue--line.svg);
+      }
+
+      &:first-child{
+        border-left: none;
+      }
+  }
+}

package/src/web/wedatheme/src/styles/theme/_checkbox&radio.scss

@@ -0,0 +1,83 @@
+// // 组件变量
+// // 名称可按如下规则定义：
+// // <component>-[type]-[attrtype]-<attr>-[status]
+// // component:组件名，如button，
+// // type: 组件类型，如 button 的次要按钮（line）
+// // attrtype: 属性的具体应用场景。如颜色，用于背景（bg）、文本（text）、边框（boder）等
+// // attr: 属性名称，如color、height、radius等
+// // status: 表示组件状态或尺寸，如 hover、disabled、s、l 等
+// // 如：@button-line-bg-color-hover
+// // 如：@button-line-height-s
+
+// // 
+// $radio-font-size:$font-size-default !default;
+$radio-width:16px !default;
+$radio-height:16px !default;
+// $radio-radius:$border-radius !default; //  主要给checkbox用
+
+// $radio-text-color:$color-text !default;
+
+// $radio-border-color:$color-border !default;
+// $radio-border-color-hover:$color-primary !default;
+// $radio-border-color-focus:$color-primary !default;
+// $radio-border-color-disabled:$color-border !default;
+// $radio-border-color-checked:$color-primary !default;
+// $radio-border-color-checked-disabled:$color-primary-disabled !default;
+
+// $radio-bg-color:$color-bg !default;
+// $radio-bg-color-hover:$color-bg-hover !default;
+// $radio-bg-color-focus:$color-bg-hover !default;
+// $radio-bg-color-disabled:$color-bg-disabled !default;
+// $radio-bg-color-checked:$color-primary !default;
+// $radio-bg-color-checked-disabled:$color-primary-disabled !default;
+// $radio-dot-bg-color:$color-bg !default;
+
+
+// $radio-height:20px;
+.#{$prefix}radio:hover,
+.#{$prefix}radio:focus,
+input[type=radio]:hover,
+input[type=radio]:focus {
+    background-position: inherit;
+}
+
+.#{$prefix}radio:checked,
+input[type=radio]:checked {
+    background-color: #fff;
+}
+.#{$prefix}radio:checked::-ms-check,
+input[type=radio]:checked::-ms-check {
+    background-color: #fff;
+}
+
+.#{$prefix}radio:checked+.#{$prefix}radio__dot,
+input[type=radio]:checked+.#{$prefix}radio__dot{
+    background-color: $color-primary;
+}
+.#{$prefix}radio:checked:hover,
+input[type=radio]:checked:hover,
+.#{$prefix}radio:checked:focus,
+input[type=radio]:checked:focus {
+    background-color: #fff;
+}
+
+.#{$prefix}radio + .#{$prefix}radio__dot, 
+input[type=radio] + .#{$prefix}radio__dot {
+  // position: relative;
+}
+
+.#{$prefix}form-check{
+  display: flex;
+  padding-left: 0;
+}
+.#{$prefix}form-check .#{$prefix}checkbox, 
+.#{$prefix}form-check .#{$prefix}radio-wrap{
+  position: relative;
+  flex:0 0 $radio-width;
+  margin-right: $space-base*2;
+  margin-top:2px; //($font-size-default*1.5 - $radio-height )/2;
+  height: $radio-height;
+}
+.#{$prefix}form-check__label{
+  line-height: $font-size-default*1.5;
+}

package/src/web/wedatheme/src/styles/theme/_datepicker.scss

@@ -0,0 +1,36 @@
+// $calendar-font-size:$font-size-default  !default;
+// $calendar-font-size-l:$font-size-l  !default;
+// $calendar-border-radius:$border-radius  !default;
+// $calendar-width:300px  !default;
+
+// $calendar-color-bg:$color-bg  !default;
+// $calendar-color-bg-hover:$color-bg-hover  !default;
+// $calendar-color-bg-selected:$color-primary  !default;
+// $calendar-color-bg-disabled:$color-bg-disabled  !default;
+
+// $calendar-range-color-bg:$color-primary-0  !default;
+
+// $calendar-color-border:$color-border  !default;
+// $calendar-color-border-hover:$color-border-hover  !default;
+// $calendar-color-border-focus:$color-primary  !default;
+// $calendar-color-border-selected:$color-primary  !default;
+// $calendar-color-border-inner:$color-border-inner  !default;
+
+// $calendar-color-text:$color-text  !default;
+// $calendar-color-text-label:$color-text-label  !default;
+// $calendar-color-text-weight:$color-text-weight  !default;
+// $calendar-color-text-current:$color-primary  !default;
+// $calendar-color-text-disabled:$color-text-disabled  !default;
+
+
+.#{$prefix}datetimepicker__input .#{$prefix}input{
+  width: 320px;
+}
+.#{$prefix}datepicker__input:after, 
+.#{$prefix}datetimepicker__input:after, 
+.#{$prefix}monthpicker__input:after{
+  background-image: url(../assets/calendar.svg);
+}
+.#{$prefix}timepicker__input:after{
+  background-image: url(../assets/time.svg);
+}

package/src/web/wedatheme/src/styles/theme/_dialog.scss

@@ -0,0 +1,39 @@
+// // 弹窗宽度
+// $dialog-min-width-size-default:420px !default;
+// $dialog-width-size-default:550px !default;
+// $dialog-width-size-s:420px !default;
+// $dialog-width-size-l:800px !default;
+// $dialog-width-size-xl:950px !default;
+// $dialog-width-size-auto:auto !default;
+// // 弹窗背景
+// $dialog-color-bg:$color-bg !default;
+// // 弹窗影阴
+// $dialog-box-shadow-s:$box-shadow-s !default;
+// // 弹窗圆角
+// $dialog-border-radius:$border-radius !default;
+// // 文本号
+// $dialog-font-size-default: $font-size-default !default;//默认12px
+// $dialog-font-size-l: $font-size-l !default;//默认14px
+// $dialog-font-size-xl: $font-size-xl !default;//默认16px
+
+// // 行高
+// $dialog-line-height-fz-default: $line-height-fz-default !default; // 12px 对应的行高
+// $dialog-line-height-fz-l: $line-height-fz-l !default; // 14px 对应的行高
+// $dialog-line-height-fz-xl: $line-height-fz-xl !default; // 16px 对应的行高
+// // 文本色
+// $dialog-color-text: $color-text !default;
+// $dialog-color-text-weight: $color-text-weight !default;
+// $dialog-color-text-label: $color-text-label !default;
+// $dialog-color-text-anti-primary: $color-text-anti-primary !default;
+// // 字重
+// $dialog-font-weight-normal: $font-weight-normal !default;
+// $dialog-font-weight-bold: $font-weight-bold !default;
+// // 遮罩
+// $dialog-mask-color:$mask-color !default;
+
+// // 关闭按钮色值
+// $dialog-color-neutral-9:$color-neutral-9 !default;
+
+.#{$prefix}dialog__btnwrap{
+  text-align: right;
+}

package/src/web/wedatheme/src/styles/theme/_divider.scss

@@ -0,0 +1 @@
+// $divider-color-text:$color-text !default;

package/src/web/wedatheme/src/styles/theme/_drawer.scss

@@ -0,0 +1,15 @@
+// // 弹窗宽度
+// $drawer-width-size-default:360px !default;
+// $drawer-width-size-l:800px !default;
+
+// // 背景
+// $drawer-color-bg:$color-bg !default;
+// // 影阴
+// $drawer-box-shadow-s:$box-shadow-s !default;
+// // 圆角
+// $drawer-border-radius:$border-radius !default;
+// // 内部分割线
+// $drawer-color-border: $color-border-inner !default;
+
+// $drawer-top-line-color:tranparent !default;
+

package/src/web/wedatheme/src/styles/theme/_dropdown.scss

@@ -0,0 +1,53 @@
+// $dropdown-font-size:$font-size-default !default;
+// $dropdown-border-radius:$border-radius !default;
+
+// $dropdown-width-s:100px !default;
+// $dropdown-width-m:200px !default;
+// $dropdown-width-l:420px !default;
+
+// $dropdown-box-color-text:$color-text !default;
+// $dropdown-box-width-min:150px !default;
+// $dropdown-box-list-height-max:180px !default;
+
+// $dropdown-color-border-inner:$color-border-inner !default;
+// $dropdown-color-border:$color-border !default;
+// $dropdown-color-border-hover:$color-border-hover !default;
+// $dropdown-color-border-focus:$color-primary !default;
+
+// $dropdown-color-bg:$color-bg !default;
+// $dropdown-color-bg-hover:$color-bg-hover !default;
+// $dropdown-color-bg-disabled:$color-bg-disabled !default;
+
+// $dropdown-color-text:$color-text !default;
+// $dropdown-color-text-weight:$color-text-weight !default;
+// $dropdown-color-text-disabled:$color-text-disabled !default;
+
+.#{$prefix}dropdown-box{
+  padding:$space-base*2;
+  .#{$prefix}list--option>li{
+    border-radius: $border-radius;
+  }
+  .#{$prefix}list--option>li.is-selected{
+    background-color: $color-primary-1;
+    color:$color-primary;
+  }
+  .#{$prefix}list--calendar-time>li.is-selected{
+    background-color: $color-primary;
+  }
+}
+
+.is-expanded.#{$prefix}dropdown-btn .#{$prefix}dropdown__header, .#{$prefix}dropdown-btn.#{$prefix}dropdown__header:hover{
+  background-color: $color-bg;
+}
+.#{$prefix}dropdown__header>.#{$prefix}icon-arrowdown{
+  background-image: url(../assets/arrowdown--line.svg);
+}
+.#{$prefix}dropdown__header.#{$prefix}dropdown-default{
+  padding:0 30px 0 16px;
+  &:hover{
+    background-color: $color-bg-hover;
+  }
+  .#{$prefix}icon{
+    right: 12px;
+  }
+}

package/src/web/wedatheme/src/styles/theme/_form.scss

@@ -0,0 +1,38 @@
+// $form-layout-font-size:$font-size-default !default;
+// $form-layout-label-width:6em !default;
+
+// $form-layout-color-text:$color-text !default;
+// $form-layout-color-text-label:$color-text-label !default;
+// $form-layout-color-text-weight:$color-text-weight !default;
+
+// $form-layout-color-border-inner:$color-border-inner !default;
+
+
+.#{$prefix}form .#{$prefix}form__label{
+  color:$color-text;
+  padding-top: ($form-height - ($font-size-default*1.5))/2;
+}
+.#{$prefix}form .#{$prefix}form__controls--text {
+  padding-top: ($form-height - ($font-size-default*1.5))/2;
+}
+#{$prefix}form #{$prefix}form__controls, #{$prefix}form #{$prefix}form__label{
+  padding-bottom: 24px;
+}
+
+/* 验证成功 */
+
+.#{$prefix}form__controls.is-success .#{$prefix}icon-valid {
+  width: 20px;
+  height: 20px;
+  background-image: url(../assets/success-filled.svg); 
+}
+
+/* 验证错误 */
+
+.#{$prefix}form__controls.is-error .#{$prefix}icon-valid {
+  width: 20px;
+  height: 20px;
+  
+  background-image: url(../assets/error-filled.svg);
+  
+}

package/src/web/wedatheme/src/styles/theme/_input&textarea&select.scss

@@ -0,0 +1,85 @@
+// // 组件变量
+// // 名称可按如下规则定义：
+// // <component>-[type]-<attr>-[attrtype]-[status]
+// // component:组件名，如button，
+// // type: 组件类型，如 button 的次要按钮（line）
+// // attr: 属性名称，如color、height、border-radius、font-size 等
+// // attrtype: 属性的具体应用场景。如颜色，用于背景（bg）、文本（text）、边框（boder）等
+// // status: 表示组件状态或尺寸，如 hover、disabled、s、l 等
+// // 如：@button-line-color-bg-hover
+// // 如：@button-line-height-s
+
+// //input textarea 公用变量
+// $input-font-size:$font-size-default !default;
+// $input-border-radius:$border-radius  !default;
+
+// $input-color-text:$color-text  !default;
+// $input-color-text-label:$color-text-label  !default;
+
+// $input-color-border:$color-border  !default;
+// $input-color-border-focus:$color-primary  !default;
+// $input-color-border-hover:$color-border-hover  !default;
+
+// $input-color-bg:$color-bg  !default;
+// $input-color-bg-hover:$color-bg  !default;
+// $input-color-bg-focus:$color-bg  !default;
+// $input-color-bg-gray:$color-bg-gray  !default;
+// $input-color-bg-disabled:$color-bg-disabled  !default;
+
+// $input-width-xs:60px  !default;
+// $input-width-s:100px  !default;
+// $input-width-default:200px  !default;
+// $input-width-l:420px  !default;
+
+
+// // select
+// $select-font-size:$font-size-default  !default;
+// $select-border-radius:$border-radius  !default;
+
+// $select-color-text:$color-text  !default;
+// $select-color-text-hover:$color-text  !default;
+// $select-color-text-disabled:$color-text  !default;
+
+// $select-color-border:$color-border  !default;
+// $select-color-border-focus:$color-primary  !default;
+// $select-color-border-hover:$color-border-hover  !default;
+// $select-color-border-disabled:$color-border-disabled  !default;
+
+// $select-color-bg:$color-bg  !default;
+// $select-color-bg-hover:$color-bg-hover  !default;
+// $select-color-bg-focus:$color-bg  !default;
+// $select-color-bg-disabled:$color-bg-disabled  !default;
+
+// $select-width-xs:60px  !default;
+// $select-width-s:100px  !default;
+// $select-width-default:200px  !default;
+// $select-width-l:420px  !default;
+
+
+// // 搜索
+// $search-color-bg:$color-bg  !default;
+// $search-border-radius:$border-radius  !default;
+
+#{$prefix}input::-webkit-input-placeholder, 
+#{$prefix}textarea-group::-webkit-input-placeholder, 
+#{$prefix}textarea::-webkit-input-placeholder{
+  color:$color-text-label;
+}
+
+.#{$prefix}input, .#{$prefix}textarea, .#{$prefix}textarea-group{
+  padding-left: $space-base * 2;
+  padding-right: $space-base * 2;
+}
+.#{$prefix}textarea-group{
+  
+  .#{$prefix}textarea,
+  .#{$prefix}textarea.size-m{
+    width:200 - $space-base * 2 * 2 - 2;
+  }
+  .#{$prefix}textarea.size-l{
+    width:420 - $space-base * 2 * 2 - 2;
+  }
+  .#{$prefix}textarea.size-s{
+    width:100 - $space-base * 2 * 2 - 2;
+  }
+}

package/src/web/wedatheme/src/styles/theme/_inputnumber.scss

@@ -0,0 +1,16 @@
+// $inputnum-border-radius:$border-radius !default;
+// $inputnum-color-border:$color-border !default;
+// $inputnum-color-bg:$color-bg !default;
+// // hover
+// $inputnum-color-bg-hover:$color-bg-hover !default;
+
+// // 禁用
+// $inputnum-color-text-disabled:$color-text-disabled !default;
+// $inputnum-color-bg-disabled:$color-bg-disabled !default;
+
+.#{$prefix}inputnum__plus:before{
+  background-image: url(../assets/plus.svg);
+}
+.#{$prefix}inputnum__minus:before{
+  background-image: url(../assets/minus.svg);
+}

package/src/web/wedatheme/src/styles/theme/_link.scss

@@ -0,0 +1,14 @@
+// // 字体
+// $link-font-size-default:$font-size-default !default;
+
+// // 字体颜色
+// $link-color-text:$color-text !default;
+// $link-primary-color-text:$color-primary !default;
+
+
+.#{$prefix}link-external:after{
+  background-image: url(../assets/jump.svg);
+}
+.#{$prefix}link-external--black:after{
+  background-image: url(../assets/jump-black.svg);
+}