(feat): several changes for bar theme

app/Sidebar/Sidebar.php

@@ -14,6 +14,9 @@ class Sidebar
 
     public function register(): void
     {
+        if (! function_exists('get_field')) {
+            return;
+        }
         add_action('acf/include_fields', [$this, 'addAcfFields']);
         add_action('wp_nav_menu_objects', [$this, 'addIconsToMenuItems'], 10, 2);
         add_action('render_block_core/navigation-link', [$this, 'addIconsToBlockMenuItems'], 10, 2);

htdocs/wp-content/themes/barbarendrecht/assets/scss/blocks/personal-heading/_shared.scss

@@ -0,0 +1,17 @@
+.openpdd-personal-heading {
+	background-image: none !important;
+
+	&__image-wrapper {
+		overflow: hidden;
+		margin-bottom: 1rem;
+		mask-image: none !important;
+
+		@include media-breakpoint-up( sm ) {
+			border-radius: 0 0 0 30px;
+		}
+
+		@include media-breakpoint-up( xl ) {
+			margin-left: 1rem;
+		}
+	}
+}

htdocs/wp-content/themes/barbarendrecht/assets/scss/components/_navbar.scss

@@ -1,5 +1,5 @@
 .navbar {
-	.menu-item {
+	.navbar-menu-list > .menu-item {
 		position: relative;
 		display: flex;
 		height: 100%;
@@ -28,12 +28,35 @@
 		}
 
 		a {
-			color: $black;
+			display: flex;
+			height: 100%;
+			align-items: center;
+			justify-content: center;
+			color: theme-color( 'primary' );
 			font-size: $font-size-base;
 
 			@include hover-focus-active() {
 				text-decoration: none;
 			}
 		}
 	}
+
+	.menu-item-has-children {
+		&::after {
+			color: theme-color( 'secondary' );
+		}
+	}
+
+	.sub-menu {
+		.menu-item a {
+			justify-content: flex-start;
+			border-bottom: 1px solid gray( 'concrete' );
+
+			@include hover-focus-active() {
+				background-color: theme-color( 'primary' );
+				color: $white;
+			}
+			transition: 0.1s ease all;
+		}
+	}
 }

htdocs/wp-content/themes/barbarendrecht/assets/scss/components/_zaak-card.scss

@@ -0,0 +1,5 @@
+.zaak-card.active {
+	.zaak-card-arrow {
+		fill: theme-color( 'secondary' ) !important;
+	}
+}

htdocs/wp-content/themes/barbarendrecht/assets/scss/components/_zaak-header.scss

@@ -0,0 +1,12 @@
+body .zaak-header {
+	border-radius: 0 0 0 20px;
+	background-color: theme-color( 'primary' );
+
+	&-image {
+		display: none;
+	}
+
+	&-title {
+		border-radius: 0 0 10px;
+	}
+}

htdocs/wp-content/themes/barbarendrecht/assets/scss/generic/_typography.scss

@@ -1 +1,10 @@
 @import url( 'https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&display=swap' );
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	color: theme-color( 'primary' );
+}

htdocs/wp-content/themes/barbarendrecht/assets/scss/settings/_colors.scss

@@ -3,8 +3,8 @@
 --------------------------------------------------------------*/
 
 $theme-colors: (
-	primary: #032d57,
+	primary: #002f5d,
 	secondary: #e5754c,
 );
 
-$mijn-zaken-footer-bg-color: #032d57;
+$mijn-zaken-footer-bg-color: #002f5d;

htdocs/wp-content/themes/barbarendrecht/assets/scss/settings/_root.scss

@@ -5,4 +5,18 @@
 	--color-palette-black: #000;
 	--layout-content-size: 800px;
 	--layout-wide-size: #{map-get( $container-max-widths, 'xl' )};
+
+	/* --------------------------------------------------------------
+		Overwrite CSS variables
+	-------------------------------------------------------------- */
+	--zaak-tabs-link-active-border-color: #{theme-color( 'primary' )};
+	--zaak-header-title-border-bottom: 2px solid #{theme-color( 'primary' )};
+	--zaak-header-title-border-left: 2px solid #{theme-color( 'primary' )};
+
+	--primary-200: #{theme-color( 'primary' )};
+	--primary-300: #{theme-color( 'primary' )};
+}
+
+.zaak-process-steps {
+	--zaak-process-steps-color-success: #{theme-color( 'primary' )} !important;
 }

