mailchimp form

dist/app.js

@@ -1,197 +1 @@
-/******/ (() => { // webpackBootstrap
+(()=>{var e,t={750:()=>{var e=new IntersectionObserver((function(e){e.forEach((function(e){var t=e.target;e.isIntersecting?t._hasEnteredOnce?t.classList.add("visible"):t._inViewportTimeout=setTimeout((function(){t.classList.add("visible"),t._hasEnteredOnce=!0}),250):(clearTimeout(e.target._inViewportTimeout),e.target.classList.remove("visible"))}))}),{threshold:.5});document.querySelectorAll(".watch-vp").forEach((function(t){e.observe(t)})),document.getElementById("mobile-nav-toggle").addEventListener("click",(function(e){e.preventDefault(),document.getElementsByTagName("body")[0].classList.toggle("mobile-nav-open")}))},989:()=>{}},r={};function n(e){var o=r[e];if(void 0!==o)return o.exports;var i=r[e]={exports:{}};return t[e](i,i.exports,n),i.exports}n.m=t,e=[],n.O=(t,r,o,i)=>{if(!r){var a=1/0;for(v=0;v<e.length;v++){for(var[r,o,i]=e[v],s=!0,c=0;c<r.length;c++)(!1&i||a>=i)&&Object.keys(n.O).every((e=>n.O[e](r[c])))?r.splice(c--,1):(s=!1,i<a&&(a=i));if(s){e.splice(v--,1);var l=o();void 0!==l&&(t=l)}}return t}i=i||0;for(var v=e.length;v>0&&e[v-1][2]>i;v--)e[v]=e[v-1];e[v]=[r,o,i]},n.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t),(()=>{var e={895:0,524:0};n.O.j=t=>0===e[t];var t=(t,r)=>{var o,i,[a,s,c]=r,l=0;if(a.some((t=>0!==e[t]))){for(o in s)n.o(s,o)&&(n.m[o]=s[o]);if(c)var v=c(n)}for(t&&t(r);l<a.length;l++)i=a[l],n.o(e,i)&&e[i]&&e[i][0](),e[i]=0;return n.O(v)},r=self.webpackChunkofc_wp_theme=self.webpackChunkofc_wp_theme||[];r.forEach(t.bind(null,0)),r.push=t.bind(null,r.push.bind(r))})(),n.O(void 0,[524],(()=>n(750)));var o=n.O(void 0,[524],(()=>n(989)));o=n.O(o)})();
-/******/ 	var __webpack_modules__ = ({
-
-/***/ "./src/js/app.js":
-/*!***********************!*\
-  !*** ./src/js/app.js ***!
-  \***********************/
-/***/ (() => {
-
-var observer = new IntersectionObserver(function (entries) {
-  entries.forEach(function (entry) {
-    var el = entry.target;
-    if (entry.isIntersecting) {
-      if (!el._hasEnteredOnce) {
-        // First time in viewport – apply delay
-        el._inViewportTimeout = setTimeout(function () {
-          el.classList.add('visible');
-          el._hasEnteredOnce = true;
-        }, 250);
-      } else {
-        // Already entered once – no delay
-        el.classList.add('visible');
-      }
-    } else {
-      clearTimeout(entry.target._inViewportTimeout);
-      entry.target.classList.remove('visible');
-    }
-  });
-}, {
-  threshold: 0.5 // adjust as needed
-});
-document.querySelectorAll('.watch-vp').forEach(function (el) {
-  observer.observe(el);
-});
-document.getElementById("mobile-nav-toggle").addEventListener("click", function (e) {
-  e.preventDefault();
-  document.getElementsByTagName("body")[0].classList.toggle("mobile-nav-open");
-});
-
-/***/ }),
-
-/***/ "./src/scss/app.scss":
-/*!***************************!*\
-  !*** ./src/scss/app.scss ***!
-  \***************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-// extracted by mini-css-extract-plugin
-
-
-/***/ })
-
-/******/ 	});
-/************************************************************************/
-/******/ 	// The module cache
-/******/ 	var __webpack_module_cache__ = {};
-/******/ 	
-/******/ 	// The require function
-/******/ 	function __webpack_require__(moduleId) {
-/******/ 		// Check if module is in cache
-/******/ 		var cachedModule = __webpack_module_cache__[moduleId];
-/******/ 		if (cachedModule !== undefined) {
-/******/ 			return cachedModule.exports;
-/******/ 		}
-/******/ 		// Create a new module (and put it into the cache)
-/******/ 		var module = __webpack_module_cache__[moduleId] = {
-/******/ 			// no module.id needed
-/******/ 			// no module.loaded needed
-/******/ 			exports: {}
-/******/ 		};
-/******/ 	
-/******/ 		// Execute the module function
-/******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
-/******/ 	
-/******/ 		// Return the exports of the module
-/******/ 		return module.exports;
-/******/ 	}
-/******/ 	
-/******/ 	// expose the modules object (__webpack_modules__)
-/******/ 	__webpack_require__.m = __webpack_modules__;
-/******/ 	
-/************************************************************************/
-/******/ 	/* webpack/runtime/chunk loaded */
-/******/ 	(() => {
-/******/ 		var deferred = [];
-/******/ 		__webpack_require__.O = (result, chunkIds, fn, priority) => {
-/******/ 			if(chunkIds) {
-/******/ 				priority = priority || 0;
-/******/ 				for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
-/******/ 				deferred[i] = [chunkIds, fn, priority];
-/******/ 				return;
-/******/ 			}
-/******/ 			var notFulfilled = Infinity;
-/******/ 			for (var i = 0; i < deferred.length; i++) {
-/******/ 				var [chunkIds, fn, priority] = deferred[i];
-/******/ 				var fulfilled = true;
-/******/ 				for (var j = 0; j < chunkIds.length; j++) {
-/******/ 					if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
-/******/ 						chunkIds.splice(j--, 1);
-/******/ 					} else {
-/******/ 						fulfilled = false;
-/******/ 						if(priority < notFulfilled) notFulfilled = priority;
-/******/ 					}
-/******/ 				}
-/******/ 				if(fulfilled) {
-/******/ 					deferred.splice(i--, 1)
-/******/ 					var r = fn();
-/******/ 					if (r !== undefined) result = r;
-/******/ 				}
-/******/ 			}
-/******/ 			return result;
-/******/ 		};
-/******/ 	})();
-/******/ 	
-/******/ 	/* webpack/runtime/hasOwnProperty shorthand */
-/******/ 	(() => {
-/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
-/******/ 	})();
-/******/ 	
-/******/ 	/* webpack/runtime/make namespace object */
-/******/ 	(() => {
-/******/ 		// define __esModule on exports
-/******/ 		__webpack_require__.r = (exports) => {
-/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
-/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
-/******/ 			}
-/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
-/******/ 		};
-/******/ 	})();
-/******/ 	
-/******/ 	/* webpack/runtime/jsonp chunk loading */
-/******/ 	(() => {
-/******/ 		// no baseURI
-/******/ 		
-/******/ 		// object to store loaded and loading chunks
-/******/ 		// undefined = chunk not loaded, null = chunk preloaded/prefetched
-/******/ 		// [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
-/******/ 		var installedChunks = {
-/******/ 			"/app": 0,
-/******/ 			"app": 0
-/******/ 		};
-/******/ 		
-/******/ 		// no chunk on demand loading
-/******/ 		
-/******/ 		// no prefetching
-/******/ 		
-/******/ 		// no preloaded
-/******/ 		
-/******/ 		// no HMR
-/******/ 		
-/******/ 		// no HMR manifest
-/******/ 		
-/******/ 		__webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
-/******/ 		
-/******/ 		// install a JSONP callback for chunk loading
-/******/ 		var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
-/******/ 			var [chunkIds, moreModules, runtime] = data;
-/******/ 			// add "moreModules" to the modules object,
-/******/ 			// then flag all "chunkIds" as loaded and fire callback
-/******/ 			var moduleId, chunkId, i = 0;
-/******/ 			if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
-/******/ 				for(moduleId in moreModules) {
-/******/ 					if(__webpack_require__.o(moreModules, moduleId)) {
-/******/ 						__webpack_require__.m[moduleId] = moreModules[moduleId];
-/******/ 					}
-/******/ 				}
-/******/ 				if(runtime) var result = runtime(__webpack_require__);
-/******/ 			}
-/******/ 			if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
-/******/ 			for(;i < chunkIds.length; i++) {
-/******/ 				chunkId = chunkIds[i];
-/******/ 				if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
-/******/ 					installedChunks[chunkId][0]();
-/******/ 				}
-/******/ 				installedChunks[chunkId] = 0;
-/******/ 			}
-/******/ 			return __webpack_require__.O(result);
-/******/ 		}
-/******/ 		
-/******/ 		var chunkLoadingGlobal = self["webpackChunkofc_wp_theme"] = self["webpackChunkofc_wp_theme"] || [];
-/******/ 		chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
-/******/ 		chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
-/******/ 	})();
-/******/ 	
-/************************************************************************/
-/******/ 	
-/******/ 	// startup
-/******/ 	// Load entry module and return exports
-/******/ 	// This entry module depends on other loaded chunks and execution need to be delayed
-/******/ 	__webpack_require__.O(undefined, ["app"], () => (__webpack_require__("./src/js/app.js")))
-/******/ 	var __webpack_exports__ = __webpack_require__.O(undefined, ["app"], () => (__webpack_require__("./src/scss/app.scss")))
-/******/ 	__webpack_exports__ = __webpack_require__.O(__webpack_exports__);
-/******/ 	
-/******/ })()
-;

