@nutui/nutui-react-taro 3.0.0-beta.0 → 3.0.0-beta.2

package/dist/styles/theme-jrkf.scss

@@ -0,0 +1,260 @@
+:root,
+page {
+  --nutui-brand-1: #ffe5e5; // 梯度1
+  --nutui-brand-2: #ffcccc; // 梯度2
+  --nutui-brand-3: #ffb2b2; // 梯度3
+  --nutui-brand-4: #ff9999; // 梯度4
+  --nutui-brand-5: #ff7f7f; // 梯度5
+  --nutui-brand-6: #ff6666; // 梯度6
+  --nutui-brand-7: #ff4c4c; // 梯度7
+  --nutui-brand-8: #ff4144; // 梯度8 * 主题色 primary brand
+  --nutui-brand-9: #e6393b; // 梯度9
+  --nutui-brand-10: #cc3133; // 梯度10
+  --nutui-brand-11: #b32a2b; // 梯度11
+  --nutui-brand-12: #992222; // 梯度12
+
+  --nutui-brand-stop-1: #ff9999; // 渐变色起
+  --nutui-brand-stop-2: #ff6666; // 渐变色止
+
+  --nutui-gray-0: #f4f5f7; // color-background
+  // 卡片背景色
+  --nutui-gray-1: #f4f3f8; // color-border-tint
+  // 通用背景色、轮廓描边色
+  --nutui-gray-2: #f0f0f0; // color-border-base
+  // 轮廓描边色（适中）
+  --nutui-gray-3: #eeeeee; // color-border-shade
+  // 轮廓描边色（深）
+  --nutui-gray-4: #e6e6e6;
+  --nutui-gray-5: #d8d8d8;
+  --nutui-gray-6: #cccccc;
+  --nutui-gray-7: #b5b5b5;
+  --nutui-gray-8: #8c8c8c;
+  --nutui-gray-9: #666666;
+  --nutui-gray-10: #595959;
+  --nutui-gray-11: #333333;
+  --nutui-gray-12: #262626;
+
+  --nutui-black-1: rgba(0, 0, 0, 0.02);
+  --nutui-black-2: rgba(0, 0, 0, 0.05);
+  --nutui-black-3: rgba(0, 0, 0, 0.1);
+  --nutui-black-4: rgba(0, 0, 0, 0.2);
+  --nutui-black-5: rgba(0, 0, 0, 0.3); // color-text-disabled
+  // 四级文本色，禁用文本色，用于表达禁用状态，占位符等需弱化呈现的文本
+  --nutui-black-6: rgba(0, 0, 0, 0.4);
+  --nutui-black-7: rgba(0, 0, 0, 0.5); // color-text-description
+  // 三级文本色，描述文本色，用于对正文级标题做注释说明
+  --nutui-black-8: rgba(0, 0, 0, 0.55); //
+  // 全局蒙层，用于弹出层、弹窗、新功能引导出现的整页遮罩
+  --nutui-black-9: rgba(0, 0, 0, 0.6); //  color-text-regular
+  // 二级文本色，正文文本色，用于次级标题，属性标示、非主要信息引导等
+  --nutui-black-10: rgba(0, 0, 0, 0.7); //
+  --nutui-black-11: rgba(0, 0, 0, 0.9); //  color-text-title
+  // 一级文字色，标题文本色，主要内容用色，常用语常规标题内容等
+  --nutui-black-12: rgba(0, 0, 0, 1); //
+
+  --nutui-white-1: rgba(255, 255, 255, 0.02);
+  --nutui-white-2: rgba(255, 255, 255, 0.05);
+  --nutui-white-3: rgba(255, 255, 255, 0.1);
+  --nutui-white-4: rgba(255, 255, 255, 0.2);
+  --nutui-white-5: rgba(255, 255, 255, 0.3);
+  --nutui-white-6: rgba(255, 255, 255, 0.4);
+  --nutui-white-7: rgba(255, 255, 255, 0.5);
+  --nutui-white-8: rgba(255, 255, 255, 0.6);
+  --nutui-white-9: rgba(255, 255, 255, 0.7);
+  --nutui-white-10: rgba(255, 255, 255, 0.8);
+  --nutui-white-11: rgba(255, 255, 255, 0.9);
+  --nutui-white-12: rgba(255, 255, 255, 1);
+
+  --nutui-green-1: #eaf9f0;
+  --nutui-green-2: #cdf5db;
+  --nutui-green-3: #b2f0c9;
+  --nutui-green-4: #7de2a3;
+  --nutui-green-5: #51d07e;
+  --nutui-green-6: #1db270; // * 成功色 success
+  --nutui-green-7: #1a9f63;
+  --nutui-green-8: #178d57;
+  --nutui-green-9: #147b4b;
+  --nutui-green-10: #116a40;
+  --nutui-green-11: #0e5935;
+  --nutui-green-12: #0b482a;
+
+  --nutui-orange-1: #fff4e6;
+  --nutui-orange-2: #ffe8cc;
+  --nutui-orange-3: #ffd9b3;
+  --nutui-orange-4: #ffcc99;
+  --nutui-orange-5: #ffbf80;
+  --nutui-orange-6: #ffb366; // * 警告色 warning
+  --nutui-orange-7: #ff9933;
+  --nutui-orange-8: #ff8000;
+  --nutui-orange-9: #cc6600;
+  --nutui-orange-10: #994d00;
+  --nutui-orange-11: #663300;
+  --nutui-orange-12: #331a00;
+
+  --nutui-red-1: #ffecec;
+  --nutui-red-2: #ffd9d9;
+  --nutui-red-3: #ffc6c6;
+  --nutui-red-4: #ff9999;
+  --nutui-red-5: #ff7373;
+  --nutui-red-6: #ff4d4d;
+  --nutui-red-7: #ff2626;
+  --nutui-red-8: #ff4144; // * 危险色 danger
+  --nutui-red-9: #e6393a;
+  --nutui-red-10: #cc3232;
+  --nutui-red-11: #b32b2b;
+  --nutui-red-12: #802020;
+
+  --nutui-info-1: #e5e9fa;
+  --nutui-info-2: #c4cffa;
+  --nutui-info-3: #a3b5f7;
+  --nutui-info-4: #7387f2;
+  --nutui-info-5: #3e5cd7; // * 说明色 info
+  --nutui-info-6: #364fc2;
+  --nutui-info-7: #2e42ad;
+  --nutui-info-8: #263598;
+  --nutui-info-9: #1e2883;
+  --nutui-info-10: #161b6e;
+  --nutui-info-11: #0e0e59;
+  --nutui-info-12: #060a4a;
+
+  --nutui-color-info: var(--nutui-info-6);
+  --nutui-color-text-disabled: var(--nutui-black-6);
+  // 字体
+  --nutui-font-size-1: 10px; // font-text-mini
+  --nutui-font-size-2: 11px;
+  --nutui-font-size-3: 12px; // font-text-small
+  --nutui-font-size-4: 14px; // font-text、font-h3
+  --nutui-font-size-5: 16px; // font-text-large、font-h2
+  --nutui-font-size-6: 18px;
+  --nutui-font-size-7: 20px; // font-h1
+  --nutui-font-size-8: 24px; // 板块标题，指标数值、价格金额
+  --nutui-font-size-9: 32px; // 运营小标题
+  --nutui-font-size-10: 40px; // 运营大标题
+
+  // 行高
+  --nutui-line-height-base: 1.5;
+
+  // space
+  --nutui-spacing-1: 2px; // spacing-xxs
+  --nutui-spacing-2: 4px; // spacing-xs
+  --nutui-spacing-3: 6px; // spacing-s
+  --nutui-spacing-4: 8px; // spacing-base
+  --nutui-spacing-5: 10px; // spacing-l
+  --nutui-spacing-6: 12px; // spacing-xl
+  --nutui-spacing-7: 14px; // spacing-xxl
+  --nutui-spacing-8: 16px; // spacing-xxxl
+  --nutui-spacing-9: 18px;
+  --nutui-spacing-10: 20px;
+
+  // radius
+  --nutui-radius-1: 16px; // radius-xxs
+  --nutui-radius-2: 18px; // radius-xs
+  --nutui-radius-3: 20px; // radius-s
+  --nutui-radius-4: 22px; // radius-base
+  --nutui-radius-5: 24px; // radius-l
+  --nutui-radius-6: 36px; // radius-xl
+
+  // 语义名
+  --nutui-color-default: var(--nutui-gray-2);
+  --nutui-color-default-press: var(--nutui-gray-3);
+  --nutui-color-default-disabled: var(--nutui-gray-1);
+  --nutui-color-default-light: var(--nutui-gray-0);
+
+  --nutui-color-primary: var(--nutui-brand-8);
+  --nutui-color-primary-pressed: var(--nutui-brand-9);
+  --nutui-color-primary-disabled: var(--nutui-brand-3);
+  --nutui-color-primary-light: var(--nutui-brand-1);
+
+  --nutui-color-success: var(--nutui-green-6);
+  --nutui-color-success-press: var(--nutui-green-8);
+  --nutui-color-success-disabled: var(--nutui-green-3);
+  --nutui-color-success-light: var(--nutui-green-1);
+
+  --nutui-color-warning: var(--nutui-orange-6);
+  --nutui-color-warning-press: var(--nutui-orange-8);
+  --nutui-color-warning-disabled: var(--nutui-orange-3);
+  --nutui-color-warning-light: var(--nutui-orange-1);
+
+  --nutui-color-danger: var(--nutui-red-8);
+  --nutui-color-danger-press: var(--nutui-red-9);
+  --nutui-color-danger-disabled: var(--nutui-red-3);
+  --nutui-color-danger-light: var(--nutui-red-1);
+
+  --nutui-color-info: var(--nutui-info-6);
+  --nutui-color-info-press: var(--nutui-info-7);
+  --nutui-color-info-disabled: var(--nutui-info-3);
+  --nutui-color-info-light: var(--nutui-info-1);
+
+  --nutui-color-dark: var(--nutui-gray-12);
+  --nutui-color-light: var(--nutui-gray-0);
+
+  --nutui-color-surface-1: var(--nutui-gray-0);
+  --nutui-color-surface-2: var(--nutui-white-12);
+  --nutui-color-surface-3: var(--nutui-white-12);
+  --nutui-color-surface-4: var(--nutui-white-12);
+  --nutui-color-surface-overlay: var(--nutui-black-8);
+
+  --nutui-color-border-shade: var(--nutui-gray-3);
+  --nutui-color-border: var(--nutui-gray-2);
+  --nutui-color-border-tint: var(--nutui-gray-1);
+
+  --nutui-color-title: var(--nutui-gray-12);
+  --nutui-color-text: var(--nutui-gray-10);
+  --nutui-color-text-help: var(--nutui-gray-8);
+  --nutui-color-text-disabled: var(--nutui-gray-7);
+  --nutui-color-text-dark: var(--nutui-white-12);
+
+  --nutui-font-h1: var(--nutui-font-size-5);
+  --nutui-font-h2: var(--nutui-font-size-4);
+  --nutui-font-h3: var(--nutui-font-size-3);
+  --nutui-font-h4: var(--nutui-font-size-2);
+  --nutui-font-h5: var(--nutui-font-size-1);
+  --nutui-font-text-large: var(--nutui-font-size-5);
+  --nutui-font-text: var(--nutui-font-size-4);
+  --nutui-font-text-small: var(--nutui-font-size-3);
+  --nutui-font-text-xs: var(--nutui-font-size-2);
+  --nutui-font-text-mini: var(--nutui-font-size-1);
+
+  --nutui-font-weight: 400;
+  --nutui-font-weight-bold: 600;
+  --nutui-line-height: 140%;
+
+  --nutui-spacing-xxs: var(--nutui-spacing-1);
+  --nutui-spacing-xs: var(--nutui-spacing-2);
+  --nutui-spacing-s: var(--nutui-spacing-3);
+  --nutui-spacing-base: var(--nutui-spacing-4);
+  --nutui-spacing-l: var(--nutui-spacing-5);
+  --nutui-spacing-xl: var(--nutui-spacing-6);
+  --nutui-spacing-xxl: var(--nutui-spacing-7);
+  --nutui-spacing-xxxl: var(--nutui-spacing-8);
+  --nutui-spacing-4xl: var(--nutui-spacing-9);
+  --nutui-spacing-5xl: var(--nutui-spacing-10);
+
+  --nutui-radius-xxs: var(--nutui-radius-1);
+  --nutui-radius-xs: var(--nutui-radius-2);
+  --nutui-radius-s: var(--nutui-radius-3);
+  --nutui-radius-base: var(--nutui-radius-4);
+  --nutui-radius-l: var(--nutui-radius-5);
+  --nutui-radius-xl: var(--nutui-radius-6);
+  --nutui-radius-full: 50%;
+
+  --nutui-shadow-light: 0 0 4px 0 rgba(0, 0, 0, 0.05);
+  --nutui-shadow-raised: 0 0 6px 0 rgba(0, 0, 0, 0.1);
+  --nutui-shadow-overlay: 0 0 8px 0 rgba(0, 0, 0, 0.2);
+
+  // 其他语义变量
+  --nutui-color-primary-stop-1: var(--nutui-brand-stop-1);
+  --nutui-color-primary-stop-2: var(--nutui-brand-stop-2);
+  --nutui-color-primary-text: #ffffff;
+  --nutui-color-primary-light-pressed: var(--nutui-brand-2);
+  --nutui-color-text-link: var(--nutui-brand-8);
+  --nutui-button-border-radius: var(--nutui-radius-base);
+  --nutui-button-default-color: var(--nutui-black-12);
+  --nutui-button-default-background-color: #fff;
+  --nutui-button-default-border-color: var(--nutui-black-3);
+  --nutui-button-default-disabled: var(--nutui-black-2);
+  --nutui-button-default-disabled-background-color: var(--nutui-black-3);
+  --nutui-button-default-disabled-border-color: var(--nutui-black-3);
+  --nutui-actionsheet-background-color: #fff;
+  --nutui-input-background-color: var(--nutui-gray-1);
+}