htdocs/wp-content/themes/barbarendrecht/assets/scss/style.scss

@@ -9,11 +9,18 @@
   Parent theme
 --------------------------------------------------------------*/
 @import '../../../owc-formulieren/assets/scss/style';
+@import 'settings/root';
 
 /*--------------------------------------------------------------
   Components
 --------------------------------------------------------------*/
 @import 'components/navbar';
+@import 'components/zaak-card';
+
+/*--------------------------------------------------------------
+Blocks
+--------------------------------------------------------------*/
+@import 'blocks/personal-heading/shared';
 
 /*--------------------------------------------------------------
   Generic

htdocs/wp-content/themes/barbarendrecht/config/home.php

@@ -7,4 +7,5 @@
     'eherkenning_provider' => 'owc-signicat-openid',
     'eidas_is_active' => true,
     'eidas_provider' => 'owc-signicat-openid',
+    'has_wide_editing' => true,
 ];

htdocs/wp-content/themes/hoekschewaard/assets/scss/components/_navbar.scss

@@ -43,14 +43,6 @@
 		}
 	}
 
-	.menu-item-has-children > a {
-		&::after {
-			@include fontawesome( '\f078' );
-			margin-left: 0.5rem;
-			font-size: 0.8rem;
-		}
-	}
-
 	.sub-menu {
 		min-width: 25rem;
 		border-bottom: 5px solid theme-color( 'primary' );

htdocs/wp-content/themes/hoekschewaard/config/home.php

@@ -7,4 +7,5 @@
     'eherkenning_provider' => 'owc-signicat-openid',
     'eidas_is_active' => false,
     'eidas_provider' => 'owc-signicat-openid',
+    'has_wide_editing' => true,
 ];

htdocs/wp-content/themes/owc-formulieren/assets/scss/components/_openkaarten.scss

@@ -0,0 +1,46 @@
+div#owc-openkaarten-streetmap {
+	--owc-filters-primary: var( --openkaarten-primary-color );
+	--search-primary-color: var( --openkaarten-primary-color );
+	--owc-openkaarten-streetmap--close-btn-color: var(
+		--openkaarten-primary-color
+	);
+	--button-color: var( --openkaarten-primary-color );
+	--owc-openkaarten-streetmap--primary-color: var(
+		--openkaarten-primary-color
+	);
+}
+
+.owc-openkaarten-streetmap__tooltip-card__button {
+	&:hover {
+		color: var( --open-kaarten-button-hover-color, #fff );
+		text-decoration: none;
+	}
+}
+
+// Overwrite all SVG's in the OWC Openkaarten Streetmap plugin
+.leaflet-control-filters,
+.owc-openkaarten-streetmap__tooltip-card__close-btn {
+	svg path {
+		fill: var( --openkaarten-primary-color );
+	}
+}
+
+.leaflet-control-list-view {
+	svg g {
+		stroke: var( --openkaarten-primary-color );
+	}
+}
+
+// List view overwrites
+.list-view .list-view__controls button:not( [class*='search'] ) {
+	border: 1px solid var( --openkaarten-primary-color );
+
+	svg path {
+		fill: var( --openkaarten-primary-color );
+	}
+
+	.leaflet-control-map-view__control-text,
+	span {
+		color: var( --openkaarten-primary-color );
+	}
+}

htdocs/wp-content/themes/owc-formulieren/assets/scss/layouts/_template-mijn-zaken.scss

@@ -5,7 +5,10 @@
 	display: flex;
 	min-height: 100vh;
 	flex-direction: column;
-	background-color: var( --color-palette-white );
+	background-color: var(
+		--openpdd-mijn-zaken-background-color,
+		var( --color-palette-white )
+	);
 
 	.footer {
 		margin-top: auto;

htdocs/wp-content/themes/owc-formulieren/assets/scss/settings/_root.scss

@@ -16,4 +16,9 @@
 	-------------------------------------------------------------- */
 	--denhaag-sidenav-link-hover-color: #{theme-color( 'primary' )};
 	--denhaag-sidenav-link-active-color: #{theme-color( 'primary' )};
+
+	/* --------------------------------------------------------------
+		Open Kaarten
+	-------------------------------------------------------------- */
+	--openkaarten-primary-color: #{theme-color( 'primary' )};
 }

