diff --git a/docs/index.html b/docs/index.html index bda880083..e19409eb4 100644 --- a/docs/index.html +++ b/docs/index.html @@ -1 +1 @@ -cube-ui Document
\ No newline at end of file +cube-ui Document
\ No newline at end of file diff --git a/docs/js/39.8e66be58793d3fa4bb13.js b/docs/js/39.8e66be58793d3fa4bb13.js deleted file mode 100644 index 901cf7780..000000000 --- a/docs/js/39.8e66be58793d3fa4bb13.js +++ /dev/null @@ -1 +0,0 @@ -webpackJsonp([39],{OKj6:function(s,a){s.exports={render:function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("section",[t("h2",{attrs:{id:"Theme"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-Theme-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Theme")]),s._v(" "),s._m(0),s._v(" "),s._m(1),s._v(" "),t("h3",{attrs:{id:"Themefile"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-Themefile-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Theme file")]),s._v(" "),s._m(2),s._v(" "),s._m(3),s._v(" "),t("h3",{attrs:{id:"webpackconfig"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-webpackconfig-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" webpack config")]),s._v(" "),s._m(4),s._v(" "),s._m(5),s._v(" "),t("h3",{attrs:{id:"Result"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-Result-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Result")]),s._v(" "),t("p",[s._v("In this way you can use cube-ui with your own theme. You do not need to override the cube-ui style because you can just override the theme variables.")])])},staticRenderFns:[function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("You can choose to modify all or only some of the theme variables from "),t("code",{pre:!0},[s._v("cube-ui^1.0.2")]),s._v("(also need webpack).")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[t("strong",[s._v("Notice:")]),s._v(" Customizing theme depend on "),t("a",{attrs:{href:"#/en-US/docs/post-compile"}},[s._v("post-compile")]),s._v(".")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("You can create a "),t("code",{pre:!0},[s._v("theme.styl")]),s._v(" file in your application's "),t("code",{pre:!0},[s._v("src/")]),s._v(" directory. The theme file's content that looks like this (these variables are cube-ui's default value):")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("pre",{pre:!0},[t("code",{attrs:{"v-pre":"",class:"language-styl"}},[t("span",{attrs:{class:"hljs-comment"}},[s._v("// you want to use cube-ui variables, just require it")]),s._v("\n@require "),t("span",{attrs:{class:"hljs-string"}},[s._v('"~cube-ui/src/common/stylus/var/color.styl"')]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// action-sheet")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-space-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bg\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// picker style")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-picker-cancel-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-picker-cancel-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// button")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// primary")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// light")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-sss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-sss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-active-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-active-grey\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// outline")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// outline-primary")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// checked")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// disabled")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox-group")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-group-horizontal-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// dialog")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-background\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-close-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-highlight-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-highlight-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-orange-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-disabled-active-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btns-split-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// index-list")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-anchor-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-anchor-bgc := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#f7f7f7")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-item-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-item-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-nav-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-nav-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// picker")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-confirm-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-confirm-btn-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-cancel-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-cancel-btn-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-item-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// popup")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$popup")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bgc := rgb("),t("span",{attrs:{class:"hljs-number"}},[s._v("37")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("38")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("45")]),s._v(")\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$popup")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-opacity := ."),t("span",{attrs:{class:"hljs-number"}},[s._v("4")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// slide")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$slide")]),s._v("-dot-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$slide")]),s._v("-dot-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// tip")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$tip")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$tip")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// toast")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$toast")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$toast")]),s._v("-bgc := rgba("),t("span",{attrs:{class:"hljs-number"}},[s._v("37")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("38")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("45")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("0.9")]),s._v(")\n")])])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("If your project is created by vue-cli, then you can modify the "),t("code",{pre:!0},[s._v("exports.cssLoaders")]),s._v(" function in "),t("code",{pre:!0},[s._v("build/utils.js")]),s._v(" to this:")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("pre",{pre:!0},[t("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("exports.cssLoaders = "),t("span",{attrs:{class:"hljs-function"}},[t("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" ("),t("span",{attrs:{class:"hljs-params"}},[s._v("options")]),s._v(") ")]),s._v("{\n options = options || {}\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" cssLoader = {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'css-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("minimize")]),s._v(": process.env.NODE_ENV === "),t("span",{attrs:{class:"hljs-string"}},[s._v("'production'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n }\n }\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" postcssLoader = {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'postcss-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n }\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// generate loader string to be used with extract text plugin")]),s._v("\n "),t("span",{attrs:{class:"hljs-function"}},[t("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" "),t("span",{attrs:{class:"hljs-title"}},[s._v("generateLoaders")]),s._v(" ("),t("span",{attrs:{class:"hljs-params"}},[s._v("loader, loaderOptions")]),s._v(") ")]),s._v("{\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("if")]),s._v(" (loader) {\n loaders.push({\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": loader + "),t("span",{attrs:{class:"hljs-string"}},[s._v("'-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": "),t("span",{attrs:{class:"hljs-built_in"}},[s._v("Object")]),s._v(".assign({}, loaderOptions, {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n })\n })\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// Extract CSS when that option is specified")]),s._v("\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// (which is the case during production build)")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("if")]),s._v(" (options.extract) {\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" ExtractTextPlugin.extract({\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("use")]),s._v(": loaders,\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("fallback")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'vue-style-loader'")]),s._v("\n })\n } "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("else")]),s._v(" {\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" ["),t("span",{attrs:{class:"hljs-string"}},[s._v("'vue-style-loader'")]),s._v("].concat(loaders)\n }\n }\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" stylusOptions = {\n "),t("span",{attrs:{class:"hljs-string"}},[s._v("'resolve url'")]),s._v(": "),t("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(",\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// !! add import option, include the theme file")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(": [path.resolve(__dirname, "),t("span",{attrs:{class:"hljs-string"}},[s._v("'../src/theme'")]),s._v(")]\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// https://vue-loader.vuejs.org/en/configurations/extract-css.html")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("css")]),s._v(": generateLoaders(),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("postcss")]),s._v(": generateLoaders(),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("less")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'less'")]),s._v("),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sass")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v(", { "),t("span",{attrs:{class:"hljs-attr"}},[s._v("indentedSyntax")]),s._v(": "),t("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(" }),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("scss")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v("),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("stylus")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(",stylusOptions),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("styl")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(",stylusOptions)\n }\n}\n")])])}]}},qVBK:function(s,a,t){s.exports=t("rKy5")},rKy5:function(s,a,t){var l=t("VU/8")(null,t("OKj6"),null,null,null);s.exports=l.exports}}); \ No newline at end of file diff --git a/docs/js/39.da7ba6ba0646b88d468c.js b/docs/js/39.da7ba6ba0646b88d468c.js new file mode 100644 index 000000000..7cac2f188 --- /dev/null +++ b/docs/js/39.da7ba6ba0646b88d468c.js @@ -0,0 +1 @@ +webpackJsonp([39],{OKj6:function(s,a){s.exports={render:function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("section",[t("h2",{attrs:{id:"Theme"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-Theme-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Theme")]),s._v(" "),s._m(0),s._v(" "),s._m(1),s._v(" "),t("h3",{attrs:{id:"Themefile"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-Themefile-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Theme file")]),s._v(" "),s._m(2),s._v(" "),s._m(3),s._v(" "),t("h3",{attrs:{id:"webpackconfig"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-webpackconfig-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" webpack config")]),s._v(" "),s._m(4),s._v(" "),s._m(5),s._v(" "),t("h3",{attrs:{id:"Result"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-Result-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" Result")]),s._v(" "),t("p",[s._v("In this way you can use cube-ui with your own theme. You do not need to override the cube-ui style because you can just override the theme variables.")])])},staticRenderFns:[function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("You can choose to modify all or only some of the theme variables from "),t("code",{pre:!0},[s._v("cube-ui^1.0.2")]),s._v("(also need webpack).")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[t("strong",[s._v("Notice:")]),s._v(" Customizing theme depend on "),t("a",{attrs:{href:"#/en-US/docs/post-compile"}},[s._v("post-compile")]),s._v(".")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("You can create a "),t("code",{pre:!0},[s._v("theme.styl")]),s._v(" file in your application's "),t("code",{pre:!0},[s._v("src/")]),s._v(" directory. The theme file's content that looks like this (these variables are cube-ui's default value):")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("pre",{pre:!0},[t("code",{attrs:{"v-pre":"",class:"language-styl"}},[t("span",{attrs:{class:"hljs-comment"}},[s._v("// you want to use cube-ui variables, just require it")]),s._v("\n@require "),t("span",{attrs:{class:"hljs-string"}},[s._v('"~cube-ui/src/common/stylus/var/color.styl"')]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// action-sheet")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-space-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bg\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// picker style")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-picker-cancel-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-picker-cancel-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// button")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// primary")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// light")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-sss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-sss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-active-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-active-grey\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// outline")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// outline-primary")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// checked")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// disabled")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox hollow")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-hollow-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-hollow-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox-group")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-group-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-group-horizontal-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// radio")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-group-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-group-horizontal-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// selected")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-selected-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-selected-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// disabled")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// radio hollow")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-hollow-selected-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-hollow-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// dialog")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-background\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-close-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-highlight-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-highlight-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-orange-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-disabled-active-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btns-split-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// index-list")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-anchor-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-anchor-bgc := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#f7f7f7")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-item-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-item-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-nav-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-nav-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// picker")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-confirm-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-confirm-btn-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-cancel-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-cancel-btn-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-item-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// popup")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$popup")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bgc := rgb("),t("span",{attrs:{class:"hljs-number"}},[s._v("37")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("38")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("45")]),s._v(")\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$popup")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-opacity := ."),t("span",{attrs:{class:"hljs-number"}},[s._v("4")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// slide")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$slide")]),s._v("-dot-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$slide")]),s._v("-dot-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// tip")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$tip")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$tip")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// toast")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$toast")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$toast")]),s._v("-bgc := rgba("),t("span",{attrs:{class:"hljs-number"}},[s._v("37")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("38")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("45")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("0.9")]),s._v(")\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// upload")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("box-shadow")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" "),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" "),t("span",{attrs:{class:"hljs-number"}},[s._v("6px")]),s._v(" "),t("span",{attrs:{class:"hljs-number"}},[s._v("2px")]),s._v(" "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#e5e5e5")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-remove-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := rgba("),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(", ."),t("span",{attrs:{class:"hljs-number"}},[s._v("8")]),s._v(")\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-remove-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-state-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bg\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-success-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-error-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#f43530")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-status-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-progress-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// switch")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$switch")]),s._v("-on-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$switch")]),s._v("-off-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$switch")]),s._v("-off-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#e4e4e4")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// input")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-focus-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-placeholder-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("clear")]),s._v("-icon-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("//textarea")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-focus-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-placeholder-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-indicator-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// validator")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$validator")]),s._v("-msg-def-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#f5222d")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// select")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#b8b8b8")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-disabled-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border")]),s._v("-active-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-placeholder-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// swipe")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$swipe")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n")])])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("If your project is created by vue-cli, then you can modify the "),t("code",{pre:!0},[s._v("exports.cssLoaders")]),s._v(" function in "),t("code",{pre:!0},[s._v("build/utils.js")]),s._v(" to this:")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("pre",{pre:!0},[t("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("exports.cssLoaders = "),t("span",{attrs:{class:"hljs-function"}},[t("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" ("),t("span",{attrs:{class:"hljs-params"}},[s._v("options")]),s._v(") ")]),s._v("{\n options = options || {}\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" cssLoader = {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'css-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("minimize")]),s._v(": process.env.NODE_ENV === "),t("span",{attrs:{class:"hljs-string"}},[s._v("'production'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n }\n }\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" postcssLoader = {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'postcss-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n }\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// generate loader string to be used with extract text plugin")]),s._v("\n "),t("span",{attrs:{class:"hljs-function"}},[t("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" "),t("span",{attrs:{class:"hljs-title"}},[s._v("generateLoaders")]),s._v(" ("),t("span",{attrs:{class:"hljs-params"}},[s._v("loader, loaderOptions")]),s._v(") ")]),s._v("{\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("if")]),s._v(" (loader) {\n loaders.push({\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": loader + "),t("span",{attrs:{class:"hljs-string"}},[s._v("'-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": "),t("span",{attrs:{class:"hljs-built_in"}},[s._v("Object")]),s._v(".assign({}, loaderOptions, {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n })\n })\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// Extract CSS when that option is specified")]),s._v("\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// (which is the case during production build)")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("if")]),s._v(" (options.extract) {\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" ExtractTextPlugin.extract({\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("use")]),s._v(": loaders,\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("fallback")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'vue-style-loader'")]),s._v("\n })\n } "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("else")]),s._v(" {\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" ["),t("span",{attrs:{class:"hljs-string"}},[s._v("'vue-style-loader'")]),s._v("].concat(loaders)\n }\n }\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" stylusOptions = {\n "),t("span",{attrs:{class:"hljs-string"}},[s._v("'resolve url'")]),s._v(": "),t("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(",\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// !! add import option, include the theme file")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(": [path.resolve(__dirname, "),t("span",{attrs:{class:"hljs-string"}},[s._v("'../src/theme'")]),s._v(")]\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// https://vue-loader.vuejs.org/en/configurations/extract-css.html")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("css")]),s._v(": generateLoaders(),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("postcss")]),s._v(": generateLoaders(),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("less")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'less'")]),s._v("),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sass")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v(", { "),t("span",{attrs:{class:"hljs-attr"}},[s._v("indentedSyntax")]),s._v(": "),t("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(" }),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("scss")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v("),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("stylus")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(",stylusOptions),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("styl")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(",stylusOptions)\n }\n}\n")])])}]}},qVBK:function(s,a,t){s.exports=t("rKy5")},rKy5:function(s,a,t){var l=t("VU/8")(null,t("OKj6"),null,null,null);s.exports=l.exports}}); \ No newline at end of file diff --git a/docs/js/7.139b877d5bf399c69213.js b/docs/js/7.139b877d5bf399c69213.js new file mode 100644 index 000000000..87b77feee --- /dev/null +++ b/docs/js/7.139b877d5bf399c69213.js @@ -0,0 +1 @@ +webpackJsonp([7],{"/i8g":function(s,a){s.exports={render:function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("section",[t("h2",{attrs:{id:"主题"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-主题-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 主题")]),s._v(" "),s._m(0),s._v(" "),s._m(1),s._v(" "),t("h3",{attrs:{id:"主题文件"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-主题文件-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 主题文件")]),s._v(" "),s._m(2),s._v(" "),s._m(3),s._v(" "),t("h3",{attrs:{id:"配置webpack"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-配置webpack-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 配置 webpack")]),s._v(" "),s._m(4),s._v(" "),s._m(5),s._v(" "),t("h3",{attrs:{id:"结果"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-结果-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 结果")]),s._v(" "),t("p",[s._v("这样修改自定义的主题文件内容,最终编译打包后的样式就是你需要的;而且这样也不存在样式冗余覆盖的问题,因为直接是对组件样式的变量做的修改,而不是采用传统的样式覆盖。")])])},staticRenderFns:[function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("移动端的组件对主题定制的需求会更多,从 "),t("code",{pre:!0},[s._v("cube-ui^1.0.2")]),s._v(" 开始,通过 webpack 工具可以实现自定义主题样式。")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[t("strong",[s._v("注意:")]),s._v(" 自定义主题依赖"),t("a",{attrs:{href:"#/zh-CN/docs/post-compile"}},[s._v("后编译")]),s._v("。")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("在你的项目的 "),t("code",{pre:!0},[s._v("src/")]),s._v(" 目录下创建一个 "),t("code",{pre:!0},[s._v("theme.styl")]),s._v(" 的文件,内容如下(展示的全是默认样式,你可以选择这针对不同组件做定制):")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("pre",{pre:!0},[t("code",{attrs:{"v-pre":"",class:"language-stylus"}},[t("span",{attrs:{class:"hljs-comment"}},[s._v("// 如果你需要使用 cube-ui 自带的颜色值 需要 require 进来")]),s._v("\n@require "),t("span",{attrs:{class:"hljs-string"}},[s._v('"~cube-ui/src/common/stylus/var/color.styl"')]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// action-sheet")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-space-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bg\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// picker style")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-picker-cancel-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-picker-cancel-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// button")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// primary")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// light")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-sss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-sss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-active-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-active-grey\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// outline")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// outline-primary")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// checked")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// disabled")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox hollow")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-hollow-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-hollow-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox-group")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-group-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-group-horizontal-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// radio")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-group-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-group-horizontal-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// selected")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-selected-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-selected-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// disabled")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// radio hollow")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-hollow-selected-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$radio")]),s._v("-hollow-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// dialog")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-background\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-close-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-highlight-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-highlight-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-orange-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-disabled-active-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btns-split-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// index-list")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-anchor-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-anchor-bgc := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#f7f7f7")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-item-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-item-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-nav-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-nav-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// picker")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-confirm-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-confirm-btn-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-cancel-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-cancel-btn-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-item-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// popup")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$popup")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bgc := rgb("),t("span",{attrs:{class:"hljs-number"}},[s._v("37")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("38")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("45")]),s._v(")\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$popup")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-opacity := ."),t("span",{attrs:{class:"hljs-number"}},[s._v("4")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// slide")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$slide")]),s._v("-dot-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$slide")]),s._v("-dot-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// tip")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$tip")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$tip")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// toast")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$toast")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$toast")]),s._v("-bgc := rgba("),t("span",{attrs:{class:"hljs-number"}},[s._v("37")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("38")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("45")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("0.9")]),s._v(")\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// upload")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("box-shadow")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" "),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(" "),t("span",{attrs:{class:"hljs-number"}},[s._v("6px")]),s._v(" "),t("span",{attrs:{class:"hljs-number"}},[s._v("2px")]),s._v(" "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#e5e5e5")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-remove-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := rgba("),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("0")]),s._v(", ."),t("span",{attrs:{class:"hljs-number"}},[s._v("8")]),s._v(")\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-remove-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-state-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bg\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-success-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-error-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#f43530")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-status-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$upload")]),s._v("-file-progress-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// switch")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$switch")]),s._v("-on-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$switch")]),s._v("-off-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$switch")]),s._v("-off-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#e4e4e4")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// input")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-focus-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-placeholder-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$input")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("clear")]),s._v("-icon-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("//textarea")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-focus-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-placeholder-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$textarea")]),s._v("-indicator-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// validator")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$validator")]),s._v("-msg-def-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#f5222d")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// select")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#b8b8b8")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-disabled-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("border")]),s._v("-active-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$select")]),s._v("-placeholder-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// swipe")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$swipe")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n")])])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("如果你的项目是用 vue-cli 生成的,那么找到 "),t("code",{pre:!0},[s._v("build/utils.js")]),s._v(" 中的 "),t("code",{pre:!0},[s._v("exports.cssLoaders")]),s._v(" 函数,改成如下:")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("pre",{pre:!0},[t("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("exports.cssLoaders = "),t("span",{attrs:{class:"hljs-function"}},[t("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" ("),t("span",{attrs:{class:"hljs-params"}},[s._v("options")]),s._v(") ")]),s._v("{\n options = options || {}\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" cssLoader = {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'css-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("minimize")]),s._v(": process.env.NODE_ENV === "),t("span",{attrs:{class:"hljs-string"}},[s._v("'production'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n }\n }\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" postcssLoader = {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'postcss-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n }\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// generate loader string to be used with extract text plugin")]),s._v("\n "),t("span",{attrs:{class:"hljs-function"}},[t("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" "),t("span",{attrs:{class:"hljs-title"}},[s._v("generateLoaders")]),s._v(" ("),t("span",{attrs:{class:"hljs-params"}},[s._v("loader, loaderOptions")]),s._v(") ")]),s._v("{\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("if")]),s._v(" (loader) {\n loaders.push({\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": loader + "),t("span",{attrs:{class:"hljs-string"}},[s._v("'-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": "),t("span",{attrs:{class:"hljs-built_in"}},[s._v("Object")]),s._v(".assign({}, loaderOptions, {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n })\n })\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// Extract CSS when that option is specified")]),s._v("\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// (which is the case during production build)")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("if")]),s._v(" (options.extract) {\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" ExtractTextPlugin.extract({\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("use")]),s._v(": loaders,\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("fallback")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'vue-style-loader'")]),s._v("\n })\n } "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("else")]),s._v(" {\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" ["),t("span",{attrs:{class:"hljs-string"}},[s._v("'vue-style-loader'")]),s._v("].concat(loaders)\n }\n }\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" stylusOptions = {\n "),t("span",{attrs:{class:"hljs-string"}},[s._v("'resolve url'")]),s._v(": "),t("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(",\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// 这里 新增 import 配置项,指向自定义主题文件")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(": [path.resolve(__dirname, "),t("span",{attrs:{class:"hljs-string"}},[s._v("'../src/theme'")]),s._v(")]\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// https://vue-loader.vuejs.org/en/configurations/extract-css.html")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("css")]),s._v(": generateLoaders(),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("postcss")]),s._v(": generateLoaders(),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("less")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'less'")]),s._v("),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sass")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v(", { "),t("span",{attrs:{class:"hljs-attr"}},[s._v("indentedSyntax")]),s._v(": "),t("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(" }),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("scss")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v("),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("stylus")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(",stylusOptions),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("styl")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(",stylusOptions)\n }\n}\n")])])}]}},"7PUU":function(s,a,t){s.exports=t("rIIE")},rIIE:function(s,a,t){var l=t("VU/8")(null,t("/i8g"),null,null,null);s.exports=l.exports}}); \ No newline at end of file diff --git a/docs/js/7.41684fe6a0ef25d82a0e.js b/docs/js/7.41684fe6a0ef25d82a0e.js deleted file mode 100644 index a80777071..000000000 --- a/docs/js/7.41684fe6a0ef25d82a0e.js +++ /dev/null @@ -1 +0,0 @@ -webpackJsonp([7],{"/i8g":function(s,a){s.exports={render:function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("section",[t("h2",{attrs:{id:"主题"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-主题-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 主题")]),s._v(" "),s._m(0),s._v(" "),s._m(1),s._v(" "),t("h3",{attrs:{id:"主题文件"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-主题文件-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 主题文件")]),s._v(" "),s._m(2),s._v(" "),s._m(3),s._v(" "),t("h3",{attrs:{id:"配置webpack"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-配置webpack-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 配置 webpack")]),s._v(" "),s._m(4),s._v(" "),s._m(5),s._v(" "),t("h3",{attrs:{id:"结果"}},[t("a",{staticClass:"anchor",attrs:{href:"#cube-结果-anchor","aria-hidden":"true"}},[t("svg",{attrs:{"aria-hidden":"true",height:"16",version:"1.1",viewBox:"0 0 16 16",width:"16"}},[t("path",{attrs:{"fill-rule":"evenodd",d:"M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"}})])]),s._v(" 结果")]),s._v(" "),t("p",[s._v("这样修改自定义的主题文件内容,最终编译打包后的样式就是你需要的;而且这样也不存在样式冗余覆盖的问题,因为直接是对组件样式的变量做的修改,而不是采用传统的样式覆盖。")])])},staticRenderFns:[function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("移动端的组件对主题定制的需求会更多,从 "),t("code",{pre:!0},[s._v("cube-ui^1.0.2")]),s._v(" 开始,通过 webpack 工具可以实现自定义主题样式。")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[t("strong",[s._v("注意:")]),s._v(" 自定义主题依赖"),t("a",{attrs:{href:"#/zh-CN/docs/post-compile"}},[s._v("后编译")]),s._v("。")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("在你的项目的 "),t("code",{pre:!0},[s._v("src/")]),s._v(" 目录下创建一个 "),t("code",{pre:!0},[s._v("theme.styl")]),s._v(" 的文件,内容如下(展示的全是默认样式,你可以选择这针对不同组件做定制):")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("pre",{pre:!0},[t("code",{attrs:{"v-pre":"",class:"language-stylus"}},[t("span",{attrs:{class:"hljs-comment"}},[s._v("// 如果你需要使用 cube-ui 自带的颜色值 需要 require 进来")]),s._v("\n@require "),t("span",{attrs:{class:"hljs-string"}},[s._v('"~cube-ui/src/common/stylus/var/color.styl"')]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// action-sheet")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-space-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bg\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// picker style")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-picker-cancel-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$action")]),s._v("-sheet-picker-cancel-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// button")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-disabled-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// primary")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-primary-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// light")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-sss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-sss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-active-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-light-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-active-grey\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// outline")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline-color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// outline-primary")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange-opacity\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$btn")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("outline")]),s._v("-primary-active-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// checked")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-checked-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("/// disabled")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-ss\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// checkbox-group")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$checkbox")]),s._v("-group-horizontal-bdc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// dialog")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-color := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-regular-blue\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("icon")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-background\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-close-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-highlight-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-highlight-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-orange-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-disabled-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btn-disabled-active-bgc := transparent\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$dialog")]),s._v("-btns-split-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-row-line\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// index-list")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-anchor-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-anchor-bgc := "),t("span",{attrs:{class:"hljs-number"}},[s._v("#f7f7f7")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-item-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-item-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-nav-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$index")]),s._v("-list-nav-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// picker")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-title-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-confirm-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-confirm-btn-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-orange\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-cancel-btn-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-cancel-btn-active-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$picker")]),s._v("-item-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// popup")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$popup")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-bgc := rgb("),t("span",{attrs:{class:"hljs-number"}},[s._v("37")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("38")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("45")]),s._v(")\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$popup")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("mask")]),s._v("-opacity := ."),t("span",{attrs:{class:"hljs-number"}},[s._v("4")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// slide")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$slide")]),s._v("-dot-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$slide")]),s._v("-dot-active-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-orange\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// tip")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$tip")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-white\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$tip")]),s._v("-bgc := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-dark-grey-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("opacity")]),s._v("\n\n"),t("span",{attrs:{class:"hljs-comment"}},[s._v("// toast")]),s._v("\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$toast")]),s._v("-"),t("span",{attrs:{class:"hljs-attribute"}},[s._v("color")]),s._v(" := "),t("span",{attrs:{class:"hljs-variable"}},[s._v("$color")]),s._v("-light-grey-s\n"),t("span",{attrs:{class:"hljs-variable"}},[s._v("$toast")]),s._v("-bgc := rgba("),t("span",{attrs:{class:"hljs-number"}},[s._v("37")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("38")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("45")]),s._v(", "),t("span",{attrs:{class:"hljs-number"}},[s._v("0.9")]),s._v(")\n")])])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("p",[s._v("如果你的项目是用 vue-cli 生成的,那么找到 "),t("code",{pre:!0},[s._v("build/utils.js")]),s._v(" 中的 "),t("code",{pre:!0},[s._v("exports.cssLoaders")]),s._v(" 函数,改成如下:")])},function(){var s=this,a=s.$createElement,t=s._self._c||a;return t("pre",{pre:!0},[t("code",{attrs:{"v-pre":"",class:"language-js"}},[s._v("exports.cssLoaders = "),t("span",{attrs:{class:"hljs-function"}},[t("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" ("),t("span",{attrs:{class:"hljs-params"}},[s._v("options")]),s._v(") ")]),s._v("{\n options = options || {}\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" cssLoader = {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'css-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("minimize")]),s._v(": process.env.NODE_ENV === "),t("span",{attrs:{class:"hljs-string"}},[s._v("'production'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n }\n }\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("var")]),s._v(" postcssLoader = {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'postcss-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n }\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// generate loader string to be used with extract text plugin")]),s._v("\n "),t("span",{attrs:{class:"hljs-function"}},[t("span",{attrs:{class:"hljs-keyword"}},[s._v("function")]),s._v(" "),t("span",{attrs:{class:"hljs-title"}},[s._v("generateLoaders")]),s._v(" ("),t("span",{attrs:{class:"hljs-params"}},[s._v("loader, loaderOptions")]),s._v(") ")]),s._v("{\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" loaders = options.usePostCSS ? [cssLoader, postcssLoader] : [cssLoader]\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("if")]),s._v(" (loader) {\n loaders.push({\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("loader")]),s._v(": loader + "),t("span",{attrs:{class:"hljs-string"}},[s._v("'-loader'")]),s._v(",\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("options")]),s._v(": "),t("span",{attrs:{class:"hljs-built_in"}},[s._v("Object")]),s._v(".assign({}, loaderOptions, {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sourceMap")]),s._v(": options.sourceMap\n })\n })\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// Extract CSS when that option is specified")]),s._v("\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// (which is the case during production build)")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("if")]),s._v(" (options.extract) {\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" ExtractTextPlugin.extract({\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("use")]),s._v(": loaders,\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("fallback")]),s._v(": "),t("span",{attrs:{class:"hljs-string"}},[s._v("'vue-style-loader'")]),s._v("\n })\n } "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("else")]),s._v(" {\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" ["),t("span",{attrs:{class:"hljs-string"}},[s._v("'vue-style-loader'")]),s._v("].concat(loaders)\n }\n }\n\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("const")]),s._v(" stylusOptions = {\n "),t("span",{attrs:{class:"hljs-string"}},[s._v("'resolve url'")]),s._v(": "),t("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(",\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// 这里 新增 import 配置项,指向自定义主题文件")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("import")]),s._v(": [path.resolve(__dirname, "),t("span",{attrs:{class:"hljs-string"}},[s._v("'../src/theme'")]),s._v(")]\n }\n\n "),t("span",{attrs:{class:"hljs-comment"}},[s._v("// https://vue-loader.vuejs.org/en/configurations/extract-css.html")]),s._v("\n "),t("span",{attrs:{class:"hljs-keyword"}},[s._v("return")]),s._v(" {\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("css")]),s._v(": generateLoaders(),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("postcss")]),s._v(": generateLoaders(),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("less")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'less'")]),s._v("),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("sass")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v(", { "),t("span",{attrs:{class:"hljs-attr"}},[s._v("indentedSyntax")]),s._v(": "),t("span",{attrs:{class:"hljs-literal"}},[s._v("true")]),s._v(" }),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("scss")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'sass'")]),s._v("),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("stylus")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(",stylusOptions),\n "),t("span",{attrs:{class:"hljs-attr"}},[s._v("styl")]),s._v(": generateLoaders("),t("span",{attrs:{class:"hljs-string"}},[s._v("'stylus'")]),s._v(",stylusOptions)\n }\n}\n")])])}]}},"7PUU":function(s,a,t){s.exports=t("rIIE")},rIIE:function(s,a,t){var l=t("VU/8")(null,t("/i8g"),null,null,null);s.exports=l.exports}}); \ No newline at end of file diff --git a/docs/js/manifest.c4b540ebff9e906bfc44.js b/docs/js/manifest.0890d26f92e48f2191fd.js similarity index 67% rename from docs/js/manifest.c4b540ebff9e906bfc44.js rename to docs/js/manifest.0890d26f92e48f2191fd.js index afdc6920a..637afb8ea 100644 --- a/docs/js/manifest.c4b540ebff9e906bfc44.js +++ b/docs/js/manifest.0890d26f92e48f2191fd.js @@ -1 +1 @@ -!function(e){function c(a){if(f[a])return f[a].exports;var d=f[a]={i:a,l:!1,exports:{}};return e[a].call(d.exports,d,d.exports,c),d.l=!0,d.exports}var a=window.webpackJsonp;window.webpackJsonp=function(f,b,n){for(var r,t,o,u=0,i=[];u