Scaffold contact form.

app/admin.php

@@ -90,27 +90,27 @@ add_action('customize_register', function (\WP_Customize_Manager $wp_customize)
         'section'  => 'pb_front_page_catalog',
         'settings' => 'pb_front_page_catalog_title',
     ]);
-    $wp_customize->add_section('pb_front_page_contact_form', [
-        'title' => __('Front Page Contact Form', 'aldine'),
+    $wp_customize->add_section('pb_network_contact_form', [
+        'title' => __('Contact Form', 'aldine'),
         'priority' => 25,
     ]);
-    $wp_customize->add_setting('pb_front_page_contact_form', [
+    $wp_customize->add_setting('pb_network_contact_form', [
         'type' => 'option',
     ]);
-    $wp_customize->add_control('pb_front_page_contact_form', [
-        'label' => __('Show Front Page Contact Form', 'aldine'),
-        'section'  => 'pb_front_page_contact_form',
-        'settings' => 'pb_front_page_contact_form',
+    $wp_customize->add_control('pb_network_contact_form', [
+        'label' => __('Show Contact Form', 'aldine'),
+        'section'  => 'pb_network_contact_form',
+        'settings' => 'pb_network_contact_form',
         'type' => 'checkbox'
     ]);
-    $wp_customize->add_setting('pb_front_page_contact_form_title', [
+    $wp_customize->add_setting('pb_network_contact_form_title', [
         'type' => 'option',
         'sanitize_callback' => 'sanitize_text_field'
     ]);
-    $wp_customize->add_control('pb_front_page_contact_form_title', [
-        'label' => __('Front Page Contact Form Title', 'aldine'),
-        'section'  => 'pb_front_page_contact_form',
-        'settings' => 'pb_front_page_contact_form_title',
+    $wp_customize->add_control('pb_network_contact_form_title', [
+        'label' => __('Contact Form Title', 'aldine'),
+        'section'  => 'pb_network_contact_form',
+        'settings' => 'pb_network_contact_form_title',
     ]);
 });
 

app/controllers/App.php

@@ -55,4 +55,14 @@ class App extends Controller
         }
         return get_the_title();
     }
+
+    public function contactFormTitle()
+    {
+        $title = get_option('pb_network_contact_form_title');
+        if ($title) {
+            return $title;
+        }
+
+        return __('Contact Us', 'aldine');
+    }
 }

resources/assets/styles/components/_forms.scss

@@ -3,3 +3,49 @@
 // TODO: .search-form label {}
 // TODO: .search-form .search-field {}
 // TODO: .search-form .search-submit {}
+
+::placeholder {
+  color: $black;
+}
+
+.contact {
+  margin-bottom: 120px;
+
+  form {
+    width: 22.125rem;
+  }
+
+  label {
+    margin-bottom: 1rem;
+  }
+
+  label,
+  input[type="text"],
+  input[type="email"],
+  textarea {
+    font-size: 0.875rem;
+    font-weight: 600;
+    font-family: $font-family-sans-serif;
+  }
+
+  textarea {
+    height: 7.5em; // TODO
+    resize: none;
+  }
+
+  input[type="text"],
+  input[type="email"],
+  textarea {
+    flex-grow: 1;
+    border-top: 0;
+    border-right: 0;
+    border-left: 0;
+    border-bottom: solid 2px $black;
+    padding: 0 0 1em;
+
+    &:focus {
+      outline: none;
+      border-bottom: solid 2px var(--brand-primary, $brand-primary);
+    }
+  }
+}

resources/views/front-page.blade.php

@@ -21,8 +21,5 @@
   @if(get_option('pb_front_page_catalog'))
     @include('partials.front-page-catalog')
   @endif
-  @if(get_option('pb_front_page_contact_form'))
-    @include('partials.front-page-contact-form')
-  @endif
   </section>
 @endsection

resources/views/partials/contact-form.blade.php

@@ -0,0 +1,11 @@
+<section class="contact flex flex-column justify-center items-center w-100" id="contact">
+  <h3 class="tc ttu">{{ $contact_form_title }}</h3>
+  <form action="<?php the_permalink(); ?>" method="post">
+    <input type="hidden" name="submitted" value="1">
+    <p class="flex flex-row items-center"><label class="clip" for="name">{{ __('Your name*', 'aldine' ) }}</label><input class="input-reset" type="text" placeholder="{{ __('Your name*', 'aldine' ) }}" name="name" value="{{ @esc_attr($_POST['name']) }}"></p>
+    <p class="flex flex-row items-center"><label class="clip" for="email">{{ __('Your email*', 'aldine' ) }}</label><input class="input-reset" type="email" placeholder="{{ __('Your email*', 'aldine' ) }}" name="email" value="{{ @esc_attr($_POST['email']) }}"></p>
+    <p class="flex flex-row items-center"><label class="clip" for="institution">{{ __('Your institution*', 'aldine' ) }}</label><input class="input-reset" type="text" placeholder="{{ __('Your institution*', 'aldine' ) }}" name="institution" value="{{ @esc_attr($_POST['institution']) }}"></p>
+    <p class="flex flex-row items-center"><label class="clip" for="content">{{ __('Your message here', 'aldine' ) }}</label><textarea class="input-reset" type="text" placeholder="{{ __('Your message here', 'aldine' ) }}"  name="content">{{ @esc_textarea($_POST['content']) }}</textarea></p>
+    <p class="tc"><input class="button-reset button button-small button-secondary button-outline input-reset pointer" type="submit" value="{{ __('Send', 'aldine' ) }}" /></p>
+  </form>
+</section>

resources/views/partials/footer.blade.php

@@ -1,5 +1,8 @@
 <footer class="content-info">
   <div class="container">
+    @if(get_option('pb_network_contact_form'))
+      @include('partials.contact-form')
+    @endif
     <section class="network-footer bg-secondary">
       <div class="network-footer-block {{ App::networkFooter(1) }}">
         @if(App::networkFooter(1) !== 'empty')