package/dist/styles/themes/default.scss

@@ -2,105 +2,105 @@
 @import '../variables.scss';
 @import '../mixins/index.scss';
 @import '../animation/index.scss';
-@import '../../es/packages/virtuallist/style/virtuallist.scss';
 @import '../../es/packages/watermark/style/watermark.scss';
-@import '../../es/packages/trendarrow/style/trendarrow.scss';
+@import '../../es/packages/virtuallist/style/virtuallist.scss';
 @import '../../es/packages/video/style/video.scss';
 @import '../../es/packages/uploader/style/uploader.scss';
 @import '../../es/packages/tour/style/tour.scss';
+@import '../../es/packages/trendarrow/style/trendarrow.scss';
 @import '../../es/packages/toast/style/toast.scss';
 @import '../../es/packages/timeselect/style/timeselect.scss';
 @import '../../es/packages/timedetail/style/timedetail.scss';
 @import '../../es/packages/textarea/style/textarea.scss';
 @import '../../es/packages/tag/style/tag.scss';
-@import '../../es/packages/tabs/style/tabs.scss';
 @import '../../es/packages/tabpane/style/tabpane.scss';
-@import '../../es/packages/tabbaritem/style/tabbaritem.scss';
+@import '../../es/packages/tabs/style/tabs.scss';
 @import '../../es/packages/table/style/table.scss';