htdocs/wp-content/themes/owc-formulieren/assets/scss/style.scss

@@ -35,6 +35,7 @@
 @import 'components/gravityforms-legacy';
 @import 'components/gravityforms-theme';
 @import 'components/navbar';
+@import 'components/openkaarten';
 @import 'components/progress-bar';
 @import 'components/sidebar';
 @import 'components/site-branding';

htdocs/wp-content/themes/owc-formulieren/config/home.php

@@ -7,4 +7,5 @@
     'eherkenning_provider' => 'owc-signicat-openid',
     'eidas_is_active' => true,
     'eidas_provider' => 'owc-signicat-openid',
+    'has_wide_editing' => false,
 ];

htdocs/wp-content/themes/owc-formulieren/templates/mijn-zaken/home/login-digid.php

@@ -6,13 +6,13 @@
 
 <?php if ($digid_is_active): ?>
 	<div class="col-md-6 | mb-3 mb-md-0">
-		<div class="p-3 border h-100 p-md-4">
+		<div class="p-3 border h-100 p-md-4 bg-white">
 			<h3>Inloggen als persoon</h3>
 			<div class="pb-4 mb-4 d-flex border-bottom">
 				<svg id="a" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 141.73 141.73" width="80px" height="80px"><path d="m20,0h101.74c11.04,0,20,8.96,20,20v101.74c0,11.04-8.96,20-20,20H20c-11.04,0-20-8.96-20-20V20C0,8.96,8.96,0,20,0Z" stroke-width="0"/><path d="m15.75,108.25v-33.49h9.6c11.33,0,17.61,5.67,17.61,15.78,0,12.1-6.84,17.72-17.82,17.72h-9.39Zm6.13-5.05h3.52c6.74,0,11.13-3.62,11.13-12.36,0-7.25-4.39-11.03-11.59-11.03h-3.06v23.38Z" fill="#fff" stroke-width="0"/><path d="m51.24,72.51c2.2,0,3.42,1.38,3.42,3.32,0,1.79-1.22,3.27-3.42,3.27s-3.37-1.33-3.37-3.27c0-1.79,1.17-3.32,3.37-3.32Zm2.91,35.74h-5.77v-25.12l5.77-.26v25.37Z" fill="#fff" stroke-width="0"/><path d="m68.13,103.34h6.02c5.41,0,7.71,2.14,7.71,6.23,0,4.8-3.98,8.68-13.17,8.68-7.2,0-10.52-2.55-10.52-6.48,0-2.4,1.33-4.39,3.83-5.46v-.15c-1.17-.61-1.99-1.89-1.99-3.37,0-1.58.97-3.06,2.81-3.78v-.15c-2.3-1.28-3.62-3.42-3.62-6.69,0-6.13,4.14-9.45,10.52-9.45,1.38,0,2.6.15,3.88.51h8.17v3.83h-3.88v.15c1.07.82,1.99,2.55,1.99,4.75,0,5.57-3.78,8.48-10.72,8.48-1.12,0-2.2-.15-3.17-.41-.66.36-1.07.97-1.07,1.58,0,1.12.87,1.74,3.22,1.74Zm1.07,10.62c5.51,0,7.51-1.38,7.51-3.37,0-1.48-.92-2.3-3.42-2.35l-8.37-.25c-.97.66-1.38,1.48-1.38,2.65,0,1.99,1.74,3.32,5.67,3.32Zm5.31-22.46c0-3.06-1.69-4.7-4.9-4.7-2.86,0-4.9,1.63-4.9,5.05s1.84,4.65,4.8,4.65c3.17,0,5-1.48,5-5Z" fill="#fff" stroke-width="0"/><path d="m88.56,72.51c2.2,0,3.42,1.38,3.42,3.32,0,1.79-1.22,3.27-3.42,3.27s-3.37-1.33-3.37-3.27c0-1.79,1.17-3.32,3.37-3.32Zm2.91,35.74h-5.77v-25.12l5.77-.26v25.37Z" fill="#e17000" stroke-width="0"/><path d="m98.77,108.25v-33.49h9.6c11.34,0,17.62,5.67,17.62,15.78,0,12.1-6.84,17.72-17.82,17.72h-9.39Zm6.13-5.05h3.52c6.74,0,11.13-3.62,11.13-12.36,0-7.25-4.39-11.03-11.59-11.03h-3.06v23.38Z" fill="#e17000" stroke-width="0"/></svg>
 				<div class="pl-4">
 					<div class="mb-1 muted">Met DigiD</div>
