bootswatch-rails 0.0.12 → 0.1.0

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.
@@ -1,33 +1,31 @@
1
- // Variables to customize the look and feel of Bootstrap
1
+ // Variables
2
2
  // Swatch: Spacelab
3
- // Version: 2.0.2
4
- // -----------------------------------------------------
5
-
6
-
3
+ // Version: 2.1.1
4
+ // --------------------------------------------------
7
5
 
8
- // GLOBAL VALUES
6
+ // Global values
9
7
  // --------------------------------------------------
10
8
 
11
9
 
12
10
  // Grays
13
11
  // -------------------------
14
12
  $black: #000;
15
- $grayDarker: #222;
13
+ $grayDarker: #2D2D2D;
16
14
  $grayDark: #333;
17
- $gray: #555;
18
- $grayLight: #999;
15
+ $gray: #777;
16
+ $grayLight: #bbb;
19
17
  $grayLighter: #eee;
20
18
  $white: #fff;
21
19
 
22
20
 
23
21
  // Accent colors
24
22
  // -------------------------
25
- $blue: #4183C4;
23
+ $blue: #3399F3;
26
24
  $blueDark: #405A6A;
27
- $green: #84DE81;
28
- $red: #E5322C;
25
+ $green: #819E37;
26
+ $red: #CD0200;
29
27
  $yellow: #F4CA00;
30
- $orange: #FF7D00;
28
+ $orange: #D47500;
31
29
  $pink: #F44B8C;
32
30
  $purple: #405A6A;
33
31
 
@@ -35,24 +33,28 @@ $purple: #405A6A;
35
33
  // Scaffolding
36
34
  // -------------------------
37
35
  $bodyBackground: $white;
38
- $textColor: $grayDark;
36
+ $textColor: $grayDarker;
39
37
 
40
38
 
41
39
  // Links
42
40
  // -------------------------
43
- $linkColor: #4183C4;
41
+ $linkColor: #558BC4;
44
42
  $linkColorHover: $linkColor;
45
43
 
46
44
 
47
45
  // Typography
48
46
  // -------------------------
49
- $baseFontSize: 13px;
50
- $baseFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif;
51
- $baseLineHeight: 18px;
52
- $altFontFamily: Georgia, "Times New Roman", Times, serif;
47
+ $sansFontFamily: "Muli", "Helvetica Neue", Helvetica, Arial, sans-serif;
48
+ $serifFontFamily: Georgia, "Times New Roman", Times, serif;
49
+ $monoFontFamily: Menlo, Monaco, Consolas, "Courier New", monospace;
50
+
51
+ $baseFontSize: 14px;
52
+ $baseFontFamily: $sansFontFamily;
53
+ $baseLineHeight: 21px;
54
+ $altFontFamily: $serifFontFamily;
53
55
 
54
56
  $headingsFontFamily: inherit; // empty to use BS default, $baseFontFamily
55
- $headingsFontWeight: bold; // instead of browser default, bold
57
+ $headingsFontWeight: normal; // instead of browser default, bold
56
58
  $headingsColor: inherit; // empty to use BS default, $textColor
57
59
 
58
60
 
@@ -67,42 +69,52 @@ $tableBorder: #ddd; // table and cell border
67
69
  // Buttons
68
70
  // -------------------------
69
71
  $btnBackground: $white;
70
- $btnBackgroundHighlight: darken($white, 10%);
71
- $btnBorder: darken($white, 20%);
72
+ $btnBackgroundHighlight: $grayLighter;
73
+ $btnBorder: darken($btnBackground, 20%);
72
74
 
73
- $btnPrimaryBackground: $linkColor;
74
- $btnPrimaryBackgroundHighlight: adjust-hue($btnPrimaryBackground, 15%);
75
+ $btnPrimaryBackground: lighten($linkColor, 15%);
76
+ $btnPrimaryBackgroundHighlight: $linkColor;
75
77
 
76
- $btnInfoBackground: #5bc0de;
77
- $btnInfoBackgroundHighlight: #2f96b4;
78
+ $btnInfoBackground: lighten($grayLight, 15%);
79
+ $btnInfoBackgroundHighlight: $grayLight;
78
80
 
79
- $btnSuccessBackground: #62c462;
80
- $btnSuccessBackgroundHighlight: #51a351;
81
+ $btnSuccessBackground: lighten($green, 15%);
82
+ $btnSuccessBackgroundHighlight: $green;
81
83
 
82
84
  $btnWarningBackground: lighten($orange, 15%);