+@import '../../es/packages/tabbaritem/style/tabbaritem.scss';
 @import '../../es/packages/tabbar/style/tabbar.scss';
-@import '../../es/packages/switch/style/switch.scss';
 @import '../../es/packages/swiperitem/style/swiperitem.scss';
+@import '../../es/packages/switch/style/switch.scss';
 @import '../../es/packages/swiper/style/swiper.scss';
 @import '../../es/packages/swipe/style/swipe.scss';
+@import '../../es/packages/subsidenavbar/style/subsidenavbar.scss';
 @import '../../es/packages/sticky/style/sticky.scss';
 @import '../../es/packages/steps/style/steps.scss';
-@import '../../es/packages/subsidenavbar/style/subsidenavbar.scss';
 @import '../../es/packages/step/style/step.scss';
 @import '../../es/packages/space/style/space.scss';
+@import '../../es/packages/skeleton/style/skeleton.scss';
 @import '../../es/packages/signature/style/signature.scss';
 @import '../../es/packages/sidenavbaritem/style/sidenavbaritem.scss';
 @import '../../es/packages/sidenavbar/style/sidenavbar.scss';
 @import '../../es/packages/shortpassword/style/shortpassword.scss';
 @import '../../es/packages/searchbar/style/searchbar.scss';
-@import '../../es/packages/skeleton/style/skeleton.scss';
-@import '../../es/packages/row/style/row.scss';
 @import '../../es/packages/safearea/style/safearea.scss';
