rayelliott
/
gulp-web
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Compare commits

base: rayelliott:19092a632527bf05ebbc0568e706c947ac999949
Branches Tags
rayelliott:master
...
compare: rayelliott:dcb2eadbbfaed28f7b06e8bfe87c33e3840f9dc3
Branches Tags
rayelliott:master

5 Commits
19092a6325 ... dcb2eadbbf

Author SHA1 Message Date
rayelliott dcb2eadbbf update 2020-05-29 20:51:54 +00:00
rayelliott 929a1dd43c update 2020-05-29 15:05:45 +00:00
rayelliott a95d4edeb5 add scripts to scan tags 2020-05-29 15:04:42 +00:00
rayelliott 90cffde075 update contact form styling 2020-05-29 15:04:05 +00:00
rayelliott d560b567a8 initial draft of form 2020-05-29 11:08:43 +00:00
8 changed files with 189 additions and 56 deletions
Show Stats Expand all files Collapse all files

1
.gitignore vendored
View File

@ -3,3 +3,4 @@ assets
wp-includes/
wp-includes
Session.vim
.tags*

48
roomwithavw-custom.php
View File

@ -12,9 +12,55 @@
*/
function roomwithavw_custom_add_scripts() {
wp_register_script( 'roomwithavw-custom-script', plugins_url( 'assets/js/index.js', __FILE__ ), array(), '1.0', true );
wp_register_script( 'roomwithavw-custom-script', plugins_url( 'assets/js/index.js', __FILE__ ), ['jquery-ui-datepicker'], '1.0', true );
wp_enqueue_script( 'roomwithavw-custom-script' );
wp_enqueue_style( 'roomwithavw-custom-styles', plugins_url( 'assets/css/style.css', __FILE__ ), '', '1.0' );
}
add_action( 'wp_enqueue_scripts', 'roomwithavw_custom_add_scripts' );
function roomwithavw_custom_enquiry_form() {
?>
<p class="lead">
We are family run business that enjoys liaising with our clients to ensure we provide the best experience. For this reason, unlike regular camper van hire companies, we are not using an online calendar booking system as we believe it takes away from the personal touch we strive to maintain.
</p>
<p class="lead">
Fill in the form below and one of our team will be in touch with you shortly.
</p>
<div class="enquiry-form wpcf7" role="form" dir="ltr">
<div class="screen-reader-response" aria-live="polite"></div>
<!-- <form action="https://mailthis.to/mailthis@gabbaell.co.uk" method="post" class="wpcf7&#45;form" novalidate="novalidate"> -->
<form action="" method="post" id="rwavw-enquiry-form" class="wpcf7-form" novalidate="novalidate">
<p><label> Forename (required)<br />
<span class="wpcf7-form-control-wrap forename"><input type="text" name="forename" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" /></span> </label></p>
<p><label> Surname (required)<br />
<span class="wpcf7-form-control-wrap surname"><input type="text" name="surname" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-validates-as-required" aria-required="true" aria-invalid="false" /></span> </label></p>
<p class="dates">
<label> Booking Date<br />
<span class="wpcf7-form-control-wrap booking-date">
<input type="date" name="booking-date" value="" class="rwavw-datepicker booking-date wpcf7-form-control wpcf7-date wpcf7-validates-as-date" aria-invalid="false" />
</span>
</label>
</p>
<p>
<label> Number of Days<br />
<span class="wpcf7-form-control-wrap day-count">
<input type="number" name="day-count" value="3" class="days wpcf7-form-control wpcf7-number wpcf7-validates-as-number" aria-invalid="false" />
</span>
</label>
</p>
<p><label> Your Email (required)<br />
<span class="wpcf7-form-control-wrap replyto"><input type="email" name="_replyto" value="" size="40" class="wpcf7-form-control wpcf7-text wpcf7-email wpcf7-validates-as-required wpcf7-validates-as-email" aria-required="true" aria-invalid="false" /></span> </label></p>
<p><input type="submit" value="Send" class="wpcf7-form-control wpcf7-submit" /></p>
<div class="wpcf7-response-output wpcf7-display-none" aria-hidden="true"></div>
</form>
</p>
</div>
<?php
}
add_shortcode('rwavw-capsule-enquiry', 'roomwithavw_custom_enquiry_form');

7
src/js/index.js
View File