83
85
  $btnWarningBackgroundHighlight: $orange;
84
86
 
85
- $btnDangerBackground: #ee5f5b;
86
- $btnDangerBackgroundHighlight: #bd362f;
87
+ $btnDangerBackground: lighten($red, 15%);
88
+ $btnDangerBackgroundHighlight: $red;
87
89
 
88
- $btnInverseBackground: $gray;
89
- $btnInverseBackgroundHighlight: $grayDarker;
90
+ // To avoid use variable not defined yet
91
+ $navbarInverseBackground: #6C737E;
92
+
93
+ $btnInverseBackground: lighten($navbarInverseBackground, 15%);
94
+ $btnInverseBackgroundHighlight: $navbarInverseBackground;
90
95
 
91
96
 
92
97
  // Forms
93
98
  // -------------------------
94
99
  $inputBackground: $white;
95
100
  $inputBorder: #ccc;
101
+ $inputBorderRadius: 3px;
96
102
  $inputDisabledBackground: $grayLighter;
97
-
103
+ $formActionsBackground: #f5f5f5;
98
104
 
99
105
  // Dropdowns
100
106
  // -------------------------
101
107
  $dropdownBackground: $white;
102
108
  $dropdownBorder: rgba(0,0,0,.2);
103
- $dropdownLinkColor: $grayDark;
109
+ $dropdownDividerTop: #e5e5e5;
110
+ $dropdownDividerBottom: $white;
111
+
112
+ $dropdownLinkColor: $textColor;
104
113
  $dropdownLinkColorHover: $white;
105
- $dropdownLinkBackgroundHover: $linkColor;
114
+ $dropdownLinkColorActive: $dropdownLinkColor;
115
+
116
+ $dropdownLinkBackgroundActive: $linkColor;
117
+ $dropdownLinkBackgroundHover: $dropdownLinkBackgroundActive;
106
118
 
107
119
 
108
120
 
@@ -116,7 +128,7 @@ $dropdownLinkBackgroundHover: $linkColor;
116
128
  // Try to avoid customizing these :)
117
129
  $zindexDropdown: 1000;
118
130
  $zindexPopover: 1010;
119
- $zindexTooltip: 1020;
131
+ $zindexTooltip: 1030;
120
132
  $zindexFixedNavbar: 1030;
121
133
  $zindexModalBackdrop: 1040;
122
134
  $zindexModal: 1050;
@@ -132,23 +144,59 @@ $placeholderText: $grayLight;
132
144
  $hrBorder: $grayLighter;
133
145
 
134
146
 
147
+ // Horizontal forms & lists
148
+ // -------------------------
149
+ $horizontalComponentOffset: 180px;
150
+
151
+
152
+ // Wells
153
+ // -------------------------
154
+ $wellBackground: #f5f5f5;
155
+
156
+
135
157
  // Navbar
136
158
  // -------------------------
159
+ $navbarCollapseWidth: 979px;
160
+
137
161
  $navbarHeight: 40px;
138
- $navbarBackground: #EAEAEA;
139
- $navbarBackgroundHighlight: lighten($navbarBackground, 15%);
162
+ $navbarBackgroundHighlight: #eee;
163
+ $navbarBackground: $grayLight;
164
+ $navbarBorder: darken($navbarBackground, 5%);
140
165
 
141
- $navbarText: $grayDarker;
142
- $navbarLinkColor: $grayDarker;
166
+ $navbarText: $textColor;
167
+ $navbarLinkColor: $textColor;
143
168
  $navbarLinkColorHover: $linkColor;
144
- $navbarLinkColorActive: $navbarLinkColorHover;
169
+ $navbarLinkColorActive: $textColor;
145
170
  $navbarLinkBackgroundHover: transparent;
146
- $navbarLinkBackgroundActive: $navbarBackground;
171
+ $navbarLinkBackgroundActive: transparent;
147
172
 
