pakyow 0.8rc1 → 0.8.rc4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- 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
|
+
}
|