More text
This commit is contained in:
parent
74df22eb5b
commit
7b060bf1c7
@ -114,7 +114,16 @@ span {
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.features .columns {
|
||||
margin-bottom: 3em;
|
||||
}
|
||||
.howto .box {
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
.contact-form {
|
||||
margin-top: 3em;
|
||||
}
|
||||
/*
|
||||
Links
|
||||
*/
|
||||
@ -131,15 +140,6 @@ Links
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
/*
|
||||
Wrapper
|
||||
*/
|
||||
.section .container,
|
||||
.hero .hero-body {
|
||||
max-width: 100%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/*
|
||||
Some aesthetic improvements
|
||||
@ -150,8 +150,7 @@ nav {
|
||||
}
|
||||
|
||||
.paragraph {
|
||||
width: 600px;
|
||||
line-height: 1.5em;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
/*
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
<div id="wrapper" class="has-text-centered-mobile">
|
||||
<div id="wrapper" class="has-text-centered">
|
||||
|
||||
<!-- Hero -->
|
||||
<section id="hero" class="hero is-medium">
|
||||
@ -19,7 +19,7 @@
|
||||
</section>
|
||||
|
||||
|
||||
<section class="section has-white-mustard-gradient">
|
||||
<section class="section howto has-white-mustard-gradient">
|
||||
<div class="container">
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
@ -81,12 +81,12 @@
|
||||
</section>
|
||||
|
||||
|
||||
<section id="features" class="section has-mustard-bg has-text-white">
|
||||
<section class="section features has-mustard-bg has-text-white">
|
||||
<div class="container">
|
||||
<div class="columns">
|
||||
<div class="columns is-multiline is-centered">
|
||||
<div class="column">
|
||||
<h3 class="is-size-3">
|
||||
Full design control over your forms
|
||||
Your form, your design!
|
||||
</h3>
|
||||
<p class="paragraph">
|
||||
Create beautiful online forms without any restrictions.<br>Tinyforms stays completely in the background.
|
||||
@ -98,73 +98,134 @@
|
||||
|
||||
<div class="column">
|
||||
<h3 class="is-size-3">
|
||||
Full Google Sheets and Airtable flexibility
|
||||
Full Google and Airtable flexibility
|
||||
</h3>
|
||||
<p class="paragraph">
|
||||
Use all your favorite Google Sheets and Airtable features. E.g. share the document with your coworkers or use field formulas.<br>
|
||||
Use all your favorite Google Sheets and Airtable features.
|
||||
<br>
|
||||
For example: share the document with your coworkers or use field formulas.
|
||||
<br>
|
||||
tinyforms follows your column setup and appends each form submission.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<h3 class="is-size-3">
|
||||
Full design control over your forms
|
||||
Super simple setup
|
||||
</h3>
|
||||
<p class="paragraph">
|
||||
Create beautiful online forms without any restrictions.<br>Tinyforms stays completely in the background.
|
||||
</p>
|
||||
<p>
|
||||
Do you need help creating your forms? We'll help you!
|
||||
Create a new tinyform, point your online from to our servers, done!
|
||||
<br>
|
||||
tinyforms will start processing submissions automatically and add them to your spreadsheets in real-time.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="column">
|
||||
<h3 class="is-size-3">
|
||||
Full Google Sheets and Airtable flexibility
|
||||
Spam protection
|
||||
</h3>
|
||||
<p class="paragraph">
|
||||
Use all your favorite Google Sheets and Airtable features. E.g. share the document with your coworkers or use field formulas.<br>
|
||||
Nobody likes spam. We help you to keep your data clean.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<h3 class="is-size-3">
|
||||
File uploads
|
||||
</h3>
|
||||
<p class="paragraph">
|
||||
Easily collect documents, photos, file, music and more.
|
||||
<br>
|
||||
We take care of the storage for you.
|
||||
<br>
|
||||
Files are added as secure links to your spreadsheet.
|
||||
</p>
|
||||
</div>
|
||||
<div class="column">
|
||||
<h3 class="is-size-3">
|
||||
JavaScript/AJAX ready
|
||||
</h3>
|
||||
<p class="paragraph">
|
||||
Use our JavaScript library or our API directly to submit data using JavaScript.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="columns">
|
||||
<div class="column">
|
||||
<h3 class="is-size-3">
|
||||
Email autoresponder
|
||||
</h3>
|
||||
<p class="paragraph">
|
||||
Send an individual email reply to submitters confirming that you've received their submission.
|
||||
</p>
|
||||
</div>
|
||||
<div class="column">
|
||||
<h3 class="is-size-3">
|
||||
Email notifications
|
||||
</h3>
|
||||
<p class="paragraph">
|
||||
Don't miss a new submission. Get notified via email.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section id="newsletter" class="section">
|
||||
<div class="container">
|
||||
<h3 class="is-size-3">
|
||||
Newsletter or Call to Action</h3>
|
||||
<p class="">
|
||||
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum.
|
||||
</p>
|
||||
<div class="field newsletter-field">
|
||||
<div class="control">
|
||||
<input class="input newsletter-input" type="text" placeholder="mail@example.com">
|
||||
</div>
|
||||
</div>
|
||||
<button class="btn has-mustard-bg has-text-white is-size-7 a-menu">
|
||||
sign up now
|
||||
</button>
|
||||
<section class="section">
|
||||
<div class="container">
|
||||
<h3 class="is-size-3">
|
||||
Missing a feature? Questions?
|
||||
</h3>
|
||||
<p class="paragraph">
|
||||
We are building tinyforms to make your work easier! Let us know what we can do for you.
|
||||
</p>
|
||||
<form method="POST" class="contact-form has-text-left" action="https://tinyforms.herokuapp.com/s/mT4qT3SjGczmKpFhKXdw4YRW">
|
||||
<div class="columns is-centered">
|
||||
<div class="column is-one-third">
|
||||
<div class="field">
|
||||
<label class="label">Your email</label>
|
||||
<div class="control">
|
||||
<input class="input" type="text" name="email" placeholder="me@earth.com">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<!-- END Newsletter -->
|
||||
<!-- Footer -->
|
||||
<section id="footer" class="section has-blue-bg">
|
||||
<div class="container has-text-centered">
|
||||
<a href="" class="is-size-4 social-link">
|
||||
<i class="fab fa-twitter"></i>
|
||||
</a>
|
||||
<a href="" class="is-size-4 social-link">
|
||||
<i class="fab fa-github"></i>
|
||||
</a>
|
||||
<a href="" class="is-size-4 social-link">
|
||||
<i class="fab fa-dev"></i>
|
||||
</a>
|
||||
<p class="has-text-white is-size-7">
|
||||
Built with <i class="fas fa-heart"></i> and <a href="">Bulma</a>, by <a href="">@hellobetkowski</a>
|
||||
</p>
|
||||
<div class="field">
|
||||
<label class="label">Message</label>
|
||||
<div class="control">
|
||||
<textarea class="textarea" placeholder="How can we help you?"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<div class="control has-text-centered">
|
||||
<button class="button is-primary">Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
|
||||
<section id="footer" class="section has-blue-bg">
|
||||
<div class="container has-text-centered">
|
||||
<a href="" class="is-size-4 social-link">
|
||||
<i class="fab fa-twitter"></i>
|
||||
</a>
|
||||
<a href="" class="is-size-4 social-link">
|
||||
<i class="fab fa-github"></i>
|
||||
</a>
|
||||
<a href="" class="is-size-4 social-link">
|
||||
<i class="fab fa-dev"></i>
|
||||
</a>
|
||||
<p class="has-text-white is-size-7">
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user