Custom 404 pages + hero block responsive adjustments. WIP #1912 @0.5

diff --git a/wp-content/themes/physioassist/app/setup.php b/wp-content/themes/physioassist/app/setup.php
index 9f383e6b330e022fa5768fb6a19716c95e9a3f2b..173522d968d351b3c4ccccf4affb7fbd10960e6f 100644 (file)
--- a/wp-content/themes/physioassist/app/setup.php
+++ b/wp-content/themes/physioassist/app/setup.php
@@ -11,7 +11,9 @@ use Roots\Sage\Template\BladeProvider;
  * Theme assets
  */
 add_action('wp_enqueue_scripts', function () {
-    wp_enqueue_style('sage/main.css', asset_path('styles/main.css'), false, null);
+    // NOTE: 'elementor-frontend' is added as a dependency for the main stylesheet to ensure that our stylesheet
+    // is always loaded afterwards, allowing us to override the default styles. On 404 pages, this wasn't happening.
+    wp_enqueue_style('sage/main.css', asset_path('styles/main.css'), ['elementor-frontend'], null);
     wp_enqueue_script('sage/main.js', asset_path('scripts/main.js'), ['jquery'], null, true);
 }, 100);
 

diff --git a/wp-content/themes/physioassist/resources/assets/styles/widgets/hero-block.styl b/wp-content/themes/physioassist/resources/assets/styles/widgets/hero-block.styl
index c6b6a55d3cd5ff251a25d998212c745c3a243b66..334a4a1a359b0ba255f2d55ea67405001be2e885 100644 (file)
--- a/wp-content/themes/physioassist/resources/assets/styles/widgets/hero-block.styl
+++ b/wp-content/themes/physioassist/resources/assets/styles/widgets/hero-block.styl
@@ -29,7 +29,7 @@ $header-height = 84px // How much space to leave for transparent header
 
     +below($breakpoint-hero-block)
       position: static
-      padding: s('calc(%s + 4vw) 5vw 30px', $header-height)
+      padding: s('calc(%s + 2.5vw) 5vw 40px', $header-height)
       bottom: 0
       right: 0
 
@@ -60,6 +60,8 @@ $header-height = 84px // How much space to leave for transparent header
     font-size: 44px
     margin-bottom: 0.5em
 
+    +below(700px)
+      font-size: 7vw !important
     +below(500px)
       br
         display: none
@@ -69,7 +71,13 @@ $header-height = 84px // How much space to leave for transparent header
     font-weight: 500
     line-height: 1.5
 
+    +below(700px)
+      font-size: 16px !important
+
   &-cta
     display: block
     color: #fff
     margin-top: 30px
+
+    +below(700px)
+      margin-top: 1.5em

diff --git a/wp-content/themes/physioassist/resources/views/404.blade.php b/wp-content/themes/physioassist/resources/views/404.blade.php
index ee68d543ca5c6ab957152ceafbfbb769ca112209..61e8753bb932732e43e27789258e2fdaed36709c 100644 (file)
--- a/wp-content/themes/physioassist/resources/views/404.blade.php
+++ b/wp-content/themes/physioassist/resources/views/404.blade.php
@@ -1,12 +1,15 @@
 @extends('layouts.app')
 
 @section('content')
-  @include('partials.page-header')
-
-  @if (!have_posts())
-    <div class="alert alert-warning">
-      {{ __('Sorry, but the page you were trying to view does not exist.', 'sage') }}
-    </div>
-    {!! get_search_form(false) !!}
-  @endif
+
+  @php
+    // Fetch content from page named '404-template'
+    // ToDo: make this more robust
+    $post = get_page_by_path('404-template');
+
+    if ($post) {
+      echo \Elementor\Plugin::instance()->frontend->get_builder_content_for_display(wpml_object_id_filter($post->ID, 'page', true));
+    }
+  @endphp
+
 @endsection