diff --git a/Gruntfile.js b/Gruntfile.js index d20b063de..8b8c96483 100644 --- a/Gruntfile.js +++ b/Gruntfile.js @@ -131,7 +131,7 @@ module.exports = function (grunt) { }, watch: { scripts: { - files: ['src/**/*.js', 'demo/**/*.js', 'demo/**/*.less'], + files: ['src/**/*.js', 'demo/js/**/*.js', 'demo/less/**/*.less'], tasks: ['less', 'concat'], options: { spanw: true, diff --git a/demo.html b/demo.html index d0b0cdd45..52ce5e093 100644 --- a/demo.html +++ b/demo.html @@ -19,5 +19,8 @@
+ + \ No newline at end of file diff --git a/demo/css/index.css b/demo/css/index.css new file mode 100644 index 000000000..2f6491e13 --- /dev/null +++ b/demo/css/index.css @@ -0,0 +1,3 @@ +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ diff --git a/demo/css/main.css b/demo/css/main.css index beaf06ad6..b8d1bc014 100644 --- a/demo/css/main.css +++ b/demo/css/main.css @@ -1,3 +1,6 @@ +* { + font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif; +} .demo-main .bg1 { background-color: #178cdf; } diff --git a/demo/css/north.css b/demo/css/north.css index eeb774681..ffd6fe0a3 100644 --- a/demo/css/north.css +++ b/demo/css/north.css @@ -1,3 +1,13 @@ +/****添加计算宽度的--运算符直接需要space****/ +/****** common color(常用颜色,可用于普遍场景) *****/ +/**** custom color(自定义颜色,用于特定场景) ****/ .demo-north { background-color: #3c8dbc; } +.demo-north .logo { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + color: #ffffff; + background-color: #367fa9; + font-size: 20px; + font-weight: 300; +} diff --git a/demo/js/center.js b/demo/js/center.js index a17b0ed41..bab672ea6 100644 --- a/demo/js/center.js +++ b/demo/js/center.js @@ -7,48 +7,14 @@ Demo.Center = BI.inherit(BI.Widget, { }, render: function () { return { - type: "bi.vertical", - hgap: 50, - vgap: 20, - items: [{ - type: "bi.label", - text: "栅格布局", - height: 50 - }, { - type: "bi.lattice", - columnSize: [0.1, 0.1, 0.3, 0.4, 0.1], - items: [{ + type: "bi.tab", + defaultShowIndex: 0, + cardCreator: function (v) { + return BI.createWidget({ type: "bi.label", - height: 30, - text: "Left-1", - cls: "layout-bg1 lattice-item", - hgap: 20 - }, { - type: "bi.label", - height: 30, - text: "Left-2", - cls: "layout-bg2 lattice-item", - hgap: 20 - }, { - type: "bi.label", - height: 30, - text: "Left-3", - cls: "layout-bg3 lattice-item", - hgap: 20 - }, { - type: "bi.label", - height: 30, - text: "Left-4", - cls: "layout-bg4 lattice-item", - hgap: 20 - }, { - type: "bi.label", - height: 30, - text: "Left-5", - cls: "layout-bg5 lattice-item", - hgap: 20 - }] - }] + text: v + }); + } } }, created: function () { diff --git a/demo/js/north.js b/demo/js/north.js index d341767e6..f45c41f41 100644 --- a/demo/js/north.js +++ b/demo/js/north.js @@ -3,7 +3,22 @@ Demo.North = BI.inherit(BI.Widget, { baseCls: "demo-north" }, render: function () { - + return { + type: "bi.htape", + items: [{ + width: 230, + el: { + type: "bi.label", + cls: "logo", + height: 50, + text: "FineUI" + } + }, { + el: { + type: "bi.layout" + } + }] + } } }); $.shortcut("demo.north", Demo.North); \ No newline at end of file diff --git a/demo/less/index.less b/demo/less/index.less new file mode 100644 index 000000000..0a07bdf29 --- /dev/null +++ b/demo/less/index.less @@ -0,0 +1 @@ +@import "../../src/less/bibase"; \ No newline at end of file diff --git a/demo/less/main.less b/demo/less/main.less index 768d2220e..263f68859 100644 --- a/demo/less/main.less +++ b/demo/less/main.less @@ -1,3 +1,7 @@ +* { + font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, sans-serif; +} + .demo-main { & .bg1 { background-color: #178cdf; diff --git a/demo/less/north.less b/demo/less/north.less index e07dfda88..1991671f5 100644 --- a/demo/less/north.less +++ b/demo/less/north.less @@ -1,3 +1,12 @@ -.demo-north{ +@import "index"; + +.demo-north { background-color: #3c8dbc; + & .logo { + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + color: @color-bi-text; + background-color: #367fa9; + font-size: 20px; + font-weight: 300; + } } \ No newline at end of file