web-app-theme 0.3.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (46) hide show
  1. data/.gitignore +2 -0
  2. data/LICENSE +21 -0
  3. data/README.md +22 -0
  4. data/Rakefile +25 -0
  5. data/VERSION +1 -0
  6. data/features/step_definitions/layout_steps.rb +55 -0
  7. data/features/step_definitions/themed_steps.rb +19 -0
  8. data/features/support/env.rb +82 -0
  9. data/features/theme_generator.feature +51 -0
  10. data/features/themed_generator.feature +52 -0
  11. data/images/avatar.png +0 -0
  12. data/index.html +474 -0
  13. data/javascripts/jquery-1.3.min.js +19 -0
  14. data/javascripts/jquery.localscroll.js +104 -0
  15. data/javascripts/jquery.scrollTo.js +150 -0
  16. data/lib/web_app_theme.rb +2 -0
  17. data/rails_generators/theme/USAGE +4 -0
  18. data/rails_generators/theme/templates/view_layout_administration.html.erb +48 -0
  19. data/rails_generators/theme/templates/view_layout_sign.html.erb +15 -0
  20. data/rails_generators/theme/templates/web_app_theme_override.css +1 -0
  21. data/rails_generators/theme/theme_generator.rb +39 -0
  22. data/rails_generators/themed/USAGE +4 -0
  23. data/rails_generators/themed/templates/view_edit.html.erb +20 -0
  24. data/rails_generators/themed/templates/view_form.html.erb +10 -0
  25. data/rails_generators/themed/templates/view_new.html.erb +19 -0
  26. data/rails_generators/themed/templates/view_show.html.erb +23 -0
  27. data/rails_generators/themed/templates/view_sidebar.html.erb +13 -0
  28. data/rails_generators/themed/templates/view_signin.html.erb +39 -0
  29. data/rails_generators/themed/templates/view_signup.html.erb +56 -0
  30. data/rails_generators/themed/templates/view_tables.html.erb +54 -0
  31. data/rails_generators/themed/templates/view_text.html.erb +18 -0
  32. data/rails_generators/themed/themed_generator.rb +95 -0
  33. data/stylesheets/base.css +336 -0
  34. data/stylesheets/themes/bec-green/style.css +290 -0
  35. data/stylesheets/themes/bec/style.css +301 -0
  36. data/stylesheets/themes/blue/style.css +280 -0
  37. data/stylesheets/themes/default/style.css +267 -0
  38. data/stylesheets/themes/djime-cerulean/style.css +298 -0
  39. data/stylesheets/themes/drastic-dark/style.css +373 -0
  40. data/stylesheets/themes/kathleene/style.css +272 -0
  41. data/stylesheets/themes/orange/style.css +263 -0
  42. data/stylesheets/themes/reidb-greenish/style.css +301 -0
  43. data/stylesheets/themes/warehouse/style.css +391 -0
  44. data/test/spec_helper.rb +5 -0
  45. data/test/themed_generator_spec.rb +115 -0
  46. metadata +101 -0