-					<?php if('owc-signicat-openid' === $digid_provider && WP_Block_Type_Registry::get_instance()->is_registered('owc-signicat-openid/openid')) : ?>
+					<?php if ('owc-signicat-openid' === $digid_provider && WP_Block_Type_Registry::get_instance()->is_registered('owc-signicat-openid/openid')) : ?>
 						<?php echo do_blocks('<!-- wp:owc-signicat-openid/openid {"redirectUrl":"/overzicht","idp":"digid"} /-->'); ?>
 					<?php else : ?>
 						<a href="<?php echo home_url('inloggen') ?>" class="wp-block-button__link">

htdocs/wp-content/themes/owc-formulieren/templates/mijn-zaken/home/login-eherkenning.php

@@ -5,13 +5,13 @@
 
 <?php if ($eherkenning_is_active): ?>
 	<div class="col-md-6">
-		<div class="h-100 border p-3 p-md-4">
+		<div class="h-100 border p-3 p-md-4 bg-white">
 			<h3>Inloggen als organisatie</h3>
 			<div class="d-flex pb-4 mb-4 border-bottom">
 				<svg id="a" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160 96" width="80px" height="80px"><g id="b"><path d="m159.94,92.97c0,.49.07,1-.02,1.48-.1.61.62,1.77-.98,1.51-.81-.13-1.65-.02-2.48-.02H3.53c-.83,0-1.66-.07-2.48.02-.87.1-1.13-.15-1.01-1.01.09-.65.02-1.32.02-1.97C.05,62.66.07,32.34,0,2.03,0,.31.32,0,2.04,0c43.86.06,87.72.05,131.59.05,8.44,0,16.88.02,25.32-.03.86,0,1.19.16.99,1.01-4.3,0-8.61-.03-12.91.01-2.15.02-2.94.76-2.96,2.83-.06,4.12-.02,8.24-.02,12.35,0,6.59.02,13.18,0,19.77-.02,3.18-.41,3.52-3.71,3.58-.99.02-1.99,0-2.98,0-8.27,0-16.55.09-24.82-.08-1.73-.04-2.13.69-2.64,1.93-1.22,2.95-2.58,5.85-3.82,8.8-.35.84-.56,1.76-.73,2.66-.17.92.05,1.59,1.23,1.53,1.16-.06,2.32-.01,3.47-.01,10.1,0,20.19,0,30.29,0,3.71,0,3.72.01,3.72,3.5,0,10.38-.01,20.76.02,31.13,0,1.27-.23,3.11.47,3.66,1.1.87,2.89.9,4.4,1.22.47.1.99-.03,1.49.02,3.25.35,6.37-.47,9.52-1ZM1.04,47.55c0,7.41-.02,14.82,0,22.23.01,4.8,1.78,9.23,4.38,12.97,2.41,3.48,5.75,6.44,9.86,8.27,2.63,1.17,9.02,2.93,11.68,2.94,4.96,0,9.93,0,14.89,0,9.43,0,18.86.02,28.29-.01,2.78,0,3.36-.61,3.39-3.4.04-3.29.02-6.59,0-9.88,0-1.98-.92-3.2-2.81-3.48-1.13-.17-2.31-.03-3.47-.03-13.57,0-27.13.01-40.7-.02-1.25,0-2.55-.17-3.73-.57-4.42-1.51-5.67-5.56-5.77-9.31-.34-13.17-.21-26.35-.06-39.52.02-2.07.64-4.42,1.77-6.13,2.23-3.39,5.69-4.81,9.87-4.78,11.08.1,22.17.03,33.25.03,2.98,0,5.96.05,8.93-.02,1.77-.04,2.66-.88,2.69-2.6.06-3.62.09-7.25-.02-10.87-.04-1.39-.88-2.36-2.47-2.33-.5,0-.99,0-1.49,0-15.22,0-30.44.02-45.66-.02-1.48,0-2.72.58-4.07.95C9.04,4.94.8,15.6,1.02,26.8c.14,6.91.03,13.83.03,20.75Zm102.29,26.11c0-2.46.04-4.92,0-7.38-.07-3.89-.21-7.79-.32-11.68-3.93-.06-7.87-.11-11.8-.17-.33,0-.66-.02-.99,0-1.99.13-2.76.89-2.76,3.02-.03,11.32,0,22.65-.02,33.97,0,.88.17,1.23,1.18,1.64,2.73,1.09,10.3,1.06,13.14.14,1.5-.49,1.6-1.11,1.59-2.31-.03-5.74-.01-11.49-.01-17.23Zm0-53.39c0-2.46.04-4.93,0-7.39-.08-3.9-.22-7.79-.33-11.68-4.1-.05-8.21-.15-12.31-.14-2.49,0-3.21.69-3.22,3.05-.03,10.84-.03,21.68,0,32.52,0,2.13.76,2.92,2.83,2.95,3.79.06,7.59-.02,11.38.04,1.24.02,1.71-.28,1.69-1.61-.07-5.91-.03-11.82-.03-17.74Zm-55.08,19.33h-12.37c-2.14,0-4.29.06-6.43-.02-1.39-.06-2.45.78-2.5,1.78-.16,3.58-.15,7.2.22,10.75.08.77.47,2.51,2.77,2.44,10.06-.28,20.12-.18,30.19-.06,1.73.02,2.78-.67,3.71-1.81.58-.7,1.07-1.53,1.4-2.37,1.15-2.97,3.26-5.59,3.35-8.97.03-1.11-.05-1.79-1.53-1.77-6.27.08-12.54.04-18.81.04Z" fill="#fcfcfd" stroke-width="0"/><path d="m159.94,92.97c-3.15.53-6.27,1.35-9.52,1-.49-.05-1.01.08-1.49-.02-1.51-.33-3.3-.35-4.4-1.22-.7-.55-.46-2.4-.47-3.66-.03-10.38-.01-20.76-.02-31.13,0-3.49-.01-3.5-3.72-3.5-10.1,0-20.19,0-30.29,0-1.16,0-2.32-.05-3.47.01-1.18.06-1.41-.61-1.23-1.53.17-.9.37-1.82.73-2.66,1.24-2.95,2.6-5.85,3.82-8.8.51-1.24.91-1.96,2.64-1.93,8.27.17,16.55.08,24.82.08.99,0,1.99.02,2.98,0,3.3-.06,3.7-.41,3.71-3.58.03-6.59,0-13.18,0-19.77,0-4.12-.04-8.24.02-12.35.03-2.07.82-2.81,2.96-2.83,4.3-.04,8.61-.01,12.91-.01v91.94Z" fill="#f30275" stroke-width="0"/><path d="m1.04,47.55c0-6.92.11-13.84-.03-20.75C.8,15.6,9.04,4.94,19.81,1.97c1.36-.37,2.59-.96,4.07-.95,15.22.04,30.44.02,45.66.02.5,0,.99,0,1.49,0,1.59-.03,2.43.94,2.47,2.33.11,3.62.08,7.25.02,10.87-.03,1.72-.91,2.57-2.69,2.6-2.98.07-5.96.02-8.93.02-11.08,0-22.17.06-33.25-.03-4.18-.04-7.64,1.38-9.87,4.78-1.13,1.71-1.74,4.06-1.77,6.13-.15,13.17-.29,26.35.06,39.52.1,3.76,1.34,7.8,5.77,9.31,1.17.4,2.48.57,3.73.57,13.57.04,27.13.02,40.7.02,1.16,0,2.34-.14,3.47.03,1.89.28,2.8,1.49,2.81,3.48.01,3.29.03,6.59,0,9.88-.03,2.79-.6,3.4-3.39,3.4-9.43.03-18.86.01-28.29.01-4.96,0-9.93,0-14.89,0-2.66,0-9.05-1.77-11.68-2.94-4.11-1.83-7.44-4.79-9.86-8.27-2.6-3.74-4.36-8.18-4.38-12.97-.02-7.41,0-14.82,0-22.23Z" fill="#054080" stroke-width="0"/><path d="m103.33,73.66c0,5.74-.02,11.49.01,17.23,0,1.2-.09,1.82-1.59,2.31-2.84.92-10.41.95-13.14-.14-1.01-.4-1.18-.75-1.18-1.64.01-11.32,0-22.65.02-33.97,0-2.13.77-2.89,2.76-3.02.33-.02.66,0,.99,0,3.93.06,7.87.11,11.8.17.11,3.89.24,7.79.32,11.68.05,2.46,0,4.92,0,7.38Z" fill="#f30275" stroke-width="0"/><path d="m103.33,20.27c0,5.91-.04,11.83.03,17.74.02,1.34-.46,1.64-1.69,1.61-3.79-.07-7.59.02-11.38-.04-2.06-.03-2.82-.82-2.83-2.95-.03-10.84-.03-21.68,0-32.52,0-2.36.73-3.04,3.22-3.05,4.1-.01,8.21.08,12.31.14.11,3.89.25,7.79.33,11.68.05,2.46,0,4.93,0,7.39Z" fill="#f30275" stroke-width="0"/><path d="m48.25,39.59c6.27,0,12.54.05,18.81-.04,1.48-.02,1.56.66,1.53,1.77-.09,3.38-2.19,6-3.35,8.97-.33.85-.82,1.67-1.4,2.37-.93,1.14-1.98,1.83-3.71,1.81-10.06-.13-20.13-.22-30.19.06-2.31.06-2.69-1.68-2.77-2.44-.38-3.56-.38-7.17-.22-10.75.04-.99,1.11-1.83,2.5-1.78,2.14.09,4.29.02,6.43.02h12.37Z" fill="#054080" stroke-width="0"/></g></svg>
 				<div class="pl-4">
 					<div class="muted mb-1">Met eHerkenning</div>