-@import '../../es/packages/range/style/range.scss';
+@import '../../es/packages/row/style/row.scss';
 @import '../../es/packages/resultpage/style/resultpage.scss';
-@import '../../es/packages/radiogroup/style/radiogroup.scss';
+@import '../../es/packages/range/style/range.scss';
 @import '../../es/packages/rate/style/rate.scss';
+@import '../../es/packages/radiogroup/style/radiogroup.scss';
 @import '../../es/packages/pulltorefresh/style/pulltorefresh.scss';
-@import '../../es/packages/price/style/price.scss';
-@import '../../es/packages/progress/style/progress.scss';
 @import '../../es/packages/radio/style/radio.scss';
+@import '../../es/packages/progress/style/progress.scss';
+@import '../../es/packages/price/style/price.scss';
 @import '../../es/packages/popup/style/popup.scss';
-@import '../../es/packages/pagination/style/pagination.scss';
+@import '../../es/packages/popover/style/popover.scss';
 @import '../../es/packages/picker/style/picker.scss';
+@import '../../es/packages/pagination/style/pagination.scss';
 @import '../../es/packages/overlay/style/overlay.scss';
-@import '../../es/packages/notify/style/notify.scss';
+@import '../../es/packages/noticebar/style/noticebar.scss';
 @import '../../es/packages/numberkeyboard/style/numberkeyboard.scss';
