layout/index.html at gh-pages · xthsky/layout · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<!doctype html>
<meta charset="utf-8">
<title>Responsive Layout Generator - Brix Style</title>
<link rel="stylesheet" href="style-min.css">

<p id="r-support">Chrome最新版测试通过</p>
<div id="r-topbar">
    <h1>Responsive Layout Generator</h1>
    <div class="r-btn-group">
        <a bx id="r-config"><span class="iconfont">&#355</span>配置</a>
        <a bx id="r-preview" target="_blank"><span class="iconfont">&#348</span>预览</a>
        <a bx id="r-save"><span class="iconfont">&#342</span>保存</a>
        <a bx id="r-output"><span class="iconfont">&#288</span>输出</a>
    </div>
</div>
<div id="r-ruler">
    <span style="width: 100px">适配尺寸</span>
    <span class="split" style="left: 100px">0</span>
    <span style="width: 720px">平板竖屏</span>
    <span class="split" style="left: 820px">720px</span>
    <span style="width: 240px">平板横屏</span>
    <span class="split" style="left: 1060px">960px</span>
    <span style="width: 240px">笔记本电脑</span>
    <span class="split" style="left: 1300px">1200px</span>
    <span style="width: 240px">桌面电脑</span>
    <span class="split" style="left: 1540px">1440px</span>
    <span style="width: 240px">宽屏电脑</span>
    <span class="split" style="left: 1780px">1680px</span>
</div>
<div bx id="r-resolution"></div>
<div bx id="r-content">
    <a id="r-add-section"><s class="plus">+</s>添加区域</a>
</div>

<script id="r-tmpl-section" type="text/template">
    <div class="r-section-bg row">{bgs}</div>
    <div class="r-section">
        <div class="r-section-bd row">{divs}</div>
        <div class="r-section-panel">
            <a class="r-add-div" title="添加区块">+</a>
            <a class="r-remove-section">&times;</a>
        </div>
    </div>
</script>
<script id="r-tmpl-div" type="text/template">
    <div class="{cls}">
        <a class="r-remove-div">&times;</a>
        <span class="r-div-size" contenteditable>190x100</span>
        <p class="r-div-name" contenteditable>{id}</p>
    </div>
</script>

<script src="http://a.tbcdn.cn/s/kissy/1.2.0/kissy.js"></script>
<!--<script src="http://a.tbcdn.cn/s/kissy/1.3.0rc/kissy-min.js"></script>-->
<script>
var TAG = '20120904';
if ( -1 === location.search.indexOf('mode=dev') ) {
    document.write('<scr' + 'ipt src="modules-min.js?t=' + TAG + '"></scr' + 'ipt>');
} else {
    KISSY.config({
        packages: [
            {
                name: 'modules',
                path: '.',
                tag: TAG
            }
        ]
        /* 1.3rc
        packages: {
            modules: {
                base: '.',
                debug: true,
                tag: TAG
            }
        }
        */
    });
}
</script>
<script>
var App = {
    appVer: '0.0.1',
    grid: {
        c: 10, // 列宽
        g: 10  // 槽宽
    },
    resolution: {
        base: 960,
        all: [720, 1024, 960, 1280, 1200, 1680, 1440, 1920, 1680]
    },
    struct: [[]],
};
KISSY.use('modules/boot, modules/pagelet', function(S, Boot, Pagelet) {
    Boot();
    Pagelet.init();
});
</script>