Full width hero (#141)

* - full-width support for hero * - add additional styles to render specific button background * - add additional styles to render specific button background
hlxsites · Jun 8, 2023 · 7712755 · 7712755
1 parent 63ec15b
commit 7712755
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 0 deletions.
diff --git a/blocks/hero/hero.css b/blocks/hero/hero.css
@@ -13,6 +13,10 @@ main .section.hero-container {
   align-items: center;
 }
 
+main .section.full-width > .hero-wrapper {
+  max-width: var(--full-page-width);
+}
+
 .hero.block.under-nav {
   margin-top: calc(var(--nav-height) * -1);
   background: linear-gradient(180deg, rgba(0 0 0 / 50%) 0, rgba(0 0 0 / 50%) 50px, transparent 100px, transparent 100%);

diff --git a/styles/styles.css b/styles/styles.css
@@ -337,6 +337,18 @@ main .section .default-content-wrapper h4 {
   cursor: pointer;
 }
 
+main .section.button-primary-color .button-container a {
+  background-color: var(--primary-color);
+  color: var(--white);
+}
+
+main .section.button-primary-color .button-container a:hover {
+  background-color: var(--white);
+  border: 1px solid var(--grey);
+  color: var(--black);
+  box-shadow: none;
+}
+
 .text-up {
   text-transform: uppercase;
 }
@@ -380,6 +392,7 @@ main .section .default-content-wrapper h4 {
   text-align: center;
 }
 
+/* stylelint-disable-next-line no-descending-specificity */
 .modal .modal-content a {
   display: inline-block;
   margin-top: 1em;