Merge pull request #309 from StartBootstrap/develop

dependencies update and sb forms integration
This commit is contained in:
David Miller 2021-06-05 20:03:25 -04:00 committed by GitHub
commit 0f59b6de5a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 195 additions and 3029 deletions

View File

@ -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
View File

@ -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
View File

@ -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 &copy; 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 &copy; 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
View File

@ -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

File diff suppressed because it is too large Load Diff

View File

@ -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"
}

View File

@ -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 &copy; Your Website
// This script automatically adds the current year to your website footer
// (credit: https://updateyourfooter.com/)
script.
document.write(new Date().getFullYear());
| Copyright &copy; 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')