Improve fullwidth container (#669)

verdigado · Jul 16, 2024 · 845288d · 845288d
1 parent 225907b
commit 845288d
Show file tree

Hide file tree

Showing 6 changed files with 35 additions and 20 deletions.
diff --git a/sass/_layout.scss b/sass/_layout.scss
@@ -246,6 +246,11 @@ iframe {
  opacity: 0.3;
  background-color: $black;
  }
+
+ .wp-block-group__inner-container {
+ position: relative;
+ }
+
  }
 }
 

diff --git a/sass/_variables.scss b/sass/_variables.scss
@@ -44,7 +44,7 @@ $container-max-widths: (
  sm: 540px,
  md: 720px,
  lg: 960px,
- xl: 1200px) !default;
+ xl: 1170px) !default;
 
 $font-size-base: 1.1875rem;
 $small-font-size: 15px;

diff --git a/sass/wp-blocks/group.scss b/sass/wp-blocks/group.scss
@@ -2,30 +2,26 @@
 
  position: relative;
 
- &.is-layout-flex {
- gap: 0;
- }
-
- &.alignfull.has-background {
+ &.alignfull {
  width: 100vw;
  display: flex;
  justify-content: center;
- flex-wrap: wrap;
- flex-direction: column;
 
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
- padding-left: 5vw;
- padding-right: 5vw;
 
- @include media-breakpoint-up(lg) {
- padding-left: 10vw;
- padding-right: 10vw;
+ @include media-breakpoint-down(xl) {
+ padding-left: 2rem;
+ padding-right: 2rem;
+ }
+
+ @include media-breakpoint-down(sm) {
+ padding-left: 1rem;
+ padding-right: 1rem;
  }
 
- @include media-breakpoint-up(xl) {
- padding-left: 20vw;
- padding-right: 20vw;
+ > p {
+ max-width: map-get($container-max-widths, "xl");
  }
  }
 

diff --git a/src/latest-posts/render.php b/src/latest-posts/render.php
@@ -83,7 +83,7 @@
 $sunflower_list_items .= sprintf(
  '
  <a class="text-white no-link d-block bg-primary has-green-550-hover-background-color border-radius" href="%1$s" rel="">
- <div class="p-45 row ">
+ <div class="p-45 row">
  <span class="continue-reading text-white text-center pt-0">%2$s</span>
  </div>
  </a>
@@ -92,7 +92,7 @@
  ( $attributes['archiveText'] ?? '' ) ? ( $attributes['archiveText'] ?? '' ) : __( 'to archive', 'sunflower-latest-posts' )
 );
 
-$sunflower_list_items .= '</div></div></div></div>';
+$sunflower_list_items .= '</div></div></div>';
 
 echo wp_kses(
  $sunflower_list_items,

diff --git a/src/next-events/block.json b/src/next-events/block.json
@@ -30,7 +30,9 @@
  }
  },
  "supports": {
- "html": false
+ "html": false,
+ "align": [ "full" ],
+ "alignWide": true
  },
  "textdomain": "sunflower-next-events",
  "editorScript": "file:./index.js",

diff --git a/theme.json b/theme.json
@@ -3,6 +3,7 @@
  "version": 3,
  "settings": {
  "appearanceTools": false,
+ "useRootPaddingAwareAlignments": true,
  "color": {
  "palette": [
  {
@@ -128,5 +129,16 @@
  }
  ]
  }
- }
+ },
+ "styles": {
+ "spacing": {
+ "padding": {
+ "top": "0px",
+ "bottom": "0px",
+ "right": "2rem",
+ "left": "2rem"
+ }
+ }
+ }
+
 }