148
- $navbarSearchBackground: lighten($navbarBackground, 25%);
149
- $navbarSearchBackgroundFocus: $white;
150
- $navbarSearchBorder: darken($navbarSearchBackground, 30%);
151
- $navbarSearchPlaceholderColor: #ccc;
173
+ $navbarBrandColor: $grayDark;
174
+
175
+ // Inverted navbar
176
+ $navbarInverseBackground: #6C737E;
177
+ $navbarInverseBackgroundHighlight: lighten($navbarInverseBackground, 25%);
178
+ $navbarInverseBorder: darken($navbarInverseBackground, 5%);
179
+
180
+ $navbarInverseText: $grayLighter;
181
+ $navbarInverseLinkColor: $grayLighter;
182
+ $navbarInverseLinkColorHover: $white;
183
+ $navbarInverseLinkColorActive: $white;
184
+ $navbarInverseLinkBackgroundHover: transparent;
185
+ $navbarInverseLinkBackgroundActive: $navbarInverseBackground;
186
+
187
+ $navbarInverseSearchBackground: lighten($navbarInverseBackground, 25%);
188
+ $navbarInverseSearchBackgroundFocus: $white;
189
+ $navbarInverseSearchBorder: $navbarInverseBackground;
190
+ $navbarInverseSearchPlaceholderColor: $grayLighter;
191
+
192
+ $navbarInverseBrandColor: $navbarInverseLinkColor;
193
+
194
+
195
+ // Pagination
196
+ // -------------------------
197
+ $paginationBackground: #fff;
198
+ $paginationBorder: #ddd;
199
+ $paginationActiveBackground: #f5f5f5;
152
200
 
153
201
 
154
202
  // Hero unit
@@ -160,28 +208,44 @@ $heroUnitLeadColor: inherit;
160
208
 
161
209
  // Form states and alerts
162
210
  // -------------------------
163
- $warningText: #393939;
164
- $warningBackground: #F5F3B4;
211
+ $warningText: $white;
212
+ $warningBackground: $orange;
165
213
  $warningBorder: darken(adjust-hue($warningBackground, -10), 3%);
166
214
 
167
- $errorText: $warningText;
168
- $errorBackground: #FFE9E9;
215
+ $errorText: $white;
216
+ $errorBackground: $red;
169
217
  $errorBorder: darken(adjust-hue($errorBackground, -10), 3%);
170
218
 
171
- $successText: #333;
172
- $successBackground: #BEDEBE;
219
+ $successText: $white;
220
+ $successBackground: $green;
173
221
  $successBorder: darken(adjust-hue($successBackground, -10), 5%);
174
222
 
175
- $infoText: #1B3650;
176
- $infoBackground: #E4F0FF;
223
+ $infoText: $white;
224
+ $infoBackground: $blue;
177
225
  $infoBorder: darken(adjust-hue($infoBackground, -10), 7%);
178
226
 
227
+ // Tooltips and popovers
228
+ // -------------------------
229
+ $tooltipColor: #fff;
230
+ $tooltipBackground: #000;
231
+ $tooltipArrowWidth: 5px;
232
+ $tooltipArrowColor: $tooltipBackground;
233
+
234
+ $popoverBackground: #fff;
235
+ $popoverArrowWidth: 10px;
236
+ $popoverArrowColor: #fff;
237
+ $popoverTitleBackground: darken($popoverBackground, 3%);
238
+
239
+ // Special enhancement for popovers
240
+ $popoverArrowOuterWidth: $popoverArrowWidth + 1;
241
+ $popoverArrowOuterColor: rgba(0,0,0,.25);
179
242
 
180
243
 
181
244
 
182
245
  // GRID
183
246
  // --------------------------------------------------
184
247
 
248
+
185
249
  // Default 940px grid
186
250
  // -------------------------
187
251
  $gridColumns: 12;
@@ -189,8 +253,26 @@ $gridColumnWidth: 60px;
189
253
  $gridGutterWidth: 20px;
190
254
  $gridRowWidth: ($gridColumns * $gridColumnWidth) + ($gridGutterWidth * ($gridColumns - 1));
191
255
 
256
+ // 1200px min
257
+ $gridColumnWidth1200: 70px;
258
+ $gridGutterWidth1200: 30px;
259
+ $gridRowWidth1200: ($gridColumns * $gridColumnWidth1200) + ($gridGutterWidth1200 * ($gridColumns - 1));
260
+
261
+ // 768px-979px
262
+ $gridColumnWidth768: 42px;
263
+ $gridGutterWidth768: 20px;
264
+ $gridRowWidth768: ($gridColumns * $gridColumnWidth768) + ($gridGutterWidth768 * ($gridColumns - 1));
265
+
192
266
 
193
267
  // Fluid grid
194
268
  // -------------------------