dist/mix-manifest.json

@@ -1,4 +1,4 @@
 {
-    "/app.js": "/app.js?id=ac271f1d4ead304b5ae143995cb9455e",
+    "/app.js": "/app.js?id=4cb03e0a718ef84b2464e0ef7fbdead9",
-    "/app.css": "/app.css?id=2f7ba30e071cbd564c36e453568cf64c"
+    "/app.css": "/app.css?id=a5b18e2e09fde200a669667e9873dd76"
 }

src/scss/flex-5050-cta.scss

@@ -2,6 +2,7 @@ section.flex-5050-cta {
     position: relative;
     padding: 6rem 0;
 
+    // grey mode
     &.grey {
         background-color: $c-offWhite;
 
@@ -17,6 +18,26 @@ section.flex-5050-cta {
         }
     }
 
+    .col-image-wrapper {
+        display: none;
+    }
+
+    // image contain mode
+    &.contain {
+        .overflow-image {
+            display: none !important;
+        }
+
+        .col-image-wrapper {
+            display: block;
+
+            img {
+                display: block;
+                width: 100%;
+            }
+        }
+    }
+
     @include media-breakpoint-down(lg) {
         .col:last-of-type {
             display: none;

src/scss/header.scss

@@ -79,15 +79,22 @@
 
         ul#menu-main-menu {
             display: flex;
-            gap: 3rem;
+            gap: 1.25rem;
             padding: 0;
             margin: 0;
             list-style-type: none;
             height: 100%;
             align-items: center;
+            font-size: 1rem;
 
             a {
                 color: $c-black;
+                white-space: nowrap;
+            }
+
+            @include media-breakpoint-up(xl) {
+                font-size: 1.25rem;
+                gap: 2rem;
             }
         }
     }

tpl/contact.tpl

@@ -27,6 +27,8 @@
                         <a href="mailto:{{ contact_email }}">Email: {{ contact_email }}</a>
                     </li>
                 </ul>
+
+                <script id="mcjs">!function(c,h,i,m,p){m=c.createElement(h),p=c.getElementsByTagName(h)[0],m.async=1,m.src=i,p.parentNode.insertBefore(m,p)}(document,"script","https://chimpstatic.com/mcjs-connected/js/users/e048c4e851c5e351f4bb73de9/c3dd1604c5ac487baa3de2c78.js");</script>
             </div>
 
             <div class="col-12 col-md-6">

tpl/flex_5050_cta.tpl

@@ -1,7 +1,7 @@
-<section class="flex-5050-cta {{ style }}">
+<section class="flex-5050-cta {{ style }} {{ image_mode }}">
     <div class="overflow-image" style="background-image:url({{ image }})">&nbsp;</div>
     <div class="container">
-        <div class="row">
+        <div class="row align-items-center">
             <div class="col">
                 <h2>{{ headline }}</h2>
                 {{{ content }}}
@@ -14,7 +14,12 @@
 
                 <img src="{{ image }}" alt="" />
             </div>
-            <div class="col">&nbsp;</div>
+
+            <div class="col">
+                <div class="col-image-wrapper">
+                    <img src="{{ image }}" alt="" />
+                </div>
+            </div>
         </div>
     </div>
 </section>

tpl/header.tpl

@@ -17,7 +17,7 @@
     <div class="container">
         <div class="row">
             <div class="col">
-                <div class="d-flex justify-content-between flex-column flex-md-row">
+                <div class="d-flex justify-content-between flex-column flex-md-row align-items-center gap-4">
                     <div class="logo-wrapper">
                         <a href="/"><img src="{{ logo }}" alt="{{#wp-title}}" /></a>