devgeniem · eebbi · Jun 25, 2026 · Jul 1, 2026 · Jul 1, 2026
diff --git a/CHANGELOG.MD b/CHANGELOG.MD
@@ -7,6 +7,9 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+- Allow gutenberg block usage
+- Minor style fixes across layouts
+
 ## [1.0.0] - 2026-06-17
 
 - Create tms-theme-muumib2b from tms-theme-base
diff --git a/assets/styles/layouts/_call-to-action.scss b/assets/styles/layouts/_call-to-action.scss
@@ -32,7 +32,7 @@
 /*
  * Specific styles if CTA is below hero
  */
-.hero + .call-to-action {
+body.page-template-page-front-page .hero + .call-to-action.before-has-background-white:has(.shape-slot--top.border-shape--wave-top-reverse) {
     margin-top: $theme-spacing-two;
     padding-top: 0 !important;
 
@@ -71,7 +71,7 @@ $_hero-bleed-colors: (
 );
 
 @each $name, $color in $_hero-bleed-colors {
-    .hero.has-background-#{$name} + .call-to-action {
+    body.page-template-page-front-page .hero.has-background-#{$name} + .call-to-action.before-has-background-white:has(.shape-slot--top.border-shape--wave-top-reverse) {
         background-image: linear-gradient(
             to bottom,
             #{$color} 16rem,

diff --git a/assets/styles/layouts/_hero-and-carousel.scss b/assets/styles/layouts/_hero-and-carousel.scss
@@ -49,7 +49,7 @@
         text-align: center;
 
         @include from($desktop) {
-            font-size: 1.165rem;
+            font-size: 1rem;
         }
 
         @media (min-width: 1800px) {

diff --git a/assets/styles/layouts/_hero.scss b/assets/styles/layouts/_hero.scss
@@ -30,7 +30,6 @@
 
     p {
         font-weight: $weight-semibold;
-        // font-size: 1.165rem;
     }
 
     .button {
@@ -73,7 +72,11 @@
             max-height: 900px;
             height: 100%;
             object-fit: cover;
-            object-position: bottom center;
+            object-position: center;
+
+            &.objectfit-image-contain {
+                object-fit: contain !important;
+            }
         }
 
         .hero-image--rounded img {
@@ -100,6 +103,10 @@
         @media (max-width: 920px) {
             .columns {
                 display: block;
+
+                > .column:first-child {
+                    text-align: center !important;
+                }
             }
         }
     }

diff --git a/assets/styles/layouts/_image-banner.scss b/assets/styles/layouts/_image-banner.scss
@@ -24,4 +24,8 @@
 
 .image-banner {
     padding: 0 !important;
+
+    &.is-align-full {
+        width: 100%;
+    }
 }
diff --git a/assets/styles/views/_page-exhibition-three.scss b/assets/styles/views/_page-exhibition-three.scss
@@ -2,12 +2,12 @@
     .hero + .content-columns {
         overflow-x: clip;
 
-        &__item {
+        .content-columns__item {
             min-height: 600px;
         }
 
-        .image {
-            @media (min-width: 768px) {
+        .column.is-6-desktop > .image {
+            @media (min-width: 768px) and (max-width: 2000px) {
                 position: absolute;
                 right: -25%;
                 top: 0;

diff --git a/lib/ACF/Fields/HeroAndImageCarouselFields.php b/lib/ACF/Fields/HeroAndImageCarouselFields.php
@@ -103,6 +103,7 @@ protected function sub_fields() : array {
         unset( $hero_field->sub_fields['use_button_icon'] );
         unset( $hero_field->sub_fields['button_icon'] );
         unset( $hero_field->sub_fields['hero_img_position'] );
+        unset( $hero_field->sub_fields['hero_img_object_fit'] );
         unset( $hero_field->sub_fields['hero_img_shape'] );
         unset( $hero_field->sub_fields['common_background_color'] );
         unset( $hero_field->sub_fields['common_next_background_color'] );

diff --git a/lib/ACF/Fields/HeroFields.php b/lib/ACF/Fields/HeroFields.php
@@ -104,9 +104,13 @@ protected function sub_fields() : array {
                 'label'        => 'Hero taustakuvan sijainti',
                 'instructions' => '',
             ],
+            'hero_img_object_fit'     => [
+                'label'        => 'Kuvan sovitus alueeseen',
+                'instructions' => '',
+            ],
             'hero_img_shape'     => [
                 'label'        => 'Hero kuvan muodot',
-                'instructions' => 'Valitse heron kuvalle käytettävä muoto',
+                'instructions' => '',
             ],
             'next_background_color' => [
                 'label'        => 'Seuraavan komponentin taustaväri',
@@ -189,9 +193,20 @@ protected function sub_fields() : array {
                 'has-text-centered' => 'Keskitetty',
             ] )
             ->set_wrapper_width( 50 )
-            ->set_default_value( 'has-text-centered-desktop' )
+            ->set_default_value( 'has-text-centered' )
             ->set_instructions( $strings['hero_img_position']['instructions'] );
 
+        $hero_img_object_fit_field = ( new Field\Select( $strings['hero_img_object_fit']['label'] ) )
+            ->set_key( "{$key}_hero_img_object_fit" )
+            ->set_name( 'hero_img_object_fit' )
+            ->set_choices( [
+                'objectfit-image-cover'   => 'Täytä alue',
+                'objectfit-image-contain' => 'Näytä koko kuva',
+            ] )
+            ->set_wrapper_width( 50 )
+            ->set_default_value( 'objectfit-image-cover' )
+            ->set_instructions( $strings['hero_img_object_fit']['instructions'] );
+
         $hero_img_shape_field = ( new Field\Select( $strings['hero_img_shape']['label'] ) )
             ->set_key( "{$key}_hero_img_shape" )
             ->set_name( 'hero_img_shape' )
@@ -200,8 +215,8 @@ protected function sub_fields() : array {
                 'hero-image--rounded' => 'Pyöristetyt reunat',
                 'hero-image--wavy'    => 'Aaltoilevat reunat',
             ] )
-            ->set_wrapper_width( 50 )
-            ->set_instructions( $strings['hero_img_shape']['instructions'] );;
+            ->set_wrapper_width( 100 )
+            ->set_instructions( $strings['hero_img_shape']['instructions'] );
 
         $background_color = ( new Field\Select( $strings['background_color']['label'] ) )
             ->set_key( "{$key}_common_background_color" )
@@ -241,6 +256,7 @@ protected function sub_fields() : array {
             $use_button_icon_field,
             $button_icon_field,
             $hero_img_position_field,
+            $hero_img_object_fit_field,
             $hero_img_shape_field,
             $background_color,
             $next_background_color,

diff --git a/models/page-extend.php b/models/page-extend.php
@@ -31,6 +31,45 @@ public function hero_image() : ?int {
             : null;
     }
 
+    /**
+     * Check if the page has any Gutenberg block content.
+     *
+     * @return bool
+     */
+    public function has_content() : bool {
+        return \has_blocks( \get_the_ID() );
+    }
+
+    /**
+     * Check if page has a hero flexible content layout.
+     *
+     * @return bool
+     */
+    public function has_hero_layout() : bool {
+        $content = \get_field( 'components' ) ?? [];
+
+        if ( empty( $content ) || ! \is_array( $content ) ) {
+            return false;
+        }
+
+        $hero_layouts = [
+            'hero',
+            'hero_and_image_carousel',
+        ];
+
+        foreach ( $content as $layout ) {
+            if ( empty( $layout['acf_fc_layout'] ) ) {
+                continue;
+            }
+
+            if ( \in_array( $layout['acf_fc_layout'], $hero_layouts, true ) ) {
+                return true;
+            }
+        }
+
+        return false;
+    }
+
     /**
      * Get post siblings.
      *

diff --git a/partials/layouts/layout-hero.dust b/partials/layouts/layout-hero.dust
@@ -11,7 +11,7 @@
             {^full_size_image}
                 <div class="column pl-0 {hero_img_position|attr} {hero_img_shape|attr}">
                     {?image}
-                        {@image id=image size="fullhd" /}
+                        {@image id=image size="fullhd" class="{hero_img_object_fit|attr}" /}
                     {/image}
                 </div>
             {/full_size_image}

diff --git a/partials/layouts/layout-image-gallery-small.dust b/partials/layouts/layout-image-gallery-small.dust
@@ -3,7 +3,7 @@
     <div class="container">
         <div class="image-gallery-small columns is-flex is-flex-wrap-wrap">
             {#rows}
-                <div class="column is-4 image-gallery-small__image p-0">
+                <div class="column is-4 image-gallery-small__image">
                     {@image id=image.id size="large" alt=image.alt class="objectfit-image" /}
                 </div>
             {/rows}

diff --git a/partials/page.dust b/partials/page.dust
@@ -9,6 +9,36 @@
                 {>"views/page/page-hero" /}
             {/Page.hero_image}
 
+            {^Page.hero_image}
+                {^Page.has_hero_layout}
+                    <section class="section pb-0">
+                        <div class="container">
+                            <div class="columns">
+                                <div class="column is-10 is-offset-1">
+                                    <h1 class="entry__title mt-0 mb-8 has-line-height-tight has-text-centered ">
+                                        {@title /}
+                                    </h1>
+                                </div>
+                            </div>
+                        </div>
+                    </section>
+                {/Page.has_hero_layout}
+            {/Page.hero_image}
+
+            {?Page.has_content}
+                <section class="section pt-0">
+                    <div class="container">
+                        <div class="columns">
+                            <div class="column is-10 is-offset-1">
+                                <div class="entry__content is-content-grid keep-vertical-spacing">
+                                    {@content /}
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </section>
+            {/Page.has_content}
+
             {>"ui/components" components=Page.components /}
         {/Page.is_password_protected_page}
     </main>

diff --git a/partials/shared/footer-inner.dust b/partials/shared/footer-inner.dust
@@ -105,8 +105,12 @@
                 <div class="column is-12 is-4-desktop mt-6 mt-0-desktop has-text-centered has-text-right-desktop">
                     <a href="{brand_logo_url|url}" class="site-footer__tampere-vaakuna is-flex">
                         <span class="is-sr-only">{Strings.s.footer.to_main_site|html}</span>
-                        {@image id=bottom_logo class="brand-logo" size="large" /}
-                        {@image id=bottom_second_logo class="brand-logo" size="large" /}
+                        {?bottom_logo}
+                            {@image id=bottom_logo class="brand-logo" size="large" /}
+                        {/bottom_logo}
+                        {?bottom_second_logo}
+                            {@image id=bottom_second_logo class="brand-logo" size="large" /}
+                        {/bottom_second_logo}
                     </a>
                 </div>
             </div>

diff --git a/style.css b/style.css
@@ -2,7 +2,7 @@
  * Theme Name:  TMS Theme MuumiB2B
  * Description: Tampere Multisite MuumiB2B Theme
  * Domain Path: /lang
- * Version:     1.0.0
+ * Version:     1.0.4
  * Author:      Hion Digital
  * Author URI:  https://hiondigital.com/
  * Text Domain: tms-theme-muumib2b