-@import '../../es/packages/popover/style/popover.scss';
-@import '../../es/packages/menuitem/style/menuitem.scss';
+@import '../../es/packages/notify/style/notify.scss';
 @import '../../es/packages/navbar/style/navbar.scss';
+@import '../../es/packages/menuitem/style/menuitem.scss';
 @import '../../es/packages/menu/style/menu.scss';
-@import '../../es/packages/noticebar/style/noticebar.scss';
-@import '../../es/packages/layout/style/layout.scss';
 @import '../../es/packages/loading/style/loading.scss';
-@import '../../es/packages/infiniteloading/style/infiniteloading.scss';
+@import '../../es/packages/layout/style/layout.scss';
 @import '../../es/packages/inputnumber/style/inputnumber.scss';
 @import '../../es/packages/input/style/input.scss';
+@import '../../es/packages/infiniteloading/style/infiniteloading.scss';
 @import '../../es/packages/indicator/style/indicator.scss';
-@import '../../es/packages/hoverbuttonitem/style/hoverbuttonitem.scss';
 @import '../../es/packages/imagepreview/style/imagepreview.scss';
-@import '../../es/packages/hoverbutton/style/hoverbutton.scss';
 @import '../../es/packages/image/style/image.scss';
+@import '../../es/packages/hoverbuttonitem/style/hoverbuttonitem.scss';
+@import '../../es/packages/hoverbutton/style/hoverbutton.scss';
 @import '../../es/packages/griditem/style/griditem.scss';