-					<?php if('owc-signicat-openid' === $eherkenning_provider && WP_Block_Type_Registry::get_instance()->is_registered('owc-signicat-openid/openid')) : ?>
+					<?php if ('owc-signicat-openid' === $eherkenning_provider && WP_Block_Type_Registry::get_instance()->is_registered('owc-signicat-openid/openid')) : ?>
 						<?php echo do_blocks('<!-- wp:owc-signicat-openid/openid {"redirectUrl":"/overzicht","idp":"eherkenning"} /-->'); ?>
 					<?php else : ?>
 						<a href="<?php echo home_url('inloggen-eherkenning') ?>" class="wp-block-button__link">

htdocs/wp-content/themes/owc-formulieren/templates/template-mijn-zaken-home.php

@@ -27,19 +27,33 @@
 				    'eidas_provider' => $home_config['eidas_provider'],
 				]); ?>
 			</div>
+			<?php if (isset($home_config['has_wide_editing']) && $home_config['has_wide_editing']): ?>
+				<div class="my-4">
+					<?php the_content(); ?>
+				</div>
+			<?php endif; ?>
 		</div>
 		<div class="container pt-md-5">
 			<div class="row">
 				<div class="col-lg-7">
 					<div class="page-main__content | shadow bg-white border p-3 p-md-4 normalize-child-margin">