195
- $fluidGridColumnWidth: 6.382978723%;
196
- $fluidGridGutterWidth: 2.127659574%;
269
+ $fluidGridColumnWidth: percentage($gridColumnWidth/$gridRowWidth);
270
+ $fluidGridGutterWidth: percentage($gridGutterWidth/$gridRowWidth);
271
+
272
+ // 1200px min
273
+ $fluidGridColumnWidth1200: percentage($gridColumnWidth1200/$gridRowWidth1200);
274
+ $fluidGridGutterWidth1200: percentage($gridGutterWidth1200/$gridRowWidth1200);
275
+
276
+ // 768px-979px
277
+ $fluidGridColumnWidth768: percentage($gridColumnWidth768/$gridRowWidth768);
278
+ $fluidGridGutterWidth768: percentage($gridGutterWidth768/$gridRowWidth768);
@@ -1,5 +1,5 @@
1
1
  // Swatch: Superhero
2
- // Version: 2.0.2
2
+ // Version: 2.0.4
3
3
  // -----------------------------------------------------
4
4
 
5
5
  // TYPOGRAPHY
@@ -8,16 +8,14 @@
8
8
  @import url(https://fonts.googleapis.com/css?family=Oswald);
9
9
  @import url(https://fonts.googleapis.com/css?family=Noticia+Text);
10
10
 
11
- h1, h2, h3, h4, h5, h6, legend, .navbar .brand,
12
- .navbar .nav > li > a,
11
+ h6, legend,
13
12
  h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
14
- font-family: 'Oswald', sans-serif;
13
+ font-family: $headingsFontFamily;
15
14
  color: $orange;
16
15
  text-shadow: -1px 1px 0 darken($orange, 30%);
17
16
  }
18
17
 
19
- h1, h2, legend, .navbar .brand,
20
- .navbar .nav > li > a {
18
+ h1, h2, legend {
21
19
  text-shadow: -2px 2px 0 darken($orange, 30%);
22
20
  }
23
21
 
@@ -50,115 +48,120 @@ blockquote.pull-right {
50
48
  // NAVBAR
51
49
  // --------------------------------------------------
52
50
 
53
- .navbar .nav > li.active > a {
54
- color: $orange;
55
- }
51
+ .navbar {
56
52
 
57
- .navbar .brand:hover,
58
- .navbar .nav > li > a:hover,
59
- .navbar .nav > li.active > a:hover,
60
- .navbar .nav > li.dropdown.open > a,
61
- .navbar .nav > li.dropdown.open > a:hover {
62
- position: relative;
63
- top: 1px;
64
- left: -1px;
65
- color: $orange;
66
- text-shadow: -1px 1px 0 darken($orange, 30%);
67
- }
53
+ .navbar-inner {
54
+ @include box-shadow(none);
55
+ background-image: none;
56
+ }
68
57
 
69
- .navbar .navbar-inner {
70
- @include box-shadow(none);
71
- background-image: none;
72
- }
58
+ .brand {
59
+ padding: 25px 20px 15px;
60
+ font-family: $headingsFontFamily;
61
+ font-size: 30px;
62
+ text-shadow: -2px 2px 0 darken($orange, 30%);
63
+ }
73
64
 
74
- .navbar .brand {
75
- padding: 25px 20px 15px;
76
- font-size: 30px;
77
- }
65
+ .nav > li > a {
66
+ padding: 27px 20px 13px;
67
+ line-height: 30px;
68
+ font-family: $headingsFontFamily;
69
+ font-size: 22px;
70
+ text-shadow: -2px 2px 0 darken($orange, 30%);
71
+ }
78
72
 
79
- .navbar .nav > li > a {
80
- padding: 27px 20px 13px;
81
- line-height: 30px;
82
- font-size: 22px;
83
- }
73
+ .navbar-text {
74
+ padding: 27px 20px 13px;
75
+ line-height: 30px;
76
+ font-family: $headingsFontFamily;
77
+ font-size: 22px;
78
+ text-shadow: -2px 2px 0 $gray;
79
+ }
84
80
 
85
- .navbar-search {
86
- padding-top: 20px;
87
- }
81
+ .nav > li.active > a {
82
+ color: $orange;
83
+ }
88
84
 
89
- .navbar-search .search-query {
90
- font-family: $baseFontFamily;
91
- font-size: $baseFontSize;
92
- line-height: $baseLineHeight;
93
- color: $textColor;
94
- background-color: $blue;
95
- @include box-shadow(none);
96
- border: none;
97
- }
85
+ .brand:hover,
86
+ .nav > li > a:hover,
87
+ .nav > li.active > a:hover,
88
+ .nav > li.dropdown.open > a,
89
+ .nav > li.dropdown.open > a:hover {
90
+ position: relative;
91
+ top: 1px;
92
+ left: -1px;
93
+ color: $orange;
94
+ text-shadow: -1px 1px 0 darken($orange, 30%);
95
+ }
98
96
 
99
- .navbar .divider-vertical {
100
- height: 70px;
101
- }
97
+ .navbar-search {
98
+ padding-top: 20px;
99
+ }
102
100
 
103
- .dropdown .caret {
104
- margin-top: 14px;
105
- opacity: 1;
106
- border-left: 6px solid transparent;
107
- border-right: 6px solid transparent;
108
- border-top: 6px solid lighten($blue, 10%);
109
- }
101
+ .navbar-search .search-query {
102
+ font-family: $baseFontFamily;
103
+ font-size: $baseFontSize;
104
+ line-height: $baseLineHeight;
105
+ color: $textColor;
106
+ background-color: $blue;
107
+ @include box-shadow(none);
108
+ border: none;
109
+ }
110
110
 
111
- .navbar .nav .dropdown-toggle .caret,
112
- .navbar .nav .open.dropdown .caret,
113
- .nav-pills .dropdown .caret,
114
- .nav-pills .dropdown:hover .caret {
115
- border-top-color: $textColor;
116
- }
111
+ .divider-vertical {
112
+ height: 70px;
113
+ }
117
114
 
118
- .navbar .dropdown-menu::before {
119
- border: none;
120
- }
115
+ .nav .dropdown-toggle .caret,
116
+ .nav .open.dropdown .caret {
117
+ border-top-color: $textColor;
118
+ }
121
119
 
122
- .navbar .dropdown-menu::after {
123
- left: 20px;
124
- border-left: 7px solid transparent;
125
- border-right: 7px solid transparent;
126
- border-bottom: 7px solid lighten($blue, 10%);
127
- }
120
+ .dropdown-menu::before {
121
+ border: none;
122
+ }
128
123
 
129
- .navbar [class^="icon-"], .navbar [class*=" icon-"] {
130
- vertical-align: 20%;
131
- }
124
+ .dropdown-menu::after {
125
+ left: 20px;
126
+ border-left: 7px solid transparent;
127
+ border-right: 7px solid transparent;
128
+ border-bottom: 7px solid lighten($blue, 10%);
129
+ }
132
130
 
133
- .navbar .btn-navbar {
134
- background-color: $blue;
135
- border-color: transparent;
136
- }
131
+ .btn-navbar {
132
+ background-color: $blue;
133
+ border-color: transparent;
134
+ }
137
135
 
138
- .navbar .nav-collapse.in {
139
- background-color: $blue;
140
- @include border-radius(4px);
136
+ .nav-collapse.in {
137
+ background-color: $blue;
138
+ @include border-radius(4px);
141
139
 
142
- li > a {
143
- color: $textColor;
144
- }
140
+ li > a {
141
+ color: $textColor;
142
+ }
145
143
 
146
- li > a:hover {
147
- color: $textColor;
148
- background-color: lighten($blue, 10%);
144
+ li > a:hover {
145
+ color: $textColor;
146
+ background-color: lighten($blue, 10%);
147
+ }
149
148
  }
150
- }
151
149
 
152
- .navbar .nav-collapse.in > .nav > li > a {
153
- color: $orange;
150
+ .nav-collapse.in > .nav > li > a {
151
+ color: $orange;
154
152
 
155
- &:hover {
156
- background-color: lighten($blue, 10%);
153
+ &:hover {
154
+ background-color: lighten($blue, 10%);
155
+ }
157
156
  }
158
157
  }
159
158
 
160
- .subnav.subnav-fixed {
161
- top: 70px;
159
+ .dropdown .caret {
160
+ margin-top: 14px;
161
+ opacity: 1;
162
+ border-left: 6px solid transparent;
163
+ border-right: 6px solid transparent;
164
+ border-top: 6px solid lighten($blue, 10%);
162
165
  }
163
166
 
164
167
  div.subnav {
@@ -177,52 +180,49 @@ div.subnav {
177
180
  .nav > li.active > a:hover {
178
181
  background-color: lighten($blue, 10%);
179
182
  }
180
- }
181
183
 
182
- div.subnav .nav > li + li > a {
183
- border-top: 0px solid transparent;
184
- }
185
-
186
- div.subnav .nav > li:first-child > a,
187
- div.subnav .nav > li:first-child > a:hover,
188
- div.subnav .nav > li.active:first-child > a,
189
- div.subnav .nav > li.active:first-child > a:hover {
190
- @include border-radius(4px 0 0 4px);
191
- }
192
-
193
- div.subnav .nav > li.active > a,
194
- div.subnav .nav > li.active > a:hover {
195
- color: $white;
196
- background-color: $orange;
197
- background-image: none;
198
- @include box-shadow(none);
199
- }
184
+ .nav > li + li > a {
185
+ border-top: 0px solid transparent;
186
+ }
200
187
 
201
- div.subnav.subnav-fixed {
202
- @include box-shadow(none);
188
+ .nav > li:first-child > a,
189
+ .nav > li:first-child > a:hover,
190
+ .nav > li.active:first-child > a,
191
+ .nav > li.active:first-child > a:hover {
192
+ @include border-radius(4px 0 0 4px);
193
+ }
203
194
 
204
- .nav > li > a,
205
195
  .nav > li.active > a,
206
- .nav > li > a:hover,
207
196
  .nav > li.active > a:hover {
208
- border-color: transparent;
209
- padding-left: 12px;
210
- padding-right: 12px;
211
- @include border-radius(0);
197
+ color: $white;
198
+ background-color: $orange;
199
+ background-image: none;
200
+ @include box-shadow(none);
212
201
  }
213
202
 
203
+ &.subnav-fixed {
204
+ top: 70px;
205
+ @include box-shadow(none);
214
206
 
215
- .nav > li > a:hover,
216
- .nav > li.active > a:hover {
217
- color: $white;
207
+ .nav > li > a,
208
+ .nav > li.active > a,
209
+ .nav > li > a:hover,
210
+ .nav > li.active > a:hover {
211
+ border-color: transparent;
212
+ padding-left: 12px;
213
+ padding-right: 12px;
214
+ @include border-radius(0);
215
+ }
216
+
217
+ .nav > li > a:hover,
218
+ .nav > li.active > a:hover {
219
+ color: $white;
220
+ }
218
221
  }
219
- }
220
-
221
- .dropdown-menu {
222
222
 
223
- .divider {
224
- border-bottom: none;
225
- background-color: $blue;
223
+ .nav > .active > a .caret,
224
+ .nav > .active > a:hover .caret {
225
+ border-top-color: $textColor;
226
226
  }
227
227
  }
228
228
 
@@ -409,6 +409,11 @@ div.subnav.subnav-fixed {
409
409
  border-color: transparent;
410
410
  }
411
411
 
412
+ .nav-pills .dropdown .caret,
413
+ .nav-pills .dropdown:hover .caret {
414
+ border-top-color: $textColor;
415
+ }
416
+
412
417
  .dropdown.open .dropdown-menu > li > a:hover,
413
418
  .dropdown.open .dropdown-menu > li.active > a:hover {
414
419
  background-color: $orange;
@@ -496,7 +501,6 @@ label {
496
501
  }
497
502
 
498
503
  .form-actions {
499
- background-color: transparent;
500
504
  border-top: none;
501
505
  }
502
506
 
@@ -512,6 +516,29 @@ label {
512
516
  @include formFieldState(lighten($successText, 10%), lighten($successText, 10%), $successBackground);
513
517
  }
514
518
 
519
+ // MODALS
520
+ // --------------------------------------------------
521
+
522
+ .modal {
523
+ background-color: transparent;
524
+ }
525
+
526
+ .modal-header,
527
+ .modal-body,
528
+ .modal-footer {
529
+ @include box-shadow(none);
530
+ background-color: $bodyBackground;
531
+ border: none;
532
+ }
533
+
534
+ .modal-header {
535
+ @include border-radius(4px 4px 0 0);
536
+ }
537
+
538
+ .modal-footer {
539
+ @include border-radius(0 0 4px 4px);
540
+ }
541
+
515
542
  // MISCELLANEOUS
516
543
  // --------------------------------------------------
517
544
 
@@ -523,12 +550,17 @@ footer.footer {
523
550
  border-top: 1px solid darken($blueDark, 5%);
524
551
  }
525
552
 
526
- .well {
553
+ .well, .hero-unit {
527
554
  background-color: $blue;
528
555
  border: none;
529
556
  @include box-shadow(none);
530
557
  }
531
558
 
559
+ .hero-unit h1 {
560
+ color: $orange;
561
+ line-height: 2em;
562
+ }
563
+
532
564
  .progress {
533
565
  background-color: darken($blueDark, 5%);
534
566
  background-image: none;