dependencies update and SB forms integration
This commit is contained in:
David Miller
parent
de8f3260ad
commit
c6f4ca7181
47
dist/index.html
vendored
47
dist/index.html
vendored
@ -312,33 +312,55 @@
|
||||
<h2 class="section-heading text-uppercase">Contact Us</h2>
|
||||
<h3 class="section-subheading text-muted">Lorem ipsum dolor sit amet consectetur.</h3>
|
||||
</div>
|
||||
<form id="contactForm">
|
||||
<!-- Contact Form-->
|
||||
<!---->
|
||||
<!-- This form is pre-integrated with SB Forms-->
|
||||
<!-- To make this form functional, sign up at-->
|
||||
<!-- https://startbootstrap.com/solution/contact-forms-->
|
||||
<!-- to get your API token!-->
|
||||
<form id="contactForm" data-sb-form-api-token="API_TOKEN">
|
||||
<div class="row align-items-stretch mb-5">
|
||||
<div class="col-md-6">
|
||||
<div class="form-group">
|
||||
<input class="form-control" id="name" type="text" placeholder="Your Name *" required="required" />
|
||||
<p class="help-block text-danger"></p>
|
||||
<input class="form-control" id="name" type="text" placeholder="Your Name *" data-sb-validations="required" />
|
||||
<div class="invalid-feedback" data-sb-feedback="name:required">A name is required.</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<input class="form-control" id="email" type="email" placeholder="Your Email *" required="required" />
|
||||
<p class="help-block text-danger"></p>
|
||||
<input class="form-control" id="email" type="email" placeholder="Your Email *" data-sb-validations="required,email" />
|
||||
<div class="invalid-feedback d-none" data-sb-feedback="email:required">An email is required.</div>
|
||||
<div class="invalid-feedback d-none" data-sb-feedback="email:email">Email is not valid.</div>
|
||||
</div>
|
||||
<div class="form-group mb-md-0">
|
||||
<input class="form-control" id="phone" type="tel" placeholder="Your Phone *" required="required" />
|
||||
<p class="help-block text-danger"></p>
|
||||
<input class="form-control" id="phone" type="tel" placeholder="Your Phone *" data-sb-validations="required" />
|
||||
<div class="invalid-feedback d-none" data-sb-feedback="phone:required">A phone number is required.</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div class="form-group form-group-textarea mb-md-0">
|
||||
<textarea class="form-control" id="message" placeholder="Your Message *" required="required"></textarea>
|
||||
<p class="help-block text-danger"></p>
|
||||
<textarea class="form-control" id="message" placeholder="Your Message *" data-sb-validations="required"></textarea>
|
||||
<div class="invalid-feedback d-none" data-sb-feedback="message:required">A message is required.</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<div id="success"></div>
|
||||
<button class="btn btn-primary btn-xl text-uppercase" id="sendMessageButton" type="submit">Send Message</button>
|
||||
<!-- Submit success message-->
|
||||
<!---->
|
||||
<!-- This is what your users will see when the form-->
|
||||
<!-- has successfully submitted-->
|
||||
<div class="d-none" id="submitSuccessMessage">
|
||||
<div class="text-center mb-3">
|
||||
<div class="fw-bolder">Form submission successful!</div>
|
||||
To activate this form, sign up at
|
||||
<br />
|
||||
<a href="https://startbootstrap.com/solution/contact-form">https://startbootstrap.com/solution/contact-form</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Submit error message-->
|
||||
<!---->
|
||||
<!-- This is what your users will see when there is-->
|
||||
<!-- an error submitting the form-->
|
||||
<div class="d-none" id="submitErrorMessage"><div class="text-center text-danger mb-3">Error sending message!</div></div>
|
||||
<!-- Submit Button-->
|
||||
<div class="text-center"><button class="btn btn-primary btn-xl text-uppercase disabled" id="submitButton" type="submit">Send Message</button></div>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
@ -581,5 +603,6 @@
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.bundle.min.js"></script>
|
||||
<!-- Core theme JS-->
|
||||
<script src="js/scripts.js"></script>
|
||||
<!-- SB Forms JS-->
|
||||
</body>
|
||||
</html>
|
||||
|
||||
3024
package-lock.json
generated
3024
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -39,14 +39,14 @@
|
||||
"bootstrap": "5.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"autoprefixer": "10.2.5",
|
||||
"autoprefixer": "10.2.6",
|
||||
"browser-sync": "2.26.14",
|
||||
"chokidar": "3.5.1",
|
||||
"concurrently": "6.1.0",
|
||||
"postcss": "8.2.15",
|
||||
"concurrently": "6.2.0",
|
||||
"postcss": "8.3.0",
|
||||
"prettier": "2.3.0",
|
||||
"pug": "3.0.2",
|
||||
"sass": "1.32.13",
|
||||
"sass": "1.34.1",
|
||||
"shelljs": "0.8.4",
|
||||
"upath": "2.0.1"
|
||||
}
|
||||
|
||||
@ -279,25 +279,72 @@ html(lang='en')
|
||||
.text-center
|
||||
h2.section-heading.text-uppercase Contact Us
|
||||
h3.section-subheading.text-muted Lorem ipsum dolor sit amet consectetur.
|
||||
form#contactForm
|
||||
|
||||
// Contact Form
|
||||
//
|
||||
// This form is pre-integrated with SB Forms
|
||||
// To make this form functional, sign up at
|
||||
// https://startbootstrap.com/solution/contact-forms
|
||||
// to get your API token!
|
||||
|
||||
form#contactForm(data-sb-form-api-token='API_TOKEN')
|
||||
.row.align-items-stretch.mb-5
|
||||
.col-md-6
|
||||
.form-group
|
||||
input#name.form-control(type='text', placeholder='Your Name *', required='required')
|
||||
p.help-block.text-danger
|
||||
input#name.form-control(
|
||||
type='text',
|
||||
placeholder='Your Name *',
|
||||
data-sb-validations='required'
|
||||
)
|
||||
.invalid-feedback(data-sb-feedback='name:required')
|
||||
| A name is required.
|
||||
.form-group
|
||||
input#email.form-control(type='email', placeholder='Your Email *', required='required')
|
||||
p.help-block.text-danger
|
||||
input#email.form-control(
|
||||
type='email',
|
||||
placeholder='Your Email *',
|
||||
data-sb-validations='required,email'
|
||||
)
|
||||
.invalid-feedback.d-none(data-sb-feedback='email:required')
|
||||
| An email is required.
|
||||
.invalid-feedback.d-none(data-sb-feedback='email:email')
|
||||
| Email is not valid.
|
||||
.form-group.mb-md-0
|
||||
input#phone.form-control(type='tel', placeholder='Your Phone *', required='required')
|
||||
p.help-block.text-danger
|
||||
input#phone.form-control(
|
||||
type='tel',
|
||||
placeholder='Your Phone *',
|
||||
data-sb-validations='required'
|
||||
)
|
||||
.invalid-feedback.d-none(data-sb-feedback='phone:required')
|
||||
| A phone number is required.
|
||||
.col-md-6
|
||||
.form-group.form-group-textarea.mb-md-0
|
||||
textarea#message.form-control(placeholder='Your Message *', required='required')
|
||||
p.help-block.text-danger
|
||||
textarea#message.form-control(placeholder='Your Message *', data-sb-validations='required')
|
||||
.invalid-feedback.d-none(data-sb-feedback='message:required')
|
||||
| A message is required.
|
||||
|
||||
// Submit success message
|
||||
//
|
||||
// This is what your users will see when the form
|
||||
// has successfully submitted
|
||||
|
||||
#submitSuccessMessage.d-none
|
||||
.text-center.mb-3
|
||||
.fw-bolder Form submission successful!
|
||||
| To activate this form, sign up at
|
||||
br
|
||||
a(href='https://startbootstrap.com/solution/contact-form') https://startbootstrap.com/solution/contact-form
|
||||
|
||||
// Submit error message
|
||||
//
|
||||
// This is what your users will see when there is
|
||||
// an error submitting the form
|
||||
|
||||
#submitErrorMessage.d-none
|
||||
.text-center.text-danger.mb-3 Error sending message!
|
||||
|
||||
// Submit Button
|
||||
.text-center
|
||||
#success
|
||||
button#sendMessageButton.btn.btn-primary.btn-xl.text-uppercase(type='submit') Send Message
|
||||
button#submitButton.btn.btn-primary.btn-xl.text-uppercase.disabled(type='submit') Send Message
|
||||
|
||||
// Footer
|
||||
footer.footer.py-4
|
||||
@ -333,3 +380,6 @@ html(lang='en')
|
||||
|
||||
// Core theme JS
|
||||
script(src='js/scripts.js')
|
||||
|
||||
// SB Forms JS
|
||||
//- script(src='path/to/cdn.js')
|
||||
|
||||
Loading…
Reference in New Issue
Block a user