luna-one 3.1.430 → 3.1.433
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.
- package/README.md +2315 -2315
- package/dist/application/assets/images/carat-down.svg +3 -3
- package/dist/application/assets/images/carat-up.svg +3 -3
- package/dist/application/assets/images/close-blue.svg +4 -4
- package/dist/application/assets/images/close.svg +3 -3
- package/dist/application/assets/images/ellipses.svg +6 -6
- package/dist/application/assets/images/facebook.svg +13 -13
- package/dist/application/assets/images/instagram.svg +19 -19
- package/dist/application/assets/images/linkedin.svg +15 -15
- package/dist/application/assets/images/twitter.svg +17 -17
- package/dist/application/assets/images/youtube.svg +14 -14
- package/dist/application/components/Loading/Loading.scss +10 -10
- package/dist/global-styles/content/typography.scss +140 -140
- package/dist/global-styles/fonts/benton.scss +5 -5
- package/dist/global-styles/global-terra.scss +10 -10
- package/dist/global-styles/global-vars.scss +600 -600
- package/dist/global-styles/layout/_css-grid.scss +20 -20
- package/dist/global-styles/layout/_media-queries.scss +35 -35
- package/dist/global-styles/layout/_normalize.scss +340 -340
- package/dist/global-styles/layout/_reset.scss +13 -13
- package/dist/global-styles/mixins/_box-shadow.scss +6 -6
- package/dist/global-styles/mixins/_mixins.scss +5 -5
- package/dist/global-styles/mixins/_organism-padding-hack.scss +7 -7
- package/dist/global-styles/mixins/_typography.scss +110 -110
- package/dist/global-styles/mixins/_yiq.scss +50 -50
- package/dist/global-styles/mixins/_z-index.scss +3 -3
- package/dist/global-styles/terra.scss +15 -15
- package/dist/global-styles/utilities/_box-shadow.scss +8 -8
- package/dist/global-styles/utilities/_display.scss +48 -48
- package/dist/global-styles/utilities/_font-family.scss +15 -15
- package/dist/global-styles/utilities/_parallax.scss +23 -23
- package/dist/global-styles/utilities/_text-align.scss +24 -24
- package/dist/luna/components/2x2/2x2.scss +776 -776
- package/dist/luna/components/AdminCategoryData/AdminCategoryData.scss +81 -81
- package/dist/luna/components/AdminProductData/AdminProductData.scss +75 -75
- package/dist/luna/components/BlockListItems/AppCards.js +1 -1
- package/dist/luna/components/BlockListItems/BlockListItems.scss +236 -236
- package/dist/luna/components/BrowserSupportBanner/BrowserSupportBanner.scss +6 -6
- package/dist/luna/components/CTAButtons/CTAButtons.scss +19 -19
- package/dist/luna/components/ComparisonTable/ComparisonTable.scss +354 -354
- package/dist/luna/components/CtaWithHeader/CtaWithHeader.scss +279 -279
- package/dist/luna/components/DataPoint/DataPoint.scss +160 -160
- package/dist/luna/components/EventCard/EventCard.scss +134 -134
- package/dist/luna/components/HTMLEmbed/HTMLEmbed.scss +26 -26
- package/dist/luna/components/Header/Header.scss +34 -34
- package/dist/luna/components/ImageGallery/ImageGallery.scss +438 -438
- package/dist/luna/components/InPageJumpNav/InPageJumpNav.scss +124 -124
- package/dist/luna/components/JobPosting/JobPosting.scss +171 -171
- package/dist/luna/components/LinkList/LinkList.scss +44 -44
- package/dist/luna/components/Login/Login.scss +180 -180
- package/dist/luna/components/MegaMenu/MegaMenu.scss +570 -570
- package/dist/luna/components/MiniFeatDropdown/MiniFeatDropdown.scss +107 -107
- package/dist/luna/components/MobileLogin/MobileLogin.scss +38 -38
- package/dist/luna/components/MobileMegaMenu/MobileMegaMenu.scss +272 -272
- package/dist/luna/components/MobileMenu/MobileMenu.scss +70 -70
- package/dist/luna/components/MobileNav/MobileNav.scss +283 -283
- package/dist/luna/components/NavBarTop/NavBarTop.scss +408 -408
- package/dist/luna/components/NavSearch/NavSearch.scss +129 -129
- package/dist/luna/components/NonTimeBasedListEntries/NonTimeBasedListEntries.scss +338 -338
- package/dist/luna/components/OverlayNotice/OverlayNotice.scss +248 -248
- package/dist/luna/components/Pagination/Pagination.scss +27 -27
- package/dist/luna/components/ProductSummary/ProductSummary.scss +266 -266
- package/dist/luna/components/ProseLayout/ProseLayout.scss +384 -384
- package/dist/luna/components/RegionCard/RegionCard.scss +86 -86
- package/dist/luna/components/ScrollInPlace/ScrollInPlace.scss +219 -219
- package/dist/luna/components/SketchUpPricingCard/SketchUpPricingCard.scss +142 -142
- package/dist/luna/components/SlideOutFeat/SlideOutFeat.scss +124 -124
- package/dist/luna/components/StoreFrontCard/StoreFrontCard.scss +434 -434
- package/dist/luna/components/SupportCard/SupportCard.scss +134 -134
- package/dist/luna/components/Tabs/Tabs.scss +747 -747
- package/dist/luna/components/TimeBasedList/TimeBasedList.scss +394 -394
- package/dist/luna/components/TrainerCard/TrainerCard.scss +51 -51
- package/dist/luna/components/UnboundedCard/UnboundedCard.scss +101 -101
- package/dist/luna/components/UnboundedCard/playIcon.svg +17 -17
- package/dist/luna/components/VariableContentCard/VariableContentCard.scss +253 -253
- package/dist/luna/components/Video/Video.scss +207 -207
- package/dist/luna/components/VidyardModal/VidyardModal.scss +32 -32
- package/dist/luna/featurettes/Accordion/Accordion.scss +137 -137
- package/dist/luna/featurettes/CustomFeat/CustomFeat.scss +17 -17
- package/dist/luna/featurettes/Feat1/Feat1.scss +110 -110
- package/dist/luna/featurettes/Feat2A/Feat2A.scss +132 -132
- package/dist/luna/featurettes/Feat2B/Feat2B.scss +231 -231
- package/dist/luna/featurettes/Feat3/Feat3.scss +49 -49
- package/dist/luna/featurettes/Feat4/Feat4.scss +86 -86
- package/dist/luna/featurettes/Feat5/Feat5.scss +235 -235
- package/dist/luna/featurettes/Feat7/Feat7.scss +49 -49
- package/dist/luna/featurettes/Feat8/Feat8.scss +103 -103
- package/dist/luna/featurettes/IconTextList/IconTextList.scss +118 -118
- package/dist/luna/featurettes/ProductsPackage/ProductsPackage.scss +187 -187
- package/dist/luna/featurettes/PullQuote/PullQuote.scss +322 -322
- package/dist/luna/featurettes/PullQuote/ico-quote-white.svg +3 -3
- package/dist/luna/featurettes/PullQuote/ico-quote.svg +3 -3
- package/dist/luna/heroes/FilterHero/FilterHero.scss +80 -80
- package/dist/luna/heroes/FullBackgroundHero/FullBackgroundHero.scss +605 -605
- package/dist/luna/heroes/Hero1/Hero1.scss +223 -223
- package/dist/luna/heroes/Hero2/Hero2.scss +165 -165
- package/dist/luna/heroes/Hero3/Hero3.scss +250 -250
- package/dist/luna/heroes/Hero4/Hero4.scss +112 -112
- package/dist/luna/heroes/Hero6/Hero6.scss +127 -127
- package/dist/luna/heroes/Hero7/Hero7.scss +193 -193
- package/dist/luna/heroes/SuperHero/SuperHero.scss +774 -774
- package/dist/luna/images/arrow-diagonal-black.svg +13 -13
- package/dist/luna/images/arrow-diagonal-blue.svg +13 -13
- package/dist/luna/images/arrow-diagonal-white.svg +13 -13
- package/dist/luna/images/bulletpoint.svg +3 -3
- package/dist/luna/images/callout-icon.svg +3 -3
- package/dist/luna/images/check-blue.svg +4 -4
- package/dist/luna/images/circle-arrow-right-black.svg +3 -3
- package/dist/luna/images/circle-arrow-right-white.svg +3 -3
- package/dist/luna/images/circle-arrow.svg +3 -3
- package/dist/luna/images/close-button.svg +42 -42
- package/dist/luna/images/close-dark-navy.svg +3 -3
- package/dist/luna/images/close-icon.svg +3 -3
- package/dist/luna/images/collapse-close-blue.svg +5 -5
- package/dist/luna/images/collapse-close-gold.svg +5 -5
- package/dist/luna/images/collapse-open-blue.svg +4 -4
- package/dist/luna/images/collapse-open-gold.svg +4 -4
- package/dist/luna/images/cross-medium-blue.svg +4 -4
- package/dist/luna/images/cross-medium-white.svg +5 -5
- package/dist/luna/images/down-caret-dark-blue.svg +4 -4
- package/dist/luna/images/down-caret-dark-gray.svg +4 -4
- package/dist/luna/images/down-caret-light-gray.svg +4 -4
- package/dist/luna/images/downArrow.svg +36 -36
- package/dist/luna/images/external-arrow-blue.svg +11 -11
- package/dist/luna/images/external-arrow-white-theme.svg +12 -12
- package/dist/luna/images/external-arrow.svg +12 -12
- package/dist/luna/images/form-border-top-light.svg +4 -4
- package/dist/luna/images/frame-intersection.svg +3 -3
- package/dist/luna/images/gallery-image-corner-border.svg +3 -3
- package/dist/luna/images/green-tick.svg +3 -3
- package/dist/luna/images/internal-arrow-blue.svg +15 -15
- package/dist/luna/images/internal-arrow-white-theme.svg +15 -15
- package/dist/luna/images/internal-arrow.svg +15 -15
- package/dist/luna/images/logo-icon.svg +17 -17
- package/dist/luna/images/pdf-doc.svg +9 -9
- package/dist/luna/images/play.svg +17 -17
- package/dist/luna/images/right-caret-dark-blue.svg +3 -3
- package/dist/luna/images/right-caret-light-gray.svg +4 -4
- package/dist/luna/images/right-caret-light-yellow-stroke.svg +9 -9
- package/dist/luna/images/right-caret-light-yellow.svg +4 -4
- package/dist/luna/images/right-caret-medium-gray.svg +4 -4
- package/dist/luna/images/search.svg +9 -9
- package/dist/luna/images/skipicon.svg +154 -154
- package/dist/luna/images/text-doc.svg +9 -9
- package/dist/luna/images/text-lines.svg +22 -22
- package/dist/luna/images/tooltip-close-icon.svg +3 -3
- package/dist/luna/images/tooltip-icon.svg +3 -3
- package/dist/luna/images/up-arrow.svg +36 -36
- package/dist/luna/images/up-right-arrow.svg +9 -9
- package/dist/luna/images/user-profile.svg +37 -37
- package/dist/luna/images/worldwide.svg +19 -19
- package/dist/luna/list-feats/ListFeat/ListFeat.scss +112 -112
- package/dist/luna/list-feats/ListFeat1/ListFeat1.scss +94 -94
- package/dist/luna/list-feats/ListFeat2/ListFeat2.scss +19 -19
- package/dist/luna/list-feats/ListFeat4/ListFeat4.scss +32 -32
- package/dist/luna/list-feats/ListFeat5/ListFeat5.scss +26 -26
- package/dist/luna/list-feats/ListFeat6/ListFeat6.scss +34 -34
- package/dist/luna/list-feats/ListFeat7/ListFeat7.scss +13 -13
- package/dist/luna/list-feats/ListFeatCustom/ListFeatCustom.scss +7 -7
- package/dist/luna/other-organisms/Carousel/Carousel.scss +134 -134
- package/dist/luna/other-organisms/Flyout/Flyout.scss +254 -254
- package/dist/luna/other-organisms/Footer/Footer.scss +469 -469
- package/dist/luna/other-organisms/LanguageSelector/LanguageSelector.scss +317 -317
- package/dist/luna/other-organisms/MarketoForm/MarketoForm.scss +56 -56
- package/dist/luna/other-organisms/NavBar/NavBar.js +2 -1
- package/dist/luna/other-organisms/NavBar/NavBar.scss +636 -638
- package/dist/luna/other-organisms/SubNav/SubNav.scss +232 -232
- package/package.json +93 -93
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Reset
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
html {
|
|
6
|
-
box-sizing: border-box;
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
*,
|
|
10
|
-
*:before,
|
|
11
|
-
*:after {
|
|
12
|
-
box-sizing: inherit;
|
|
13
|
-
}
|
|
1
|
+
/**
|
|
2
|
+
* Reset
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
html {
|
|
6
|
+
box-sizing: border-box;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
*,
|
|
10
|
+
*:before,
|
|
11
|
+
*:after {
|
|
12
|
+
box-sizing: inherit;
|
|
13
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Box Shadow
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
@mixin box-shadow($level) {
|
|
6
|
-
box-shadow: map-get($box-shadows, $level);
|
|
1
|
+
/**
|
|
2
|
+
* Box Shadow
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
@mixin box-shadow($level) {
|
|
6
|
+
box-shadow: map-get($box-shadows, $level);
|
|
7
7
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
// modules
|
|
2
|
-
@import "box-shadow";
|
|
3
|
-
@import "typography";
|
|
4
|
-
@import "yiq";
|
|
5
|
-
@import "z-index";
|
|
1
|
+
// modules
|
|
2
|
+
@import "box-shadow";
|
|
3
|
+
@import "typography";
|
|
4
|
+
@import "yiq";
|
|
5
|
+
@import "z-index";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
@mixin organism-padding() {
|
|
2
|
-
padding: spacing("super") calc((100vw - 1200px) / 2);
|
|
3
|
-
|
|
4
|
-
@media screen and (max-width: 1272px) {
|
|
5
|
-
padding: spacing("super") 36px;
|
|
6
|
-
}
|
|
7
|
-
}
|
|
1
|
+
@mixin organism-padding() {
|
|
2
|
+
padding: spacing("super") calc((100vw - 1200px) / 2);
|
|
3
|
+
|
|
4
|
+
@media screen and (max-width: 1272px) {
|
|
5
|
+
padding: spacing("super") 36px;
|
|
6
|
+
}
|
|
7
|
+
}
|
|
@@ -1,110 +1,110 @@
|
|
|
1
|
-
// header type setting
|
|
2
|
-
@mixin header-type-setting() {
|
|
3
|
-
font-size: 1em;
|
|
4
|
-
font-family: $header-font-family;
|
|
5
|
-
line-height: line-height('tight');
|
|
6
|
-
font-weight: $header-font-weight;
|
|
7
|
-
color: $header-font-color;
|
|
8
|
-
display: block;
|
|
9
|
-
margin: 0 0 0.67em 0;
|
|
10
|
-
}
|
|
11
|
-
|
|
12
|
-
// general type setting
|
|
13
|
-
@mixin type-setting($font-size: 'base', $line-height: 'regular') {
|
|
14
|
-
font-size: font-size($font-size);
|
|
15
|
-
line-height: line-height($line-height);
|
|
16
|
-
}
|
|
17
|
-
|
|
18
|
-
// paragraph type setting
|
|
19
|
-
@mixin paragraph-type-setting {
|
|
20
|
-
@include type-setting('base', 'loose');
|
|
21
|
-
margin: 0 0 1.5em 0;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
// sets font-size
|
|
25
|
-
@mixin font-size($size) {
|
|
26
|
-
@include type-setting($size);
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
// sets font-size
|
|
30
|
-
$normal-font-family: 'Benton Sans W05 Book', -apple-system, BlinkMacSystemFont,
|
|
31
|
-
'helvetica neue', helvetica, ubuntu, roboto, noto, 'segoe ui', arial,
|
|
32
|
-
sans-serif;
|
|
33
|
-
|
|
34
|
-
$light-font-weight: 100;
|
|
35
|
-
$light-font-family: 'Benton Sans W05 Light', -apple-system, BlinkMacSystemFont,
|
|
36
|
-
'helvetica neue', helvetica, ubuntu, roboto, noto, 'segoe ui', arial,
|
|
37
|
-
sans-serif;
|
|
38
|
-
|
|
39
|
-
$regular-font-weight: 400;
|
|
40
|
-
$regular-font-family: 'Benton Sans W05 Regular', -apple-system,
|
|
41
|
-
BlinkMacSystemFont, 'helvetica neue', helvetica, ubuntu, roboto, noto,
|
|
42
|
-
'segoe ui', arial, sans-serif;
|
|
43
|
-
|
|
44
|
-
$medium-font-weight: 400;
|
|
45
|
-
$medium-font-family: 'Benton Sans W05 Medium', -apple-system, BlinkMacSystemFont,
|
|
46
|
-
'helvetica neue', helvetica, ubuntu, roboto, noto, 'segoe ui', arial,
|
|
47
|
-
sans-serif;
|
|
48
|
-
|
|
49
|
-
$bold-font-weight: 400;
|
|
50
|
-
$bold-font-family: 'Benton Sans W05 Bold', -apple-system, BlinkMacSystemFont,
|
|
51
|
-
'helvetica neue', helvetica, ubuntu, roboto, noto, 'segoe ui', arial,
|
|
52
|
-
sans-serif;
|
|
53
|
-
|
|
54
|
-
$very-bold-font-family: 'Benton Sans W05 Black', -apple-system,
|
|
55
|
-
BlinkMacSystemFont, 'helvetica neue', helvetica, ubuntu, roboto, noto,
|
|
56
|
-
'segoe ui', arial, sans-serif;
|
|
57
|
-
|
|
58
|
-
@mixin font-size($size) {
|
|
59
|
-
@include type-setting($size);
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
// NEW BENTING FONT STYLING
|
|
63
|
-
@mixin benton-normal() {
|
|
64
|
-
font-family: $normal-font-family;
|
|
65
|
-
}
|
|
66
|
-
|
|
67
|
-
@mixin benton-light() {
|
|
68
|
-
font-family: $light-font-family;
|
|
69
|
-
font-weight: $light-font-weight;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
|
-
@mixin benton-regular() {
|
|
73
|
-
font-family: $regular-font-family;
|
|
74
|
-
font-weight: $regular-font-weight;
|
|
75
|
-
}
|
|
76
|
-
|
|
77
|
-
@mixin benton-medium() {
|
|
78
|
-
font-family: $medium-font-family;
|
|
79
|
-
font-weight: $medium-font-weight;
|
|
80
|
-
}
|
|
81
|
-
|
|
82
|
-
@mixin benton-bold() {
|
|
83
|
-
font-family: $bold-font-family;
|
|
84
|
-
font-weight: $bold-font-weight;
|
|
85
|
-
}
|
|
86
|
-
|
|
87
|
-
@mixin benton-very-bold() {
|
|
88
|
-
font-family: $very-bold-font-family;
|
|
89
|
-
}
|
|
90
|
-
|
|
91
|
-
h3,
|
|
92
|
-
h2 {
|
|
93
|
-
@include benton-very-bold();
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
strong {
|
|
97
|
-
@include benton-medium();
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
.ter-feat__sub-header-container,
|
|
101
|
-
.ter-feat__sub-header,
|
|
102
|
-
.ter-hero__sub-header,
|
|
103
|
-
.ter-hero__sub-header-container {
|
|
104
|
-
@include benton-light();
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
.ter-hero__header,
|
|
108
|
-
.ter-feat__header {
|
|
109
|
-
@include benton-very-bold();
|
|
110
|
-
}
|
|
1
|
+
// header type setting
|
|
2
|
+
@mixin header-type-setting() {
|
|
3
|
+
font-size: 1em;
|
|
4
|
+
font-family: $header-font-family;
|
|
5
|
+
line-height: line-height('tight');
|
|
6
|
+
font-weight: $header-font-weight;
|
|
7
|
+
color: $header-font-color;
|
|
8
|
+
display: block;
|
|
9
|
+
margin: 0 0 0.67em 0;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
// general type setting
|
|
13
|
+
@mixin type-setting($font-size: 'base', $line-height: 'regular') {
|
|
14
|
+
font-size: font-size($font-size);
|
|
15
|
+
line-height: line-height($line-height);
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
// paragraph type setting
|
|
19
|
+
@mixin paragraph-type-setting {
|
|
20
|
+
@include type-setting('base', 'loose');
|
|
21
|
+
margin: 0 0 1.5em 0;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
// sets font-size
|
|
25
|
+
@mixin font-size($size) {
|
|
26
|
+
@include type-setting($size);
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
// sets font-size
|
|
30
|
+
$normal-font-family: 'Benton Sans W05 Book', -apple-system, BlinkMacSystemFont,
|
|
31
|
+
'helvetica neue', helvetica, ubuntu, roboto, noto, 'segoe ui', arial,
|
|
32
|
+
sans-serif;
|
|
33
|
+
|
|
34
|
+
$light-font-weight: 100;
|
|
35
|
+
$light-font-family: 'Benton Sans W05 Light', -apple-system, BlinkMacSystemFont,
|
|
36
|
+
'helvetica neue', helvetica, ubuntu, roboto, noto, 'segoe ui', arial,
|
|
37
|
+
sans-serif;
|
|
38
|
+
|
|
39
|
+
$regular-font-weight: 400;
|
|
40
|
+
$regular-font-family: 'Benton Sans W05 Regular', -apple-system,
|
|
41
|
+
BlinkMacSystemFont, 'helvetica neue', helvetica, ubuntu, roboto, noto,
|
|
42
|
+
'segoe ui', arial, sans-serif;
|
|
43
|
+
|
|
44
|
+
$medium-font-weight: 400;
|
|
45
|
+
$medium-font-family: 'Benton Sans W05 Medium', -apple-system, BlinkMacSystemFont,
|
|
46
|
+
'helvetica neue', helvetica, ubuntu, roboto, noto, 'segoe ui', arial,
|
|
47
|
+
sans-serif;
|
|
48
|
+
|
|
49
|
+
$bold-font-weight: 400;
|
|
50
|
+
$bold-font-family: 'Benton Sans W05 Bold', -apple-system, BlinkMacSystemFont,
|
|
51
|
+
'helvetica neue', helvetica, ubuntu, roboto, noto, 'segoe ui', arial,
|
|
52
|
+
sans-serif;
|
|
53
|
+
|
|
54
|
+
$very-bold-font-family: 'Benton Sans W05 Black', -apple-system,
|
|
55
|
+
BlinkMacSystemFont, 'helvetica neue', helvetica, ubuntu, roboto, noto,
|
|
56
|
+
'segoe ui', arial, sans-serif;
|
|
57
|
+
|
|
58
|
+
@mixin font-size($size) {
|
|
59
|
+
@include type-setting($size);
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
// NEW BENTING FONT STYLING
|
|
63
|
+
@mixin benton-normal() {
|
|
64
|
+
font-family: $normal-font-family;
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
@mixin benton-light() {
|
|
68
|
+
font-family: $light-font-family;
|
|
69
|
+
font-weight: $light-font-weight;
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
@mixin benton-regular() {
|
|
73
|
+
font-family: $regular-font-family;
|
|
74
|
+
font-weight: $regular-font-weight;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
@mixin benton-medium() {
|
|
78
|
+
font-family: $medium-font-family;
|
|
79
|
+
font-weight: $medium-font-weight;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
@mixin benton-bold() {
|
|
83
|
+
font-family: $bold-font-family;
|
|
84
|
+
font-weight: $bold-font-weight;
|
|
85
|
+
}
|
|
86
|
+
|
|
87
|
+
@mixin benton-very-bold() {
|
|
88
|
+
font-family: $very-bold-font-family;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
h3,
|
|
92
|
+
h2 {
|
|
93
|
+
@include benton-very-bold();
|
|
94
|
+
}
|
|
95
|
+
|
|
96
|
+
strong {
|
|
97
|
+
@include benton-medium();
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.ter-feat__sub-header-container,
|
|
101
|
+
.ter-feat__sub-header,
|
|
102
|
+
.ter-hero__sub-header,
|
|
103
|
+
.ter-hero__sub-header-container {
|
|
104
|
+
@include benton-light();
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
.ter-hero__header,
|
|
108
|
+
.ter-feat__header {
|
|
109
|
+
@include benton-very-bold();
|
|
110
|
+
}
|
|
@@ -1,50 +1,50 @@
|
|
|
1
|
-
/// Determines whether a given color is light or dark.
|
|
2
|
-
/// The YIQ color space function gives weights each RGB value according to how sensitive they are to human eyesight.
|
|
3
|
-
/// @param {Color} $color - The color to test
|
|
4
|
-
/// @param {Number} $threshold [$yiq-contrasted-threshold] - The YIQ lightness value that $color should be tested against. Acceptable values are between 0 & 255.
|
|
5
|
-
/// @returns {Boolean}
|
|
6
|
-
@function yiq-is-light(
|
|
7
|
-
$color,
|
|
8
|
-
$threshold: $yiq-contrasted-threshold
|
|
9
|
-
) {
|
|
10
|
-
$red: red($color);
|
|
11
|
-
$green: green($color);
|
|
12
|
-
$blue: blue($color);
|
|
13
|
-
|
|
14
|
-
$yiq: (($red*299)+($green*587)+($blue*114))/1000;
|
|
15
|
-
|
|
16
|
-
@if $yiq-debug { @debug $yiq, $threshold; }
|
|
17
|
-
|
|
18
|
-
@return if($yiq >= $threshold, true, false);
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
/// Returns an appropriate color to ensure proper contrast
|
|
22
|
-
/// @param {Color} $base - The color to be tested
|
|
23
|
-
/// @param {Color} $dark - The color to return if $base is light
|
|
24
|
-
/// @param {Color} $light - The color to return if $base is dark
|
|
25
|
-
/// @param {Number} $threshold [$yiq-contrasted-threshold] - The YIQ lightness value that $base should be tested against. Acceptable values are between 0 & 255.
|
|
26
|
-
/// @returns {Color} - $dark if $base is light, $light is $base if dark
|
|
27
|
-
@function yiq-contrast-color(
|
|
28
|
-
$base,
|
|
29
|
-
$dark: $yiq-contrasted-dark-default,
|
|
30
|
-
$light: $yiq-contrasted-light-default,
|
|
31
|
-
$threshold: $yiq-contrasted-threshold
|
|
32
|
-
) {
|
|
33
|
-
@return if(yiq-is-light($base, $threshold), $dark, $light);
|
|
34
|
-
}
|
|
35
|
-
|
|
36
|
-
/// Sets the specified background color and calculates a dark or light contrasted text color
|
|
37
|
-
/// @param {Color} $base - The color to be tested
|
|
38
|
-
/// @param {Color} $dark - The color to return if $base is light
|
|
39
|
-
/// @param {Color} $light - The color to return if $base is dark
|
|
40
|
-
/// @param {Number} $threshold [$yiq-contrasted-threshold] - The YIQ lightness value that $base should be tested against. Acceptable values are between 0 & 255.
|
|
41
|
-
/// @outputs a background-color/text color combination with proper contrasting
|
|
42
|
-
@mixin yiq-contrasted(
|
|
43
|
-
$background-color,
|
|
44
|
-
$dark: $yiq-contrasted-dark-default,
|
|
45
|
-
$light: $yiq-contrasted-light-default,
|
|
46
|
-
$threshold: $yiq-contrasted-threshold
|
|
47
|
-
) {
|
|
48
|
-
background-color: $background-color;
|
|
49
|
-
color: yiq-contrast-color($background-color, $dark, $light, $threshold);
|
|
50
|
-
}
|
|
1
|
+
/// Determines whether a given color is light or dark.
|
|
2
|
+
/// The YIQ color space function gives weights each RGB value according to how sensitive they are to human eyesight.
|
|
3
|
+
/// @param {Color} $color - The color to test
|
|
4
|
+
/// @param {Number} $threshold [$yiq-contrasted-threshold] - The YIQ lightness value that $color should be tested against. Acceptable values are between 0 & 255.
|
|
5
|
+
/// @returns {Boolean}
|
|
6
|
+
@function yiq-is-light(
|
|
7
|
+
$color,
|
|
8
|
+
$threshold: $yiq-contrasted-threshold
|
|
9
|
+
) {
|
|
10
|
+
$red: red($color);
|
|
11
|
+
$green: green($color);
|
|
12
|
+
$blue: blue($color);
|
|
13
|
+
|
|
14
|
+
$yiq: (($red*299)+($green*587)+($blue*114))/1000;
|
|
15
|
+
|
|
16
|
+
@if $yiq-debug { @debug $yiq, $threshold; }
|
|
17
|
+
|
|
18
|
+
@return if($yiq >= $threshold, true, false);
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
/// Returns an appropriate color to ensure proper contrast
|
|
22
|
+
/// @param {Color} $base - The color to be tested
|
|
23
|
+
/// @param {Color} $dark - The color to return if $base is light
|
|
24
|
+
/// @param {Color} $light - The color to return if $base is dark
|
|
25
|
+
/// @param {Number} $threshold [$yiq-contrasted-threshold] - The YIQ lightness value that $base should be tested against. Acceptable values are between 0 & 255.
|
|
26
|
+
/// @returns {Color} - $dark if $base is light, $light is $base if dark
|
|
27
|
+
@function yiq-contrast-color(
|
|
28
|
+
$base,
|
|
29
|
+
$dark: $yiq-contrasted-dark-default,
|
|
30
|
+
$light: $yiq-contrasted-light-default,
|
|
31
|
+
$threshold: $yiq-contrasted-threshold
|
|
32
|
+
) {
|
|
33
|
+
@return if(yiq-is-light($base, $threshold), $dark, $light);
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
/// Sets the specified background color and calculates a dark or light contrasted text color
|
|
37
|
+
/// @param {Color} $base - The color to be tested
|
|
38
|
+
/// @param {Color} $dark - The color to return if $base is light
|
|
39
|
+
/// @param {Color} $light - The color to return if $base is dark
|
|
40
|
+
/// @param {Number} $threshold [$yiq-contrasted-threshold] - The YIQ lightness value that $base should be tested against. Acceptable values are between 0 & 255.
|
|
41
|
+
/// @outputs a background-color/text color combination with proper contrasting
|
|
42
|
+
@mixin yiq-contrasted(
|
|
43
|
+
$background-color,
|
|
44
|
+
$dark: $yiq-contrasted-dark-default,
|
|
45
|
+
$light: $yiq-contrasted-light-default,
|
|
46
|
+
$threshold: $yiq-contrasted-threshold
|
|
47
|
+
) {
|
|
48
|
+
background-color: $background-color;
|
|
49
|
+
color: yiq-contrast-color($background-color, $dark, $light, $threshold);
|
|
50
|
+
}
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
@mixin z-index($level) {
|
|
2
|
-
z-index: $level * 100;
|
|
3
|
-
}
|
|
1
|
+
@mixin z-index($level) {
|
|
2
|
+
z-index: $level * 100;
|
|
3
|
+
}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
// global
|
|
2
|
-
@import "./global-vars.scss";
|
|
3
|
-
@import "~terra-one/dist/global-styles/global-colors.scss";
|
|
4
|
-
@import "~terra-one/dist/global-styles/global-text-sizes.scss";
|
|
5
|
-
@import "~terra-one/dist/global-styles/global-vars.scss";
|
|
6
|
-
|
|
7
|
-
// mixins
|
|
8
|
-
@import "./mixins/box-shadow";
|
|
9
|
-
@import "./mixins/typography";
|
|
10
|
-
@import "./mixins/yiq";
|
|
11
|
-
@import "./mixins/organism-padding-hack";
|
|
12
|
-
|
|
13
|
-
// layout
|
|
14
|
-
@import "./layout/media-queries";
|
|
15
|
-
@import "./layout/css-grid";
|
|
1
|
+
// global
|
|
2
|
+
@import "./global-vars.scss";
|
|
3
|
+
@import "~terra-one/dist/global-styles/global-colors.scss";
|
|
4
|
+
@import "~terra-one/dist/global-styles/global-text-sizes.scss";
|
|
5
|
+
@import "~terra-one/dist/global-styles/global-vars.scss";
|
|
6
|
+
|
|
7
|
+
// mixins
|
|
8
|
+
@import "./mixins/box-shadow";
|
|
9
|
+
@import "./mixins/typography";
|
|
10
|
+
@import "./mixins/yiq";
|
|
11
|
+
@import "./mixins/organism-padding-hack";
|
|
12
|
+
|
|
13
|
+
// layout
|
|
14
|
+
@import "./layout/media-queries";
|
|
15
|
+
@import "./layout/css-grid";
|
|
@@ -1,9 +1,9 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Box Shadow
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
@each $level, $value in $box-shadows {
|
|
6
|
-
.box-shadow-#{$level} {
|
|
7
|
-
box-shadow: $value;
|
|
8
|
-
}
|
|
1
|
+
/**
|
|
2
|
+
* Box Shadow
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
@each $level, $value in $box-shadows {
|
|
6
|
+
.box-shadow-#{$level} {
|
|
7
|
+
box-shadow: $value;
|
|
8
|
+
}
|
|
9
9
|
}
|
|
@@ -1,49 +1,49 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Display
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
.d-inline { display: inline; }
|
|
6
|
-
.d-inline-block { display: inline-block; }
|
|
7
|
-
.d-block { display: block; }
|
|
8
|
-
.d-flex { display: flex; }
|
|
9
|
-
.d-inline-flex { display: inline-flex; }
|
|
10
|
-
.d-table { display: table; }
|
|
11
|
-
.d-table-cell { display: table-cell; }
|
|
12
|
-
.d-table-row { display: table-row; }
|
|
13
|
-
.d-none { display: none; }
|
|
14
|
-
|
|
15
|
-
@media only screen and (min-width: $breakpoint-xs) {
|
|
16
|
-
.d-sm-inline { display: inline; }
|
|
17
|
-
.d-sm-inline-block { display: inline-block; }
|
|
18
|
-
.d-sm-block { display: block; }
|
|
19
|
-
.d-sm-flex { display: flex; }
|
|
20
|
-
.d-sm-inline-flex { display: inline-flex; }
|
|
21
|
-
.d-sm-table { display: table; }
|
|
22
|
-
.d-sm-table-cell { display: table-cell; }
|
|
23
|
-
.d-sm-table-row { display: table-row; }
|
|
24
|
-
.d-sm-none { display: none; }
|
|
25
|
-
}
|
|
26
|
-
|
|
27
|
-
@media only screen and (min-width: $breakpoint-sm) {
|
|
28
|
-
.d-md-inline { display: inline; }
|
|
29
|
-
.d-md-inline-block { display: inline-block; }
|
|
30
|
-
.d-md-block { display: block; }
|
|
31
|
-
.d-md-flex { display: flex; }
|
|
32
|
-
.d-md-inline-flex { display: inline-flex; }
|
|
33
|
-
.d-md-table { display: table; }
|
|
34
|
-
.d-md-table-cell { display: table-cell; }
|
|
35
|
-
.d-md-table-row { display: table-row; }
|
|
36
|
-
.d-md-none { display: none; }
|
|
37
|
-
}
|
|
38
|
-
|
|
39
|
-
@media only screen and (min-width: $breakpoint-md) {
|
|
40
|
-
.d-lg-inline { display: inline; }
|
|
41
|
-
.d-lg-inline-block { display: inline-block; }
|
|
42
|
-
.d-lg-block { display: block; }
|
|
43
|
-
.d-lg-flex { display: flex; }
|
|
44
|
-
.d-lg-inline-flex { display: inline-flex; }
|
|
45
|
-
.d-lg-table { display: table; }
|
|
46
|
-
.d-lg-table-cell { display: table-cell; }
|
|
47
|
-
.d-lg-table-row { display: table-row; }
|
|
48
|
-
.d-lg-none { display: none; }
|
|
1
|
+
/**
|
|
2
|
+
* Display
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
.d-inline { display: inline; }
|
|
6
|
+
.d-inline-block { display: inline-block; }
|
|
7
|
+
.d-block { display: block; }
|
|
8
|
+
.d-flex { display: flex; }
|
|
9
|
+
.d-inline-flex { display: inline-flex; }
|
|
10
|
+
.d-table { display: table; }
|
|
11
|
+
.d-table-cell { display: table-cell; }
|
|
12
|
+
.d-table-row { display: table-row; }
|
|
13
|
+
.d-none { display: none; }
|
|
14
|
+
|
|
15
|
+
@media only screen and (min-width: $breakpoint-xs) {
|
|
16
|
+
.d-sm-inline { display: inline; }
|
|
17
|
+
.d-sm-inline-block { display: inline-block; }
|
|
18
|
+
.d-sm-block { display: block; }
|
|
19
|
+
.d-sm-flex { display: flex; }
|
|
20
|
+
.d-sm-inline-flex { display: inline-flex; }
|
|
21
|
+
.d-sm-table { display: table; }
|
|
22
|
+
.d-sm-table-cell { display: table-cell; }
|
|
23
|
+
.d-sm-table-row { display: table-row; }
|
|
24
|
+
.d-sm-none { display: none; }
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
@media only screen and (min-width: $breakpoint-sm) {
|
|
28
|
+
.d-md-inline { display: inline; }
|
|
29
|
+
.d-md-inline-block { display: inline-block; }
|
|
30
|
+
.d-md-block { display: block; }
|
|
31
|
+
.d-md-flex { display: flex; }
|
|
32
|
+
.d-md-inline-flex { display: inline-flex; }
|
|
33
|
+
.d-md-table { display: table; }
|
|
34
|
+
.d-md-table-cell { display: table-cell; }
|
|
35
|
+
.d-md-table-row { display: table-row; }
|
|
36
|
+
.d-md-none { display: none; }
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
@media only screen and (min-width: $breakpoint-md) {
|
|
40
|
+
.d-lg-inline { display: inline; }
|
|
41
|
+
.d-lg-inline-block { display: inline-block; }
|
|
42
|
+
.d-lg-block { display: block; }
|
|
43
|
+
.d-lg-flex { display: flex; }
|
|
44
|
+
.d-lg-inline-flex { display: inline-flex; }
|
|
45
|
+
.d-lg-table { display: table; }
|
|
46
|
+
.d-lg-table-cell { display: table-cell; }
|
|
47
|
+
.d-lg-table-row { display: table-row; }
|
|
48
|
+
.d-lg-none { display: none; }
|
|
49
49
|
}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Font Family
|
|
3
|
-
*/
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
.font-sans-serif {
|
|
7
|
-
font-family: $font-sans-serif;
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
.font-serif {
|
|
11
|
-
font-family: $font-serif;
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
.font-code {
|
|
15
|
-
font-family: $font-code;
|
|
1
|
+
/**
|
|
2
|
+
* Font Family
|
|
3
|
+
*/
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
.font-sans-serif {
|
|
7
|
+
font-family: $font-sans-serif;
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
.font-serif {
|
|
11
|
+
font-family: $font-serif;
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
.font-code {
|
|
15
|
+
font-family: $font-code;
|
|
16
16
|
}
|
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
.ter-feat-one,
|
|
2
|
-
.ter-feat-two,
|
|
3
|
-
.ter-feat-three,
|
|
4
|
-
.ter-feat-four,
|
|
5
|
-
.ter-feat-five,
|
|
6
|
-
.ter-feat-six,
|
|
7
|
-
.ter-feat-seven,
|
|
8
|
-
.ter-feat-eight,
|
|
9
|
-
.ter-feat9,
|
|
10
|
-
.ter-feat-ten,
|
|
11
|
-
.ter-hero-two,
|
|
12
|
-
.ter-hero-four,
|
|
13
|
-
.ter-hero-five,
|
|
14
|
-
.ter-feat-four-flex {
|
|
15
|
-
&__background-image {
|
|
16
|
-
transition: 0.1s;
|
|
17
|
-
// background-size: contain;
|
|
18
|
-
// This is potentially bad for parallax performance optmization
|
|
19
|
-
|
|
20
|
-
background-repeat: no-repeat;
|
|
21
|
-
}
|
|
22
|
-
overflow: hidden;
|
|
23
|
-
}
|
|
1
|
+
.ter-feat-one,
|
|
2
|
+
.ter-feat-two,
|
|
3
|
+
.ter-feat-three,
|
|
4
|
+
.ter-feat-four,
|
|
5
|
+
.ter-feat-five,
|
|
6
|
+
.ter-feat-six,
|
|
7
|
+
.ter-feat-seven,
|
|
8
|
+
.ter-feat-eight,
|
|
9
|
+
.ter-feat9,
|
|
10
|
+
.ter-feat-ten,
|
|
11
|
+
.ter-hero-two,
|
|
12
|
+
.ter-hero-four,
|
|
13
|
+
.ter-hero-five,
|
|
14
|
+
.ter-feat-four-flex {
|
|
15
|
+
&__background-image {
|
|
16
|
+
transition: 0.1s;
|
|
17
|
+
// background-size: contain;
|
|
18
|
+
// This is potentially bad for parallax performance optmization
|
|
19
|
+
|
|
20
|
+
background-repeat: no-repeat;
|
|
21
|
+
}
|
|
22
|
+
overflow: hidden;
|
|
23
|
+
}
|