@snyk-mktg/brand-ui 2.5.9-canary.0 → 2.5.9-canary.2

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 (62) hide show
  1. package/dist/css/bundle.css +82 -1
  2. package/dist/css/bundle.css.map +1 -1
  3. package/dist/css/components.css +82 -1
  4. package/dist/css/components.css.map +1 -1
  5. package/dist/css/evo-bundle.css +31 -1
  6. package/dist/css/evo-bundle.css.map +1 -1
  7. package/dist/css/labs-bundle.css +31 -1
  8. package/dist/css/labs-bundle.css.map +1 -1
  9. package/dist/scss/base/_color.scss +1 -16
  10. package/dist/scss/base/_layout.scss +7 -11
  11. package/dist/scss/base/decorations/_markers.scss +28 -26
  12. package/dist/scss/base/mixins/_accessibility.scss +6 -0
  13. package/dist/scss/base/mixins/_color-mode.scss +7 -0
  14. package/dist/scss/base/variables/_colors.scss +34 -29
  15. package/dist/scss/base/variables/_themes.scss +17 -17
  16. package/dist/scss/base/variables/_typography.scss +41 -49
  17. package/dist/scss/base.scss +4 -2
  18. package/dist/scss/components/atoms/_badge.scss +1 -1
  19. package/dist/scss/components/atoms/_button.scss +11 -116
  20. package/dist/scss/components/atoms/_checkbox.scss +12 -2
  21. package/dist/scss/components/atoms/_dropdown.scss +3 -3
  22. package/dist/scss/components/atoms/_feature-checkmark.scss +0 -1
  23. package/dist/scss/components/atoms/_icons.scss +5 -2
  24. package/dist/scss/components/atoms/_tabs.scss +4 -4
  25. package/dist/scss/components/atoms/triggers/_filter.scss +1 -1
  26. package/dist/scss/components/molecules/_announcements.scss +4 -4
  27. package/dist/scss/components/molecules/_pagination.scss +3 -3
  28. package/dist/scss/components/molecules/_share-this.scss +2 -1
  29. package/dist/scss/components/molecules/_tables.scss +59 -2
  30. package/dist/scss/components/molecules/cards/_card.scss +7 -8
  31. package/dist/scss/components/organisms/_glossary.scss +7 -0
  32. package/dist/scss/components/organisms/_split-content.scss +0 -4
  33. package/dist/scss/components/organisms/_sub-navigation.scss +1 -1
  34. package/dist/scss/components/organisms/ctas/_basic-cta.scss +6 -4
  35. package/dist/scss/components/organisms/heroes/_hero-case-study.scss +4 -7
  36. package/dist/scss/evo/_components.scss +1 -1
  37. package/dist/scss/evo/base/variables/_typography.scss +1 -0
  38. package/dist/scss/evo/components/atoms/_button.scss +88 -0
  39. package/dist/scss/evo/components/molecules/_share-this.scss +44 -0
  40. package/dist/scss/evo/components/molecules/cards/_card.scss +3 -0
  41. package/dist/scss/evo/components/organisms/_footer.scss +14 -0
  42. package/dist/scss/evo/components/organisms/ctas/_basic-cta.scss +1 -0
  43. package/dist/scss/labs/base/variables/_colors.scss +8 -0
  44. package/dist/scss/labs/base/variables/_typography.scss +44 -0
  45. package/dist/scss/labs/components/atoms/_button.scss +12 -0
  46. package/dist/scss/labs/components/atoms/triggers/_play.scss +1 -1
  47. package/dist/scss/labs/components/molecules/_pagination.scss +5 -0
  48. package/dist/scss/labs/components/molecules/cards/_card.scss +10 -0
  49. package/dist/scss/labs/components/organisms/ctas/_basic-cta.scss +2 -0
  50. package/dist/scss/labs/utilities/_rich-text.scss +13 -0
  51. package/dist/scss/utilities/_rich-text.scss +1 -1
  52. package/package.json +3 -2
  53. package/dist/js/helpers/caseFormats.test.d.ts +0 -1
  54. package/dist/js/helpers/caseFormats.test.js +0 -59
  55. package/dist/js/helpers/classnames.test.d.ts +0 -1
  56. package/dist/js/helpers/classnames.test.js +0 -13
  57. package/dist/js/helpers/getInitials.test.d.ts +0 -1
  58. package/dist/js/helpers/getInitials.test.js +0 -29
  59. package/dist/js/helpers/grid.test.d.ts +0 -1
  60. package/dist/js/helpers/grid.test.js +0 -44
  61. package/dist/js/helpers/range.test.d.ts +0 -1
  62. package/dist/js/helpers/range.test.js +0 -24
package/dist/css/bundle.css CHANGED
@@ -18247,6 +18247,18 @@ cite {
18247
18247
  font-size: 0.875rem;
18248
18248
  line-height: 1.5rem;
18249
18249
  }
