ZURB-foundation 2.1.3.3 → 2.1.4
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.
- data/README.mkdn +16 -2
- data/lib/ZURB-foundation.rb +2 -2
- data/stylesheets/ZURB/_buttons.sass +101 -0
- data/stylesheets/ZURB/_forms.sass +26 -12
- data/stylesheets/ZURB/_globals.sass +53 -24
- data/stylesheets/ZURB/_grid.sass +105 -102
- data/stylesheets/ZURB/_mobile.sass +61 -27
- data/stylesheets/ZURB/_orbit.sass +87 -22
- data/stylesheets/ZURB/_reveal.sass +20 -19
- data/stylesheets/ZURB/_typography.sass +18 -8
- data/stylesheets/ZURB/_ui.sass +45 -123
- data/stylesheets/ZURB/includes/_colors.sass +5 -1
- data/stylesheets/ZURB/includes/_mixins.sass +10 -6
- data/stylesheets/ZURB/includes/_settings.sass +43 -3
- data/stylesheets/_ZURB-foundation.sass +13 -0
- data/templates/project/index.html +2 -11
- data/templates/project/javascripts/app.js +25 -26
- data/templates/project/javascripts/jquery.customforms.js +65 -13
- data/templates/project/javascripts/modernizr.foundation.js +4 -0
- data/templates/project/manifest.rb +3 -2
- data/templates/project/sass/app.sass +9 -21
- data/templates/project/sass/ie.sass +4 -4
- metadata +7 -5
- data/stylesheets/ZURB/_foundation.sass +0 -9
data/stylesheets/ZURB/_ui.sass
CHANGED
@@ -1,117 +1,17 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
/* :: Nav */
|
12
|
-
/* :: Video */
|
13
|
-
/* :: Microformats */
|
1
|
+
// Table of Contents:
|
2
|
+
//
|
3
|
+
// Notices and Alerts
|
4
|
+
// Tabs
|
5
|
+
// Pagination
|
6
|
+
// Lists
|
7
|
+
// Panels
|
8
|
+
// Nav
|
9
|
+
// Video
|
10
|
+
// Microformats
|
14
11
|
|
15
|
-
|
16
|
-
|
17
|
-
background: $blue
|
18
|
-
display: inline-block
|
19
|
-
text-align: center
|
20
|
-
padding: 9px 34px 11px
|
21
|
-
color: $white
|
22
|
-
text-decoration: none
|
23
|
-
font-weight: bold
|
24
|
-
+HelveticaFontStack
|
25
|
-
line-height: 1
|
26
|
-
position: relative
|
27
|
-
cursor: pointer
|
28
|
-
border: none
|
29
|
-
&.nice
|
30
|
-
background-color: $blue
|
31
|
-
+background-image(linear-gradient(rgba(255,255,255,0.2) 0%, rgba(255,255,255,0.2) 50%, rgba(0,0,0,0) 51%, rgba(0,0,0,0) 100%))
|
32
|
-
+box-shadow(0 1px 0 rgba(255,255,255,0.5) inset)
|
33
|
-
text-shadow: 0 -1px 1px rgba(0,0,0,0.28)
|
34
|
-
border: solid 1px darken($blue, 7%)
|
35
|
-
+transition-property(background-color)
|
36
|
-
+transition-duration(.15s)
|
37
|
-
+transition-timing-function(ease-in-out)
|
38
|
-
&.radius
|
39
|
-
+border-radius(3px)
|
40
|
-
&.round
|
41
|
-
+border-radius(1000)
|
42
|
-
&.full-width
|
43
|
-
width: 100%
|
44
|
-
padding-left: 0 !important
|
45
|
-
padding-right: 0 !important
|
46
|
-
text-align: center
|
47
|
-
&.left-align
|
48
|
-
text-align: left
|
49
|
-
text-indent: 12px
|
50
|
-
|
51
|
-
input[type=submit].button
|
52
|
-
-webkit-appearance: none
|
53
|
-
|
54
|
-
/* Sizes */
|
55
|
-
.button
|
56
|
-
&.small
|
57
|
-
+font-size(11)
|
58
|
-
padding: 8px 20px 10px
|
59
|
-
width: auto
|
60
|
-
&.medium
|
61
|
-
+font-size(13)
|
62
|
-
width: auto
|
63
|
-
&.large
|
64
|
-
+font-size(18)
|
65
|
-
padding: 11px 48px 13px
|
66
|
-
width: auto
|
67
|
-
/* Colors */
|
68
|
-
.button
|
69
|
-
&.blue
|
70
|
-
background-color: $blue
|
71
|
-
&.red
|
72
|
-
background-color: $red
|
73
|
-
&.white
|
74
|
-
background-color: #e9e9e9
|
75
|
-
color: #333
|
76
|
-
&.black
|
77
|
-
background-color: $black
|
78
|
-
/* Nice Colors */
|
79
|
-
.nice
|
80
|
-
&.button
|
81
|
-
&.blue
|
82
|
-
border: solid 1px darken($blue, 7%)
|
83
|
-
&.red
|
84
|
-
border: solid 1px darken($red, 7%)
|
85
|
-
&.white
|
86
|
-
border: solid 1px darken($white, 14%)
|
87
|
-
text-shadow: none !important
|
88
|
-
&.black
|
89
|
-
border: solid 1px darken($black, 7%)
|
90
|
-
/* Hovers */
|
91
|
-
.button
|
92
|
-
&:hover, &:focus
|
93
|
-
background-color: darken($blue, 5%)
|
94
|
-
color: #fff
|
95
|
-
&.blue
|
96
|
-
&:hover, &:focus
|
97
|
-
background-color: darken($blue, 5%)
|
98
|
-
&.red
|
99
|
-
&:hover, &:focus
|
100
|
-
background-color: darken($red, 5%)
|
101
|
-
&.white
|
102
|
-
&:hover, &:focus
|
103
|
-
background-color: darken($white, 12%)
|
104
|
-
color: #333
|
105
|
-
&.black
|
106
|
-
&:hover, &:focus
|
107
|
-
background-color: darken($black, 5%)
|
12
|
+
// Alerts
|
13
|
+
//----------------------------------------------------------------------------------------------------
|
108
14
|
|
109
|
-
/* Disabled */
|
110
|
-
.button.disabled, .button[disabled]
|
111
|
-
+opacity(0.6)
|
112
|
-
cursor: default
|
113
|
-
|
114
|
-
/* Alerts */
|
115
15
|
div.alert-box
|
116
16
|
display: block
|
117
17
|
padding: 6px 7px
|
@@ -146,7 +46,9 @@ div.alert-box
|
|
146
46
|
&:hover, &:focus
|
147
47
|
+opacity(0.4)
|
148
48
|
|
149
|
-
|
49
|
+
// Tabs
|
50
|
+
//----------------------------------------------------------------------------------------------------
|
51
|
+
|
150
52
|
dl.tabs
|
151
53
|
display: block
|
152
54
|
margin: 0 0 20px
|
@@ -186,6 +88,8 @@ dl.tabs
|
|
186
88
|
background: #fff
|
187
89
|
border-width: 1px 1px 0 1px
|
188
90
|
height: 30px
|
91
|
+
|
92
|
+
// Nice tabs
|
189
93
|
.nice
|
190
94
|
&.tabs
|
191
95
|
border-bottom: solid 1px #eee
|
@@ -211,6 +115,8 @@ dl.tabs
|
|
211
115
|
&:first-child
|
212
116
|
a.active
|
213
117
|
margin-left: 0
|
118
|
+
|
119
|
+
// Vertical tabs
|
214
120
|
dl.tabs.vertical
|
215
121
|
height: auto
|
216
122
|
dl.tabs.vertical dt, dl.tabs.vertical dd, dl.nice.tabs.vertical dt, dl.nice.tabs.vertical dd
|
@@ -233,6 +139,8 @@ dl.tabs.vertical dd a
|
|
233
139
|
margin: 0
|
234
140
|
border-width: 1px 0 0
|
235
141
|
background: $white
|
142
|
+
|
143
|
+
// Nice tabs vertical
|
236
144
|
.nice.tabs.vertical
|
237
145
|
border-bottom: solid 1px #eee
|
238
146
|
height: auto
|
@@ -283,7 +191,9 @@ ul.nice.contained.tabs-content
|
|
283
191
|
&>li
|
284
192
|
border-color: #eee
|
285
193
|
|
286
|
-
|
194
|
+
// Pagination
|
195
|
+
//----------------------------------------------------------------------------------------------------
|
196
|
+
|
287
197
|
ul.pagination
|
288
198
|
display: block
|
289
199
|
height: 24px
|
@@ -311,7 +221,9 @@ ul.pagination
|
|
311
221
|
a
|
312
222
|
border-bottom: none
|
313
223
|
|
314
|
-
|
224
|
+
// Lists
|
225
|
+
//----------------------------------------------------------------------------------------------------
|
226
|
+
|
315
227
|
ul.nice, ol.nice
|
316
228
|
list-style: none
|
317
229
|
margin: 0
|
@@ -324,7 +236,9 @@ ul.nice li span.bullet, ol.nice li span.number
|
|
324
236
|
top: 0
|
325
237
|
color: #ccc
|
326
238
|
|
327
|
-
|
239
|
+
// Panels
|
240
|
+
//----------------------------------------------------------------------------------------------------
|
241
|
+
|
328
242
|
div.panel
|
329
243
|
padding: 20px 20px 2px 20px
|
330
244
|
background-color: #efefef
|
@@ -332,7 +246,9 @@ div.panel
|
|
332
246
|
+box-shadow(0 2px 5px rgba(0,0,0,0.15))
|
333
247
|
margin: 0 0 20px 0
|
334
248
|
|
335
|
-
|
249
|
+
// Nav Bar with Dropdowns
|
250
|
+
//----------------------------------------------------------------------------------------------------
|
251
|
+
|
336
252
|
.nav-bar
|
337
253
|
height: 45px
|
338
254
|
background: #fff
|
@@ -404,9 +320,11 @@ div.panel
|
|
404
320
|
p:last-child
|
405
321
|
margin-bottom: 0
|
406
322
|
|
407
|
-
|
408
|
-
|
409
|
-
.video
|
323
|
+
// Video
|
324
|
+
//----------------------------------------------------------------------------------------------------
|
325
|
+
// Mad props to http://www.alistapart.com/articles/creating-intrinsic-ratios-for-video/
|
326
|
+
|
327
|
+
.flex-video
|
410
328
|
position: relative
|
411
329
|
padding-top: 25px
|
412
330
|
padding-bottom: 67.5%
|
@@ -424,8 +342,10 @@ div.panel
|
|
424
342
|
width: 100%
|
425
343
|
height: 100%
|
426
344
|
|
427
|
-
|
428
|
-
|
345
|
+
// Microformats
|
346
|
+
//----------------------------------------------------------------------------------------------------
|
347
|
+
|
348
|
+
// hcard
|
429
349
|
ul.vcard
|
430
350
|
display: inline-block
|
431
351
|
margin: 0 0 12px 0
|
@@ -437,6 +357,8 @@ ul.vcard
|
|
437
357
|
&.fn
|
438
358
|
font-weight: bold
|
439
359
|
+font-size(15)
|
360
|
+
|
361
|
+
// vevent
|
440
362
|
p.vevent span.summary
|
441
363
|
font-weight: bold
|
442
364
|
p.vevent abbr
|
@@ -444,4 +366,4 @@ p.vevent abbr
|
|
444
366
|
text-decoration: none
|
445
367
|
font-weight: bold
|
446
368
|
border: none
|
447
|
-
padding: 0 1px
|
369
|
+
padding: 0 1px
|
@@ -1,16 +1,17 @@
|
|
1
|
-
// Compass
|
1
|
+
// Compass imports
|
2
2
|
//----------------------------------------------------------------------------------------------------
|
3
3
|
|
4
4
|
@import compass/css3
|
5
5
|
@import compass/utilities
|
6
6
|
|
7
|
-
// Font
|
7
|
+
// Font stack
|
8
8
|
//----------------------------------------------------------------------------------------------------
|
9
9
|
|
10
10
|
@mixin HelveticaFontStack
|
11
|
-
font-family:
|
11
|
+
font-family: $helvetica-font-stack
|
12
12
|
|
13
13
|
// Font size mixin to include px and rem
|
14
|
+
//----------------------------------------------------------------------------------------------------
|
14
15
|
|
15
16
|
@mixin font-size($size, $is-important: false)
|
16
17
|
@if $is-important
|
@@ -20,13 +21,16 @@
|
|
20
21
|
font-size: $size + px
|
21
22
|
font-size: ($size / 10) + rem
|
22
23
|
|
23
|
-
// WebKit
|
24
|
-
|
25
|
-
|
24
|
+
// WebKit font-smoothing
|
25
|
+
//----------------------------------------------------------------------------------------------------
|
26
|
+
|
26
27
|
// References:
|
27
28
|
//
|
28
29
|
// 1. http://maxvoltar.com/sandbox/fontsmoothing/
|
29
30
|
// 2. http://maxvoltar.com/archive/-webkit-font-smoothing
|
31
|
+
//
|
32
|
+
// Values: none, antialiased (default), subpixel-antialiased
|
33
|
+
//
|
30
34
|
|
31
35
|
@mixin font-smoothing($value: antialiased)
|
32
36
|
-webkit-font-smoothing: $value
|
@@ -1,5 +1,45 @@
|
|
1
|
-
//
|
1
|
+
// `Global Foundation vars
|
2
2
|
//----------------------------------------------------------------------------------------------------
|
3
3
|
|
4
|
-
|
5
|
-
|
4
|
+
//
|
5
|
+
// This file contains global variables and settings for Foundation
|
6
|
+
// When adding new variables, be sure to use `!default` to allow over-riding at the project level
|
7
|
+
//
|
8
|
+
|
9
|
+
// Compass experimental support setttings
|
10
|
+
//----------------------------------------------------------------------------------------------------
|
11
|
+
|
12
|
+
$experimental-support-for-khtml: false !default
|
13
|
+
$experimental-support-for-microsoft: false !default
|
14
|
+
|
15
|
+
// Font stacks
|
16
|
+
//----------------------------------------------------------------------------------------------------
|
17
|
+
|
18
|
+
$helvetica-font-stack: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif
|
19
|
+
|
20
|
+
// Default body tag variables
|
21
|
+
//----------------------------------------------------------------------------------------------------
|
22
|
+
|
23
|
+
$body-font-size: 13 !default
|
24
|
+
$body-font-family: $helvetica-font-stack !default
|
25
|
+
$body-background: #fff !default
|
26
|
+
$body-line-height: 18px !default
|
27
|
+
$body-color: #555 !default
|
28
|
+
|
29
|
+
// Grid settings
|
30
|
+
//----------------------------------------------------------------------------------------------------
|
31
|
+
|
32
|
+
$grid-max-width: 980px !default
|
33
|
+
$grid-min-width: 727px !default
|
34
|
+
$support-block-grid-nth-child: false !default
|
35
|
+
|
36
|
+
// Button settings
|
37
|
+
//----------------------------------------------------------------------------------------------------
|
38
|
+
|
39
|
+
$button-transition-duration: .25s !default
|
40
|
+
|
41
|
+
// Orbit settings
|
42
|
+
//----------------------------------------------------------------------------------------------------
|
43
|
+
|
44
|
+
$orbit-slider-id: featured !default
|
45
|
+
$include-default-orbit-slider-id: true !default
|
@@ -0,0 +1,13 @@
|
|
1
|
+
// Shared
|
2
|
+
@import ZURB/includes
|
3
|
+
|
4
|
+
// Foundation parts
|
5
|
+
@import ZURB/globals
|
6
|
+
@import ZURB/typography
|
7
|
+
@import ZURB/grid
|
8
|
+
@import ZURB/buttons
|
9
|
+
@import ZURB/ui
|
10
|
+
@import ZURB/forms
|
11
|
+
@import ZURB/orbit
|
12
|
+
@import ZURB/reveal
|
13
|
+
@import ZURB/mobile
|
@@ -14,16 +14,6 @@
|
|
14
14
|
<title>Welcome to Foundation</title>
|
15
15
|
|
16
16
|
<!-- Included CSS Files -->
|
17
|
-
<!-- Combine and Compress These CSS Files -->
|
18
|
-
<link rel="stylesheet" href="stylesheets/globals.css">
|
19
|
-
<link rel="stylesheet" href="stylesheets/typography.css">
|
20
|
-
<link rel="stylesheet" href="stylesheets/grid.css">
|
21
|
-
<link rel="stylesheet" href="stylesheets/ui.css">
|
22
|
-
<link rel="stylesheet" href="stylesheets/forms.css">
|
23
|
-
<link rel="stylesheet" href="stylesheets/orbit.css">
|
24
|
-
<link rel="stylesheet" href="stylesheets/reveal.css">
|
25
|
-
<link rel="stylesheet" href="stylesheets/mobile.css">
|
26
|
-
<!-- End Combine and Compress These CSS Files -->
|
27
17
|
<link rel="stylesheet" href="stylesheets/app.css">
|
28
18
|
|
29
19
|
<!--[if lt IE 9]>
|
@@ -45,7 +35,7 @@
|
|
45
35
|
<div class="row">
|
46
36
|
<div class="twelve columns">
|
47
37
|
<h2>Welcome to Foundation</h2>
|
48
|
-
<p>This is version 2.
|
38
|
+
<p>This is version 2.1.4 released on January 07, 2011</p>
|
49
39
|
|
50
40
|
<hr />
|
51
41
|
</div>
|
@@ -140,6 +130,7 @@
|
|
140
130
|
|
141
131
|
<!-- Included JS Files -->
|
142
132
|
<script src="javascripts/jquery.min.js"></script>
|
133
|
+
<script src="javascripts/modernizr.foundation.js"></script>
|
143
134
|
<script src="javascripts/jquery.reveal.js"></script>
|
144
135
|
<script src="javascripts/jquery.orbit-1.3.0.js"></script>
|
145
136
|
<script src="javascripts/forms.jquery.js"></script>
|
@@ -29,10 +29,11 @@ $(document).ready(function () {
|
|
29
29
|
if (window.location.hash) {
|
30
30
|
activateTab($('a[href="' + window.location.hash + '"]'));
|
31
31
|
}
|
32
|
-
|
32
|
+
|
33
33
|
/* ALERT BOXES ------------ */
|
34
|
-
$(".alert-box").delegate("a.close", "click", function() {
|
35
|
-
|
34
|
+
$(".alert-box").delegate("a.close", "click", function(event) {
|
35
|
+
event.preventDefault();
|
36
|
+
$(this).closest(".alert-box").fadeOut(function(event){
|
36
37
|
$(this).remove();
|
37
38
|
});
|
38
39
|
});
|
@@ -50,43 +51,41 @@ $(document).ready(function () {
|
|
50
51
|
// $('.block-grid.three-up>li:nth-child(3n+1)').css({clear: 'left'});
|
51
52
|
// $('.block-grid.four-up>li:nth-child(4n+1)').css({clear: 'left'});
|
52
53
|
// $('.block-grid.five-up>li:nth-child(5n+1)').css({clear: 'left'});
|
53
|
-
|
54
|
-
|
55
|
-
|
54
|
+
|
55
|
+
|
56
|
+
|
56
57
|
/* DROPDOWN NAV ------------- */
|
57
|
-
|
58
|
-
|
58
|
+
|
59
|
+
var currentFoundationDropdown = null;
|
60
|
+
$('.nav-bar li a').each(function() {
|
59
61
|
$(this).data('clicks', 0);
|
60
62
|
});
|
61
|
-
$('.nav-bar li a
|
62
|
-
e.stopPropagation();
|
63
|
+
$('.nav-bar li a').on('click', function(e) {
|
63
64
|
e.preventDefault();
|
64
|
-
|
65
|
+
if (currentFoundationDropdown !== $(this).index() || currentFoundationDropdown === null) {
|
66
|
+
$(this).data('clicks', 0);
|
67
|
+
currentFoundationDropdown = $(this).index();
|
68
|
+
}
|
65
69
|
$(this).data('clicks', ($(this).data('clicks') + 1));
|
66
|
-
|
70
|
+
var f = $(this).siblings('.flyout');
|
71
|
+
if (!f.is(':visible') && $(this).parent('.has-flyout').length > 1) {
|
67
72
|
$('.nav-bar li .flyout').hide();
|
68
73
|
f.show();
|
69
|
-
}
|
70
|
-
});
|
71
|
-
$('.nav-bar li a, .nav-bar li a:after').bind(' touchend click', function(e) {
|
72
|
-
e.stopPropagation();
|
73
|
-
e.preventDefault();
|
74
|
-
if ($(this).data('clicks') > 1) {
|
74
|
+
} else if (($(this).data('clicks') > 1) || ($(this).parent('.has-flyout').length < 1)) {
|
75
75
|
window.location = $(this).attr('href');
|
76
76
|
}
|
77
77
|
});
|
78
|
-
$('.nav-bar').
|
78
|
+
$('.nav-bar').on('click', function(e) {
|
79
79
|
e.stopPropagation();
|
80
|
-
if (
|
80
|
+
if ($(e.target).parents().is('.flyout') || $(e.target).is('.flyout')) {
|
81
81
|
e.preventDefault();
|
82
82
|
}
|
83
83
|
});
|
84
|
-
$('body').bind('touchend', function(e) {
|
85
|
-
|
86
|
-
|
87
|
-
|
88
|
-
});
|
89
|
-
*/
|
84
|
+
// $('body').bind('touchend', function(e) {
|
85
|
+
// if (!$(e.target).parents().is('.nav-bar') || !$(e.target).is('.nav-bar')) {
|
86
|
+
// $('.nav-bar li .flyout').is(':visible').hide();
|
87
|
+
// }
|
88
|
+
// });
|
90
89
|
|
91
90
|
/* DISABLED BUTTONS ------------- */
|
92
91
|
/* Gives elements with a class of 'disabled' a return: false; */
|