[Improvement] update helper

example/app.json

@@ -9,7 +9,7 @@
     "pages/cell/index",
     "pages/dialog/index",
     "pages/field/index",
-    "pages/helper/index",
+    "pages/common/index",
     "pages/icon/index",
     "pages/layout/index",
     "pages/loading/index",

example/pages/common/index.json

@@ -1,5 +1,5 @@
 {
-  "navigationBarTitleText": "Helper 基础样式",
+  "navigationBarTitleText": "Common 基础样式",
   "usingComponents": {
     "van-cell": "../../dist/cell/index",
     "van-panel": "../../dist/panel/index",

example/pages/dashboard/config.js

@@ -3,12 +3,12 @@ export default {
     title: '基础组件',
     content: [
       {
-        name: 'Layout 布局',
-        path: '/pages/layout/index'
+        name: 'Common 基础样式',
+        path: '/pages/common/index'
       },
       {
-        name: 'Base 基础样式',
-        path: '/pages/helper/index'
+        name: 'Layout 布局',
+        path: '/pages/layout/index'
       },
       {
         name: 'Badge 徽章',

package.json

@@ -10,7 +10,6 @@
     "release": "sh scripts/release.sh",
     "components": "cross-env NODE_ENV=production node scripts/build-components.js --color",
     "changelog": "sh scripts/build-changelog.sh",
-    "icon": "sh scripts/build-icon.sh",
     "dev": "node scripts/build-dev.js --color",
     "build": "sh scripts/deploy.sh",
     "watch:doc": "NODE_ENV=development wedoc run watch",

packages/actionsheet/index.pcss

@@ -1,5 +1,4 @@
-@import "../common/_var";
-@import "../common/_mixins";
+@import "../common/index.pcss";
 
 .van-actionsheet {
   background-color: #f8f8f8;

packages/badge-group/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-badge-group {
   width: 85px;

packages/badge/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-badge {
   display: block;

packages/button/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-button {
   position: relative;

packages/card/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-card {
   color: $text-color;

packages/cell-group/index.pcss

@@ -1 +1 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';

packages/cell/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-cell {
   width: 100%;

packages/color/index.pcss

@@ -1,29 +0,0 @@
-@import '../common/_var';
-
-.van-c-red {
-  color: $red !important;
-}
-
-.van-c-gray {
-  color: $gray !important;
-}
-
-.van-c-gray-dark {
-  color: $gray-dark !important;
-}
-
-.van-c-gray-darker {
-  color: $gray-darker !important;
-}
-
-.van-c-black {
-  color: $text-color !important;
-}
-
-.van-c-blue {
-  color: $blue !important;
-}
-
-.van-c-green {
-  color: $green !important;
-}

packages/common/_mixins.pcss

@@ -1,29 +0,0 @@
-@import './_var';
-
-@define-mixin hairline $border-retina-color: $gray-light {
-  content: '';
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 200%;
-  height: 200%;
-  transform: scale(.5);
-  transform-origin: 0 0;
-  pointer-events: none;
-  box-sizing: border-box;
-  border: 0 solid $border-retina-color;
-}
-
-@define-mixin multi-ellipsis $lines {
-  overflow : hidden;
-  text-overflow: ellipsis;
-  display: -webkit-box;
-  -webkit-line-clamp: $lines;
-  -webkit-box-orient: vertical;
-}
-
-@define-mixin ellipsis {
-  overflow: hidden;
-  white-space: nowrap;
-  text-overflow: ellipsis;
-}

packages/common/_var.pcss

@@ -1,35 +0,0 @@
-/* color variables */
-$black: #000;
-$white: #fff;
-$red: #f44;
-$blue: #38f;
-$orange: #f60;
-$green: #06bf04;
-$gray: #c9c9c9;
-$gray-light: #e5e5e5;
-$gray-darker: #666;
-$gray-dark: #999;
-
-/* default colors */
-$text-color: #333;
-$border-color: $gray-light;
-$active-color: #e8e8e8;
-$background-color: #f8f8f8;
-
-/* button */
-$button-default-color: $text-color;
-$button-default-background-color: $white;
-$button-default-border-color: $border-color;
-$button-primary-color: $white;
-$button-primary-background-color: #4b0;
-$button-primary-border-color: #4b0;
-$button-danger-color: $white;
-$button-danger-background-color: $red;
-$button-danger-border-color: $red;
-$button-disabled-color: $gray-dark;
-$button-disabled-background-color: $active-color;
-$button-disabled-border-color: $border-color;
-$button-bottom-action-default-color: $white;
-$button-bottom-action-default-background-color: #f85;
-$button-bottom-action-primary-color: $white;
-$button-bottom-action-primary-background-color: $red;

packages/common/index.pcss

@@ -0,0 +1,9 @@
+/**
+ * Entry of basic styles
+ */
+
+@import "./style/var.pcss";
+@import "./style/ellipsis.pcss";
+@import "./style/clearfix.pcss";
+@import "./style/hairline.pcss";
+@import "./style/animation.pcss";

packages/common/style/clearfix.pcss

@@ -1,4 +1,4 @@
-@import '../mixins/clearfix.pcss';
+@import './mixins/clearfix.pcss';
 
 .van-clearfix {
   @mixin clearfix;

packages/common/style/ellipsis.pcss

@@ -1,4 +1,4 @@
-@import '../mixins/ellipsis.pcss';
+@import './mixins/ellipsis.pcss';
 
 .van-ellipsis {
   @mixin ellipsis;

packages/common/style/hairline.pcss

@@ -1,4 +1,4 @@
-@import "../mixins/border-retina.pcss";
+@import "./mixins/border-retina.pcss";
 
 .van-hairline,
 .van-hairline--top,

packages/common/style/mixins/border-retina.pcss

@@ -1,4 +1,4 @@
-@import '../common/var.pcss';
+@import '../var.pcss';
 
 $border-poses: top, right, bottom, left;
 

packages/dialog/index.pcss

@@ -1,5 +1,3 @@
-@import "../common/_mixins";
-
 /* 基础样式 */
 .van-dialog--container {
   width: 80vw;
@@ -23,7 +21,6 @@
   min-height: 40px;
 
   &::after {
-    @mixin hairline;
     border-bottom-width: 1px;
   }
 }

packages/field/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-field {
   &__body {

packages/helper/common/var.pcss

@@ -1,38 +0,0 @@
-/* color variables */
-$black: #000;
-$white: #fff;
-$red: #f44;
-$blue: #38f;
-$orange: #f85;
-$green: #06bf04;
-$gray: #c9c9c9;
-$gray-light: #e5e5e5;
-$gray-darker: #666;
-$gray-dark: #999;
-
-/* default colors */
-$text-color: #333;
-$border-color: $gray-light;
-$active-color: #e8e8e8;
-$background-color: #f8f8f8;
-
-/* button */
-$button-default-color: $text-color;
-$button-default-background-color: $white;
-$button-default-border-color: $border-color;
-$button-primary-color: $white;
-$button-primary-background-color: #4b0;
-$button-primary-border-color: #4b0;
-$button-danger-color: $white;
-$button-danger-background-color: $red;
-$button-danger-border-color: $red;
-$button-warning-color: $white;
-$button-warning-background-color: $orange;
-$button-warning-border-color: $orange;
-$button-disabled-color: $gray-dark;
-$button-disabled-background-color: $active-color;
-$button-disabled-border-color: $border-color;
-$button-bottom-action-default-color: $white;
-$button-bottom-action-default-background-color: #f85;
-$button-bottom-action-primary-color: $white;
-$button-bottom-action-primary-background-color: $red;

packages/helper/index.pcss

@@ -1,9 +0,0 @@
-/**
- * Entry of basic styles
- */
-
-@import "./common/var.pcss";
-@import "./common/ellipsis.pcss";
-@import "./common/clearfix.pcss";
-@import "./common/hairline.pcss";
-@import "./common/animation.pcss";

packages/icon/index.pcss

@@ -1,4 +1,4 @@
-@import '../common/var.pcss';
+@import '../common/index.pcss';
 
 @font-face {
   font-style: normal;

packages/index.pcss

@@ -1 +1 @@
-@import "helper/index.pcss";
+@import "common/index.pcss";

packages/loading/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-loading {
   z-index: 0;

packages/loadmore/index.pcss

@@ -1,5 +1,3 @@
-@import "../common/_mixins";
-
 .van-loadmore {
   display: flex;
   align-items: center;
@@ -15,7 +13,6 @@
   position: relative;
 
   &::after {
-    @mixin hairline;
     border-bottom-width: 1px;
   }
 }

packages/panel/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-panel {
   background: $white;

packages/stepper/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-stepper {
   font-size: 0;

packages/switch/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-switch {
   height: 1em;

packages/tag/index.pcss

@@ -1,4 +1,4 @@
-@import '../helper/index.pcss';
+@import '../common/index.pcss';
 
 .van-tag {
   display: inline-block;

packages/tree-select/index.pcss

@@ -1,4 +1,4 @@
-@import "../helper/index.pcss";
+@import "../common/index.pcss";
 
 .tree-select {
   user-select: none;