luna-one 3.1.538 → 3.1.539

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.
Files changed (169) hide show
  1. package/README.md +2315 -2315
  2. package/dist/application/assets/images/carat-down.svg +3 -3
  3. package/dist/application/assets/images/carat-up.svg +3 -3
  4. package/dist/application/assets/images/close-blue.svg +4 -4
  5. package/dist/application/assets/images/close.svg +3 -3
  6. package/dist/application/assets/images/ellipses.svg +6 -6
  7. package/dist/application/assets/images/facebook.svg +13 -13
  8. package/dist/application/assets/images/instagram.svg +19 -19
  9. package/dist/application/assets/images/linkedin.svg +15 -15
  10. package/dist/application/assets/images/twitter.svg +17 -17
  11. package/dist/application/assets/images/youtube.svg +14 -14
  12. package/dist/application/components/Loading/Loading.scss +10 -10
  13. package/dist/global-styles/content/typography.scss +140 -140
  14. package/dist/global-styles/fonts/benton.scss +113 -113
  15. package/dist/global-styles/global-terra.scss +10 -10
  16. package/dist/global-styles/global-vars.scss +599 -599
  17. package/dist/global-styles/layout/_css-grid.scss +20 -20
  18. package/dist/global-styles/layout/_media-queries.scss +35 -35
  19. package/dist/global-styles/layout/_normalize.scss +340 -340
  20. package/dist/global-styles/layout/_reset.scss +13 -13
  21. package/dist/global-styles/mixins/_box-shadow.scss +6 -6
  22. package/dist/global-styles/mixins/_mixins.scss +5 -5
  23. package/dist/global-styles/mixins/_organism-padding-hack.scss +7 -7
  24. package/dist/global-styles/mixins/_typography.scss +102 -102
  25. package/dist/global-styles/mixins/_yiq.scss +50 -50
  26. package/dist/global-styles/mixins/_z-index.scss +3 -3
  27. package/dist/global-styles/terra.scss +15 -15
  28. package/dist/global-styles/utilities/_box-shadow.scss +8 -8
  29. package/dist/global-styles/utilities/_display.scss +48 -48
  30. package/dist/global-styles/utilities/_font-family.scss +15 -15
  31. package/dist/global-styles/utilities/_parallax.scss +23 -23
  32. package/dist/global-styles/utilities/_text-align.scss +24 -24
  33. package/dist/luna/components/2x2/2x2.scss +842 -781
  34. package/dist/luna/components/AdminCategoryData/AdminCategoryData.scss +81 -81
  35. package/dist/luna/components/AdminProductData/AdminProductData.scss +75 -75
  36. package/dist/luna/components/BlockListItems/BlockListItems.scss +266 -266
  37. package/dist/luna/components/BrowserSupportBanner/BrowserSupportBanner.scss +6 -6
  38. package/dist/luna/components/CTAButtons/CTAButtons.scss +19 -19
  39. package/dist/luna/components/ComparisonTable/ComparisonTable.scss +331 -331
  40. package/dist/luna/components/CtaWithHeader/CtaWithHeader.scss +295 -295
  41. package/dist/luna/components/DataPoint/DataPoint.scss +160 -160
  42. package/dist/luna/components/EventCard/EventCard.scss +134 -134
  43. package/dist/luna/components/HTMLEmbed/HTMLEmbed.scss +51 -51
  44. package/dist/luna/components/Header/Header.scss +35 -35
  45. package/dist/luna/components/ImageGallery/ImageGallery.scss +438 -438
  46. package/dist/luna/components/InPageJumpNav/InPageJumpNav.scss +122 -122
  47. package/dist/luna/components/JobPosting/JobPosting.scss +171 -171
  48. package/dist/luna/components/LinkList/LinkList.scss +59 -59
  49. package/dist/luna/components/Login/Login.scss +180 -180
  50. package/dist/luna/components/MegaMenu/MegaMenu.scss +570 -570
  51. package/dist/luna/components/MiniFeatDropdown/MiniFeatDropdown.scss +107 -107
  52. package/dist/luna/components/MobileLogin/MobileLogin.scss +38 -38
  53. package/dist/luna/components/MobileMegaMenu/MobileMegaMenu.scss +289 -289
  54. package/dist/luna/components/MobileMenu/MobileMenu.scss +70 -70
  55. package/dist/luna/components/MobileNav/MobileNav.scss +282 -282
  56. package/dist/luna/components/NavBarTop/NavBarTop.scss +403 -403
  57. package/dist/luna/components/NavSearch/NavSearch.scss +130 -130
  58. package/dist/luna/components/NonTimeBasedListEntries/NonTimeBasedListEntries.scss +339 -339
  59. package/dist/luna/components/OverlayNotice/OverlayNotice.scss +247 -247
  60. package/dist/luna/components/Pagination/Pagination.scss +27 -27
  61. package/dist/luna/components/ProductSummary/ProductSummary.scss +267 -267
  62. package/dist/luna/components/ProseLayout/ProseLayout.scss +384 -384
  63. package/dist/luna/components/RegionCard/RegionCard.scss +86 -86
  64. package/dist/luna/components/ScrollInPlace/ScrollInPlace.scss +219 -219
  65. package/dist/luna/components/SketchUpPricingCard/SketchUpPricingCard.scss +142 -142
  66. package/dist/luna/components/SlideOutFeat/SlideOutFeat.scss +124 -124
  67. package/dist/luna/components/StoreFrontCard/StoreFrontCard.scss +434 -434
  68. package/dist/luna/components/SupportCard/SupportCard.scss +134 -134
  69. package/dist/luna/components/Tabs/Tabs.scss +829 -829
  70. package/dist/luna/components/TimeBasedList/TimeBasedList.scss +394 -394
  71. package/dist/luna/components/TrainerCard/TrainerCard.scss +51 -51
  72. package/dist/luna/components/UnboundedCard/UnboundedCard.scss +100 -100
  73. package/dist/luna/components/UnboundedCard/playIcon.svg +17 -17
  74. package/dist/luna/components/VariableContentCard/VariableContentCard.scss +253 -253
  75. package/dist/luna/components/Video/Video.scss +209 -209
  76. package/dist/luna/components/VidyardModal/VidyardModal.scss +34 -34
  77. package/dist/luna/components/WaffleMenu/WaffleMenu.scss +73 -73
  78. package/dist/luna/featurettes/Accordion/Accordion.scss +138 -138
  79. package/dist/luna/featurettes/CustomFeat/CustomFeat.scss +17 -17
  80. package/dist/luna/featurettes/Feat1/Feat1.scss +110 -110
  81. package/dist/luna/featurettes/Feat2A/Feat2A.scss +132 -132
  82. package/dist/luna/featurettes/Feat2B/Feat2B.scss +231 -231
  83. package/dist/luna/featurettes/Feat3/Feat3.scss +49 -49
  84. package/dist/luna/featurettes/Feat4/Feat4.scss +86 -86
  85. package/dist/luna/featurettes/Feat5/Feat5.scss +235 -235
  86. package/dist/luna/featurettes/Feat7/Feat7.scss +49 -49
  87. package/dist/luna/featurettes/Feat8/Feat8.scss +103 -103
  88. package/dist/luna/featurettes/IconTextList/IconTextList.scss +124 -124
  89. package/dist/luna/featurettes/ProductsPackage/ProductsPackage.scss +211 -211
  90. package/dist/luna/featurettes/PullQuote/PullQuote.scss +322 -322
  91. package/dist/luna/featurettes/PullQuote/ico-quote-white.svg +3 -3
  92. package/dist/luna/featurettes/PullQuote/ico-quote.svg +3 -3
  93. package/dist/luna/heroes/FilterHero/FilterHero.scss +80 -80
  94. package/dist/luna/heroes/FullBackgroundHero/FullBackgroundHero.scss +670 -670
  95. package/dist/luna/heroes/Hero1/Hero1.scss +223 -223
  96. package/dist/luna/heroes/Hero2/Hero2.scss +165 -165
  97. package/dist/luna/heroes/Hero3/Hero3.scss +250 -250
  98. package/dist/luna/heroes/Hero4/Hero4.scss +112 -112
  99. package/dist/luna/heroes/Hero6/Hero6.scss +127 -127
  100. package/dist/luna/heroes/Hero7/Hero7.scss +193 -193
  101. package/dist/luna/heroes/SuperHero/SuperHero.scss +801 -801
  102. package/dist/luna/images/arrow-diagonal-black.svg +13 -13
  103. package/dist/luna/images/arrow-diagonal-blue.svg +13 -13
  104. package/dist/luna/images/arrow-diagonal-white.svg +13 -13
  105. package/dist/luna/images/bulletpoint.svg +3 -3
  106. package/dist/luna/images/callout-icon.svg +3 -3
  107. package/dist/luna/images/check-blue.svg +4 -4
  108. package/dist/luna/images/circle-arrow-right-black.svg +3 -3
  109. package/dist/luna/images/circle-arrow-right-white.svg +3 -3
  110. package/dist/luna/images/circle-arrow.svg +3 -3
  111. package/dist/luna/images/close-button.svg +42 -42
  112. package/dist/luna/images/close-dark-navy.svg +3 -3
  113. package/dist/luna/images/close-icon.svg +3 -3
  114. package/dist/luna/images/collapse-close-blue.svg +5 -5
  115. package/dist/luna/images/collapse-close-gold.svg +5 -5
  116. package/dist/luna/images/collapse-open-blue.svg +4 -4
  117. package/dist/luna/images/collapse-open-gold.svg +4 -4
  118. package/dist/luna/images/cross-medium-blue.svg +4 -4
  119. package/dist/luna/images/cross-medium-white.svg +5 -5
  120. package/dist/luna/images/down-caret-dark-blue.svg +4 -4
  121. package/dist/luna/images/down-caret-dark-gray.svg +4 -4
  122. package/dist/luna/images/down-caret-light-gray.svg +4 -4
  123. package/dist/luna/images/downArrow.svg +36 -36
  124. package/dist/luna/images/external-arrow-blue.svg +11 -11
  125. package/dist/luna/images/external-arrow-white-theme.svg +12 -12
  126. package/dist/luna/images/external-arrow.svg +12 -12
  127. package/dist/luna/images/form-border-top-light.svg +4 -4
  128. package/dist/luna/images/frame-intersection.svg +3 -3
  129. package/dist/luna/images/gallery-image-corner-border.svg +3 -3
  130. package/dist/luna/images/green-tick.svg +3 -3
  131. package/dist/luna/images/internal-arrow-blue.svg +15 -15
  132. package/dist/luna/images/internal-arrow-white-theme.svg +15 -15
  133. package/dist/luna/images/internal-arrow.svg +15 -15
  134. package/dist/luna/images/logo-icon.svg +17 -17
  135. package/dist/luna/images/pdf-doc.svg +9 -9
  136. package/dist/luna/images/play.svg +17 -17
  137. package/dist/luna/images/right-caret-dark-blue.svg +3 -3
  138. package/dist/luna/images/right-caret-light-gray.svg +4 -4
  139. package/dist/luna/images/right-caret-light-yellow-stroke.svg +9 -9
  140. package/dist/luna/images/right-caret-light-yellow.svg +4 -4
  141. package/dist/luna/images/right-caret-medium-gray.svg +4 -4
  142. package/dist/luna/images/search.svg +9 -9
  143. package/dist/luna/images/skipicon.svg +154 -154
  144. package/dist/luna/images/text-doc.svg +9 -9
  145. package/dist/luna/images/text-lines.svg +22 -22
  146. package/dist/luna/images/tooltip-close-icon.svg +3 -3
  147. package/dist/luna/images/tooltip-icon.svg +3 -3
  148. package/dist/luna/images/up-arrow.svg +36 -36
  149. package/dist/luna/images/up-right-arrow.svg +9 -9
  150. package/dist/luna/images/user-profile.svg +37 -37
  151. package/dist/luna/images/user.svg +4 -4
  152. package/dist/luna/images/waffle.svg +11 -11
  153. package/dist/luna/images/worldwide.svg +19 -19
  154. package/dist/luna/list-feats/ListFeat/ListFeat.scss +112 -112
  155. package/dist/luna/list-feats/ListFeat1/ListFeat1.scss +94 -94
  156. package/dist/luna/list-feats/ListFeat2/ListFeat2.scss +19 -19
  157. package/dist/luna/list-feats/ListFeat4/ListFeat4.scss +32 -32
  158. package/dist/luna/list-feats/ListFeat5/ListFeat5.scss +26 -26
  159. package/dist/luna/list-feats/ListFeat6/ListFeat6.scss +34 -34
  160. package/dist/luna/list-feats/ListFeat7/ListFeat7.scss +13 -13
  161. package/dist/luna/list-feats/ListFeatCustom/ListFeatCustom.scss +7 -7
  162. package/dist/luna/other-organisms/Carousel/Carousel.scss +155 -155
  163. package/dist/luna/other-organisms/Flyout/Flyout.scss +329 -329
  164. package/dist/luna/other-organisms/Footer/Footer.scss +470 -470
  165. package/dist/luna/other-organisms/LanguageSelector/LanguageSelector.scss +318 -318
  166. package/dist/luna/other-organisms/MarketoForm/MarketoForm.scss +56 -56
  167. package/dist/luna/other-organisms/NavBar/NavBar.scss +622 -622
  168. package/dist/luna/other-organisms/SubNav/SubNav.scss +265 -265
  169. package/package.json +93 -93
