caboose-cms 0.5.13 → 0.5.14

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,15 +1,15 @@
1
1
  ---
2
2
  !binary "U0hBMQ==":
3
3
  metadata.gz: !binary |-
4
- MzhiMDY0ZDQ3NGY0NzdjNzgwZTk0OTBiZmYwOGE3MGRkNTMwNDQ5NA==
4
+ YWRhNDZlOGY5YzA5ODcwOTliYmRmMzU3OTMwZmMxNTEzNzM0MmYyNA==
5
5
  data.tar.gz: !binary |-
6
- MzI3NTQ1NjJkMGY5ZTFmZTc5MTE1MGZjZDZmNjM0YWE3N2Q3MzY4NQ==
6
+ ODliZDMwODBmN2Q1ZmZjNjU1YTgwNWRiZGYwMjk1NGM3MmE4NDgyMw==
7
7
  !binary "U0hBNTEy":
8
8
  metadata.gz: !binary |-
9
- YTI1MDI3MDA3M2QzYTViMGJjNGNiNzUzYTk2ODk2YTU1MjQwMmZjYTNiOWIz
10
- MmQ3ZTk1NTczYjdkMDliMWFmNjdhMTc2NThkYjNmZDEyODQ4ZDNkZGY4YWI0
11
- NWIwMGFlZjQ1ZDY2MmQ3NWFjYWE3MzcwMzliYzBiMjA0OWQ1MjI=
9
+ NmY1MmZhNTU0NTJlMmE3ZDRjZjQ3YjQyYmZmNGE0MTI1Nzg4YjhlNDg2MDY5
10
+ NWYyMjgyYmY3YzgwZGU0ODA3MzMwM2QzZDBmN2QxOTg5OThhOWJhMGFjMzMy
11
+ ZDNhNjYzMDA5ZDQxZjQ3NTQyMTkzNDg2MWExYWJkMjVlMjU0YmY=
12
12
  data.tar.gz: !binary |-