@ -1,10 +1,13 @@
(function() {
const observeSelector = '.js-onscreen';
// TODO - will the form ID ever change?
const observedNodes = document.querySelectorAll(observeSelector);
let observedCount = 0;
let observedTotal = !!observeSelector ? observedNodes.length : 0;
window.addEventListener('DOMContentLoaded', event => {
// TODO this selector needs to be robuts
const enquiryForm = document.querySelector('#wpcf7-f1041-o1 > form');
const intersectionSupport = !!window.IntersectionObserver;
function updateObservedCount() {
@ -24,6 +27,10 @@
});
}
if (enquiryForm) {
enquiryForm.action = '__URL__';
}
document.body.classList.add('rwavw-custom');
observedNodes.forEach(el => {

72
src/scss/_contact.scss Normal file
View File

@ -0,0 +1,72 @@
body.rwavw-custom {
.contact-us-body {
p.lead {
margin: 48px 0;
font-size: 18px;
line-height: 1.5;
letter-spacing: initial;
opacity: 0.7;
}
div.wpcf7 {
max-width: 90ch;
margin-right: auto;
margin-left: auto;
}
.wpcf7 {
padding: 64px 48px 92px;
color: #4a5568;
background-color: rgba(#fff, 1);
border-radius: 3px;
margin-top: 64px;
p {
margin-bottom: 24px;
}
label {
font-size: 14px;
font-weight: 600;
letter-spacing: initial;
cursor: pointer;
}
input,
textarea {
border-radius: 3px;
border-color: #cbd5e0;
background-color: #f7fafc;
cursor: pointer;
&:focus {
border-color: rgba(#000, 0.8);
}
}
input.booking-date {
width: 21ch;
}
input.days {
width: 21ch;
}
.wpcf7-form-control-wrap {
margin-left: 0;
}
.wpcf7-submit {
height: auto;
border: 3px solid currentColor;
border-radius: 3px;
color: inherit;
font-size: 16px;
font-weight: 600;
padding: 10px 24px;
letter-spacing: 1px;
}
}
}
}

52
src/scss/_faq.scss Normal file
View File

@ -0,0 +1,52 @@
body.rwavw-custom {
@media (min-width: 766.98px) {
#faq > .layout-boxed {
position: relative;
bottom: 18rem;
}
}
.wrapper-content > .layers-pro-accordion {
margin-left: 0;
margin-right: 0;
.accordion-row {
position: relative;
z-index: 150;
max-width: 90ch;
padding: 32px 8px;
border-radius: 3px;
background-color: #fff;
box-shadow: 2px 3px 4px 0 rgba(#000, 0.03);
}
.accordion-button {
font-size: 16px;
font-weight: 600;
color: #4a5568;
opacity: 0.8;
&:hover,
&:active {
opacity: 1;
}
}
.accordion-content p {
font-size: 16px;
color: #4a5568;
}
@media (min-width: 766.98px) {
margin-left: 15px;
margin-right: 15px;
.accordion-row {
padding: 64px 48px;
margin-top: -46rem;
}
}
}
}

58
src/scss/style.scss
View File

@ -1,3 +1,6 @@
@import "contact";
@import "faq";
body.rwavw-custom {
#top-nav .logo {
margin-top: 16px;
@ -38,59 +41,4 @@ body.rwavw-custom {
background-color: rgba(#000, 0.9);
}
.contact-us-body {
p.lead {
margin: 48px 0;
font-size: 18px;
line-height: 1.5;
letter-spacing: initial;
opacity: 0.7;
}
.wpcf7 {
padding: 64px 48px 92px;
color: #4a5568;
background-color: rgba(#fff, 1);
border-radius: 3px;
margin-top: 64px;
p {
margin-bottom: 24px;
}
label {
font-size: 14px;
font-weight: 600;
letter-spacing: initial;
}
input,
textarea {
border-radius: 3px;
border-color: #cbd5e0;
background-color: #f7fafc;
&:focus {
border-color: rgba(#000, 0.8);
}
}
.wpcf7-form-control-wrap {
margin-left: 0;
}
.wpcf7-submit {
height: auto;
border: 3px solid currentColor;
border-radius: 3px;
color: inherit;
font-size: 16px;
font-weight: 600;
padding: 10px 24px;
letter-spacing: 1px;
}
}
}
}

4
tagscan-external.sh Executable file
View File

@ -0,0 +1,4 @@
#!/bin/sh
if [ -f '.tags-external' ] ; then rm .tags-external; fi
ctags -R -o .tags-external -a ./wp-includes

3
tagscan.sh Executable file
View File

@ -0,0 +1,3 @@
#!/bin/sh
ctags -R -o .tags --exclude='node_modules/*' --exclude='wp-includes' *