Merge pull request #309 from StartBootstrap/develop
dependencies update and sb forms integration
This commit is contained in:
commit
0f59b6de5a
13
README.md
13
README.md
@ -47,6 +47,19 @@ Clone the source files of the theme and navigate into the theme's root directory
|
||||
|
||||
You must have npm installed in order to use this build environment.
|
||||
|
||||
### Contact Form
|
||||
|
||||
The contact form available with this theme is prebuilt to use [SB Forms](https://startbootstrap.com/solution/contact-forms).
|
||||
SB Forms is a simple form solution for adding functional forms to your theme. Since this theme is prebuilt using our
|
||||
SB Forms markup, all you need to do is sign up for [SB Forms on Start Bootstrap](https://startbootstrap.com/solution/contact-forms).
|
||||
|
||||
After signing up you will need to set the domain name your form will be used on, and you will then see your
|
||||
access key. Copy this and paste it into the `data-sb-form-api-token='API_TOKEN'` data attribute in place of
|
||||
`API_TOKEN`. That's it! Your forms will be up and running!
|
||||
|
||||
If you aren't using SB Forms, simply delete the custom data attributes from the form, and remove the link above the
|
||||
closing `</body>` tag to SB Forms.
|
||||
|
||||
## Bugs and Issues
|
||||
|
||||
Have a bug or an issue with this template? [Open a new issue](https://github.com/StartBootstrap/startbootstrap-agency/issues) here on GitHub or leave a comment on the [theme overview page at Start Bootstrap](https://startbootstrap.com/theme/agency).
|
||||
|
2
dist/css/styles.css
vendored
2
dist/css/styles.css
vendored
@ -1,6 +1,6 @@
|
||||
@charset "UTF-8";
|
||||
/*!
|
||||
* Start Bootstrap - Agency v7.0.0 (https://startbootstrap.com/theme/agency)
|
||||
* Start Bootstrap - Agency v7.0.1 (https://startbootstrap.com/theme/agency)
|
||||
* Copyright 2013-2021 Start Bootstrap
|
||||
* Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-agency/blob/master/LICENSE)
|
||||
*/
|
||||
|
65
dist/index.html
vendored
65
dist/index.html
vendored
@ -312,33 +312,60 @@
|
||||
<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">
|
||||
<!-- * * * * * * * * * * * * * * *-->
|
||||
<!-- * * SB Forms 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 an 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>
|
||||
<!-- Name input-->
|
||||
<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>
|
||||
<!-- Email address input-->
|
||||
<input class="form-control" id="email" type="email" placeholder="Your Email *" data-sb-validations="required,email" />
|
||||
<div class="invalid-feedback" data-sb-feedback="email:required">An email is required.</div>
|
||||
<div class="invalid-feedback" 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>
|
||||
<!-- Phone number input-->
|
||||
<input class="form-control" id="phone" type="tel" placeholder="Your Phone *" data-sb-validations="required" />
|
||||
<div class="invalid-feedback" 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>
|
||||
<!-- Message input-->
|
||||
<textarea class="form-control" id="message" placeholder="Your Message *" data-sb-validations="required"></textarea>
|
||||
<div class="invalid-feedback" 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>
|
||||
@ -346,14 +373,7 @@
|
||||
<footer class="footer py-4">
|
||||
<div class="container">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-lg-4 text-lg-start">
|
||||
Copyright © Your Website
|
||||
<!-- This script automatically adds the current year to your website footer-->
|
||||
<!-- (credit: https://updateyourfooter.com/)-->
|
||||
<script>
|
||||
document.write(new Date().getFullYear());
|
||||
</script>
|
||||
</div>
|
||||
<div class="col-lg-4 text-lg-start">Copyright © Your Website 2021</div>
|
||||
<div class="col-lg-4 my-3 my-lg-0">
|
||||
<a class="btn btn-dark btn-social mx-2" href="#!"><i class="fab fa-twitter"></i></a>
|
||||
<a class="btn btn-dark btn-social mx-2" href="#!"><i class="fab fa-facebook-f"></i></a>
|
||||
@ -581,5 +601,10 @@
|
||||
<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 * *-->
|
||||
<!-- * * Activate your form at https://startbootstrap.com/solution/contact-forms * *-->
|
||||
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *-->
|
||||
<script src="https://cdn.startbootstrap.com/sb-forms-latest.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
2
dist/js/scripts.js
vendored
2
dist/js/scripts.js
vendored
@ -1,5 +1,5 @@
|
||||
/*!
|
||||
* Start Bootstrap - Agency v7.0.0 (https://startbootstrap.com/theme/agency)
|
||||
* Start Bootstrap - Agency v7.0.1 (https://startbootstrap.com/theme/agency)
|
||||
* Copyright 2013-2021 Start Bootstrap
|
||||
* Licensed under MIT (https://github.com/StartBootstrap/startbootstrap-agency/blob/master/LICENSE)
|
||||
*/
|
||||
|
3032
package-lock.json
generated
3032
package-lock.json
generated
File diff suppressed because it is too large
Load Diff
12
package.json
12
package.json
@ -1,7 +1,7 @@
|
||||
{
|
||||
"title": "Agency",
|
||||
"name": "startbootstrap-agency",
|
||||
"version": "7.0.0",
|
||||
"version": "7.0.1",
|
||||
"scripts": {
|
||||
"build": "npm run clean && npm run build:pug && npm run build:scss && npm run build:scripts && npm run build:assets",
|
||||
"build:assets": "node scripts/build-assets.js",
|
||||
@ -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",
|
||||
"prettier": "2.3.0",
|
||||
"concurrently": "6.2.0",
|
||||
"postcss": "8.3.0",
|
||||
"prettier": "2.3.1",
|
||||
"pug": "3.0.2",
|
||||
"sass": "1.32.13",
|
||||
"sass": "1.34.1",
|
||||
"shelljs": "0.8.4",
|
||||
"upath": "2.0.1"
|
||||
}
|
||||
|
@ -279,36 +279,95 @@ 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
|
||||
|
||||
// * * * * * * * * * * * * * * *
|
||||
// * * SB Forms 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 an 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
|
||||
|
||||
// Name input
|
||||
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
|
||||
|
||||
// Email address input
|
||||
input#email.form-control(
|
||||
type='email',
|
||||
placeholder='Your Email *',
|
||||
data-sb-validations='required,email'
|
||||
)
|
||||
.invalid-feedback(data-sb-feedback='email:required')
|
||||
| An email is required.
|
||||
.invalid-feedback(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
|
||||
|
||||
// Phone number input
|
||||
input#phone.form-control(
|
||||
type='tel',
|
||||
placeholder='Your Phone *',
|
||||
data-sb-validations='required'
|
||||
)
|
||||
.invalid-feedback(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
|
||||
|
||||
// Message input
|
||||
textarea#message.form-control(
|
||||
placeholder='Your Message *',
|
||||
data-sb-validations='required'
|
||||
)
|
||||
.invalid-feedback(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
|
||||
.container
|
||||
.row.align-items-center
|
||||
.col-lg-4.text-lg-start
|
||||
| Copyright © Your Website
|
||||
// This script automatically adds the current year to your website footer
|
||||
// (credit: https://updateyourfooter.com/)
|
||||
script.
|
||||
document.write(new Date().getFullYear());
|
||||
| Copyright © Your Website 2021
|
||||
.col-lg-4.my-3.my-lg-0
|
||||
a.btn.btn-dark.btn-social.mx-2(href='#!')
|
||||
i.fab.fa-twitter
|
||||
@ -333,3 +392,10 @@ html(lang='en')
|
||||
|
||||
// Core theme JS
|
||||
script(src='js/scripts.js')
|
||||
|
||||
// * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
|
||||
// * * SB Forms JS * *
|
||||
// * * Activate your form at https://startbootstrap.com/solution/contact-forms * *
|
||||
// * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
|
||||
|
||||
script(src='https://cdn.startbootstrap.com/sb-forms-latest.js')
|
||||
|
Loading…
Reference in New Issue
Block a user