@@ -1,70 +1,70 @@
1
- @import "../../../global-styles/terra.scss";
2
-
3
- .ter-mobile-menu {
4
- border-top: solid 1px $white;
5
-
6
- &--first {
7
- border-top: none;
8
- }
9
-
10
- &__name {
11
- font-size: $body-font-size;
12
- margin: 0;
13
- height: 60px;
14
- line-height: 60px;
15
- background: $trimble-blue;
16
- color: $white;
17
- padding: 0 16px;
18
- @include benton-medium();
19
- position: relative;
20
- &:hover {
21
- cursor: pointer;
22
- }
23
- }
24
-
25
- &__caret {
26
- width: 10px;
27
- position: absolute;
28
- top: 24px;
29
- right: 16px;
30
- transition: 0.3s;
31
-
32
- @media screen and (max-width: $breakpoint-xs) {
33
- right: 24px;
34
- }
35
-
36
- &--up {
37
- left: 16px;
38
- transform: rotate(180deg);
39
- }
40
- }
41
-
42
- &__link-container {
43
- background: $white;
44
- margin: 0;
45
- padding: 0;
46
- overflow: hidden;
47
- height: auto;
48
- max-height: 0;
49
- transition: 0.3s;
50
-
51
- &--is-open {
52
- max-height: 1000px;
53
- }
54
- }
55
-
56
- &__link {
57
- padding: 0;
58
- display: block;
59
-
60
- a {
61
- padding: 0 16px;
62
- height: 60px;
63
- line-height: 60px;
64
- color: $trimble-blue;
65
- font-size: $body-font-size;
66
- text-decoration: none;
67
- @include benton-medium();
68
- }
69
- }
70
- }
1
+ @import "../../../global-styles/terra.scss";
2
+
3
+ .ter-mobile-menu {
4
+ border-top: solid 1px $white;
5
+
6
+ &--first {
7
+ border-top: none;
8
+ }
9
+
10
+ &__name {
11
+ font-size: $body-font-size;
12
+ margin: 0;
13
+ height: 60px;
14
+ line-height: 60px;
15
+ background: $trimble-blue;
16
+ color: $white;
17
+ padding: 0 16px;
18
+ @include benton-medium();
19
+ position: relative;
20
+ &:hover {
21
+ cursor: pointer;
22
+ }
23
+ }
24
+
25
+ &__caret {
26
+ width: 10px;
27
+ position: absolute;
28
+ top: 24px;
29
+ right: 16px;
30
+ transition: 0.3s;
31
+
32
+ @media screen and (max-width: $breakpoint-xs) {
33
+ right: 24px;
34
+ }
35
+
36
+ &--up {
37
+ left: 16px;
38
+ transform: rotate(180deg);
39
+ }
40
+ }
41
+
42
+ &__link-container {
43
+ background: $white;
44
+ margin: 0;
45
+ padding: 0;
46
+ overflow: hidden;
47
+ height: auto;
48
+ max-height: 0;
49
+ transition: 0.3s;
50
+
51
+ &--is-open {
52
+ max-height: 1000px;
53
+ }
54
+ }
55
+
56
+ &__link {
57
+ padding: 0;
58
+ display: block;
59
+
60
+ a {
61
+ padding: 0 16px;
62
+ height: 60px;
63
+ line-height: 60px;
64
+ color: $trimble-blue;
65
+ font-size: $body-font-size;
66
+ text-decoration: none;
67
+ @include benton-medium();
68
+ }
69
+ }
70
+ }
@@ -1,282 +1,282 @@
1
- @import "../../../global-styles/terra.scss";
2
-
3
- .ter-mobile-nav {
4
- position: absolute;
5
- top: 60px;
6
- width: 100vw;
7
- z-index: 100;
8
- white-space: nowrap;
9
- color: $trimble-dark-gray;
10
- transition: 0.3s;
11
- overflow: scroll;
12
- overflow-x: hidden;
13
- height: 0vh;
14
- visibility: hidden;
15
-
16
- &--is-open {
17
- visibility: visible;
18
- height: 100vh;
19
- background: $white;
20
- }
21
-
22
- &__menus-container {
23
- font-size: $eyebrow-font-size;
24
-
25
- li {
26
- text-decoration: none;
27
- list-style: none;
28
- border-bottom: 1px solid $steel-gray;
29
- padding: 0px;
30
- }
31
-
32
- &--fill {
33
- position: absolute;
34
- top: 0;
35
- background: $trimble-blue;
36
- width: 100vw;
37
- height: 60px;
38
- transition: 0s;
39
- transition-delay: 0.3s;
40
-
41
- &--hidden {
42
- width: 0vw;
43
- transition-delay: 0s;
44
- }
45
- }
46
- &--no-fill {
47
- position: absolute;
48
- top: 0;
49
- background: none;
50
- width: 100vw;
51
- height: 60px;
52
- transition: 0s;
53
- transition-delay: 0.3s;
54
-
55
- &--hidden {
56
- width: 0vw;
57
- transition-delay: 0s;
58
- }
59
- }
60
- }
61
-
62
- &__link {
63
- text-decoration: none;
64
- visibility: visible;
65
- display: block;
66
- transition: 0.3s;
67
- transform: translateX(0%);
68
-
69
- &--hidden {
70
- visibility: hidden;
71
- transform: translateX(-100%);
72
- }
73
-
74
- p {
75
- font-size: $body-font-size;
76
- margin: 0;
77
- height: 60px;
78
- line-height: 60px;
79
- background: $trimble-blue;
80
- color: $white;
81
- padding: 0 16px;
82
- @include benton-medium();
83
- border-bottom: solid 1px $white;
84
- overflow: hidden;
85
- }
86
-
87
- &:focus p {
88
- transition: 0s;
89
- outline: 2px solid $trimble-gold;
90
- outline-offset: -2px;
91
- }
92
- }
93
-
94
- &__flyout {
95
- &--active {
96
- display: flex;
97
- flex-direction: column;
98
- }
99
-
100
- &--regular-padding {
101
- padding-bottom: 60px;
102
- }
103
-
104
- &--extra-padding {
105
- padding-bottom: 170px;
106
- }
107
-
108
- &-wrapper {
109
- display: flex;
110
- flex-direction: row;
111
- justify-content: space-between;
112
- align-items: center;
113
- height: 80px;
114
- cursor: pointer;
115
- padding-left: 16px;
116
- transform: translateX(0%);
117
- transition: 0.3s;
118
-
119
- &--inactive {
120
- visibility: hidden;
121
- transform: translateX(-100%);
122
- }
123
- }
124
-
125
- &-title {
126
- display: flex;
127
- flex-direction: row;
128
- align-items: center;
129
-
130
- &-text {
131
- font-size: $body-font-size;
132
- color: $trimble-blue;
133
- @include benton-medium();
134
- margin-right: 11px;
135
- }
136
-
137
- &-icon {
138
- width: 10px;
139
- }
140
- }
141
-
142
- &-logo {
143
- background: #0063a3;
144
- width: 80px;
145
- height: 80px;
146
- display: flex;
147
- justify-content: center;
148
- align-items: center;
149
-
150
- img {
151
- width: 37px;
152
- height: 40px;
153
- }
154
- }
155
- }
156
- }
157
-
158
- .ter-top-mobile-nav {
159
- padding: 16px;
160
-
161
- &__location-wrapper {
162
- display: flex;
163
- align-items: center;
164
- height: 60px;
165
- border-bottom: 1px solid $trimble-blue;
166
- padding: 0 16px;
167
- cursor: pointer;
168
- transform: translateX(0%);
169
- transition: 0.3s;
170
- visibility: visible;
171
- overflow: hidden;
172
- background: $white;
173
- &--inactive {
174
- visibility: hidden;
175
- transform: translateX(-100%);
176
- }
177
-
178
- &--hidden {
179
- visibility: hidden;
180
- transform: translateX(0%);
181
- }
182
- }
183
-
184
- &__login-wrapper {
185
- display: flex;
186
- align-items: center;
187
- padding: 0 16px;
188
- transform: translateX(0%);
189
- transition: 0.3s;
190
- visibility: visible;
191
- overflow: hidden;
192
- background: $white;
193
- &--inactive {
194
- visibility: hidden;
195
- transform: translateX(-100%);
196
- }
197
-
198
- &--hidden {
199
- visibility: hidden;
200
- transform: translateX(0%);
201
- }
202
- }
203
-
204
- &__location {
205
- font-size: $body-font-size;
206
- padding-right: 9px;
207
- transform: translateY(-1px);
208
- margin: 0px;
209
- padding: 0 8px;
210
-
211
- color: $trimble-blue;
212
- @include benton-medium();
213
- }
214
-
215
- &__globe-icon {
216
- width: 16px;
217
- transform: translateY(-2px);
218
- }
219
-
220
- &__search-wrapper {
221
- display: grid;
222
- grid-template-columns: 1fr 22px;
223
- margin-top: 28px;
224
- }
225
-
226
- &__search-field {
227
- border: solid 1px $trimble-dark-gray;
228
- height: 37px;
229
-
230
- &:focus {
231
- outline: none;
232
- }
233
- }
234
-
235
- &__search-submit {
236
- margin: 0;
237
- padding: 0;
238
- }
239
-
240
- &__search-icon {
241
- width: 14px;
242
- display: block;
243
-
244
- padding: 12px;
245
- box-sizing: content-box;
246
- }
247
-
248
- &__link-wrapper {
249
- display: flex;
250
- justify-content: flex-start;
251
- align-items: center;
252
- width: 100%;
253
- height: 60px;
254
- border-bottom: 1px solid $trimble-blue;
255
- padding: 0 16px;
256
- visibility: visible;
257
- transition: 0.3s;
258
- transform: translateX(0%);
259
- overflow: hidden;
260
- background: $white;
261
- &--inactive {
262
- visibility: hidden;
263
- transform: translateX(-100%);
264
- }
265
-
266
- &--hidden {
267
- visibility: hidden;
268
- transform: translateX(0%);
269
- }
270
- }
271
-
272
- &__link {
273
- font-size: $body-font-size;
274
- color: $trimble-blue !important;
275
- @include benton-medium();
276
- text-decoration: none !important;
277
- }
278
-
279
- &__link.tabFocus.active:focus {
280
- outline: 2px solid $sky-blue;
281
- }
282
- }
1
+ @import "../../../global-styles/terra.scss";
2
+
3
+ .ter-mobile-nav {
4
+ position: absolute;
5
+ top: 60px;
6
+ width: 100vw;
7
+ z-index: 100;
8
+ white-space: nowrap;
9
+ color: $trimble-dark-gray;
10
+ transition: 0.3s;
11
+ overflow: scroll;
12
+ overflow-x: hidden;
13
+ height: 0vh;
14
+ visibility: hidden;
15
+
16
+ &--is-open {
17
+ visibility: visible;
18
+ height: 100vh;
19
+ background: $white;
20
+ }
21
+
22
+ &__menus-container {
23
+ font-size: $eyebrow-font-size;
24
+
25
+ li {
26
+ text-decoration: none;
27
+ list-style: none;
28
+ border-bottom: 1px solid $steel-gray;
29
+ padding: 0px;
30
+ }
31
+
32
+ &--fill {
33
+ position: absolute;
34
+ top: 0;
35
+ background: $trimble-blue;
36
+ width: 100vw;
37
+ height: 60px;
38
+ transition: 0s;
39
+ transition-delay: 0.3s;
40
+
41
+ &--hidden {
42
+ width: 0vw;
43
+ transition-delay: 0s;
44
+ }
45
+ }
46
+ &--no-fill {
47
+ position: absolute;
48
+ top: 0;
49
+ background: none;
50
+ width: 100vw;
51
+ height: 60px;
52
+ transition: 0s;
53
+ transition-delay: 0.3s;
54
+
55
+ &--hidden {
56
+ width: 0vw;
57
+ transition-delay: 0s;
58
+ }
59
+ }
60
+ }
61
+
62
+ &__link {
63
+ text-decoration: none;
64
+ visibility: visible;
65
+ display: block;
66
+ transition: 0.3s;
67
+ transform: translateX(0%);
68
+
69
+ &--hidden {
70
+ visibility: hidden;
71
+ transform: translateX(-100%);
72
+ }
73
+
74
+ p {
75
+ font-size: $body-font-size;
76
+ margin: 0;
77
+ height: 60px;
78
+ line-height: 60px;
79
+ background: $trimble-blue;
80
+ color: $white;
81
+ padding: 0 16px;
82
+ @include benton-medium();
83
+ border-bottom: solid 1px $white;
84
+ overflow: hidden;
85
+ }
86
+
87
+ &:focus p {
88
+ transition: 0s;
89
+ outline: 2px solid $trimble-gold;
90
+ outline-offset: -2px;
91
+ }
92
+ }
93
+
94
+ &__flyout {
95
+ &--active {
96
+ display: flex;
97
+ flex-direction: column;
98
+ }
99
+
100
+ &--regular-padding {
101
+ padding-bottom: 60px;
102
+ }
103
+
104
+ &--extra-padding {
105
+ padding-bottom: 170px;
106
+ }
107
+
108
+ &-wrapper {
109
+ display: flex;
110
+ flex-direction: row;
111
+ justify-content: space-between;
112
+ align-items: center;
113
+ height: 80px;
114
+ cursor: pointer;
115
+ padding-left: 16px;
116
+ transform: translateX(0%);
117
+ transition: 0.3s;
118
+
119
+ &--inactive {
120
+ visibility: hidden;
121
+ transform: translateX(-100%);
122
+ }
123
+ }
124
+
125
+ &-title {
126
+ display: flex;
127
+ flex-direction: row;
128
+ align-items: center;
129
+
130
+ &-text {
131
+ font-size: $body-font-size;
132
+ color: $trimble-blue;
133
+ @include benton-medium();
134
+ margin-right: 11px;
135
+ }
136
+
137
+ &-icon {
138
+ width: 10px;
139
+ }
140
+ }
141
+
142
+ &-logo {
143
+ background: #0063a3;
144
+ width: 80px;
145
+ height: 80px;
146
+ display: flex;
147
+ justify-content: center;
148
+ align-items: center;
149
+
150
+ img {
151
+ width: 37px;
152
+ height: 40px;
153
+ }
154
+ }
155
+ }
156
+ }
157
+
158
+ .ter-top-mobile-nav {
159
+ padding: 16px;
160
+
161
+ &__location-wrapper {
162
+ display: flex;
163
+ align-items: center;
164
+ height: 60px;
165
+ border-bottom: 1px solid $trimble-blue;
166
+ padding: 0 16px;
167
+ cursor: pointer;
168
+ transform: translateX(0%);
169
+ transition: 0.3s;
170
+ visibility: visible;
171
+ overflow: hidden;
172
+ background: $white;
173
+ &--inactive {
174
+ visibility: hidden;
175
+ transform: translateX(-100%);
176
+ }
177
+
178
+ &--hidden {
179
+ visibility: hidden;
180
+ transform: translateX(0%);
181
+ }
182
+ }
183
+
184
+ &__login-wrapper {
185
+ display: flex;
186
+ align-items: center;
187
+ padding: 0 16px;
188
+ transform: translateX(0%);
189
+ transition: 0.3s;
190
+ visibility: visible;
191
+ overflow: hidden;
192
+ background: $white;
193
+ &--inactive {
194
+ visibility: hidden;
195
+ transform: translateX(-100%);
196
+ }
197
+
198
+ &--hidden {
199
+ visibility: hidden;
200
+ transform: translateX(0%);
201
+ }
202
+ }
203
+
204
+ &__location {
205
+ font-size: $body-font-size;
206
+ padding-right: 9px;
207
+ transform: translateY(-1px);
208
+ margin: 0px;
209
+ padding: 0 8px;
210
+
211
+ color: $trimble-blue;
212
+ @include benton-medium();
213
+ }
214
+
215
+ &__globe-icon {
216
+ width: 16px;
217
+ transform: translateY(-2px);
218
+ }
219
+
220
+ &__search-wrapper {
221
+ display: grid;
222
+ grid-template-columns: 1fr 22px;
223
+ margin-top: 28px;
224
+ }
225
+
226
+ &__search-field {
227
+ border: solid 1px $trimble-dark-gray;
228
+ height: 37px;
229
+
230
+ &:focus {
231
+ outline: none;
232
+ }
233
+ }
234
+
235
+ &__search-submit {
236
+ margin: 0;
237
+ padding: 0;
238
+ }
239
+
240
+ &__search-icon {
241
+ width: 14px;
242
+ display: block;
243
+
244
+ padding: 12px;
245
+ box-sizing: content-box;
246
+ }
247
+
248
+ &__link-wrapper {
249
+ display: flex;
250
+ justify-content: flex-start;
251
+ align-items: center;
252
+ width: 100%;
253
+ height: 60px;
254
+ border-bottom: 1px solid $trimble-blue;
255
+ padding: 0 16px;
256
+ visibility: visible;
257
+ transition: 0.3s;
258
+ transform: translateX(0%);
259
+ overflow: hidden;
260
+ background: $white;
261
+ &--inactive {
262
+ visibility: hidden;
263
+ transform: translateX(-100%);
264
+ }
265
+
266
+ &--hidden {
267
+ visibility: hidden;
268
+ transform: translateX(0%);
269
+ }
270
+ }
271
+
272
+ &__link {
273
+ font-size: $body-font-size;
274
+ color: $trimble-blue !important;
275
+ @include benton-medium();
276
+ text-decoration: none !important;
277
+ }
278
+
279
+ &__link.tabFocus.active:focus {
280
+ outline: 2px solid $sky-blue;
281
+ }
282
+ }