-					<?php the_content(); ?>
+						<?php if (isset($home_config['has_wide_editing']) && $home_config['has_wide_editing']): ?>
+							<h2 class="wp-block-heading">Dit vindt u in de Mijn-omgeving:</h2>
+							<ul class="wp-block-list is-style-arrows">
+								<li>Uw lopende en afgeronde zaken</li>
+								<li>Uw persoonlijke berichten van de gemeente</li>
+								<li>Uw gegevens en voorkeuren</li>
+								<li>Nieuws en evenementen bij u in de buurt</li>
+							</ul>
+						<?php else: ?>
+							<?php the_content(); ?>
+						<?php endif; ?>
 					</div>
 				</div>
 			</div>
-
 		</div>
 
-		<?php if(has_post_thumbnail()): ?>
+		<?php if (has_post_thumbnail()): ?>
 			<?php the_post_thumbnail('full', ['class' => 'w-100 h-400px object-fit-cover']); ?>
 		<?php endif; ?>
     </main>

htdocs/wp-content/themes/owc-formulieren/templates/template-single-zaak.php

@@ -15,7 +15,7 @@
         <article class="page-main__content">
 			<?php if ($zaak) : ?>
 			<div class="zaak-header">
-				<img src="<?php echo get_template_directory_uri() . "/assets/img/zaak-header.jpg"; ?>" alt="" class="zaak-header-image" />
+				<img src="<?php echo get_theme_file_uri('/assets/img/zaak-header.jpg'); ?>" alt="" class="zaak-header-image" />
 				<h1 class="zaak-header-title"><?php echo $zaak->title(); ?></h1>
 			</div>
 			<div class="zaak-details">