13
- ODk0ZWNmN2VkOWY5ZmU3MWExMTIwY2I0MTYzYzMyNTQ5YmM4ZDNhODA0ZWJk
14
- NDIyMWQyMTNiMDc0NDhmNzc0ZGI1ZTA1NGQ0ODZlNWRlZTUwZmIzOTU3ZGRl
15
- NWJmZjVhNzg2ZmY5ZDRjM2Q0N2ViMzRjZWE2NDE0YzZhN2YzZTM=
13
+ NWY2OWNiZGVkZTA2ZjFhNWY5Mjg4YjkxMjVkZmI3MzBkNDQyNmNmMTJkMDhk
14
+ OGM0MTIwZTdlNDY5NGZlZDk5YWFjNWIzYjAzYjFjNWFiYWZhNjBmZTBiNGU0
15
+ NmE4MjM0NzY5MGM3YTQyMWVmYWVjNjEwMzlmMGMxMTM3M2YyNGU=
@@ -0,0 +1,406 @@
1
+ //
2
+ // Checkout
3
+ //
4
+
5
+ #checkout { padding-top: 75px }
6
+ #checkout * { box-sizing: border-box }
7
+
8
+ #checkout input[type=text],
9
+ #checkout input[type=password],
10
+ #checkout input[type=email] {
11
+ outline: none !important;
12
+ height: 36px;
13
+ }
14
+
15
+ #checkout input[type=submit],
16
+ #checkout button {
17
+ background: #000;
18
+ border: none;
19
+ color: #fff;
20
+ padding: 9px 11px;
21
+ }
22
+
23
+ #checkout {
24
+ font-family: 'Avenir';
25
+ min-height: 400px;
26
+ > header {
27
+ border-bottom: 1px solid #d0d0d0;
28
+ font-size: 27px;
29
+ line-height: 100px;
30
+ padding: 12px;
31
+ margin: 0 0 24px;
32
+ text-align: center;
33
+ @media screen and (max-width: 512px) { font-size: 19px }
34
+ }
35
+ h1, h2, h3, h4, h5, h6 {
36
+ text-align: center;
37
+ margin: 24px 0;
38
+ line-height: 1.5;
39
+ //span { color: $color-dark-blue; }
40
+ }
41
+ }
42
+
43
+ #checkout.loading {
44
+ position: relative;
45
+ &::before {
46
+ background: rgba(#fff, 0.75) url(/assets/loading.gif) center 200px no-repeat;
47
+ content: "";
48
+ height: 100%;
49
+ position: absolute;
50
+ width: 100%;
51
+ z-index: 99;
52
+ }
53
+ }
54
+
55
+ #checkout #checkout-line-items {
56
+ > ul {
57
+ border-top: 1px solid #d0d0d0;
58
+ border-bottom: 1px solid #d0d0d0;
59
+ list-style-type: none;
60
+ margin: 12px 0;
61
+ > li {
62
+ border-bottom: 1px solid #d0d0d0;
63
+ padding: 24px 0;
64
+ &:last-child { border-bottom: none }
65
+ > .wrapper { overflow: hidden }
66
+ }
67
+ }
68
+
69
+ li aside,
70
+ li section { float: left }
71
+ li aside {
72
+ border-right: 1px solid #d0d0d0;
73
+ overflow: hidden;
74
+ padding-right: 24px;
75
+ width: 350px;
76
+ }
77
+ li aside figure {
78
+ background-position: center center;
79
+ background-repeat: no-repeat;
80
+ background-size: cover;
81
+ float: left;
82
+ height: 100px;
83
+ margin-right: 12px;
84
+ width: 100px;
85
+ }
86
+ //li aside figure + p { margin-top: 24px }
87
+ li aside p {
88
+ //float: left;
89
+ line-height: 24px;
90
+ padding-left: 12px;
91
+ }
92
+ li section p {
93
+ color: #63544b;
94
+ font-size: 42px;
95
+ line-height: 100px;
96
+ padding-left: 42px;
97
+ }
98
+ .subtotal, .shipping, .tax, .total {
99
+ border-bottom: 1px solid #d0d0d0;
100
+ line-height: 1.5;
101
+ overflow: hidden;
102
+ padding: 24px 0;
103
+ span { line-height: 42px }
104
+ span:first-child {
105
+ display: block;
106
+ float: left;
107
+ width: 33%;
108
+ text-align: right;
109
+ }
110
+ span:last-child {
111
+ float: right;
112
+ font-size: 24px;
113
+ }
114
+ &:last-child {
115
+ border-bottom: none;
116
+ //span:last-child { color: $color-dark-blue }
117
+ }
118
+ }
119
+
120
+ li aside .price { display: none }
121
+ @media screen and (max-width: 648px) {
122
+ li aside { border-right: none }
123
+ li section p { display: none }
124
+ li aside .price { display: block }
125
+
126
+ .subtotal, .shipping, .tax, .total {
127
+ span { padding: 0 12px }
128
+ span:first-child { width: auto }
129
+ span.last-child { text-align: right }
130
+ }
131
+ }
132
+ }
133
+
134
+ #checkout #checkout-login {
135
+ background: #f2f2f2;
136
+ border-top: 1px solid #d0d0d0;
137
+ border-bottom: 1px solid #d0d0d0;
138
+ padding: 24px 0;
139
+ input[type=text],
140
+ input[type=password],
141
+ input[type=email] {
142
+ width: 100%;
143
+ }
144
+ ul {
145
+ list-style-type: none;
146
+ overflow: hidden;
147
+ > li {
148
+ border-right: 1px solid #d0d0d0;
149
+ color: #443f3a;
150
+ float: left;
151
+ line-height: 1.5;
152
+ margin: 0;
153
+ padding: 24px 0;
154
+ width: percentage(1/3);
155
+ text-align: center;
156
+ &:last-child { border-right: none }
157
+ p { margin: 0 0 6px }
158
+ button {
159
+ background: #000;
160
+ border: none;
161
+ border-radius: 3px;
162
+ color: #fff;
163
+ padding: 6px 12px;
164
+ text-transform: uppercase;
165
+ &.selected {
166
+ background: #821413;
167
+ }
168
+ }
169
+ }
170
+ @media screen and (max-width: 896px) {
171
+ > li {
172
+ float: none;
173
+ width: auto;
174
+ border-bottom: 1px solid darken(#f2f2f2, 12%);
175
+ padding: 0 0 24px;
176
+ margin-bottom: 24px;
177
+ &:last-child {
178
+ border-bottom: none;
179
+ padding-botom: 0;
180
+ margin-bottom: 0;
181
+ }
182
+ }
183
+ }
184
+ }
185
+
186
+ form {
187
+ /*
188
+ border-top: 1px solid #d0d0d0;
189
+ margin-top: 42px;
190
+ */
191
+ padding-top: 42px;
192
+ }
193
+ form input[type=text],
194
+ form input[type=email],
195
+ form input[type=password] {
196
+ background: #fff;
197
+ border: 1px solid #d0d0d0;
198
+ }
199
+ }
200
+
201
+ #checkout #checkout-address {
202
+ margin: 42px 0;
203
+ .wrapper { overflow: hidden }
204
+ h1, h2, h3, h4, h5, h6 {
205
+ text-align: left;
206
+ span {
207
+ font-size: 16px;
208
+ margin-left: 12px;
209
+ }
210
+ }
211
+ section {
212
+ float: left;
213
+ width: 50%;
214
+ &:first-child { padding-right: 12px }
215
+ &:last-child { padding-left: 12px }
216
+ @media screen and (max-width: 896px) {
217
+ float: none;
218
+ width: auto;
219
+ padding: 0;
220
+ }
221
+ }
222
+ label {
223
+ cursor: pointer;
224
+ display: block;
225
+ margin: 0 0 12px;
226
+ overflow: hidden;
227
+ width: 100%;
228
+ &:last-child { margin: 0 }
229
+ }
230
+ label span {
231
+ display: block;
232
+ float: left;
233
+ height: 42px;
234
+ line-height: 42px;
235
+ margin: 0;
236
+ padding: 0 0 12px;
237
+ width: 20%;
238
+ }
239
+ label input {
240
+ display: block;
241
+ float: left;
242
+ width: 80%;
243
+ }
244
+ label select {
245
+ display: block;
246
+ height: 24px;
247
+ margin: 12px 0;
248
+ float: left;
249
+ width: 80%;
250
+ }
251
+ label input[type=checkbox] {
252
+ display: inline-block;
253
+ float: none;
254
+ line-height: 42px;
255
+ margin: 0 6px 0 20%;
256
+ width: auto;
257
+ }
258
+ @media screen and (max-width: 480px) {
259
+ label span, label input, label select { float: none }
260
+ label span, label input { width: 100% }
261
+ label select {
262
+ margin-left: 6px;
263
+ width: auto;
264
+ }
265
+ label input[type=checkbox] {
266
+ margin: 24px 6px 24px 0;
267
+ }
268
+ }
269
+ }
270
+
271
+ #checkout #checkout-continue,
272
+ #checkout #checkout-complete {
273
+ clear: left;
274
+ /*
275
+ background: #ededed;
276
+ border-top: 1px solid #d0d0d0;
277
+ border-bottom: 1px solid #d0d0d0;
278
+ */
279
+ padding: 42px 0;
280
+ text-align: center;
281
+ em { margin: 0 12px }
282
+ @media screen and (max-width: 480px) {
283
+ button, a, em {
284
+ display: block;
285
+ margin: 0 0 12px;
286
+ &:last-child { margin: 0 }
287
+ }
288
+ button {
289
+ margin-left: auto;
290
+ margin-right: auto;
291
+ }
292
+ }
293
+ }
294
+
295
+ #checkout #checkout-shipping {
296
+ > section {
297
+ border-top: 1px solid #d0d0d0;
298
+ border-bottom: 1px solid #d0d0d0;
299
+ margin: 24px 0;
300
+ padding: 42px 0;
301
+ h1, h2, h3, h4, h5, h6 { text-align: left }
302
+ p { margin: 0 0 24px }
303
+ }
304
+ }
305
+
306
+ #checkout #checkout-payment {
307
+ margin: 42px 0;
308
+ h1, h2, h3, h4, h5, h6 { text-align: left }
309
+ input, label, select { margin: 12px 0 }
310
+ label { line-height: 32px }
311
+ input {
312
+ clear: both;
313
+ display: block;
314
+ width: 100%;
315
+ }
316
+ select {
317
+ margin-left: 12px;
318
+ margin-right: 12px;
319
+ width: 100px;
320
+ }
321
+ iframe { display: none }
322
+ form {
323
+ width: 450px;
324
+ @media screen and (max-width: 768px) { width: 100% }
325
+ }
326
+ }
327
+
328
+ #checkout #checkout-nav {
329
+ ul {
330
+ margin: 0 0 20px 0;
331
+ padding: 0;
332
+ list-style: none;
333
+ text-align: center;
334
+
335
+ li {
336
+ margin: 0 5px;
337
+ padding: 0;
338
+ list-style: none;
339
+ display: inline;
340
+
341
+ a {
342
+ display: inline-block;
343
+ margin: 0;
344
+ position: relative;
345
+ width: 15%;
346
+ height: 40px;
347
+
348
+ &.done { background: #cccccc; color: #666; text-decoration: line-through; }
349
+ &.current { background: #821413; color: #fff; font-weight: bold; }
350
+ &.not_done { background: #cccccc; color: #666; }
351
+
352
+ span { display: block; padding: 10px 0 0 0; }
353
+ }
354
+
355
+ a:before {
356
+ content: ' ';
357
+ height: 0;
358
+ position: absolute;
359
+ top: 0;
360
+ left: -10px;
361
+ width: 0;
362
+ border: 20px solid transparent;
363
+ border-width: 20px 10px;
364
+ border-top-color: #ccc;
365
+ border-right-color: transparent;
366
+ border-bottom-color: #ccc;
367
+ border-left-color: transparent;
368
+ }
369
+ a.current:before {
370
+ border-top-color: #821413;
371
+ border-right-color: transparent;
372
+ border-bottom-color: #821413;
373
+ }
374
+
375
+ a:after {
376
+ content: ' ';
377
+ height: 0;
378
+ position: absolute;
379
+ top: 0;
380
+ right: -20px;
381
+ width: 0;
382
+ border: 20px solid transparent;
383
+ border-width: 20px 10px;
384
+ border-left-color: #ccc;
385
+ }
386
+ a.current:after {
387
+ border-left-color: #821413;
388
+ }
389
+ }
390
+ }
391
+ }
392
+
393
+ #checkout-confirm {
394
+ width: 100%;
395
+ #line-items { width: 100%; margin: 0 auto;
396
+ table {
397
+ border-collapse: collapse;
398
+ td { padding: 4px 8px; border: #ccc 1px solid; }
399
+ th { padding: 4px 8px; font-weight: bold; background: #666; color: #fff; text-align: center; }
400
+ }
401
+ }
402
+ #billing_address { width: 25%; float: left; }
403
+ #shipping_address { width: 25%; float: left; }
404
+ #shipping_method { width: 25%; float: left; }
405
+ #payment_method { width: 25%; float: left; }
406
+ }
@@ -89,5 +89,8 @@
89
89
  </div>
90
90
 
91
91
  <%= content_for :caboose_js do %>
92
- <%= javascript_include_tag 'caboose/modules/checkout_step4' %>
92
+ <%= javascript_include_tag 'caboose/checkout_step4' %>
93
+ <% end %>
94
+ <%= content_for :caboose_css do %>
95
+ <%= stylesheet_link_tag 'caboose/checkout' %>
93
96
  <% end %>
@@ -52,5 +52,8 @@
52
52
  </div>
53
53
 
54
54
  <%= content_for :caboose_js do %>
55
- <%= javascript_include_tag 'caboose/modules/checkout_step1' %>
55
+ <%= javascript_include_tag 'caboose/checkout_step1' %>
56
56
  <% end %>
57
+ <%= content_for :caboose_css do %>
58
+ <%= stylesheet_link_tag 'caboose/checkout' %>
59
+ <% end %>
@@ -19,5 +19,8 @@
19
19
  </div>
20
20
 
21
21
  <%= content_for :caboose_js do %>
22
- <%= javascript_include_tag 'caboose/modules/checkout_step3' %>
22
+ <%= javascript_include_tag 'caboose/checkout_step3' %>
23
+ <% end %>
24
+ <%= content_for :caboose_css do %>
25
+ <%= stylesheet_link_tag 'caboose/checkout' %>
23
26
  <% end %>
@@ -47,6 +47,9 @@ ba = @order.billing_address
47
47
  </div>
48
48
 
49
49
  <%= content_for :caboose_js do %>
50
- <%= javascript_include_tag 'caboose/modules/checkout_step2' %>
50
+ <%= javascript_include_tag 'caboose/checkout_step2' %>
51
+ <% end %>
52
+ <%= content_for :caboose_css do %>
53
+ <%= stylesheet_link_tag 'caboose/checkout' %>
51
54
  <% end %>
52
55
 
@@ -1,3 +1,3 @@
1
1
  module Caboose
2
- VERSION = '0.5.13'
2
+ VERSION = '0.5.14'
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: caboose-cms
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.5.13
4
+ version: 0.5.14
5
5
  platform: ruby
6
6
  authors:
7
7
  - William Barry
@@ -309,6 +309,7 @@ files:
309
309
  - app/assets/stylesheets/caboose/application.css
310
310
  - app/assets/stylesheets/caboose/bound_input.css
311
311
  - app/assets/stylesheets/caboose/caboose.css
312
+ - app/assets/stylesheets/caboose/checkout.css.scss
312
313
  - app/assets/stylesheets/caboose/fonts/avenir-medium.eot
313
314
  - app/assets/stylesheets/caboose/fonts/avenir-medium.ttf
314
315
  - app/assets/stylesheets/caboose/fonts/big_noodle_titling.ttf