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,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,102 +1,102 @@
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 for Trimble W05";
31
-
32
- $light-font-weight: 100;
33
- $light-font-family: "Benton Sans for Trimble W05";
34
-
35
- $regular-font-weight: 350;
36
- $regular-font-family: "Benton Sans for Trimble W05";
37
-
38
- $medium-font-weight: 400;
39
- $medium-font-family: "Benton Sans for Trimble W05";
40
-
41
- $bold-font-weight: 600;
42
-
43
- $very-bold-font-weight: 800;
44
- $bold-font-family: "Benton Sans for Trimble W05";
45
-
46
- $very-bold-font-family: "Benton Sans for Trimble W05";
47
-
48
- @mixin font-size($size) {
49
- @include type-setting($size);
50
- }
51
-
52
- // NEW BENTING FONT STYLING
53
- @mixin benton-normal() {
54
- font-family: $normal-font-family;
55
- font-weight: 400;
56
- }
57
-
58
- @mixin benton-light() {
59
- font-family: $light-font-family;
60
- font-weight: $light-font-weight;
61
- }
62
-
63
- @mixin benton-regular() {
64
- font-family: $regular-font-family;
65
- font-weight: $regular-font-weight;
66
- }
67
-
68
- @mixin benton-medium() {
69
- font-family: $medium-font-family;
70
- font-weight: $medium-font-weight;
71
- }
72
-
73
- @mixin benton-bold() {
74
- font-family: $bold-font-family;
75
- font-weight: $bold-font-weight;
76
- }
77
-
78
- @mixin benton-very-bold() {
79
- font-family: $very-bold-font-family;
80
- font-weight: $very-bold-font-weight;
81
- }
82
-
83
- h3,
84
- h2 {
85
- @include benton-very-bold();
86
- }
87
-
88
- strong {
89
- @include benton-medium();
90
- }
91
-
92
- .ter-feat__sub-header-container,
93
- .ter-feat__sub-header,
94
- .ter-hero__sub-header,
95
- .ter-hero__sub-header-container {
96
- @include benton-light();
97
- }
98
-
99
- .ter-hero__header,
100
- .ter-feat__header {
101
- @include benton-very-bold();
102
- }
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 for Trimble W05";
31
+
32
+ $light-font-weight: 100;
33
+ $light-font-family: "Benton Sans for Trimble W05";
34
+
35
+ $regular-font-weight: 350;
36
+ $regular-font-family: "Benton Sans for Trimble W05";
37
+
38
+ $medium-font-weight: 400;
39
+ $medium-font-family: "Benton Sans for Trimble W05";
40
+
41
+ $bold-font-weight: 600;
42
+
43
+ $very-bold-font-weight: 800;
44
+ $bold-font-family: "Benton Sans for Trimble W05";
45
+
46
+ $very-bold-font-family: "Benton Sans for Trimble W05";
47
+
48
+ @mixin font-size($size) {
49
+ @include type-setting($size);
50
+ }
51
+
52
+ // NEW BENTING FONT STYLING
53
+ @mixin benton-normal() {
54
+ font-family: $normal-font-family;
55
+ font-weight: 400;
56
+ }
57
+
58
+ @mixin benton-light() {
59
+ font-family: $light-font-family;
60
+ font-weight: $light-font-weight;
61
+ }
62
+
63
+ @mixin benton-regular() {
64
+ font-family: $regular-font-family;
65
+ font-weight: $regular-font-weight;
66
+ }
67
+
68
+ @mixin benton-medium() {
69
+ font-family: $medium-font-family;
70
+ font-weight: $medium-font-weight;
71
+ }
72
+
73
+ @mixin benton-bold() {
74
+ font-family: $bold-font-family;
75
+ font-weight: $bold-font-weight;
76
+ }
77
+
78
+ @mixin benton-very-bold() {
79
+ font-family: $very-bold-font-family;
80
+ font-weight: $very-bold-font-weight;
81
+ }
82
+
83
+ h3,
84
+ h2 {
85
+ @include benton-very-bold();
86
+ }
87
+
88
+ strong {
89
+ @include benton-medium();
90
+ }
91
+
92
+ .ter-feat__sub-header-container,
93
+ .ter-feat__sub-header,
94
+ .ter-hero__sub-header,
95
+ .ter-hero__sub-header-container {
96
+ @include benton-light();
97
+ }
98
+
99
+ .ter-hero__header,
100
+ .ter-feat__header {
101
+ @include benton-very-bold();
102
+ }
@@ -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
+ }
@@ -1,25 +1,25 @@
1
- /**
2
- * Text Align
3
- */
4
-
5
- .text-left { text-align: left; }
6
- .text-right { text-align: right; }
7
- .text-center { text-align: center; }
8
-
9
- @media only screen and (min-width: $breakpoint-xs) {
10
- .text-sm-left { text-align: left; }
11
- .text-sm-right { text-align: right; }
12
- .text-sm-center { text-align: center; }
13
- }
14
-
15
- @media only screen and (min-width: $breakpoint-sm) {
16
- .text-md-left { text-align: left; }
17
- .text-md-right { text-align: right; }
18
- .text-md-center { text-align: center; }
19
- }
20
-
21
- @media only screen and (min-width: $breakpoint-md) {
22
- .text-lg-left { text-align: left; }
23
- .text-lg-right { text-align: right; }
24
- .text-lg-center { text-align: center; }
1
+ /**
2
+ * Text Align
3
+ */
4
+
5
+ .text-left { text-align: left; }
6
+ .text-right { text-align: right; }
7
+ .text-center { text-align: center; }
8
+
9
+ @media only screen and (min-width: $breakpoint-xs) {
10
+ .text-sm-left { text-align: left; }
11
+ .text-sm-right { text-align: right; }
12
+ .text-sm-center { text-align: center; }
13
+ }
14
+
15
+ @media only screen and (min-width: $breakpoint-sm) {
16
+ .text-md-left { text-align: left; }
17
+ .text-md-right { text-align: right; }
18
+ .text-md-center { text-align: center; }
19
+ }
20
+
21
+ @media only screen and (min-width: $breakpoint-md) {
22
+ .text-lg-left { text-align: left; }
23
+ .text-lg-right { text-align: right; }
24
+ .text-lg-center { text-align: center; }
25
25
  }