spike 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (142) hide show
  1. data/.document +5 -0
  2. data/.gitignore +21 -0
  3. data/.gitmodules +6 -0
  4. data/LICENSE +20 -0
  5. data/README.md +45 -0
  6. data/Rakefile +56 -0
  7. data/VERSION +1 -0
  8. data/bin/spike +5 -0
  9. data/lib/initializers/960.rb +33 -0
  10. data/lib/initializers/jquery.rb +1 -0
  11. data/lib/spike.rb +61 -0
  12. data/lib/template/app.css +0 -0
  13. data/lib/template/css/960/README.txt +52 -0
  14. data/lib/template/css/960/code/css/960.css +1 -0
  15. data/lib/template/css/960/code/css/960_24_col.css +1 -0
  16. data/lib/template/css/960/code/css/reset.css +1 -0
  17. data/lib/template/css/960/code/css/rtl_960.css +1 -0
  18. data/lib/template/css/960/code/css/rtl_960_24_col.css +1 -0
  19. data/lib/template/css/960/code/css/rtl_text.css +1 -0
  20. data/lib/template/css/960/code/css/text.css +1 -0
  21. data/lib/template/css/960/code/css/uncompressed/960.css +628 -0
  22. data/lib/template/css/960/code/css/uncompressed/960_24_col.css +599 -0
  23. data/lib/template/css/960/code/css/uncompressed/demo.css +47 -0
  24. data/lib/template/css/960/code/css/uncompressed/reset.css +53 -0
  25. data/lib/template/css/960/code/css/uncompressed/rtl_960.css +628 -0
  26. data/lib/template/css/960/code/css/uncompressed/rtl_960_24_col.css +599 -0
  27. data/lib/template/css/960/code/css/uncompressed/rtl_text.css +84 -0
  28. data/lib/template/css/960/code/css/uncompressed/text.css +84 -0
  29. data/lib/template/css/960/code/demo.html +538 -0
  30. data/lib/template/css/960/code/demo_24_col.html +411 -0
  31. data/lib/template/css/960/code/img/12_col.gif +0 -0
  32. data/lib/template/css/960/code/img/16_col.gif +0 -0
  33. data/lib/template/css/960/code/img/24_col.gif +0 -0
  34. data/lib/template/css/960/code/rtl_demo.html +538 -0
  35. data/lib/template/css/960/code/rtl_demo_24_col.html +411 -0
  36. data/lib/template/css/960/fireworks_extension/960.gs Grid Commands.mxp +0 -0
  37. data/lib/template/css/960/fireworks_extension/_source/12 columns.jsf +26 -0
  38. data/lib/template/css/960/fireworks_extension/_source/16 columns.jsf +26 -0
  39. data/lib/template/css/960/fireworks_extension/_source/24 columns.jsf +26 -0
  40. data/lib/template/css/960/fireworks_extension/_source/960.gs Grid Commands.mxi +22 -0
  41. data/lib/template/css/960/licenses/GPL_license.txt +674 -0
  42. data/lib/template/css/960/licenses/MIT_license.txt +20 -0
  43. data/lib/template/css/960/sketch_sheets/960_sketch.pdf +0 -0
  44. data/lib/template/css/960/templates/acorn/960_grid_12_col.acorn +0 -0
  45. data/lib/template/css/960/templates/acorn/960_grid_16_col.acorn +0 -0
  46. data/lib/template/css/960/templates/acorn/960_grid_24_col.acorn +0 -0
  47. data/lib/template/css/960/templates/corel_draw/960_grid_12_col.cdt +0 -0
  48. data/lib/template/css/960/templates/corel_draw/960_grid_16_col.cdt +0 -0
  49. data/lib/template/css/960/templates/corel_draw/960_grid_24_col.cdt +0 -0
  50. data/lib/template/css/960/templates/expression_design/960_grid_12_col.design +0 -0
  51. data/lib/template/css/960/templates/expression_design/960_grid_16_col.design +0 -0
  52. data/lib/template/css/960/templates/expression_design/960_grid_24_col.design +0 -0
  53. data/lib/template/css/960/templates/fireworks/960_grid_12_col.png +0 -0
  54. data/lib/template/css/960/templates/fireworks/960_grid_16_col.png +0 -0
  55. data/lib/template/css/960/templates/fireworks/960_grid_24_col.png +0 -0
  56. data/lib/template/css/960/templates/flash/960_grid_12_col.fla +0 -0
  57. data/lib/template/css/960/templates/flash/960_grid_16_col.fla +0 -0
  58. data/lib/template/css/960/templates/flash/960_grid_24_col.fla +0 -0
  59. data/lib/template/css/960/templates/gimp/960_grid_12_col.xcf +0 -0
  60. data/lib/template/css/960/templates/gimp/960_grid_16_col.xcf +0 -0
  61. data/lib/template/css/960/templates/gimp/960_grid_24_col.xcf +0 -0
  62. data/lib/template/css/960/templates/illustrator/960_grid_12_col.ai +372 -0
  63. data/lib/template/css/960/templates/illustrator/960_grid_16_col.ai +361 -0
  64. data/lib/template/css/960/templates/indesign/960_grid_12_col.inx +1197 -0
  65. data/lib/template/css/960/templates/indesign/960_grid_16_col.inx +1214 -0
  66. data/lib/template/css/960/templates/inkscape/960_grid_12_col.svg +217 -0
  67. data/lib/template/css/960/templates/inkscape/960_grid_16_col.svg +265 -0
  68. data/lib/template/css/960/templates/inkscape/960_grid_24_col.svg +174 -0
  69. data/lib/template/css/960/templates/omnigraffle/960_graffle.graffle +0 -0
  70. data/lib/template/css/960/templates/photoshop/960_grid_12_col.psd +0 -0
  71. data/lib/template/css/960/templates/photoshop/960_grid_16_col.psd +0 -0
  72. data/lib/template/css/960/templates/photoshop/960_grid_24_col.psd +0 -0
  73. data/lib/template/css/960/templates/visio/960_visio.vsd +0 -0
  74. data/lib/template/css/blueprint/AUTHORS.textile +42 -0
  75. data/lib/template/css/blueprint/CHANGELOG +159 -0
  76. data/lib/template/css/blueprint/LICENSE +22 -0
  77. data/lib/template/css/blueprint/README.textile +81 -0
  78. data/lib/template/css/blueprint/TUTORIAL.textile +206 -0
  79. data/lib/template/css/blueprint/blueprint/ie.css +35 -0
  80. data/lib/template/css/blueprint/blueprint/plugins/buttons/icons/cross.png +0 -0
  81. data/lib/template/css/blueprint/blueprint/plugins/buttons/icons/key.png +0 -0
  82. data/lib/template/css/blueprint/blueprint/plugins/buttons/icons/tick.png +0 -0
  83. data/lib/template/css/blueprint/blueprint/plugins/buttons/readme.txt +32 -0
  84. data/lib/template/css/blueprint/blueprint/plugins/buttons/screen.css +97 -0
  85. data/lib/template/css/blueprint/blueprint/plugins/fancy-type/readme.txt +14 -0
  86. data/lib/template/css/blueprint/blueprint/plugins/fancy-type/screen.css +71 -0
  87. data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/doc.png +0 -0
  88. data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/email.png +0 -0
  89. data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/external.png +0 -0
  90. data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/feed.png +0 -0
  91. data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/im.png +0 -0
  92. data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/pdf.png +0 -0
  93. data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/visited.png +0 -0
  94. data/lib/template/css/blueprint/blueprint/plugins/link-icons/icons/xls.png +0 -0
  95. data/lib/template/css/blueprint/blueprint/plugins/link-icons/readme.txt +18 -0
  96. data/lib/template/css/blueprint/blueprint/plugins/link-icons/screen.css +40 -0
  97. data/lib/template/css/blueprint/blueprint/plugins/rtl/readme.txt +10 -0
  98. data/lib/template/css/blueprint/blueprint/plugins/rtl/screen.css +110 -0
  99. data/lib/template/css/blueprint/blueprint/print.css +29 -0
  100. data/lib/template/css/blueprint/blueprint/screen.css +258 -0
  101. data/lib/template/css/blueprint/blueprint/src/forms.css +65 -0
  102. data/lib/template/css/blueprint/blueprint/src/grid.css +280 -0
  103. data/lib/template/css/blueprint/blueprint/src/grid.png +0 -0
  104. data/lib/template/css/blueprint/blueprint/src/ie.css +76 -0
  105. data/lib/template/css/blueprint/blueprint/src/print.css +85 -0
  106. data/lib/template/css/blueprint/blueprint/src/reset.css +45 -0
  107. data/lib/template/css/blueprint/blueprint/src/typography.css +106 -0
  108. data/lib/template/css/blueprint/lib/blueprint/blueprint.rb +39 -0
  109. data/lib/template/css/blueprint/lib/blueprint/compressor.rb +290 -0
  110. data/lib/template/css/blueprint/lib/blueprint/core_ext.rb +39 -0
  111. data/lib/template/css/blueprint/lib/blueprint/css_parser.rb +72 -0
  112. data/lib/template/css/blueprint/lib/blueprint/custom_layout.rb +72 -0
  113. data/lib/template/css/blueprint/lib/blueprint/grid.css.erb +146 -0
  114. data/lib/template/css/blueprint/lib/blueprint/grid_builder.rb +63 -0
  115. data/lib/template/css/blueprint/lib/blueprint/namespace.rb +38 -0
  116. data/lib/template/css/blueprint/lib/blueprint/semantic_class_names.rb +64 -0
  117. data/lib/template/css/blueprint/lib/blueprint/validate/COPYRIGHT.html +93 -0
  118. data/lib/template/css/blueprint/lib/blueprint/validate/JIGSAW_COPYRIGHT +64 -0
  119. data/lib/template/css/blueprint/lib/blueprint/validate/README.html +83 -0
  120. data/lib/template/css/blueprint/lib/blueprint/validate/XERCES_COPYING.txt +56 -0
  121. data/lib/template/css/blueprint/lib/blueprint/validate/css-validator-javadoc.jar +0 -0
  122. data/lib/template/css/blueprint/lib/blueprint/validate/css-validator.jar +0 -0
  123. data/lib/template/css/blueprint/lib/blueprint/validate/jigsaw.jar +0 -0
  124. data/lib/template/css/blueprint/lib/blueprint/validate/xerces.jar +0 -0
  125. data/lib/template/css/blueprint/lib/blueprint/validator.rb +49 -0
  126. data/lib/template/css/blueprint/lib/compress.rb +167 -0
  127. data/lib/template/css/blueprint/lib/settings.example.yml +33 -0
  128. data/lib/template/css/blueprint/lib/validate.rb +15 -0
  129. data/lib/template/css/blueprint/templates/psd/fixed-width.psd +0 -0
  130. data/lib/template/css/blueprint/tests/index.html +83 -0
  131. data/lib/template/css/blueprint/tests/parts/elements.html +247 -0
  132. data/lib/template/css/blueprint/tests/parts/forms.html +191 -0
  133. data/lib/template/css/blueprint/tests/parts/grid.html +163 -0
  134. data/lib/template/css/blueprint/tests/parts/sample.html +75 -0
  135. data/lib/template/css/blueprint/tests/parts/test-small.jpg +0 -0
  136. data/lib/template/css/blueprint/tests/parts/test.jpg +0 -0
  137. data/lib/template/css/blueprint/tests/parts/valid.png +0 -0
  138. data/lib/template/index.html +16 -0
  139. data/spike.gemspec +190 -0
  140. data/test/helper.rb +10 -0
  141. data/test/test_spike.rb +7 -0
  142. metadata +227 -0
