use HTML for feature table in readme for better style control
This commit is contained in:
parent
d08ff43d38
commit
351047bc4f
44
README.md
44
README.md
@ -16,14 +16,46 @@
|
||||
Vue Formulate is the easiest way to build forms using Vue. Please read the [comprehensive documentation](https://vueformulate.com) for guidance on using Vue Formulate within your own projects.
|
||||
|
||||
|
||||
| <h3>Key features</h3> | |
|
||||
|:-------------|:----------|
|
||||
| <h4>😎 Developer happiness</h4> Forms are everywhere, yet surprisingly tedious to author — well, not anymore. Vue Formulate provides a [powerful and flexible API](https://vueformulate.com/guide/inputs/#all-options) to developers that makes complex form creation a breeze. | <h4>☝️ A single input element</h4> With Vue Formulate you don't need to remember the names of a dozen components — all form elements are created with a [single component](https://vueformulate.com/guide/#inputs). Easy! |
|
||||
| <h4>💪 Grouped fields</h4> Vue Formulate ships with [repeatable field groups](https://vueformulate.com/guide/inputs/types/group/#repeatable-groups) out of the box. Create complex UIs such as multi-person booking forms with ease. | <h4>🎯 Built-in validation</h4> Ridiculously easy [validation](https://vueformulate.com/guide/validation) out-of-the-box to handle 95% of use-cases. Help text, validation rules, and validation messages are simple props. Need more? You can add custom validations too. |
|
||||
| <h4>🔌 Plugin system</h4> Extend Vue Formulate's functionality or reuse custom inputs, validation rules, and messages across projects by tapping into the [plugin system](https://vueformulate.com/guide/plugins/#creating-a-new-plugin). Make your plugin open source to share with others! | <h4>✨ Generate forms</h4> [Generate an entire form](https://vueformulate.com/guide/forms/#generating-forms) from a JSON string. Because Vue Formulate uses a single input component, you can easily loop through an array and dynamically generate a form. |
|
||||
<table style="width: 100%;">
|
||||
<tr>
|
||||
<th colspan="2">
|
||||
<h3>Key features</h3>
|
||||
</th>
|
||||
<tr>
|
||||
<tr>
|
||||
<td style="width: 50%; vertical-align: top;">
|
||||
<h4 style="margin-top: 0.25em">😎 Developer happiness</h4>
|
||||
<p>Forms are everywhere, yet surprisingly tedious to author — well, not anymore. Vue Formulate provides a <a href="https://vueformulate.com/guide/inputs/#all-options">powerful and flexible API</a> to developers that makes complex form creation a breeze.</p>
|
||||
</td>
|
||||
<td style="width: 50%; vertical-align: top;">
|
||||
<h4 style="margin-top: 0.25em;">☝️ A single input element</h4>
|
||||
<p>With Vue Formulate you don't need to remember the names of a dozen components — all form elements are created with a <a href="https://vueformulate.com/guide/#inputs">single component</a>. Easy!</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 50%; vertical-align: top;">
|
||||
<h4 style="margin-top: 0.25em">💪 Grouped fields</h4>
|
||||
<p>Vue Formulate ships with <a href="https://vueformulate.com/guide/inputs/types/group/#repeatable-groups">repeatable field groups</a> out of the box. Create complex UIs such as multi-person booking forms with ease.</p>
|
||||
</td>
|
||||
<td style="width: 50%; vertical-align: top;">
|
||||
<h4 style="margin-top: 0.25em;">🎯 Built-in validation</h4>
|
||||
<p>Ridiculously easy <a href="https://vueformulate.com/guide/validation">validation</a> out-of-the-box to handle 95% of use-cases. Help text, validation rules, and validation messages are simple props. Need more? You can add custom validations too.</p>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width: 50%; vertical-align: top;">
|
||||
<h4 style="margin-top: 0.25em">🔌 Plugin system</h4>
|
||||
<p>Extend Vue Formulate's functionality or reuse custom inputs, validation rules, and messages across projects by tapping into the <a href="https://vueformulate.com/guide/plugins/#creating-a-new-plugin">plugin system</a>. Make your plugin open source to share with others!</p>
|
||||
</td>
|
||||
<td style="width: 50%; vertical-align: top;">
|
||||
<h4 style="margin-top: 0.25em;">✨ Generate forms</h4>
|
||||
<p><a href="https://vueformulate.com/guide/forms/#generating-forms">Generate an entire form</a> from a JSON string. Because Vue Formulate uses a single input component, you can easily loop through an array and dynamically generate a form.</p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
||||
These features and many more are thoroughly covered an the [documentation website](https://vueformulate.com).
|
||||
These features and many more are thoroughly covered at the [documentation website](https://vueformulate.com).
|
||||
|
||||
|
||||
## Contributing
|
||||
|
Loading…
Reference in New Issue
Block a user