pakyow 0.8rc1 → 0.8.rc4
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +7 -0
- data/bin/pakyow +18 -0
- data/lib/commands/USAGE +9 -0
- data/lib/commands/USAGE-CONSOLE +12 -0
- data/lib/commands/USAGE-NEW +11 -0
- data/lib/commands/USAGE-SERVER +16 -0
- data/lib/commands/console.rb +17 -0
- data/lib/commands/server.rb +27 -0
- data/lib/generators/pakyow/app/app_generator.rb +58 -0
- data/lib/generators/pakyow/app/templates/Gemfile +8 -0
- data/lib/generators/pakyow/app/templates/README.md +20 -0
- data/lib/generators/pakyow/app/templates/app.rb +26 -0
- data/lib/generators/pakyow/app/templates/app/lib/bindings.rb +3 -0
- data/lib/generators/pakyow/app/templates/app/lib/helpers.rb +3 -0
- data/lib/generators/pakyow/app/templates/app/lib/routes.rb +8 -0
- data/lib/generators/pakyow/app/templates/app/views/_templates/pakyow.html +17 -0
- data/lib/generators/pakyow/app/templates/config.ru +5 -0
- data/lib/generators/pakyow/app/templates/public/favicon.ico +0 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/CHANGES +3 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/README.md +3 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/VERSION +1 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/examples/extension.css +7 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/examples/structure-fluid.html +150 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/examples/structure.html +156 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/examples/styled.html +114 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/reset.css +48 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/structure.css +264 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/style.css +219 -0
- data/lib/generators/pakyow/app/templates/public/pakyow-css/syntax.css +90 -0
- data/lib/generators/pakyow/app/templates/rakefile +4 -0
- metadata +66 -27
@@ -0,0 +1,156 @@
|
|
1
|
+
<!DOCTYPE html>
|
2
|
+
<html>
|
3
|
+
<head>
|
4
|
+
<title>Pakyow CSS</title>
|
5
|
+
<link rel="stylesheet" type="text/css" href="../structure.css">
|
6
|
+
<link rel="stylesheet" type="text/css" href="extension.css">
|
7
|
+
</head>
|
8
|
+
|
9
|
+
<body>
|
10
|
+
<div class="container">
|
11
|
+
<h1>1 Column</h1>
|
12
|
+
|
13
|
+
<div class="container-1">
|
14
|
+
<div class="col">
|
15
|
+
column1
|
16
|
+
</div>
|
17
|
+
</div>
|
18
|
+
</div>
|
19
|
+
|
20
|
+
<div class="container">
|
21
|
+
<h1>2 Columns</h1>
|
22
|
+
|
23
|
+
<div class="container-2">
|
24
|
+
<div class="col">
|
25
|
+
column1
|
26
|
+
</div>
|
27
|
+
|
28
|
+
<div class="col">
|
29
|
+
column2
|
30
|
+
</div>
|
31
|
+
</div>
|
32
|
+
</div>
|
33
|
+
|
34
|
+
<div class="container">
|
35
|
+
<h1>3 Columns</h1>
|
36
|
+
|
37
|
+
<div class="container-3">
|
38
|
+
<div class="col">
|
39
|
+
column1
|
40
|
+
</div>
|
41
|
+
|
42
|
+
<div class="col">
|
43
|
+
column2
|
44
|
+
</div>
|
45
|
+
|
46
|
+
<div class="col">
|
47
|
+
column3
|
48
|
+
</div>
|
49
|
+
</div>
|
50
|
+
</div>
|
51
|
+
|
52
|
+
<div class="container">
|
53
|
+
<h1>4 Columns</h1>
|
54
|
+
|
55
|
+
<div class="container-4">
|
56
|
+
<div class="col">
|
57
|
+
column1
|
58
|
+
</div>
|
59
|
+
|
60
|
+
<div class="col">
|
61
|
+
column2
|
62
|
+
</div>
|
63
|
+
|
64
|
+
<div class="col">
|
65
|
+
column3
|
66
|
+
</div>
|
67
|
+
|
68
|
+
<div class="col">
|
69
|
+
column4
|
70
|
+
</div>
|
71
|
+
</div>
|
72
|
+
</div>
|
73
|
+
|
74
|
+
<div class="container">
|
75
|
+
<h1>5 Columns</h1>
|
76
|
+
|
77
|
+
<div class="container-5">
|
78
|
+
<div class="col">
|
79
|
+
column1
|
80
|
+
</div>
|
81
|
+
|
82
|
+
<div class="col">
|
83
|
+
column2
|
84
|
+
</div>
|
85
|
+
|
86
|
+
<div class="col">
|
87
|
+
column3
|
88
|
+
</div>
|
89
|
+
|
90
|
+
<div class="col">
|
91
|
+
column4
|
92
|
+
</div>
|
93
|
+
|
94
|
+
<div class="col">
|
95
|
+
column5
|
96
|
+
</div>
|
97
|
+
</div>
|
98
|
+
</div>
|
99
|
+
|
100
|
+
<div class="container">
|
101
|
+
<h1>Resizing Columns</h1>
|
102
|
+
|
103
|
+
<div class="container-2">
|
104
|
+
<div class="col r-3-2">
|
105
|
+
max
|
106
|
+
</div>
|
107
|
+
|
108
|
+
<div class="col r-3-1">
|
109
|
+
min
|
110
|
+
</div>
|
111
|
+
</div>
|
112
|
+
|
113
|
+
<div class="container-3">
|
114
|
+
<div class="col r-4-1">
|
115
|
+
min
|
116
|
+
</div>
|
117
|
+
|
118
|
+
<div class="col r-4-1">
|
119
|
+
min
|
120
|
+
</div>
|
121
|
+
|
122
|
+
<div class="col r-4-2">
|
123
|
+
max
|
124
|
+
</div>
|
125
|
+
</div>
|
126
|
+
|
127
|
+
<div class="container-3">
|
128
|
+
<div class="col r-5-1">
|
129
|
+
min
|
130
|
+
</div>
|
131
|
+
|
132
|
+
<div class="col r-5-3">
|
133
|
+
max
|
134
|
+
</div>
|
135
|
+
|
136
|
+
<div class="col r-5-1">
|
137
|
+
min
|
138
|
+
</div>
|
139
|
+
</div>
|
140
|
+
</div>
|
141
|
+
|
142
|
+
<div class="container">
|
143
|
+
<h1>Flows</h1>
|
144
|
+
|
145
|
+
<div class="container flow">
|
146
|
+
<div class="col">
|
147
|
+
col1
|
148
|
+
</div>
|
149
|
+
|
150
|
+
<div class="col">
|
151
|
+
some longer content
|
152
|
+
</div>
|
153
|
+
</div>
|
154
|
+
</div>
|
155
|
+
</body>
|
156
|
+
</html>
|
@@ -0,0 +1,114 @@
|
|
1
|
+
<!DOCTYPE html>
|
2
|
+
<html>
|
3
|
+
<head>
|
4
|
+
<title>Pakyow CSS</title>
|
5
|
+
<link rel="stylesheet" type="text/css" href="../structure.css">
|
6
|
+
<link rel="stylesheet" type="text/css" href="../style.css">
|
7
|
+
<link rel="stylesheet" type="text/css" href="extension.css">
|
8
|
+
</head>
|
9
|
+
|
10
|
+
<body>
|
11
|
+
<div class="container">
|
12
|
+
<h1>This is a big header.</h1>
|
13
|
+
|
14
|
+
<p>
|
15
|
+
Like you, I used to think the world was this great place where everybody lived by the same standards I did,
|
16
|
+
then some kid with a nail showed me I was living in his world, a world where chaos rules not order, a world
|
17
|
+
where righteousness is not rewarded. That's Cesar's world, and if you're not willing to play by his rules,
|
18
|
+
then you're gonna have to pay the price.
|
19
|
+
</p>
|
20
|
+
|
21
|
+
|
22
|
+
<h2>This is a sorta big header.</h2>
|
23
|
+
|
24
|
+
<p>
|
25
|
+
The lysine contingency - it's intended to prevent the spread of the animals is case they ever got off the
|
26
|
+
island. Dr. Wu inserted a gene that makes a single faulty enzyme in protein metabolism. The animals can't
|
27
|
+
manufacture the amino acid lysine. Unless they're continually supplied with lysine by us, they'll slip
|
28
|
+
into a coma and die.
|
29
|
+
</p>
|
30
|
+
|
31
|
+
|
32
|
+
<h3>This is a medium size header.</h3>
|
33
|
+
|
34
|
+
<p>
|
35
|
+
You think water moves fast? You should see ice. It moves like it has a mind. Like it knows it killed the
|
36
|
+
world once and got a taste for murder. After the avalanche, it took us a week to climb out. Now, I don't
|
37
|
+
know exactly when we turned on each other, but I know that seven of us survived the slide... and only
|
38
|
+
five made it out. Now we took an oath, that I'm breaking now. We said we'd say it was the snow that
|
39
|
+
killed the other two, but it wasn't. Nature is lethal but it doesn't hold a candle to man.
|
40
|
+
</p>
|
41
|
+
|
42
|
+
|
43
|
+
<h4>This is a small header.</h4>
|
44
|
+
|
45
|
+
<p>
|
46
|
+
You see? It's curious. Ted did figure it out - time travel. And when we get back, we gonna tell
|
47
|
+
everyone. How it's possible, how it's done, what the dangers are. But then why fifty years in the future
|
48
|
+
when the spacecraft encounters a black hole does the computer call it an 'unknown entry event'? Why don't
|
49
|
+
they know? If they don't know, that means we never told anyone. And if we never told anyone it means we
|
50
|
+
never made it back. Hence we die down here. Just as a matter of deductive logic.
|
51
|
+
</p>
|
52
|
+
|
53
|
+
|
54
|
+
<h4>Unordered List</h4>
|
55
|
+
|
56
|
+
<ul>
|
57
|
+
<li>Item 1</li>
|
58
|
+
<li>
|
59
|
+
Item 2
|
60
|
+
|
61
|
+
<ul>
|
62
|
+
<li>Sub Item 1</li>
|
63
|
+
</ul>
|
64
|
+
</li>
|
65
|
+
<li>Item 3</li>
|
66
|
+
</ul>
|
67
|
+
|
68
|
+
<h4>Ordered List</h4>
|
69
|
+
|
70
|
+
<ol>
|
71
|
+
<li>Item 1</li>
|
72
|
+
<li>Item 2</li>
|
73
|
+
<li>Item 3</li>
|
74
|
+
</ol>
|
75
|
+
|
76
|
+
<h4>Horizontal List</h4>
|
77
|
+
|
78
|
+
<ul class="horizontal">
|
79
|
+
<li>Item 1</li>
|
80
|
+
<li>Item 2</li>
|
81
|
+
<li>Item 3</li>
|
82
|
+
</ul>
|
83
|
+
</div>
|
84
|
+
|
85
|
+
<div class="container">
|
86
|
+
<h1>Forms</h1>
|
87
|
+
|
88
|
+
<fieldset>
|
89
|
+
<ul>
|
90
|
+
<li>
|
91
|
+
<label>A Field</label>
|
92
|
+
<input type="text">
|
93
|
+
</li>
|
94
|
+
|
95
|
+
<li class="container-2">
|
96
|
+
<div class="col">
|
97
|
+
<label>Inline Field</label>
|
98
|
+
<input type="text">
|
99
|
+
</div>
|
100
|
+
|
101
|
+
<div class="col">
|
102
|
+
<label>Another Inline Field</label>
|
103
|
+
<input type="text">
|
104
|
+
</div>
|
105
|
+
</li>
|
106
|
+
|
107
|
+
<li>
|
108
|
+
<button>Foo</button>
|
109
|
+
</li>
|
110
|
+
</ul>
|
111
|
+
</fieldset>
|
112
|
+
</div>
|
113
|
+
</body>
|
114
|
+
</html>
|
@@ -0,0 +1,48 @@
|
|
1
|
+
/* http://meyerweb.com/eric/tools/css/reset/
|
2
|
+
v2.0 | 20110126
|
3
|
+
License: none (public domain)
|
4
|
+
*/
|
5
|
+
|
6
|
+
html, body, div, span, applet, object, iframe,
|
7
|
+
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
8
|
+
a, abbr, acronym, address, big, cite, code,
|
9
|
+
del, dfn, em, img, ins, kbd, q, s, samp,
|
10
|
+
small, strike, strong, sub, sup, tt, var,
|
11
|
+
b, u, i, center,
|
12
|
+
dl, dt, dd, ol, ul, li,
|
13
|
+
fieldset, form, label, legend,
|
14
|
+
table, caption, tbody, tfoot, thead, tr, th, td,
|
15
|
+
article, aside, canvas, details, embed,
|
16
|
+
figure, figcaption, footer, header, hgroup,
|
17
|
+
menu, nav, output, ruby, section, summary,
|
18
|
+
time, mark, audio, video {
|
19
|
+
margin: 0;
|
20
|
+
padding: 0;
|
21
|
+
border: 0;
|
22
|
+
font-size: 100%;
|
23
|
+
font: inherit;
|
24
|
+
vertical-align: baseline;
|
25
|
+
}
|
26
|
+
/* HTML5 display-role reset for older browsers */
|
27
|
+
article, aside, details, figcaption, figure,
|
28
|
+
footer, header, hgroup, menu, nav, section {
|
29
|
+
display: block;
|
30
|
+
}
|
31
|
+
body {
|
32
|
+
line-height: 1;
|
33
|
+
}
|
34
|
+
ol, ul {
|
35
|
+
list-style: none;
|
36
|
+
}
|
37
|
+
blockquote, q {
|
38
|
+
quotes: none;
|
39
|
+
}
|
40
|
+
blockquote:before, blockquote:after,
|
41
|
+
q:before, q:after {
|
42
|
+
content: '';
|
43
|
+
content: none;
|
44
|
+
}
|
45
|
+
table {
|
46
|
+
border-collapse: collapse;
|
47
|
+
border-spacing: 0;
|
48
|
+
}
|
@@ -0,0 +1,264 @@
|
|
1
|
+
/*****************************
|
2
|
+
Positioning
|
3
|
+
*****************************/
|
4
|
+
|
5
|
+
.float-right, .float-r {
|
6
|
+
float: right;
|
7
|
+
}
|
8
|
+
|
9
|
+
.float-left, .float-l {
|
10
|
+
float: left;
|
11
|
+
}
|
12
|
+
|
13
|
+
.align-right, .align-r {
|
14
|
+
text-align: right;
|
15
|
+
}
|
16
|
+
|
17
|
+
.align-left, .align-l {
|
18
|
+
text-align: left;
|
19
|
+
}
|
20
|
+
|
21
|
+
.align-center, .align-c {
|
22
|
+
text-align:center;
|
23
|
+
}
|
24
|
+
|
25
|
+
.hidden {
|
26
|
+
display: none;
|
27
|
+
}
|
28
|
+
|
29
|
+
.clear {
|
30
|
+
clear: both;
|
31
|
+
}
|
32
|
+
|
33
|
+
.clear-left, .clear-l {
|
34
|
+
clear: left;
|
35
|
+
}
|
36
|
+
|
37
|
+
.clear-right, .clear-r {
|
38
|
+
clear: right;
|
39
|
+
}
|
40
|
+
|
41
|
+
/*****************************
|
42
|
+
Relational
|
43
|
+
*****************************/
|
44
|
+
|
45
|
+
.margin {
|
46
|
+
margin:20px;
|
47
|
+
}
|
48
|
+
|
49
|
+
.margin-t {
|
50
|
+
margin-top:20px;
|
51
|
+
}
|
52
|
+
|
53
|
+
.margin-b {
|
54
|
+
margin-bottom:20px;
|
55
|
+
}
|
56
|
+
|
57
|
+
.margin-r {
|
58
|
+
margin-right:20px;
|
59
|
+
}
|
60
|
+
|
61
|
+
.margin-l {
|
62
|
+
margin-left:20px;
|
63
|
+
}
|
64
|
+
|
65
|
+
/*****************************
|
66
|
+
Structure
|
67
|
+
*****************************/
|
68
|
+
|
69
|
+
*[class*="container"] {
|
70
|
+
width:940px;
|
71
|
+
margin-left:auto;
|
72
|
+
margin-right:auto;
|
73
|
+
}
|
74
|
+
|
75
|
+
*[class*="container"]:before, *[class*="container"]:after {
|
76
|
+
display: table;
|
77
|
+
content: "";
|
78
|
+
}
|
79
|
+
|
80
|
+
*[class*="container"]:after {
|
81
|
+
clear: both;
|
82
|
+
}
|
83
|
+
|
84
|
+
*[class*="container"] .col, .container-1 .col {
|
85
|
+
width:940px;
|
86
|
+
}
|
87
|
+
|
88
|
+
.container-2 [class*="col"] {
|
89
|
+
width:460px;
|
90
|
+
}
|
91
|
+
|
92
|
+
.container-3 .col {
|
93
|
+
width:300px;
|
94
|
+
}
|
95
|
+
|
96
|
+
.container-4 .col {
|
97
|
+
width:220px;
|
98
|
+
}
|
99
|
+
|
100
|
+
.container-5 .col {
|
101
|
+
width:172px;
|
102
|
+
}
|
103
|
+
|
104
|
+
*[class*="col"] {
|
105
|
+
float:left;
|
106
|
+
margin-left:20px;
|
107
|
+
}
|
108
|
+
|
109
|
+
*[class*="col"]:first-child {
|
110
|
+
margin-left:0;
|
111
|
+
}
|
112
|
+
|
113
|
+
/* Resized Columns */
|
114
|
+
|
115
|
+
.col.r-3-1 {
|
116
|
+
width:300px;
|
117
|
+
}
|
118
|
+
|
119
|
+
.col.r-3-2 {
|
120
|
+
width:620px;
|
121
|
+
}
|
122
|
+
|
123
|
+
.col.r-4-1 {
|
124
|
+
width:220px;
|
125
|
+
}
|
126
|
+
|
127
|
+
.col.r-4-2 {
|
128
|
+
width:460px;
|
129
|
+
}
|
130
|
+
|
131
|
+
.col.r-4-3 {
|
132
|
+
width:700px;
|
133
|
+
}
|
134
|
+
|
135
|
+
.col.r-5-1 {
|
136
|
+
width:172px;
|
137
|
+
}
|
138
|
+
|
139
|
+
.col.r-5-2 {
|
140
|
+
width:364px;
|
141
|
+
}
|
142
|
+
|
143
|
+
.col.r-5-3 {
|
144
|
+
width:556px;
|
145
|
+
}
|
146
|
+
|
147
|
+
.col.r-5-4 {
|
148
|
+
width:748px;
|
149
|
+
}
|
150
|
+
|
151
|
+
/*****************************
|
152
|
+
Fluid Structure
|
153
|
+
*****************************/
|
154
|
+
|
155
|
+
*[class*="container"].fluid, .fluid *[class*="container"] {
|
156
|
+
width:auto;
|
157
|
+
}
|
158
|
+
|
159
|
+
*[class*="container"].fluid {
|
160
|
+
padding:0 20px;
|
161
|
+
}
|
162
|
+
|
163
|
+
*[class*="container"].fluid *[class*="col"] {
|
164
|
+
margin-left:1.94%;
|
165
|
+
}
|
166
|
+
|
167
|
+
*[class*="container"].fluid *[class*="col"]:first-child {
|
168
|
+
margin-left:0;
|
169
|
+
float:left !important;
|
170
|
+
}
|
171
|
+
|
172
|
+
/*
|
173
|
+
Since percentage calculations aren't pixel-accurate, widths are always a little
|
174
|
+
shy of correct. Aligning the last column to the right makes everything line up.
|
175
|
+
*/
|
176
|
+
.fluid *[class*="col"]:last-child {
|
177
|
+
float:right;
|
178
|
+
}
|
179
|
+
|
180
|
+
.container.fluid .col, .fluid .container .col {
|
181
|
+
width:100%;
|
182
|
+
}
|
183
|
+
|
184
|
+
.container-1.fluid .col, .fluid .container-1 .col {
|
185
|
+
width:100%;
|
186
|
+
}
|
187
|
+
|
188
|
+
.container-2.fluid .col, .fluid .container-2 .col {
|
189
|
+
width:49.03%;
|
190
|
+
}
|
191
|
+
|
192
|
+
.container-3.fluid .col, .fluid .container-3 .col {
|
193
|
+
width:32.02%;
|
194
|
+
}
|
195
|
+
|
196
|
+
.container-4.fluid .col, .fluid .container-4 .col {
|
197
|
+
width:23.52%;
|
198
|
+
}
|
199
|
+
|
200
|
+
.container-5.fluid .col, .fluid .container-5 .col {
|
201
|
+
width:18.43%;
|
202
|
+
}
|
203
|
+
|
204
|
+
/* Resized Columns */
|
205
|
+
|
206
|
+
.fluid .col.r-3-1 {
|
207
|
+
width:32.02%;
|
208
|
+
}
|
209
|
+
|
210
|
+
.fluid .col.r-3-2 {
|
211
|
+
width:65.98%;
|
212
|
+
}
|
213
|
+
|
214
|
+
.fluid .col.r-4-1 {
|
215
|
+
width:23.52%;
|
216
|
+
}
|
217
|
+
|
218
|
+
.fluid .col.r-4-2 {
|
219
|
+
width:48.98%;
|
220
|
+
}
|
221
|
+
|
222
|
+
.fluid .col.r-4-3 {
|
223
|
+
width:74.45%;
|
224
|
+
}
|
225
|
+
|
226
|
+
.fluid .col.r-5-1 {
|
227
|
+
width:18.43%;
|
228
|
+
}
|
229
|
+
|
230
|
+
.fluid .col.r-5-2 {
|
231
|
+
width:38.80%;
|
232
|
+
}
|
233
|
+
|
234
|
+
.fluid .col.r-5-3 {
|
235
|
+
width:59.17%;
|
236
|
+
}
|
237
|
+
|
238
|
+
.fluid .col.r-5-4 {
|
239
|
+
width:79.54%;
|
240
|
+
}
|
241
|
+
|
242
|
+
/*****************************
|
243
|
+
Flows
|
244
|
+
*****************************/
|
245
|
+
|
246
|
+
.container.flow .col {
|
247
|
+
width:auto;
|
248
|
+
}
|
249
|
+
|
250
|
+
/*****************************
|
251
|
+
Fixed Structure
|
252
|
+
*****************************/
|
253
|
+
|
254
|
+
.container.fixed {
|
255
|
+
position:fixed;
|
256
|
+
}
|
257
|
+
|
258
|
+
.container.fixed.fluid {
|
259
|
+
width:100%;
|
260
|
+
|
261
|
+
-webkit-box-sizing:border-box;
|
262
|
+
-moz-box-sizing:border-box;
|
263
|
+
box-sizing:border-box;
|
264
|
+
}
|