@@ -0,0 +1,411 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta http-equiv="content-type" content="text/html; charset=utf-8" />
5
+ <title>960 Grid System &mdash; Demo</title>
6
+ <link rel="stylesheet" href="css/reset.css" />
7
+ <link rel="stylesheet" href="css/text.css" />
8
+ <link rel="stylesheet" href="css/960_24_col.css" />
9
+ <link rel="stylesheet" href="css/uncompressed/demo.css" />
10
+ </head>
11
+ <body>
12
+ <h1>
13
+ <a href="http://960.gs/">960 Grid System</a>
14
+ </h1>
15
+ <div class="container_24">
16
+ <h2>
17
+ 24 Column Grid
18
+ </h2>
19
+ <div class="grid_24">
20
+ <p>
21
+ 950
22
+ </p>
23
+ </div>
24
+ <!-- end .grid_24 -->
25
+ <div class="clear"></div>
26
+ <div class="grid_1">
27
+ <p>
28
+ 30
29
+ </p>
30
+ </div>
31
+ <!-- end .grid_1 -->
32
+ <div class="grid_23">
33
+ <p>
34
+ 910
35
+ </p>
36
+ </div>
37
+ <!-- end .grid_23 -->
38
+ <div class="clear"></div>
39
+ <div class="grid_2">
40
+ <p>
41
+ 70
42
+ </p>
43
+ </div>
44
+ <!-- end .grid_2 -->
45
+ <div class="grid_22">
46
+ <p>
47
+ 870
48
+ </p>
49
+ </div>
50
+ <!-- end .grid_2 -->
51
+ <div class="clear"></div>
52
+ <div class="grid_3">
53
+ <p>
54
+ 110
55
+ </p>
56
+ </div>
57
+ <!-- end .grid_3 -->
58
+ <div class="grid_21">
59
+ <p>
60
+ 830
61
+ </p>
62
+ </div>
63
+ <!-- end .grid_21 -->
64
+ <div class="clear"></div>
65
+ <div class="grid_4">
66
+ <p>
67
+ 150
68
+ </p>
69
+ </div>
70
+ <!-- end .grid_4 -->
71
+ <div class="grid_20">
72
+ <p>
73
+ 790
74
+ </p>
75
+ </div>
76
+ <!-- end .grid_20 -->
77
+ <div class="clear"></div>
78
+ <div class="grid_5">
79
+ <p>
80
+ 190
81
+ </p>
82
+ </div>
83
+ <!-- end .grid_5 -->
84
+ <div class="grid_19">
85
+ <p>
86
+ 750
87
+ </p>
88
+ </div>
89
+ <!-- end .grid_19 -->
90
+ <div class="clear"></div>
91
+ <div class="grid_6">
92
+ <p>
93
+ 230
94
+ </p>
95
+ </div>
96
+ <!-- end .grid_6 -->
97
+ <div class="grid_18">
98
+ <p>
99
+ 710
100
+ </p>
101
+ </div>
102
+ <!-- end .grid_18 -->
103
+ <div class="clear"></div>
104
+ <div class="grid_7">
105
+ <p>
106
+ 270
107
+ </p>
108
+ </div>
109
+ <!-- end .grid_7 -->
110
+ <div class="grid_17">
111
+ <p>
112
+ 670
113
+ </p>
114
+ </div>
115
+ <!-- end .grid_17 -->
116
+ <div class="clear"></div>
117
+ <div class="grid_8">
118
+ <p>
119
+ 310
120
+ </p>
121
+ </div>
122
+ <!-- end .grid_8 -->
123
+ <div class="grid_16">
124
+ <p>
125
+ 630
126
+ </p>
127
+ </div>
128
+ <!-- end .grid_16 -->
129
+ <div class="clear"></div>
130
+ <div class="grid_9">
131
+ <p>
132
+ 350
133
+ </p>
134
+ </div>
135
+ <!-- end .grid_9 -->
136
+ <div class="grid_15">
137
+ <p>
138
+ 590
139
+ </p>
140
+ </div>
141
+ <!-- end .grid_15 -->
142
+ <div class="clear"></div>
143
+ <div class="grid_10">
144
+ <p>
145
+ 390
146
+ </p>
147
+ </div>
148
+ <!-- end .grid_10 -->
149
+ <div class="grid_14">
150
+ <p>
151
+ 550
152
+ </p>
153
+ </div>
154
+ <!-- end .grid_14 -->
155
+ <div class="clear"></div>
156
+ <div class="grid_11">
157
+ <p>
158
+ 430
159
+ </p>
160
+ </div>
161
+ <!-- end .grid_11 -->
162
+ <div class="grid_13">
163
+ <p>
164
+ 510
165
+ </p>
166
+ </div>
167
+ <!-- end .grid_13 -->
168
+ <div class="clear"></div>
169
+ <div class="grid_12">
170
+ <p>
171
+ 470
172
+ </p>
173
+ </div>
174
+ <!-- end .grid_12 -->
175
+ <div class="grid_12">
176
+ <p>
177
+ 470
178
+ </p>
179
+ </div>
180
+ <!-- end .grid_12 -->
181
+ <div class="clear"></div>
182
+ <div class="grid_1 suffix_23">
183
+ <p>
184
+ 30
185
+ </p>
186
+ </div>
187
+ <!-- end .grid_1.suffix_23 -->
188
+ <div class="clear"></div>
189
+ <div class="grid_1 prefix_1 suffix_22">
190
+ <p>
191
+ 30
192
+ </p>
193
+ </div>
194
+ <!-- end .grid_1.prefix_1.suffix_22 -->
195
+ <div class="clear"></div>
196
+ <div class="grid_1 prefix_2 suffix_21">
197
+ <p>
198
+ 30
199
+ </p>
200
+ </div>
201
+ <!-- end .grid_1.prefix_2.suffix_21 -->
202
+ <div class="clear"></div>
203
+ <div class="grid_1 prefix_3 suffix_20">
204
+ <p>
205
+ 30
206
+ </p>
207
+ </div>
208
+ <!-- end .grid_1.prefix_3.suffix_20 -->
209
+ <div class="clear"></div>
210
+ <div class="grid_1 prefix_4 suffix_19">
211
+ <p>
212
+ 30
213
+ </p>
214
+ </div>
215
+ <!-- end .grid_1.prefix_4.suffix_19 -->
216
+ <div class="clear"></div>
217
+ <div class="grid_1 prefix_5 suffix_18">
218
+ <p>
219
+ 30
220
+ </p>
221
+ </div>
222
+ <!-- end .grid_1.prefix_5.suffix_18 -->
223
+ <div class="clear"></div>
224
+ <div class="grid_1 prefix_6 suffix_17">
225
+ <p>
226
+ 30
227
+ </p>
228
+ </div>
229
+ <!-- end .grid_1.prefix_6.suffix_17 -->
230
+ <div class="clear"></div>
231
+ <div class="grid_1 prefix_7 suffix_16">
232
+ <p>
233
+ 30
234
+ </p>
235
+ </div>
236
+ <!-- end .grid_1.prefix_7.suffix_16 -->
237
+ <div class="clear"></div>
238
+ <div class="grid_1 prefix_8 suffix_15">
239
+ <p>
240
+ 30
241
+ </p>
242
+ </div>
243
+ <!-- end .grid_1.prefix_8.suffix_15 -->
244
+ <div class="clear"></div>
245
+ <div class="grid_1 prefix_9 suffix_14">
246
+ <p>
247
+ 30
248
+ </p>
249
+ </div>
250
+ <!-- end .grid_1.prefix_9.suffix_14 -->
251
+ <div class="clear"></div>
252
+ <div class="grid_1 prefix_10 suffix_13">
253
+ <p>
254
+ 30
255
+ </p>
256
+ </div>
257
+ <!-- end .grid_1.prefix_10.suffix_13 -->
258
+ <div class="clear"></div>
259
+ <div class="grid_1 prefix_11 suffix_12">
260
+ <p>
261
+ 30
262
+ </p>
263
+ </div>
264
+ <!-- end .grid_1.prefix_11.suffix_12 -->
265
+ <div class="grid_1 prefix_12 suffix_11">
266
+ <p>
267
+ 30
268
+ </p>
269
+ </div>
270
+ <!-- end .grid_1.prefix_12.suffix_11 -->
271
+ <div class="clear"></div>
272
+ <div class="grid_1 prefix_13 suffix_10">
273
+ <p>
274
+ 30
275
+ </p>
276
+ </div>
277
+ <!-- end .grid_1.prefix_13.suffix_10 -->
278
+ <div class="clear"></div>
279
+ <div class="grid_1 prefix_14 suffix_9">
280
+ <p>
281
+ 30
282
+ </p>
283
+ </div>
284
+ <!-- end .grid_1.prefix_14.suffix_9 -->
285
+ <div class="clear"></div>
286
+ <div class="grid_1 prefix_15 suffix_8">
287
+ <p>
288
+ 30
289
+ </p>
290
+ </div>
291
+ <!-- end .grid_1.prefix_15.suffix_8 -->
292
+ <div class="clear"></div>
293
+ <div class="grid_1 prefix_16 suffix_7">
294
+ <p>
295
+ 30
296
+ </p>
297
+ </div>
298
+ <!-- end .grid_1.prefix_16.suffix_7 -->
299
+ <div class="clear"></div>
300
+ <div class="grid_1 prefix_17 suffix_6">
301
+ <p>
302
+ 30
303
+ </p>
304
+ </div>
305
+ <!-- end .grid_1.prefix_17.suffix_6 -->
306
+ <div class="clear"></div>
307
+ <div class="grid_1 prefix_18 suffix_5">
308
+ <p>
309
+ 30
310
+ </p>
311
+ </div>
312
+ <!-- end .grid_1.prefix_18.suffix_5 -->
313
+ <div class="clear"></div>
314
+ <div class="grid_1 prefix_19 suffix_4">
315
+ <p>
316
+ 30
317
+ </p>
318
+ </div>
319
+ <!-- end .grid_1.prefix_19.suffix_4 -->
320
+ <div class="clear"></div>
321
+ <div class="grid_1 prefix_20 suffix_3">
322
+ <p>
323
+ 30
324
+ </p>
325
+ </div>
326
+ <!-- end .grid_1.prefix_20.suffix_3 -->
327
+ <div class="clear"></div>
328
+ <div class="grid_1 prefix_21 suffix_2">
329
+ <p>
330
+ 30
331
+ </p>
332
+ </div>
333
+ <!-- end .grid_1.prefix_21.suffix_2 -->
334
+ <div class="clear"></div>
335
+ <div class="grid_1 prefix_22 suffix_1">
336
+ <p>
337
+ 30
338
+ </p>
339
+ </div>
340
+ <!-- end .grid_1.prefix_22.suffix_1 -->
341
+ <div class="clear"></div>
342
+ <div class="grid_1 prefix_23">
343
+ <p>
344
+ 30
345
+ </p>
346
+ </div>
347
+ <!-- end .grid_1.prefix_23 -->
348
+ <div class="clear"></div>
349
+ <div class="grid_12 push_12">
350
+ <div class="grid_6 alpha">
351
+ <p>
352
+ 230
353
+ </p>
354
+ </div>
355
+ <!-- end .grid_6.alpha -->
356
+ <div class="grid_6 omega">
357
+ <p>
358
+ 230
359
+ </p>
360
+ </div>
361
+ <!-- end .grid_6.omega -->
362
+ <div class="clear"></div>
363
+ <div class="grid_1 alpha">
364
+ <p>
365
+ 30
366
+ </p>
367
+ </div>
368
+ <!-- end .grid_1.alpha -->
369
+ <div class="grid_11 omega">
370
+ <p>
371
+ 430
372
+ </p>
373
+ </div>
374
+ <!-- end .grid_11.omega -->
375
+ <div class="clear"></div>
376
+ </div>
377
+ <!-- end .grid_12.push_12 -->
378
+ <div class="grid_12 pull_12">
379
+ <div class="grid_1 alpha">
380
+ <p>
381
+ 30
382
+ </p>
383
+ </div>
384
+ <!-- end .grid_1.alpha -->
385
+ <div class="grid_11 omega">
386
+ <p>
387
+ 430
388
+ </p>
389
+ </div>
390
+ <!-- end .grid_11.omega -->
391
+ <div class="clear"></div>
392
+ <div class="grid_6 alpha">
393
+ <p>
394
+ 230
395
+ </p>
396
+ </div>
397
+ <!-- end .grid_6.alpha -->
398
+ <div class="grid_6 omega">
399
+ <p>
400
+ 230
401
+ </p>
402
+ </div>
403
+ <!-- end .grid_6.omega -->
404
+ <div class="clear"></div>
405
+ </div>
406
+ <!-- end .grid_12.pull_12 -->
407
+ <div class="clear"></div>
408
+ </div>
409
+ <!-- end .container_24 -->
410
+ </body>
411
+ </html>
@@ -0,0 +1,538 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en" dir="rtl">
3
+ <head>
4
+ <meta http-equiv="content-type" content="text/html; charset=utf-8" />
5
+ <title>960 Grid System &mdash; Demo</title>
6
+ <link rel="stylesheet" href="css/reset.css" />
7
+ <link rel="stylesheet" href="css/rtl_text.css" />
8
+ <link rel="stylesheet" href="css/rtl_960.css" />
9
+ <link rel="stylesheet" href="css/uncompressed/demo.css" />
10
+ </head>
11
+ <body>
12
+ <h1>
13
+ <a href="http://960.gs/">960 Grid System</a>
14
+ </h1>
15
+ <div class="container_12">
16
+ <h2>
17
+ 12 Column Grid
18
+ </h2>
19
+ <div class="grid_12">
20
+ <p>
21
+ 940
22
+ </p>
23
+ </div>
24
+ <!-- end .grid_12 -->
25
+ <div class="clear"></div>
26
+ <div class="grid_1">
27
+ <p>
28
+ 60
29
+ </p>
30
+ </div>
31
+ <!-- end .grid_1 -->
32
+ <div class="grid_11">
33
+ <p>
34
+ 860
35
+ </p>
36
+ </div>
37
+ <!-- end .grid_11 -->
38
+ <div class="clear"></div>
39
+ <div class="grid_2">
40
+ <p>
41
+ 140
42
+ </p>
43
+ </div>
44
+ <!-- end .grid_2 -->
45
+ <div class="grid_10">
46
+ <p>
47
+ 780
48
+ </p>
49
+ </div>
50
+ <!-- end .grid_10 -->
51
+ <div class="clear"></div>
52
+ <div class="grid_3">
53
+ <p>
54
+ 220
55
+ </p>
56
+ </div>
57
+ <!-- end .grid_3 -->
58
+ <div class="grid_9">
59
+ <p>
60
+ 700
61
+ </p>
62
+ </div>
63
+ <!-- end .grid_9 -->
64
+ <div class="clear"></div>
65
+ <div class="grid_4">
66
+ <p>
67
+ 300
68
+ </p>
69
+ </div>
70
+ <!-- end .grid_4 -->
71
+ <div class="grid_8">
72
+ <p>
73
+ 620
74
+ </p>
75
+ </div>
76
+ <!-- end .grid_8 -->
77
+ <div class="clear"></div>
78
+ <div class="grid_5">
79
+ <p>
80
+ 380
81
+ </p>
82
+ </div>
83
+ <!-- end .grid_5 -->
84
+ <div class="grid_7">
85
+ <p>
86
+ 540
87
+ </p>
88
+ </div>
89
+ <!-- end .grid_7 -->
90
+ <div class="clear"></div>
91
+ <div class="grid_6">
92
+ <p>
93
+ 460
94
+ </p>
95
+ </div>
96
+ <!-- end .grid_6 -->
97
+ <div class="grid_6">
98
+ <p>
99
+ 460
100
+ </p>
101
+ </div>
102
+ <!-- end .grid_6 -->
103
+ <div class="clear"></div>
104
+ <div class="grid_1 suffix_11">
105
+ <p>
106
+ 60
107
+ </p>
108
+ </div>
109
+ <!-- end .grid_1.suffix_11 -->
110
+ <div class="clear"></div>
111
+ <div class="grid_1 prefix_1 suffix_10">
112
+ <p>
113
+ 60
114
+ </p>
115
+ </div>
116
+ <!-- end .grid_1.prefix_1.suffix_10 -->
117
+ <div class="clear"></div>
118
+ <div class="grid_1 prefix_2 suffix_9">
119
+ <p>
120
+ 60
121
+ </p>
122
+ </div>
123
+ <!-- end .grid_1.prefix_2.suffix_9 -->
124
+ <div class="clear"></div>
125
+ <div class="grid_1 prefix_3 suffix_8">
126
+ <p>
127
+ 60
128
+ </p>
129
+ </div>
130
+ <!-- end .grid_1.prefix_3.suffix_8 -->
131
+ <div class="clear"></div>
132
+ <div class="grid_1 prefix_4 suffix_7">
133
+ <p>
134
+ 60
135
+ </p>
136
+ </div>
137
+ <!-- end .grid_1.prefix_4.suffix_7 -->
138
+ <div class="clear"></div>
139
+ <div class="grid_1 prefix_5 suffix_6">
140
+ <p>
141
+ 60
142
+ </p>
143
+ </div>
144
+ <!-- end .grid_1.prefix_5.suffix_6 -->
145
+ <div class="clear"></div>
146
+ <div class="grid_1 prefix_6 suffix_5">
147
+ <p>
148
+ 60
149
+ </p>
150
+ </div>
151
+ <!-- end .grid_1.prefix_6.suffix_5 -->
152
+ <div class="clear"></div>
153
+ <div class="grid_1 prefix_7 suffix_4">
154
+ <p>
155
+ 60
156
+ </p>
157
+ </div>
158
+ <!-- end .grid_1.prefix_7.suffix_4 -->
159
+ <div class="clear"></div>
160
+ <div class="grid_1 prefix_8 suffix_3">
161
+ <p>
162
+ 60
163
+ </p>
164
+ </div>
165
+ <!-- end .grid_1.prefix_8.suffix_3 -->
166
+ <div class="clear"></div>
167
+ <div class="grid_1 prefix_9 suffix_2">
168
+ <p>
169
+ 60
170
+ </p>
171
+ </div>
172
+ <!-- end .grid_1.prefix_9.suffix_2 -->
173
+ <div class="clear"></div>
174
+ <div class="grid_1 prefix_10 suffix_1">
175
+ <p>
176
+ 60
177
+ </p>
178
+ </div>
179
+ <!-- end .grid_1.prefix_10.suffix_1 -->
180
+ <div class="clear"></div>
181
+ <div class="grid_1 prefix_11">
182
+ <p>
183
+ 60
184
+ </p>
185
+ </div>
186
+ <!-- end .grid_1.prefix_11 -->
187
+ <div class="clear"></div>
188
+ <div class="grid_6 push_6">
189
+ <div class="grid_1 alpha">
190
+ <p>
191
+ 60
192
+ </p>
193
+ </div>
194
+ <!-- end .grid_1.alpha -->
195
+ <div class="grid_5 omega">
196
+ <p>
197
+ 380
198
+ </p>
199
+ </div>
200
+ <!-- end .grid_5.omega -->
201
+ <div class="clear"></div>
202
+ <div class="grid_3 alpha">
203
+ <p>
204
+ 220
205
+ </p>
206
+ </div>
207
+ <!-- end .grid_3.alpha -->
208
+ <div class="grid_3 omega">
209
+ <p>
210
+ 220
211
+ </p>
212
+ </div>
213
+ <!-- end .grid_3.omega -->
214
+ <div class="clear"></div>
215
+ </div>
216
+ <!-- end .grid_6.push_6 -->
217
+ <div class="grid_6 pull_6">
218
+ <div class="grid_3 alpha">
219
+ <p>
220
+ 220
221
+ </p>
222
+ </div>
223
+ <!-- end .grid_3.alpha -->
224
+ <div class="grid_3 omega">
225
+ <p>
226
+ 220
227
+ </p>
228
+ </div>
229
+ <!-- end .grid_3.omega -->
230
+ <div class="clear"></div>
231
+ <div class="grid_1 alpha">
232
+ <p>
233
+ 60
234
+ </p>
235
+ </div>
236
+ <!-- end .grid_1.alpha -->
237
+ <div class="grid_5 omega">
238
+ <p>
239
+ 380
240
+ </p>
241
+ </div>
242
+ <!-- end .grid_5.omega -->
243
+ <div class="clear"></div>
244
+ </div>
245
+ <!-- end .grid_6.pull_6 -->
246
+ <div class="clear"></div>
247
+ </div>
248
+ <!-- end .container_12 -->
249
+ <div class="container_16">
250
+ <h2>
251
+ 16 Column Grid
252
+ </h2>
253
+ <div class="grid_16">
254
+ <p>
255
+ 940
256
+ </p>
257
+ </div>
258
+ <!-- end .grid_16 -->
259
+ <div class="clear"></div>
260
+ <div class="grid_1">
261
+ <p>
262
+ 40
263
+ </p>
264
+ </div>
265
+ <!-- end .grid_1 -->
266
+ <div class="grid_15">
267
+ <p>
268
+ 880
269
+ </p>
270
+ </div>
271
+ <!-- end .grid_15 -->
272
+ <div class="clear"></div>
273
+ <div class="grid_2">
274
+ <p>
275
+ 100
276
+ </p>
277
+ </div>
278
+ <!-- end .grid_2 -->
279
+ <div class="grid_14">
280
+ <p>
281
+ 820
282
+ </p>
283
+ </div>
284
+ <!-- end .grid_14 -->
285
+ <div class="clear"></div>
286
+ <div class="grid_3">
287
+ <p>
288
+ 160
289
+ </p>
290
+ </div>
291
+ <!-- end .grid_3 -->
292
+ <div class="grid_13">
293
+ <p>
294
+ 760
295
+ </p>
296
+ </div>
297
+ <!-- end .grid_13 -->
298
+ <div class="clear"></div>
299
+ <div class="grid_4">
300
+ <p>
301
+ 220
302
+ </p>
303
+ </div>
304
+ <!-- end .grid_4 -->
305
+ <div class="grid_12">
306
+ <p>
307
+ 700
308
+ </p>
309
+ </div>
310
+ <!-- end .grid_12 -->
311
+ <div class="clear"></div>
312
+ <div class="grid_5">
313
+ <p>
314
+ 280
315
+ </p>
316
+ </div>
317
+ <!-- end .grid_5 -->
318
+ <div class="grid_11">
319
+ <p>
320
+ 640
321
+ </p>
322
+ </div>
323
+ <!-- end .grid_11 -->
324
+ <div class="clear"></div>
325
+ <div class="grid_6">
326
+ <p>
327
+ 340
328
+ </p>
329
+ </div>
330
+ <!-- end .grid_6 -->
331
+ <div class="grid_10">
332
+ <p>
333
+ 580
334
+ </p>
335
+ </div>
336
+ <!-- end .grid_10 -->
337
+ <div class="clear"></div>
338
+ <div class="grid_7">
339
+ <p>
340
+ 400
341
+ </p>
342
+ </div>
343
+ <!-- end .grid_7 -->
344
+ <div class="grid_9">
345
+ <p>
346
+ 520
347
+ </p>
348
+ </div>
349
+ <!-- end .grid_9 -->
350
+ <div class="clear"></div>
351
+ <div class="grid_8">
352
+ <p>
353
+ 460
354
+ </p>
355
+ </div>
356
+ <!-- end .grid_8 -->
357
+ <div class="grid_8">
358
+ <p>
359
+ 460
360
+ </p>
361
+ </div>
362
+ <!-- end .grid_8 -->
363
+ <div class="clear"></div>
364
+ <div class="grid_1 suffix_15">
365
+ <p>
366
+ 40
367
+ </p>
368
+ </div>
369
+ <!-- end .grid_1.suffix_15 -->
370
+ <div class="clear"></div>
371
+ <div class="grid_1 prefix_1 suffix_14">
372
+ <p>
373
+ 40
374
+ </p>
375
+ </div>
376
+ <!-- end .grid_1.prefix_1.suffix_14 -->
377
+ <div class="clear"></div>
378
+ <div class="grid_1 prefix_2 suffix_13">
379
+ <p>
380
+ 40
381
+ </p>
382
+ </div>
383
+ <!-- end .grid_1.prefix_2.suffix_13 -->
384
+ <div class="clear"></div>
385
+ <div class="grid_1 prefix_3 suffix_12">
386
+ <p>
387
+ 40
388
+ </p>
389
+ </div>
390
+ <!-- end .grid_1.prefix_3.suffix_12 -->
391
+ <div class="clear"></div>
392
+ <div class="grid_1 prefix_4 suffix_11">
393
+ <p>
394
+ 40
395
+ </p>
396
+ </div>
397
+ <!-- end .grid_1.prefix_4.suffix_11 -->
398
+ <div class="clear"></div>
399
+ <div class="grid_1 prefix_5 suffix_10">
400
+ <p>
401
+ 40
402
+ </p>
403
+ </div>
404
+ <!-- end .grid_1.prefix_5.suffix_10 -->
405
+ <div class="clear"></div>
406
+ <div class="grid_1 prefix_6 suffix_9">
407
+ <p>
408
+ 40
409
+ </p>
410
+ </div>
411
+ <!-- end .grid_1.prefix_6.suffix_9 -->
412
+ <div class="clear"></div>
413
+ <div class="grid_1 prefix_7 suffix_8">
414
+ <p>
415
+ 40
416
+ </p>
417
+ </div>
418
+ <!-- end .grid_1.prefix_7.suffix_8 -->
419
+ <div class="clear"></div>
420
+ <div class="grid_1 prefix_8 suffix_7">
421
+ <p>
422
+ 40
423
+ </p>
424
+ </div>
425
+ <!-- end .grid_1.prefix_8.suffix_7 -->
426
+ <div class="clear"></div>
427
+ <div class="grid_1 prefix_9 suffix_6">
428
+ <p>
429
+ 40
430
+ </p>
431
+ </div>
432
+ <!-- end .grid_1.prefix_9.suffix_6 -->
433
+ <div class="clear"></div>
434
+ <div class="grid_1 prefix_10 suffix_5">
435
+ <p>
436
+ 40
437
+ </p>
438
+ </div>
439
+ <!-- end .grid_1.prefix_10.suffix_5 -->
440
+ <div class="clear"></div>
441
+ <div class="grid_1 prefix_11 suffix_4">
442
+ <p>
443
+ 40
444
+ </p>
445
+ </div>
446
+ <!-- end .grid_1.prefix_11.suffix_4 -->
447
+ <div class="clear"></div>
448
+ <div class="grid_1 prefix_12 suffix_3">
449
+ <p>
450
+ 40
451
+ </p>
452
+ </div>
453
+ <!-- end .grid_1.prefix_12.suffix_3 -->
454
+ <div class="clear"></div>
455
+ <div class="grid_1 prefix_13 suffix_2">
456
+ <p>
457
+ 40
458
+ </p>
459
+ </div>
460
+ <!-- end .grid_1.prefix_13.suffix_2 -->
461
+ <div class="clear"></div>
462
+ <div class="grid_1 prefix_14 suffix_1">
463
+ <p>
464
+ 40
465
+ </p>
466
+ </div>
467
+ <!-- end .grid_1.prefix_14.suffix_1 -->
468
+ <div class="clear"></div>
469
+ <div class="grid_1 prefix_15">
470
+ <p>
471
+ 40
472
+ </p>
473
+ </div>
474
+ <!-- end .grid_1.prefix_15 -->
475
+ <div class="clear"></div>
476
+ <div class="grid_8 push_8">
477
+ <div class="grid_1 alpha">
478
+ <p>
479
+ 40
480
+ </p>
481
+ </div>
482
+ <!-- end .grid_1.alpha -->
483
+ <div class="grid_7 omega">
484
+ <p>
485
+ 400
486
+ </p>
487
+ </div>
488
+ <!-- end .grid_7.omega -->
489
+ <div class="clear"></div>
490
+ <div class="grid_4 alpha">
491
+ <p>
492
+ 220
493
+ </p>
494
+ </div>
495
+ <!-- end .grid_4.alpha -->
496
+ <div class="grid_4 omega">
497
+ <p>
498
+ 220
499
+ </p>
500
+ </div>
501
+ <!-- end .grid_4.omega -->
502
+ <div class="clear"></div>
503
+ </div>
504
+ <!-- end .grid_8.push_8 -->
505
+ <div class="grid_8 pull_8">
506
+ <div class="grid_4 alpha">
507
+ <p>
508
+ 220
509
+ </p>
510
+ </div>
511
+ <!-- end .grid_4.alpha -->
512
+ <div class="grid_4 omega">
513
+ <p>
514
+ 220
515
+ </p>
516
+ </div>
517
+ <!-- end .grid_4.omega -->
518
+ <div class="clear"></div>
519
+ <div class="grid_1 alpha">
520
+ <p>
521
+ 40
522
+ </p>
523
+ </div>
524
+ <!-- end .grid_1.alpha -->
525
+ <div class="grid_7 omega">
526
+ <p>
527
+ 400
528
+ </p>
529
+ </div>
530
+ <!-- end .grid_7.omega -->
531
+ <div class="clear"></div>
532
+ </div>
533
+ <!-- end .grid_8.pull_8 -->
534
+ <div class="clear"></div>
535
+ </div>
536
+ <!-- end .container_16 -->
537
+ </body>
538
+ </html>