va_common 0.1.0 → 0.2.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (182) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +0 -4
  3. data/app/assets/js/va_common_main.js +16 -1
  4. data/lib/va_common/version.rb +1 -1
  5. data/lib/va_common.rb +4 -0
  6. data/va_common.gemspec +15 -0
  7. metadata +200 -177
  8. data/app/assets/js/foundation/foundation.abide.js +0 -408
  9. data/app/assets/js/foundation/foundation.accordion.js +0 -88
  10. data/app/assets/js/foundation/foundation.alert.js +0 -43
  11. data/app/assets/js/foundation/foundation.clearing.js +0 -586
  12. data/app/assets/js/foundation/foundation.dropdown.js +0 -463
  13. data/app/assets/js/foundation/foundation.equalizer.js +0 -104
  14. data/app/assets/js/foundation/foundation.interchange.js +0 -359
  15. data/app/assets/js/foundation/foundation.joyride.js +0 -932
  16. data/app/assets/js/foundation/foundation.js +0 -725
  17. data/app/assets/js/foundation/foundation.magellan.js +0 -215
  18. data/app/assets/js/foundation/foundation.offcanvas.js +0 -152
  19. data/app/assets/js/foundation/foundation.orbit.js +0 -476
  20. data/app/assets/js/foundation/foundation.reveal.js +0 -498
  21. data/app/assets/js/foundation/foundation.slider.js +0 -281
  22. data/app/assets/js/foundation/foundation.tab.js +0 -249
  23. data/app/assets/js/foundation/foundation.tooltip.js +0 -339
  24. data/app/assets/js/foundation/foundation.topbar.js +0 -458
  25. data/app/assets/js/foundation.min.js +0 -6376
  26. data/app/assets/js/vendor/html5shiv.js +0 -8
  27. data/app/assets/js/vendor/jquery-1.11.0.min.js +0 -4
  28. data/app/assets/js/vendor/jquery.js +0 -9789
  29. data/app/assets/js/vendor/jquery.smooth-scroll.js +0 -255
  30. data/app/assets/js/vendor/jquery.stellar.js +0 -651
  31. data/app/assets/js/vendor/jquery.tipsy.js +0 -258
  32. data/app/assets/js/vendor/menu.js +0 -40
  33. data/app/assets/js/vendor/modernizr.custom.js +0 -4
  34. data/app/assets/js/vendor/respond.min.js +0 -6
  35. data/app/assets/js/vendor/selectivizr-1.0.3b.js +0 -560
  36. data/app/assets/js/vendor/tota11y.min.js +0 -28
  37. data/app/assets/js/vendor/wow.min.js +0 -2
  38. data/app/assets/stylesheets/foundation/_functions.scss +0 -146
  39. data/app/assets/stylesheets/foundation/_settings.scss +0 -1467
  40. data/app/assets/stylesheets/foundation/_variables.scss +0 -1286
  41. data/app/assets/stylesheets/foundation/components/_accordion.scss +0 -157
  42. data/app/assets/stylesheets/foundation/components/_alert-boxes.scss +0 -128
  43. data/app/assets/stylesheets/foundation/components/_block-grid.scss +0 -132
  44. data/app/assets/stylesheets/foundation/components/_breadcrumbs.scss +0 -132
  45. data/app/assets/stylesheets/foundation/components/_button-groups.scss +0 -200
  46. data/app/assets/stylesheets/foundation/components/_buttons.scss +0 -259
  47. data/app/assets/stylesheets/foundation/components/_clearing.scss +0 -256
  48. data/app/assets/stylesheets/foundation/components/_dropdown-buttons.scss +0 -131
  49. data/app/assets/stylesheets/foundation/components/_dropdown.scss +0 -262
  50. data/app/assets/stylesheets/foundation/components/_flex-video.scss +0 -51
  51. data/app/assets/stylesheets/foundation/components/_forms.scss +0 -570
  52. data/app/assets/stylesheets/foundation/components/_global.scss +0 -481
  53. data/app/assets/stylesheets/foundation/components/_grid.scss +0 -289
  54. data/app/assets/stylesheets/foundation/components/_icon-bar.scss +0 -358
  55. data/app/assets/stylesheets/foundation/components/_inline-lists.scss +0 -57
  56. data/app/assets/stylesheets/foundation/components/_joyride.scss +0 -222
  57. data/app/assets/stylesheets/foundation/components/_keystrokes.scss +0 -61
  58. data/app/assets/stylesheets/foundation/components/_labels.scss +0 -106
  59. data/app/assets/stylesheets/foundation/components/_magellan.scss +0 -34
  60. data/app/assets/stylesheets/foundation/components/_offcanvas.scss +0 -515
  61. data/app/assets/stylesheets/foundation/components/_orbit.scss +0 -368
  62. data/app/assets/stylesheets/foundation/components/_pagination.scss +0 -162
  63. data/app/assets/stylesheets/foundation/components/_panels.scss +0 -101
  64. data/app/assets/stylesheets/foundation/components/_pricing-tables.scss +0 -150
  65. data/app/assets/stylesheets/foundation/components/_progress-bars.scss +0 -79
  66. data/app/assets/stylesheets/foundation/components/_range-slider.scss +0 -169
  67. data/app/assets/stylesheets/foundation/components/_reveal.scss +0 -202
  68. data/app/assets/stylesheets/foundation/components/_side-nav.scss +0 -116
  69. data/app/assets/stylesheets/foundation/components/_split-buttons.scss +0 -199
  70. data/app/assets/stylesheets/foundation/components/_sub-nav.scss +0 -123
  71. data/app/assets/stylesheets/foundation/components/_switches.scss +0 -238
  72. data/app/assets/stylesheets/foundation/components/_tables.scss +0 -135
  73. data/app/assets/stylesheets/foundation/components/_tabs.scss +0 -123
  74. data/app/assets/stylesheets/foundation/components/_thumbs.scss +0 -66
  75. data/app/assets/stylesheets/foundation/components/_toolbar.scss +0 -70
  76. data/app/assets/stylesheets/foundation/components/_tooltips.scss +0 -142
  77. data/app/assets/stylesheets/foundation/components/_top-bar.scss +0 -691
  78. data/app/assets/stylesheets/foundation/components/_type.scss +0 -525
  79. data/app/assets/stylesheets/foundation/components/_visibility.scss +0 -408
  80. data/app/assets/stylesheets/lib/_normalize.scss +0 -427
  81. data/app/assets/stylesheets/lib/bourbon/_bourbon-deprecated-upcoming.scss +0 -411
  82. data/app/assets/stylesheets/lib/bourbon/_bourbon.scss +0 -87
  83. data/app/assets/stylesheets/lib/bourbon/addons/_border-color.scss +0 -26
  84. data/app/assets/stylesheets/lib/bourbon/addons/_border-radius.scss +0 -48
  85. data/app/assets/stylesheets/lib/bourbon/addons/_border-style.scss +0 -25
  86. data/app/assets/stylesheets/lib/bourbon/addons/_border-width.scss +0 -25
  87. data/app/assets/stylesheets/lib/bourbon/addons/_buttons.scss +0 -64
  88. data/app/assets/stylesheets/lib/bourbon/addons/_clearfix.scss +0 -25
  89. data/app/assets/stylesheets/lib/bourbon/addons/_ellipsis.scss +0 -30
  90. data/app/assets/stylesheets/lib/bourbon/addons/_font-stacks.scss +0 -31
  91. data/app/assets/stylesheets/lib/bourbon/addons/_hide-text.scss +0 -27
  92. data/app/assets/stylesheets/lib/bourbon/addons/_margin.scss +0 -26
  93. data/app/assets/stylesheets/lib/bourbon/addons/_padding.scss +0 -26
  94. data/app/assets/stylesheets/lib/bourbon/addons/_position.scss +0 -48
  95. data/app/assets/stylesheets/lib/bourbon/addons/_prefixer.scss +0 -66
  96. data/app/assets/stylesheets/lib/bourbon/addons/_retina-image.scss +0 -25
  97. data/app/assets/stylesheets/lib/bourbon/addons/_size.scss +0 -51
  98. data/app/assets/stylesheets/lib/bourbon/addons/_text-inputs.scss +0 -112
  99. data/app/assets/stylesheets/lib/bourbon/addons/_timing-functions.scss +0 -34
  100. data/app/assets/stylesheets/lib/bourbon/addons/_triangle.scss +0 -63
  101. data/app/assets/stylesheets/lib/bourbon/addons/_word-wrap.scss +0 -29
  102. data/app/assets/stylesheets/lib/bourbon/css3/_animation.scss +0 -43
  103. data/app/assets/stylesheets/lib/bourbon/css3/_appearance.scss +0 -3
  104. data/app/assets/stylesheets/lib/bourbon/css3/_backface-visibility.scss +0 -3
  105. data/app/assets/stylesheets/lib/bourbon/css3/_background-image.scss +0 -42
  106. data/app/assets/stylesheets/lib/bourbon/css3/_background.scss +0 -55
  107. data/app/assets/stylesheets/lib/bourbon/css3/_border-image.scss +0 -59
  108. data/app/assets/stylesheets/lib/bourbon/css3/_calc.scss +0 -4
  109. data/app/assets/stylesheets/lib/bourbon/css3/_columns.scss +0 -47
  110. data/app/assets/stylesheets/lib/bourbon/css3/_filter.scss +0 -4
  111. data/app/assets/stylesheets/lib/bourbon/css3/_flex-box.scss +0 -287
  112. data/app/assets/stylesheets/lib/bourbon/css3/_font-face.scss +0 -24
  113. data/app/assets/stylesheets/lib/bourbon/css3/_font-feature-settings.scss +0 -4
  114. data/app/assets/stylesheets/lib/bourbon/css3/_hidpi-media-query.scss +0 -10
  115. data/app/assets/stylesheets/lib/bourbon/css3/_hyphens.scss +0 -4
  116. data/app/assets/stylesheets/lib/bourbon/css3/_image-rendering.scss +0 -14
  117. data/app/assets/stylesheets/lib/bourbon/css3/_keyframes.scss +0 -36
  118. data/app/assets/stylesheets/lib/bourbon/css3/_linear-gradient.scss +0 -38
  119. data/app/assets/stylesheets/lib/bourbon/css3/_perspective.scss +0 -8
  120. data/app/assets/stylesheets/lib/bourbon/css3/_placeholder.scss +0 -8
  121. data/app/assets/stylesheets/lib/bourbon/css3/_radial-gradient.scss +0 -39
  122. data/app/assets/stylesheets/lib/bourbon/css3/_selection.scss +0 -42
  123. data/app/assets/stylesheets/lib/bourbon/css3/_text-decoration.scss +0 -19
  124. data/app/assets/stylesheets/lib/bourbon/css3/_transform.scss +0 -15
  125. data/app/assets/stylesheets/lib/bourbon/css3/_transition.scss +0 -71
  126. data/app/assets/stylesheets/lib/bourbon/css3/_user-select.scss +0 -3
  127. data/app/assets/stylesheets/lib/bourbon/functions/_assign-inputs.scss +0 -11
  128. data/app/assets/stylesheets/lib/bourbon/functions/_contains-falsy.scss +0 -20
  129. data/app/assets/stylesheets/lib/bourbon/functions/_contains.scss +0 -26
  130. data/app/assets/stylesheets/lib/bourbon/functions/_is-length.scss +0 -11
  131. data/app/assets/stylesheets/lib/bourbon/functions/_is-light.scss +0 -21
  132. data/app/assets/stylesheets/lib/bourbon/functions/_is-number.scss +0 -11
  133. data/app/assets/stylesheets/lib/bourbon/functions/_is-size.scss +0 -13
  134. data/app/assets/stylesheets/lib/bourbon/functions/_modular-scale.scss +0 -69
  135. data/app/assets/stylesheets/lib/bourbon/functions/_px-to-em.scss +0 -13
  136. data/app/assets/stylesheets/lib/bourbon/functions/_px-to-rem.scss +0 -15
  137. data/app/assets/stylesheets/lib/bourbon/functions/_shade.scss +0 -24
  138. data/app/assets/stylesheets/lib/bourbon/functions/_strip-units.scss +0 -17
  139. data/app/assets/stylesheets/lib/bourbon/functions/_tint.scss +0 -24
  140. data/app/assets/stylesheets/lib/bourbon/functions/_transition-property-name.scss +0 -22
  141. data/app/assets/stylesheets/lib/bourbon/functions/_unpack.scss +0 -27
  142. data/app/assets/stylesheets/lib/bourbon/helpers/_convert-units.scss +0 -21
  143. data/app/assets/stylesheets/lib/bourbon/helpers/_directional-values.scss +0 -96
  144. data/app/assets/stylesheets/lib/bourbon/helpers/_font-source-declaration.scss +0 -43
  145. data/app/assets/stylesheets/lib/bourbon/helpers/_gradient-positions-parser.scss +0 -13
  146. data/app/assets/stylesheets/lib/bourbon/helpers/_linear-angle-parser.scss +0 -25
  147. data/app/assets/stylesheets/lib/bourbon/helpers/_linear-gradient-parser.scss +0 -41
  148. data/app/assets/stylesheets/lib/bourbon/helpers/_linear-positions-parser.scss +0 -61
  149. data/app/assets/stylesheets/lib/bourbon/helpers/_linear-side-corner-parser.scss +0 -31
  150. data/app/assets/stylesheets/lib/bourbon/helpers/_radial-arg-parser.scss +0 -69
  151. data/app/assets/stylesheets/lib/bourbon/helpers/_radial-gradient-parser.scss +0 -50
  152. data/app/assets/stylesheets/lib/bourbon/helpers/_radial-positions-parser.scss +0 -18
  153. data/app/assets/stylesheets/lib/bourbon/helpers/_render-gradients.scss +0 -26
  154. data/app/assets/stylesheets/lib/bourbon/helpers/_shape-size-stripper.scss +0 -10
  155. data/app/assets/stylesheets/lib/bourbon/helpers/_str-to-num.scss +0 -50
  156. data/app/assets/stylesheets/lib/bourbon/settings/_asset-pipeline.scss +0 -7
  157. data/app/assets/stylesheets/lib/bourbon/settings/_prefixer.scss +0 -9
  158. data/app/assets/stylesheets/lib/bourbon/settings/_px-to-em.scss +0 -1
  159. data/app/assets/stylesheets/lib/neat/_neat-helpers.scss +0 -8
  160. data/app/assets/stylesheets/lib/neat/_neat.scss +0 -23
  161. data/app/assets/stylesheets/lib/neat/functions/_new-breakpoint.scss +0 -49
  162. data/app/assets/stylesheets/lib/neat/functions/_private.scss +0 -114
  163. data/app/assets/stylesheets/lib/neat/grid/_box-sizing.scss +0 -15
  164. data/app/assets/stylesheets/lib/neat/grid/_direction-context.scss +0 -33
  165. data/app/assets/stylesheets/lib/neat/grid/_display-context.scss +0 -28
  166. data/app/assets/stylesheets/lib/neat/grid/_fill-parent.scss +0 -22
  167. data/app/assets/stylesheets/lib/neat/grid/_media.scss +0 -92
  168. data/app/assets/stylesheets/lib/neat/grid/_omega.scss +0 -87
  169. data/app/assets/stylesheets/lib/neat/grid/_outer-container.scss +0 -38
  170. data/app/assets/stylesheets/lib/neat/grid/_pad.scss +0 -25
  171. data/app/assets/stylesheets/lib/neat/grid/_private.scss +0 -35
  172. data/app/assets/stylesheets/lib/neat/grid/_row.scss +0 -52
  173. data/app/assets/stylesheets/lib/neat/grid/_shift.scss +0 -50
  174. data/app/assets/stylesheets/lib/neat/grid/_span-columns.scss +0 -94
  175. data/app/assets/stylesheets/lib/neat/grid/_to-deprecate.scss +0 -97
  176. data/app/assets/stylesheets/lib/neat/grid/_visual-grid.scss +0 -42
  177. data/app/assets/stylesheets/lib/neat/settings/_disable-warnings.scss +0 -13
  178. data/app/assets/stylesheets/lib/neat/settings/_grid.scss +0 -51
  179. data/app/assets/stylesheets/lib/neat/settings/_visual-grid.scss +0 -27
  180. data/app/assets/stylesheets/va_common_main.css.scss +0 -18
  181. /data/app/assets/js/{vendor/scroll-settings.js → scroll-settings.js} +0 -0
  182. /data/app/assets/js/{vendor/stellar-settings.js → stellar-settings.js} +0 -0