-@import '../../es/packages/fixednav/style/fixednav.scss';
-@import '../../es/packages/grid/style/grid.scss';
 @import '../../es/packages/formitem/style/formitem.scss';
+@import '../../es/packages/grid/style/grid.scss';
 @import '../../es/packages/form/style/form.scss';
-@import '../../es/packages/drag/style/drag.scss';
-@import '../../es/packages/ellipsis/style/ellipsis.scss';
+@import '../../es/packages/fixednav/style/fixednav.scss';
 @import '../../es/packages/empty/style/empty.scss';
+@import '../../es/packages/ellipsis/style/ellipsis.scss';
+@import '../../es/packages/drag/style/drag.scss';
 @import '../../es/packages/divider/style/divider.scss';
+@import '../../es/packages/elevator/style/elevator.scss';
 @import '../../es/packages/dialog/style/dialog.scss';
 @import '../../es/packages/datepicker/style/datepicker.scss';
-@import '../../es/packages/countdown/style/countdown.scss';
-@import '../../es/packages/elevator/style/elevator.scss';
 @import '../../es/packages/countup/style/countup.scss';
-@import '../../es/packages/collapse/style/collapse.scss';
-@import '../../es/packages/collapseitem/style/collapseitem.scss';
+@import '../../es/packages/countdown/style/countdown.scss';
 @import '../../es/packages/configprovider/style/configprovider.scss';
+@import '../../es/packages/collapseitem/style/collapseitem.scss';
+@import '../../es/packages/collapse/style/collapse.scss';
 @import '../../es/packages/col/style/col.scss';
 @import '../../es/packages/circleprogress/style/circleprogress.scss';
-@import '../../es/packages/cellgroup/style/cellgroup.scss';
 @import '../../es/packages/checkboxgroup/style/checkboxgroup.scss';
+@import '../../es/packages/checkbox/style/checkbox.scss';
+@import '../../es/packages/cellgroup/style/cellgroup.scss';
 @import '../../es/packages/cell/style/cell.scss';
 @import '../../es/packages/cascader/style/cascader.scss';
 @import '../../es/packages/card/style/card.scss';
-@import '../../es/packages/checkbox/style/checkbox.scss';
-@import '../../es/packages/calendarcard/style/calendarcard.scss';
 @import '../../es/packages/calendaritem/style/calendaritem.scss';
+@import '../../es/packages/calendarcard/style/calendarcard.scss';
+@import '../../es/packages/calendar/style/calendar.scss';
 @import '../../es/packages/button/style/button.scss';
 @import '../../es/packages/barrage/style/barrage.scss';
-@import '../../es/packages/calendar/style/calendar.scss';
-@import '../../es/packages/avatargroup/style/avatargroup.scss';
+@import '../../es/packages/badge/style/badge.scss';
 @import '../../es/packages/backtop/style/backtop.scss';
+@import '../../es/packages/avatargroup/style/avatargroup.scss';
 @import '../../es/packages/avatarcropper/style/avatarcropper.scss';
-@import '../../es/packages/badge/style/badge.scss';
-@import '../../es/packages/audio/style/audio.scss';
 @import '../../es/packages/avatar/style/avatar.scss';
+@import '../../es/packages/audio/style/audio.scss';
 @import '../../es/packages/animate/style/animate.scss';
-@import '../../es/packages/address/style/address.scss';
 @import '../../es/packages/animatingnumbers/style/animatingnumbers.scss';
+@import '../../es/packages/address/style/address.scss';
 @import '../../es/packages/actionsheet/style/actionsheet.scss';