18250
+ .button.search-trigger:hover, .button.search-trigger:focus {
18251
+ color: #145deb;
18252
+ }
18253
+ .button.search-trigger:hover.dark-mode, .dark-mode .button.search-trigger:hover, .button.search-trigger:focus.dark-mode, .dark-mode .button.search-trigger:focus {
18254
+ color: #9bcfff;
18255
+ }
18256
+ .button.search-trigger:hover, .button.search-trigger:focus {
18257
+ background-color: transparent;
18258
+ }
18259
+ .button.search-trigger:hover.dark-mode, .dark-mode .button.search-trigger:hover, .button.search-trigger:focus.dark-mode, .dark-mode .button.search-trigger:focus {
18260
+ background-color: transparent;
18261
+ }
18250
18262
 
18251
18263
  .buttons {
18252
18264
  max-width: max-content;
@@ -26542,6 +26554,57 @@ a.tag:focus {
26542
26554
  color: #3ea2ff;
26543
26555
  }
26544
26556
 
26557
+ .search-wrapper {
26558
+ position: relative;
26559
+ display: flex;
26560
+ align-items: center;
26561
+ width: 100%;
26562
+ padding: 2px;
26563
+ border-width: 0.0625rem;
26564
+ border-radius: 100rem;
26565
+ border-style: solid;
26566
+ }
26567
+ .search-wrapper {
26568
+ border-color: #383f76;
26569
+ }
26570
+ .search-wrapper.dark-mode, .dark-mode .search-wrapper {
26571
+ border-color: #fff;
26572
+ }
26573
+ .search-input {
26574
+ border: none;
26575
+ border-radius: 100rem;
26576
+ outline: none;
26577
+ padding: 0.5rem 1.5rem;
26578
+ width: 100%;
26579
+ font-family: "Roboto", sans-serif;
26580
+ min-width: 300px;
26581
+ font-size: 1rem;
26582
+ }
26583
+ .search-input {
26584
+ color: #383f76;
26585
+ }
26586
+ .search-input.dark-mode, .dark-mode .search-input {
26587
+ color: #fff;
26588
+ }
26589
+ .search-input::placeholder {
26590
+ font-size: 1rem;
26591
+ font-family: "Roboto", sans-serif;
26592
+ }
26593
+ @media (min-width: 769px) {
26594
+ .search-input {
26595
+ min-width: 500px;
26596
+ }
26597
+ }
26598
+ .search-submit {
26599
+ position: absolute;
26600
+ right: 0;
26601
+ }
26602
+
26603
+ .search-result-highlight {
26604
+ border-radius: 2px;
26605
+ background-color: #ffe792;
26606
+ }
26607
+
26545
26608
  .table-comparison-caption {
26546
26609
  width: calc(1440px / 12 * 6);
26547
26610
  }
@@ -26621,7 +26684,7 @@ a.tag:focus {
26621
26684
  background-color: "none";
26622
26685
  }
26623
26686
  .table-comparison-row-header {
26624
- width: calc(1440px / 12 * 6);
26687
+ width: calc(1440px / 12 * 4);
26625
26688
  padding-left: 1rem;
26626
26689
  text-align: left;
26627
26690
  vertical-align: top;
@@ -28518,6 +28581,16 @@ a.tag:focus {
28518
28581
  transform: unset;
28519
28582
  }
28520
28583
  }
28584
+ .brandui-navigation .navigation-wrapper:has(.with-search) {
28585
+ justify-content: end;
28586
+ gap: 1rem;
28587
+ }
28588
+ @media (max-width: 1024px) {
28589
+ .brandui-navigation .navigation-wrapper:has(.with-search) {
28590
+ justify-content: start;
28591
+ gap: 0.5rem;
28592
+ }
28593
+ }
28521
28594
  @media (max-width: 1024px) {
28522
28595
  .brandui-navigation .navigation-wrapper {
28523
28596
  margin-top: 5rem;
@@ -29364,6 +29437,11 @@ a.tag:focus {
29364
29437
  transition: 0.2s ease-in-out;
29365
29438
  margin-left: auto;
29366
29439
  }
29440
+ @media (min-width: 1025px) {
29441
+ .brandui-navigation .navigation-buttons.with-search {
29442
+ margin-left: 0;
29443
+ }
29444
+ }
29367
29445
  @media (max-width: 1024px) {
29368
29446
  .brandui-navigation .navigation-buttons {
29369
29447
  margin: 0 auto;
@@ -29371,6 +29449,9 @@ a.tag:focus {
29371
29449
  align-items: center;
29372
29450
  flex-direction: column-reverse;
29373
29451
  }
29452
+ .brandui-navigation .navigation-buttons.no-reverse {
29453
+ flex-direction: column;
29454
+ }
29374
29455
  }
29375
29456
  @media (max-width: 1024px) {
29376
29457
  .brandui-navigation .navigation {