@@ -0,0 +1,301 @@
1
+ .small { font-size:11px; }
2
+ .gray { color:#a2b0b6; }
3
+ .hightlight { background-color:#d6e7c7; }
4
+
5
+ a:link, a:visited, a:hover, a:active { color: #81B953; }
6
+ h1, h2, h3 { color: #3B5526; }
7
+ a { -moz-outline: none; }
8
+
9
+ body {
10
+ color: #222;
11
+ background: #e4ebe4;
12
+ font-family: helvetica, arial, sans-serif;
13
+ }
14
+
15
+ hr {
16
+ background: #f0f0ee;
17
+ color: #f0f0ee;
18
+ }
19
+
20
+ #header {
21
+ background: #c9deb7;
22
+
23
+ }
24
+
25
+ #header h1{
26
+ padding: 20px 0;
27
+ font-weight: bold;
28
+
29
+ }
30
+
31
+ #header h1 a:link, #header h1 a:active,
32
+ #header h1 a:hover, #header h1 a:visited {
33
+ color: #3B5526;
34
+ }
35
+
36
+ #main .block .content {
37
+ background: #FFF;
38
+ padding-top: 1px;
39
+ }
40
+
41
+ #main .block .content h2 {
42
+ margin-left: 15px;
43
+ }
44
+
45
+ #main .content { border: 1px solid #81B953;}
46
+
47
+ #sidebar .block {
48
+ background: #FFF;
49
+ border: none;
50
+ }
51
+
52
+ #sidebar h3 {
53
+ padding: 8px 12px;
54
+ background: #3B5526;
55
+ color: #FFF;
56
+ font-weight: bold;
57
+ border-bottom: 5px solid #81B953;
58
+ }
59
+
60
+
61
+ #sidebar ul li a:link,
62
+ #sidebar ul li a:visited {
63
+ background: #FFF;
64
+ border-bottom: 1px solid #F0F0EE;
65
+ text-decoration: none;
66
+ }
67
+
68
+ #sidebar ul li a:hover,
69
+ #sidebar ul li a:active {
70
+ background: #D3E8C1;
71
+ color: #FFF;
72
+ }
73
+
74
+ #main-navigation {
75
+ background: #44721e;
76
+ margin-right: 20px;
77
+ padding: 7px 7px 0 7px;
78
+ }
79
+
80
+ #main-navigation ul li {
81
+ background: #91B96F;
82
+ margin-right: 7px;
83
+ }
84
+
85
+ #main-navigation ul li a {
86
+ padding: 10px 10px 5px 10px;
87
+ }
88
+
89
+ #main-navigation ul li.active {
90
+ background: #e4ebe4;
91
+ border: 1px solid #91B96F;
92
+ border-bottom: none;
93
+ font-weight: bold;
94
+ }
95
+
96
+ #main-navigation ul li a:hover,
97
+ #main-navigation ul li a:link,
98
+ #main-navigation ul li a:visited,
99
+ #main-navigation ul li a:active,
100
+ .secondary-navigation ul li a:link, .secondary-navigation ul li a:visited,
101
+ .secondary-navigation ul li a:hover, .secondary-navigation ul li a:active {
102
+ text-decoration: none;
103
+ color: #FFF;
104
+ }
105
+
106
+ #user-navigation ul li a:link,
107
+ #user-navigation ul li a:visited,
108
+ #user-navigation ul li a:active {
109
+ color: #3B5526;
110
+ }
111
+
112
+ #user-navigation ul li a:hover { color: #fff; }
113
+
114
+ #main-navigation ul li.active a:link,
115
+ #main-navigation ul li.active a:visited,
116
+ #main-navigation ul li.active a:hover,
117
+ #main-navigation ul li.active a:active {
118
+ color: #262626;
119
+ }
120
+
121
+ .secondary-navigation {
122
+ background: #3B5526;
123
+ border-bottom: 5px solid #81b953;
124
+ }
125
+
126
+ .secondary-navigation ul li a {
127
+ display:block;
128
+ padding: 8px 12px;
129
+ }
130
+
131
+ .secondary-navigation ul li.active {background: #81b953; font-weight: bold;}
132
+ .secondary-navigation ul li.active a:hover {
133
+ background-color: #81B953;
134
+ }
135
+
136
+ .secondary-navigation li a:hover {
137
+ background: #81B953;
138
+ }
139
+
140
+ #footer .block {
141
+ color: #FFF;
142
+ background: #3B5526;
143
+ }
144
+
145
+ #footer .block p {
146
+ margin: 0;
147
+ padding: 5px;
148
+ }
149
+
150
+ /* pagination */
151
+
152
+ .pagination span.current {
153
+ background: #262626;
154
+ color: #FFF;
155
+ border-color: #262626;
156
+ }
157
+
158
+ .pagination a {
159
+ color: #262626;
160
+ border-color: #262626;
161
+ }
162
+
163
+ .pagination a:hover {
164
+ color: #FFF;
165
+ background: #262626;
166
+ }
167
+
168
+ /* tables */
169
+
170
+
171
+ .table th {
172
+ background: #253618;
173
+ color: #FFF;
174
+ }
175
+
176
+ .table tr th { padding: 5px; }
177
+
178
+ .table td {
179
+ border-bottom:1px solid #F0F0EE;
180
+ }
181
+ .table tr.odd {background: #ebfadf;}
182
+ .table tr.even {background: #d3e8c1;}
183
+
184
+
185
+ /* forms */
186
+
187
+ .form input.text_field, .form textarea.text_area {
188
+ width: 100%;
189
+ border: 1px solid #262626;
190
+ }
191
+
192
+ .form input.button {
193
+ background: #EEE;
194
+ color: #262626;
195
+ padding: 2px 5px;
196
+ border: 1px solid #262626;
197
+ cursor: pointer;
198
+ }
199
+
200
+ .form .description {
201
+ font-style: italic;
202
+ color: #8C8C8C;
203
+ font-size: .9em;
204
+ }
205
+
206
+ /* flash-messages */
207
+ .flash .message {
208
+ -moz-border-radius: 3px;
209
+ -webkit-border-radius: 3px;
210
+ text-align:center;
211
+ margin: 0 auto 15px;
212
+
213
+ }
214
+
215
+ .flash .message p {
216
+ margin:8px;
217
+ }
218
+ .flash .error {
219
+ border: 1px solid #fbb;
220
+ background-color: #fdd;
221
+ }
222
+ .flash .warning {
223
+ border: 1px solid #fffaaa;
224
+ background-color: #ffffcc;
225
+ }
226
+ .flash .notice {
227
+ border: 1px solid #1FDF00;
228
+ background-color: #BBFFB6;
229
+ }
230
+
231
+ /* lists */
232
+
233
+ ul.list li {
234
+ border-bottom-color: #F0F0EE;
235
+ border-bottom-width: 1px;
236
+ border-bottom-style: solid;
237
+ }
238
+
239
+ ul.list li .item .avatar {
240
+ border-color: #F0F0EE;
241
+ border-width: 1px;
242
+ border-style: solid;
243
+ padding: 2px;
244
+ }
245
+
246
+ /* box */
247
+
248
+ #box .block {
249
+ background: #FFF;
250
+ }
251
+
252
+ #box .block h2 {
253
+ color: #fff;
254
+ background: #3B5526;
255
+ border-bottom: 5px solid #81b953;
256
+ }
257
+
258
+ #box .block .content { border: 1px solid #81b953; border}
259
+
260
+ /* login */
261
+
262
+ #block-login { }
263
+ #block-login h2 { background: #3B5526;border-bottom: 5px solid #81b953;}
264
+
265
+ /* rounded borders */
266
+
267
+ #main, #main-navigation, #main-navigation li,
268
+ .secondary-navigation, #main .block, #sidebar .block,
269
+ #sidebar h3, ul.list li, #footer .block,
270
+ .form input.button, #box .block, #box .block h2 {
271
+ -moz-border-radius-topleft: 4px;
272
+ -webkit-border-top-left-radius: 4px;
273
+ -moz-border-radius-topright: 4px;
274
+ -webkit-border-top-right-radius: 4px;
275
+ }
276
+
277
+ .secondary-navigation li.first a,
278
+ .secondary-navigation ul li.first,
279
+ .table th.first, .table th.first {
280
+ -moz-border-radius-topleft: 4px;
281
+ -webkit-border-top-left-radius: 4px;
282
+ }
283
+
284
+ .table th.last {
285
+ -moz-border-radius-topright: 4px;
286
+ -webkit-border-top-right-radius: 4px;
287
+ }
288
+
289
+ .secondary-navigation ul li.first {
290
+ -moz-border-radius-topleft: 4px;
291
+ -webkit-border-top-left-radius: 4px;
292
+ }
293
+
294
+ #sidebar, #sidebar .block, #main .block,
295
+ #sidebar ul.navigation, ul.list li,
296
+ #footer .block, .form input.button, #box .block {
297
+ -moz-border-radius-bottomleft: 4px;
298
+ -webkit-border-bottom-left-radius: 4px;
299
+ -moz-border-radius-bottomright: 4px;
300
+ -webkit-border-bottom-right-radius: 4px;
301
+ }
@@ -0,0 +1,391 @@
1
+ a:link, a:visited { color: #07b; text-decoration: none; }
2
+ a, a:hover, a:active { color: #d30; }
3
+ h1, h2, h3 {color: #444}
4
+
5
+ body {
6
+ color: #333;
7
+ background: #EBEBEB;
8
+ font: normal 12px/1.5em "Lucida Grande", "Helvetica Neue", Arial, sans-serif;
9
+ }
10
+
11
+ hr {
12
+ background: #aaa;
13
+ }
14
+
15
+ p {
16
+ font-size: 12px;
17
+ line-height: 20px;
18
+ }
19
+
20
+ input.checkbox {
21
+ vertical-align:middle;
22
+ }
23
+
24
+ #header h1 {
25
+ font-size: 28px;
26
+ padding: 5px 0;
27
+ margin: 5px 0;
28
+ }
29
+
30
+ .hightlight {
31
+ background-color: #ffc;
32
+ }
33
+ .small {
34
+ font-size: 11px;
35
+ }
36
+ .gray {
37
+ color: #999;
38
+ }
39
+ #header {
40
+ background: #232C30;
41
+ }
42
+
43
+ #header h1 a:link, #header h1 a:active, #header h1 a:hover, #header h1 a:visited {
44
+ color: #eaeaea;
45
+ }
46
+
47
+ #main {
48
+ background: #EBEBEB;
49
+ width: 73%;
50
+ }
51
+
52
+ #main .block {
53
+ -moz-border-radius-topleft: 4px;
54
+ -moz-border-radius-topright: 4px;
55
+ padding: 0;
56
+ margin-bottom:20px;
57
+ padding-bottom: 20px;
58
+ background: transparent;
59
+ }
60
+
61
+ #main .block .content {
62
+ border-left: 1px solid #ddd;
63
+ border-top: 1px solid #ddd;
64
+ border-bottom: 1px solid #ccc;
65
+ border-right: 1px solid #ccc;
66
+ background: #fff;
67
+ }
68
+
69
+ #main .block h2.title {
70
+ margin: 10px 0 5px 0;
71
+ background-color: none;
72
+ padding: 5px 5px 5px 15px;
73
+ font-size:18px;
74
+ color: #456;
75
+ }
76
+
77
+ .main_container {
78
+ padding:10px;
79
+ }
80
+
81
+ #footer {
82
+ background-color: #ddd;
83
+ border-top: 1px solid #bbb;
84
+ }
85
+
86
+ #footer .block {
87
+ font-size:11px;
88
+ background-color: #ddd;
89
+ padding: 0 10px;
90
+ text-align: right;
91
+ }
92
+
93
+ /* #sidebar .block { background: #FFF; padding-bottom:0px; } */
94
+
95
+ #sidebar .notice {
96
+ background-color: #ffc;
97
+ padding: 0 10px;
98
+ border-bottom:1px solid #ddd;
99
+ border-right:1px solid #ddd;
100
+ border-top:1px solid #fff;
101
+ border-left:1px solid #fff;
102
+ }
103
+ #sidebar .notice h2 {
104
+ font-size:16px;
105
+ margin: 5px 0;
106
+ border-bottom:1px solid #456;
107
+ }
108
+ #sidebar .notice p {
109
+ font-size:12px;
110
+ }
111
+
112
+ #sidebar .block {
113
+ padding-bottom: 0;
114
+ }
115
+
116
+ #sidebar .block .content {
117
+ padding: 0 10px;
118
+ }
119
+
120
+
121
+ #sidebar h3 {
122
+ background: #fff;
123
+ border-bottom:1px solid #ccc;
124
+ border-right:1px solid #ccc;
125
+ border-left:1px solid #ddd;
126
+ border-top:1px solid #ddd;
127
+ padding: 5px 10px;
128
+ color: #333;
129
+ font-weight: bold;
130
+ }
131
+
132
+ #sidebar ul li a:link, #sidebar ul li a:visited {
133
+ font-size:12px;
134
+ }
135
+
136
+ #sidebar ul li a:hover, #sidebar ul li a:active {
137
+ background: none;
138
+ color: #444;
139
+ font-size:12px;
140
+ text-decoration:underline;
141
+ }
142
+ #sidebar ul.navigation li.last a {
143
+ border-bottom: none;
144
+ }
145
+
146
+ #sidebar ul.navigation li a:link,#sidebar ul.navigation li a:visited {
147
+ padding: 5px 10px;
148
+ color:#6a6a6a;
149
+ text-decoration: none;
150
+ }
151
+ #sidebar ul.navigation li a:hover {
152
+ text-decoration:underline;
153
+ }
154
+ #sidebar .block .sidebar-block h4 {
155
+ border-bottom: 1px dotted #aaa;
156
+ }
157
+ #main-navigation ul li {
158
+ background: #456;
159
+ border-top: 1px solid #5C738A;
160
+ color: #eee;
161
+ border-top-left-radius: 5px;
162
+ border-top-right-radius: 5px;
163
+ }
164
+
165
+ #main-navigation ul li:hover {
166
+ border-top-color: #7593B0;
167
+ background-color: #576C82 !important;
168
+ color: #fff;
169
+ }
170
+
171
+ #main-navigation ul li.active {
172
+ border-top: 1px solid #fff;
173
+ background-color: #eee !important;
174
+ color: #333;
175
+ }
176
+
177
+ #main-navigation ul li a:link, #main-navigation ul li a:visited, #main-navigation ul li a:hover, #main-navigation ul li a:active,
178
+ .secondary-navigation ul li a:link, .secondary-navigation ul li a:visited, .secondary-navigation ul li a:hover, .secondary-navigation ul li a:active,
179
+ #user-navigation ul li a:link, #user-navigation ul li a:visited, #user-navigation ul li a:hover, #user-navigation ul li a:active {
180
+ text-decoration: none;
181
+ color: #FFF;
182
+ }
183
+
184
+ #user-navigation ul li a:link, #user-navigation ul li a:visited {
185
+ color: #CDE;
186
+ border-bottom: 1px dotted #345;
187
+ }
188
+
189
+ #user-navigation ul li a:hover {
190
+ color: #fff;
191
+ border-bottom: 1px dotted #CDE;
192
+ text-decoration: none;
193
+ }
194
+
195
+ #main-navigation ul li a {
196
+ font-size: 12px;
197
+ padding: 3px 10px;
198
+ }
199
+
200
+ #main-navigation ul li.active a:link, #main-navigation ul li.active a:visited, #main-navigation ul li.active a:hover, #main-navigation ul li.active a:active {
201
+ color: #364b69;
202
+ }
203
+
204
+ .secondary-navigation {
205
+ background: #eaeaea;
206
+ border-bottom: 0px;
207
+ }
208
+
209
+ .secondary-navigation ul li {
210
+ background: #456;
211
+ border-top: 1px solid #5C738A;
212
+ color: #eee;
213
+ margin-right: 5px;
214
+ border-top-left-radius: 5px;
215
+ border-top-right-radius: 5px;
216
+ }
217
+
218
+ .secondary-navigation ul li a {
219
+ padding: 3px 10px;
220
+ }
221
+
222
+ .secondary-navigation ul li.active:hover {
223
+ background: #fff !important;
224
+ border-top: 1px solid #ccc;
225
+ border-right: 1px solid #ccc;
226
+ }
227
+
228
+ .secondary-navigation ul li.active {
229
+ border-top: 1px solid #ddd;
230
+ border-left: 1px solid #ddd;
231
+ border-right: 1px solid #ccc;
232
+ border-bottom: 1px solid #fff;
233
+ margin-bottom: -1px;
234
+ background-color: #fff !important;
235
+ color: #333;
236
+ }
237
+
238
+ .secondary-navigation ul li.active a {
239
+ color: #333;
240
+ }
241
+
242
+ .secondary-navigation ul li:hover {
243
+ border-top-color: #7593B0;
244
+ background-color: #576C82 !important;
245
+ color: #fff;
246
+ }
247
+
248
+ /* pagination */
249
+
250
+ .pagination span.current {
251
+ background: #576C82;
252
+ color: #FFF;
253
+ border: 1px solid #7593B0;
254
+ -moz-border-radius:5px;
255
+ }
256
+
257
+ .pagination span.disabled {
258
+ background: #eee;
259
+ color: #aaa;
260
+ border: 1px solid #ddd;
261
+ -moz-border-radius:5px;
262
+ }
263
+
264
+ .pagination a {
265
+ color: #364B69;
266
+ border: 1px solid #ddd;
267
+ -moz-border-radius:5px;
268
+ font-size:11px;
269
+ }
270
+
271
+ .pagination a:hover {
272
+ color: #444;
273
+ background: #eaeaea;
274
+ border: 1px solid #576C82;
275
+ }
276
+
277
+ /* tables */
278
+
279
+ .table th {
280
+ background: #576C82;
281
+ color: #FFF;
282
+ font-weight:normal;
283
+ padding:3px;
284
+ }
285
+
286
+ .table th a.toggle {
287
+ display: block;
288
+ width: 12px;
289
+ height: 12px;
290
+ background: transparent url('images/tick.png') center no-repeat;
291
+ text-indent: -9999px;
292
+ -moz-outline: none;
293
+ }
294
+
295
+ .table th.first {
296
+ width: 30px;
297
+ text-align: center;
298
+ }
299
+
300
+ .table td {
301
+ border-bottom: 1px solid #AAA;
302
+ }
303
+
304
+ /* forms */
305
+
306
+ .form input.text, .form textarea.textarea {
307
+ border: 1px solid #ddd;
308
+ padding: 5px;
309
+ width:99%;
310
+ }
311
+
312
+ .form input.text_field, .form textarea.text_area {
313
+ border-right: 1px solid #ddd;
314
+ border-bottom: 1px solid #ddd;
315
+ border-top: 2px solid #ccc;
316
+ border-left: 2px solid #ccc;
317
+ width:99%;
318
+ }
319
+
320
+ .form .navform {
321
+ padding:10px;
322
+ background-color: #eee;
323
+ font-size:14px;
324
+ border-bottom:1px solid #ddd;
325
+ border-right:1px solid #ddd;
326
+ border-top:1px solid #eee;
327
+ border-left:1px solid #eee;
328
+ }
329
+
330
+ .form .navform input {
331
+ font-size:14px;
332
+ }
333
+
334
+ .description {
335
+ color:#aaa;
336
+ font-family:Georgia, serif;
337
+ }
338
+
339
+ /* flash-messages */
340
+ .flash .message {
341
+ -moz-border-radius: 3px;
342
+ -webkit-border-radius: 3px;
343
+ text-align:center;
344
+ margin:0 auto 5px;
345
+ width:80%;
346
+ }
347
+ .flash .message p {
348
+ margin:8px;
349
+ }
350
+ .flash .error {
351
+ border: 1px solid #fbb;
352
+ background-color: #fdd;
353
+ }
354
+ .flash .warning {
355
+ border: 1px solid #fffaaa;
356
+ background-color: #ffffcc;
357
+ }
358
+ .flash .notice {
359
+ border: 1px solid #ddf;
360
+ background-color: #eef;
361
+ }
362
+
363
+ /* lists */
364
+
365
+ ul.list li {
366
+ border-bottom-color: #F0F0EE;
367
+ }
368
+
369
+ ul.list li .item .avatar {
370
+ border-color: #F0F0EE;
371
+ margin: 3px 10px 0 0;
372
+ }
373
+
374
+ ul.list li .left {
375
+ padding: 5px 5px;
376
+ }
377
+
378
+ /* box */
379
+
380
+ #box .block {
381
+ background: #FFF;
382
+ border: 1px solid #ddd;
383
+ border-radius: 10px;
384
+ }
385
+
386
+ #box .block h2 {
387
+ background: #576C82;
388
+ color: #FFF;
389
+ border-top-left-radius: 5px;
390
+ border-top-right-radius: 5px;
391
+ }