@@ -1,691 +0,0 @@
1
- // Foundation by ZURB
2
- // foundation.zurb.com
3
- // Licensed under MIT Open Source
4
-
5
- @import "global";
6
- @import "grid";
7
- @import "buttons";
8
- @import "forms";
9
-
10
- //
11
- // Top Bar Variables
12
- //
13
- $include-html-top-bar-classes: $include-html-classes !default;
14
-
15
- // Background color for the top bar
16
- $topbar-bg-color: $oil !default;
17
- $topbar-bg: $topbar-bg-color !default;
18
-
19
- // Height and margin
20
- $topbar-height: rem-calc(45) !default;
21
- $topbar-margin-bottom: 0 !default;
22
-
23
- // Controlling the styles for the title in the top bar
24
- $topbar-title-weight: $font-weight-normal !default;
25
- $topbar-title-font-size: rem-calc(17) !default;
26
-
27
- // Set the link colors and styles for top-level nav
28
- $topbar-link-color: $white !default;
29
- $topbar-link-color-hover: $white !default;
30
- $topbar-link-color-active: $white !default;
31
- $topbar-link-color-active-hover: $white !default;
32
- $topbar-link-weight: $font-weight-normal !default;
33
- $topbar-link-font-size: rem-calc(13) !default;
34
- $topbar-link-hover-lightness: -10% !default; // Darken by 10%
35
- $topbar-link-bg: $topbar-bg !default;
36
- $topbar-link-bg-hover: $oil !default;
37
- $topbar-link-bg-color-hover: $charcoal !default;
38
- $topbar-link-bg-active: $primary-color !default;
39
- $topbar-link-bg-active-hover: scale-color($primary-color, $lightness: -14%) !default;
40
- $topbar-link-font-family: $body-font-family !default;
41
- $topbar-link-text-transform: none !default;
42
- $topbar-link-padding: ($topbar-height / 3) !default;
43
- $topbar-back-link-size: rem-calc(18) !default;
44
- $topbar-link-dropdown-padding: rem-calc(20) !default;
45
- $topbar-button-font-size: 0.75rem !default;
46
- $topbar-button-top: 7px !default;
47
-
48
- // Style the top bar dropdown elements
49
- $topbar-dropdown-bg: $oil !default;
50
- $topbar-dropdown-link-color: $white !default;
51
- $topbar-dropdown-link-color-hover: $topbar-link-color-hover !default;
52
- $topbar-dropdown-link-bg: $oil !default;
53
- $topbar-dropdown-link-bg-hover: $oil !default;
54
- $topbar-dropdown-link-weight: $font-weight-normal !default;
55
- $topbar-dropdown-toggle-size: 5px !default;
56
- $topbar-dropdown-toggle-color: $white !default;
57
- $topbar-dropdown-toggle-alpha: 0.4 !default;
58
-
59
- $topbar-dropdown-label-color: $monsoon !default;
60
- $topbar-dropdown-label-text-transform: uppercase !default;
61
- $topbar-dropdown-label-font-weight: $font-weight-bold !default;
62
- $topbar-dropdown-label-font-size: rem-calc(10) !default;
63
- $topbar-dropdown-label-bg: $oil !default;
64
-
65
- // Top menu icon styles
66
- $topbar-menu-link-transform: uppercase !default;
67
- $topbar-menu-link-font-size: rem-calc(13) !default;
68
- $topbar-menu-link-weight: $font-weight-bold !default;
69
- $topbar-menu-link-color: $white !default;
70
- $topbar-menu-icon-color: $white !default;
71
- $topbar-menu-link-color-toggled: $jumbo !default;
72
- $topbar-menu-icon-color-toggled: $jumbo !default;
73
- $topbar-menu-icon-position: $opposite-direction !default; // Change to $default-float for a left menu icon
74
-
75
- // Transitions and breakpoint styles
76
- $topbar-transition-speed: 300ms !default;
77
- // Using rem-calc for the below breakpoint causes issues with top bar
78
- $topbar-breakpoint: #{lower-bound($medium-range)} !default; // Change to 9999px for always mobile layout
79
- $topbar-media-query: $medium-up !default;
80
-
81
- // Top-bar input styles
82
- $topbar-input-height: rem-calc(28) !default;
83
-
84
- // Divider Styles
85
- $topbar-divider-border-bottom: solid 1px scale-color($topbar-bg-color, $lightness: 13%) !default;
86
- $topbar-divider-border-top: solid 1px scale-color($topbar-bg-color, $lightness: -50%) !default;
87
-
88
- // Sticky Class
89
- $topbar-sticky-class: ".sticky" !default;
90
- $topbar-arrows: true !default; //Set false to remove the triangle icon from the menu item
91
- $topbar-dropdown-arrows: true !default; //Set false to remove the \00bb >> text from dropdown subnavigation li
92
-
93
- // Accessibility mixins for hiding and showing the menu dropdown items
94
- @mixin topbar-hide-dropdown {
95
- // Makes an element visually hidden by default, but visible when focused.
96
- display: block;
97
- @include element-invisible();
98
- }
99
-
100
- @mixin topbar-show-dropdown {
101
- display: block;
102
- @include element-invisible-off();
103
- position: absolute !important; // Reset the position from static to absolute
104
- }
105
-
106
- @include exports("top-bar") {
107
-
108
- @if $include-html-top-bar-classes {
109
-
110
- // Used to provide media query values for javascript components.
111
- // This class is generated despite the value of $include-html-top-bar-classes
112
- // to ensure width calculations work correctly.
113
- meta.foundation-mq-topbar {
114
- font-family: "/" + unquote($topbar-media-query) + "/";
115
- width: $topbar-breakpoint;
116
- }
117
-
118
- /* Wrapped around .top-bar to contain to grid width */
119
- .contain-to-grid {
120
- width: 100%;
121
- background: $topbar-bg;
122
-
123
- .top-bar { margin-bottom: $topbar-margin-bottom; }
124
- }
125
-
126
- // Wrapped around .top-bar to make it stick to the top
127
- .fixed {
128
- width: 100%;
129
- #{$default-float}: 0;
130
- position: fixed;
131
- top: 0;
132
- z-index: 99;
133
-
134
- &.expanded:not(.top-bar) {
135
- overflow-y: auto;
136
- height: auto;
137
- width: 100%;
138
- max-height: 100%;
139
-
140
- .title-area {
141
- position: fixed;
142
- width: 100%;
143
- z-index: 99;
144
- }
145
- // Ensure you can scroll the menu on small screens
146
- .top-bar-section {
147
- z-index: 98;
148
- margin-top: $topbar-height;
149
- }
150
- }
151
- }
152
-
153
- .top-bar {
154
- overflow: hidden;
155
- height: $topbar-height;
156
- line-height: $topbar-height;
157
- position: relative;
158
- background: $topbar-bg;
159
- margin-bottom: $topbar-margin-bottom;
160
-
161
- // Topbar Global list Styles
162
- ul {
163
- margin-bottom: 0;
164
- list-style: none;
165
- }
166
-
167
- .row { max-width: none; }
168
-
169
- form,
170
- input { margin-bottom: 0; }
171
-
172
- input {
173
- height: $topbar-input-height;
174
- padding-top: .35rem;
175
- padding-bottom: .35rem;
176
- font-size: $topbar-button-font-size;
177
- }
178
-
179
- .button, button {
180
- padding-top: .35rem + rem-calc(1);
181
- padding-bottom: .35rem + rem-calc(1);
182
- margin-bottom: 0;
183
- font-size: $topbar-button-font-size;
184
- // position: relative;
185
- // top: -1px;
186
-
187
- // Corrects a slight misalignment when put next to an input field
188
- @media #{$small-only} {
189
- position: relative;
190
- top: -1px;
191
- }
192
- }
193
-
194
- // Title Area
195
- .title-area {
196
- position: relative;
197
- margin: 0;
198
- }
199
-
200
- .name {
201
- height: $topbar-height;
202
- margin: 0;
203
- font-size: $rem-base;
204
- // @if $topbar-menu-icon-position == $default-float {float: $opposite-direction;}
205
-
206
- h1, h2, h3, h4, p, span {
207
- line-height: $topbar-height;
208
- font-size: $topbar-title-font-size;
209
- margin: 0;
210
- a {
211
- font-weight: $topbar-title-weight;
212
- color: $topbar-link-color;
213
- width: 75%;
214
- display: block;
215
- padding: 0 $topbar-link-padding;
216
- }
217
- }
218
- }
219
-
220
- // Menu toggle button on small devices
221
- .toggle-topbar {
222
- position: absolute;
223
- #{$topbar-menu-icon-position}: 0;
224
- top: 0;
225
-
226
- a {
227
- color: $topbar-link-color;
228
- text-transform: $topbar-menu-link-transform;
229
- font-size: $topbar-menu-link-font-size;
230
- font-weight: $topbar-menu-link-weight;
231
- position: relative;
232
- display: block;
233
- padding: 0 $topbar-link-padding;
234
- height: $topbar-height;
235
- line-height: $topbar-height;
236
- }
237
-
238
- // Adding the class "menu-icon" will add the 3-line icon people love and adore.
239
- &.menu-icon {
240
- top: 50%;
241
- margin-top: -16px;
242
-
243
- a {
244
- @if $text-direction == rtl {
245
- text-indent: -58px;
246
- }
247
- height: 34px;
248
- line-height: 33px;
249
- padding: 0 $topbar-link-padding+rem-calc(25) 0 $topbar-link-padding;
250
- color: $topbar-menu-link-color;
251
- position: relative;
252
-
253
- & {
254
- // @include hamburger icon
255
- //
256
- // We use this to create the icon with three lines aka the hamburger icon, the menu-icon or the navicon
257
- // $width - Width of hamburger icon
258
- // $left - If false, icon will be centered horizontally || explicitly set value in rem
259
- // $top - If false, icon will be centered vertically || explicitly set value in rem
260
- // $thickness - thickness of lines in hamburger icon, set value in px
261
- // $gap - spacing between the lines in hamburger icon, set value in px
262
- // $color - icon color
263
- // $hover-color - icon color during hover, here it isn't set b/c it would override $topbar-menu-icon-color-toggled
264
- // $offcanvas - Set to false of @include in topbar
265
- @include hamburger(16px, false, 0, 1px, 6px, $topbar-menu-icon-color, "", false);
266
- }
267
- }
268
- }
269
- }
270
-
271
- // Change things up when the top-bar is expanded
272
- &.expanded {
273
- height: auto;
274
- background: transparent;
275
-
276
- .title-area { background: $topbar-bg; }
277
-
278
- .toggle-topbar {
279
- a { color: $topbar-menu-link-color-toggled;
280
- span::after {
281
- // Shh, don't tell, but box-shadows create the menu icon :)
282
- // Change the color of the bars when the menu is expanded, using given thickness from hamburger() above
283
- box-shadow: 0 0 0 1px $topbar-menu-icon-color-toggled,
284
- 0 7px 0 1px $topbar-menu-icon-color-toggled,
285
- 0 14px 0 1px $topbar-menu-icon-color-toggled;
286
- }
287
- }
288
- }
289
- }
290
- }
291
-
292
- // Right and Left Navigation that stacked by default
293
- .top-bar-section {
294
- #{$default-float}: 0;
295
- position: relative;
296
- width: auto;
297
- @include single-transition($default-float, $topbar-transition-speed);
298
-
299
- ul {
300
- padding: 0;
301
- width: 100%;
302
- height: auto;
303
- display: block;
304
- font-size: $rem-base;
305
- margin: 0;
306
- }
307
-
308
- .divider,
309
- [role="separator"] {
310
- border-top: $topbar-divider-border-top;
311
- clear: both;
312
- height: 1px;
313
- width: 100%;
314
- }
315
-
316
- ul li {
317
- background: $topbar-dropdown-bg;
318
- & > a {
319
- display: block;
320
- width: 100%;
321
- color: $topbar-link-color;
322
- padding: 12px 0 12px 0;
323
- padding-#{$default-float}: $topbar-link-padding;
324
- font-family: $topbar-link-font-family;
325
- font-size: $topbar-link-font-size;
326
- font-weight: $topbar-link-weight;
327
- text-transform: $topbar-link-text-transform;
328
-
329
- &.button {
330
- font-size: $topbar-link-font-size;
331
- padding-#{$opposite-direction}: $topbar-link-padding;
332
- padding-#{$default-float}: $topbar-link-padding;
333
- @include button-style($bg:$primary-color);
334
- }
335
- &.button.secondary { @include button-style($bg:$secondary-color); }
336
- &.button.success { @include button-style($bg:$success-color); }
337
- &.button.alert { @include button-style($bg:$alert-color); }
338
- &.button.warning { @include button-style($bg:$warning-color); }
339
- }
340
-
341
- > button {
342
- font-size: $topbar-link-font-size;
343
- padding-#{$opposite-direction}: $topbar-link-padding;
344
- padding-#{$default-float}: $topbar-link-padding;
345
- @include button-style($bg:$primary-color);
346
-
347
- &.secondary { @include button-style($bg:$secondary-color); }
348
- &.success { @include button-style($bg:$success-color); }
349
- &.alert { @include button-style($bg:$alert-color); }
350
- &.warning { @include button-style($bg:$warning-color); }
351
- }
352
-
353
- // Apply the hover link color when it has that class
354
- &:hover:not(.has-form) > a {
355
- background-color: $topbar-link-bg-color-hover;
356
- @if ($topbar-link-bg-hover) {
357
- background: $topbar-link-bg-hover;
358
- }
359
- color: $topbar-link-color-hover;
360
- }
361
-
362
- // Apply the active link color when it has that class
363
- &.active > a {
364
- background: $topbar-link-bg-active;
365
- color: $topbar-link-color-active;
366
- &:hover {
367
- background: $topbar-link-bg-active-hover;
368
- color: $topbar-link-color-active-hover;
369
- }
370
- }
371
- }
372
-
373
- // Add some extra padding for list items contains buttons
374
- .has-form { padding: $topbar-link-padding; }
375
-
376
- // Styling for list items that have a dropdown within them.
377
- .has-dropdown {
378
- position: relative;
379
-
380
- & > a {
381
- &:after {
382
- @if ($topbar-arrows){
383
- @include css-triangle($topbar-dropdown-toggle-size, rgba($topbar-dropdown-toggle-color, $topbar-dropdown-toggle-alpha), $default-float);
384
- }
385
- margin-#{$opposite-direction}: $topbar-link-padding;
386
- margin-top: -($topbar-dropdown-toggle-size / 2) - 2;
387
- position: absolute;
388
- top: 50%;
389
- #{$opposite-direction}: 0;
390
- }
391
- }
392
-
393
- &.moved { position: static;
394
- & > .dropdown {
395
- @include topbar-show-dropdown();
396
- width: 100%;
397
- }
398
- & > a:after {
399
- display: none;
400
- }
401
- }
402
- }
403
-
404
- // Styling elements inside of dropdowns
405
- .dropdown {
406
- padding: 0;
407
- position: absolute;
408
- #{$default-float}: 100%;
409
- top: 0;
410
- z-index: 99;
411
- @include topbar-hide-dropdown();
412
-
413
- li {
414
- width: 100%;
415
- height: auto;
416
-
417
- a {
418
- font-weight: $topbar-dropdown-link-weight;
419
- padding: 8px $topbar-link-padding;
420
- &.parent-link {
421
- font-weight: $topbar-link-weight;
422
- }
423
- }
424
-
425
- &.title h5, &.parent-link {
426
- // Back Button
427
- margin-bottom: 0;
428
- margin-top: 0;
429
- font-size: $topbar-back-link-size;
430
- a {
431
- color: $topbar-link-color;
432
- // line-height: ($topbar-height / 2);
433
- display: block;
434
- &:hover { background:none; }
435
- }
436
- }
437
- &.has-form { padding: 8px $topbar-link-padding; }
438
- .button, button { top: auto; }
439
- }
440
-
441
- label {
442
- padding: 8px $topbar-link-padding 2px;
443
- margin-bottom: 0;
444
- text-transform: $topbar-dropdown-label-text-transform;
445
- color: $topbar-dropdown-label-color;
446
- font-weight: $topbar-dropdown-label-font-weight;
447
- font-size: $topbar-dropdown-label-font-size;
448
- }
449
- }
450
- }
451
-
452
- .js-generated { display: block; }
453
-
454
-
455
- // Top Bar styles intended for screen sizes above the breakpoint.
456
- @media #{$topbar-media-query} {
457
- .top-bar {
458
- background: $topbar-bg;
459
- @include clearfix;
460
- overflow: visible;
461
-
462
- .toggle-topbar { display: none; }
463
-
464
- .title-area { float: $default-float; }
465
- .name h1 a { width: auto; }
466
-
467
- input,
468
- .button,
469
- button {
470
- font-size: rem-calc(14);
471
- position: relative;
472
- height: $topbar-input-height;
473
- top: (($topbar-height - $topbar-input-height) / 2);
474
- }
475
-
476
- &.expanded { background: $topbar-bg; }
477
- }
478
-
479
- .contain-to-grid .top-bar {
480
- max-width: $row-width;
481
- margin: 0 auto;
482
- margin-bottom: $topbar-margin-bottom;
483
- }
484
-
485
- .top-bar-section {
486
- @include single-transition(none,0,0);
487
- #{$default-float}: 0 !important;
488
-
489
- ul {
490
- width: auto;
491
- height: auto !important;
492
- display: inline;
493
-
494
- li {
495
- float: $default-float;
496
- .js-generated { display: none; }
497
- }
498
- }
499
-
500
- li {
501
- &.hover {
502
- > a:not(.button) {
503
- background-color: $topbar-link-bg-color-hover;
504
- @if ($topbar-link-bg-hover) {
505
- background: $topbar-link-bg-hover;
506
- }
507
- color: $topbar-link-color-hover;
508
- }
509
- }
510
- &:not(.has-form) {
511
- a:not(.button) {
512
- padding: 0 $topbar-link-padding;
513
- line-height: $topbar-height;
514
- background: $topbar-link-bg;
515
- &:hover {
516
- background-color: $topbar-link-bg-color-hover;
517
- @if ($topbar-link-bg-hover) {
518
- background: $topbar-link-bg-hover;
519
- }
520
- }
521
- }
522
- }
523
- &.active:not(.has-form) {
524
- a:not(.button) {
525
- padding: 0 $topbar-link-padding;
526
- line-height: $topbar-height;
527
- color: $topbar-link-color-active;
528
- background: $topbar-link-bg-active;
529
- &:hover {
530
- background: $topbar-link-bg-active-hover;
531
- color: $topbar-link-color-active-hover;
532
- }
533
- }
534
- }
535
- }
536
-
537
- .has-dropdown {
538
- @if($topbar-arrows){
539
- & > a {
540
- padding-#{$opposite-direction}: $topbar-link-padding + $topbar-link-dropdown-padding !important;
541
- &:after {
542
- @include css-triangle($topbar-dropdown-toggle-size, rgba($topbar-dropdown-toggle-color, $topbar-dropdown-toggle-alpha), top);
543
- margin-top: -($topbar-dropdown-toggle-size / 2);
544
- top: ($topbar-height / 2);
545
- }
546
- }
547
- }
548
-
549
- &.moved { position: relative;
550
- & > .dropdown {
551
- @include topbar-hide-dropdown();
552
- }
553
- }
554
-
555
- &.hover, &.not-click:hover {
556
- & > .dropdown {
557
- @include topbar-show-dropdown();
558
- }
559
- }
560
- > a:focus + .dropdown {
561
- @include topbar-show-dropdown();
562
- }
563
-
564
- .dropdown li.has-dropdown {
565
- & > a {
566
- @if ($topbar-dropdown-arrows){
567
- &:after {
568
- border: none;
569
- content: "\00bb";
570
- top: 1rem;
571
- margin-top: -1px;
572
- #{$opposite-direction}: 5px;
573
- line-height: 1.2;
574
- }
575
- }
576
- }
577
- }
578
- }
579
-
580
- .dropdown {
581
- #{$default-float}: 0;
582
- top: auto;
583
- background: transparent;
584
- min-width: 100%;
585
-
586
- li {
587
- a {
588
- color: $topbar-dropdown-link-color;
589
- line-height: $topbar-height;
590
- white-space: nowrap;
591
- padding: 12px $topbar-link-padding;
592
- background: $topbar-dropdown-link-bg;
593
- }
594
-
595
- &:not(.has-form):not(.active) {
596
- & > a:not(.button) {
597
- color: $topbar-dropdown-link-color;
598
- background: $topbar-dropdown-link-bg;
599
- }
600
-
601
- &:hover > a:not(.button) {
602
- color: $topbar-dropdown-link-color-hover;
603
- background-color: $topbar-link-bg-color-hover;
604
- @if ($topbar-dropdown-link-bg-hover) {
605
- background: $topbar-dropdown-link-bg-hover;
606
- }
607
- }
608
- }
609
-
610
- label {
611
- white-space: nowrap;
612
- background: $topbar-dropdown-label-bg;
613
- }
614
-
615
- // Second Level Dropdowns
616
- .dropdown {
617
- #{$default-float}: 100%;
618
- top: 0;
619
- }
620
- }
621
- }
622
-
623
- & > ul > .divider,
624
- & > ul > [role="separator"] {
625
- border-bottom: none;
626
- border-top: none;
627
- border-#{$opposite-direction}: $topbar-divider-border-bottom;
628
- clear: none;
629
- height: $topbar-height;
630
- width: 0;
631
- }
632
-
633
- .has-form {
634
- background: $topbar-link-bg;
635
- padding: 0 $topbar-link-padding;
636
- height: $topbar-height;
637
- }
638
-
639
- // Position overrides for ul.right and ul.left
640
- .#{$opposite-direction} {
641
- li .dropdown {
642
- #{$default-float}: auto;
643
- #{$opposite-direction}: 0;
644
-
645
- li .dropdown { #{$opposite-direction}: 100%; }
646
- }
647
- }
648
- .#{$default-float} {
649
- li .dropdown {
650
- #{$opposite-direction}: auto;
651
- #{$default-float}: 0;
652
-
653
- li .dropdown { #{$default-float}: 100%; }
654
- }
655
- }
656
- }
657
-
658
- // Degrade gracefully when Javascript is disabled. Displays dropdown and changes
659
- // background & text color on hover.
660
- .no-js .top-bar-section {
661
- ul li {
662
- // Apply the hover link color when it has that class
663
- &:hover > a {
664
- background-color: $topbar-link-bg-color-hover;
665
- @if ($topbar-link-bg-hover) {
666
- background: $topbar-link-bg-hover;
667
- }
668
- color: $topbar-link-color-hover;
669
- }
670
-
671
- // Apply the active link color when it has that class
672
- &:active > a {
673
- background: $topbar-link-bg-active;
674
- color: $topbar-link-color-active;
675
- }
676
- }
677
-
678
- .has-dropdown {
679
- &:hover {
680
- & > .dropdown {
681
- @include topbar-show-dropdown();
682
- }
683
- }
684
- > a:focus + .dropdown {
685
- @include topbar-show-dropdown();
686
- }
687
- }
688
- }
689
- }
690
- }
691
- }