x
1
2
3
4
5
6
7
8
9
10
<div class="elevate-form-layout-container">
<div id="form_layout_item_position_1" class="elevate-form-layout--item"> <input type="email" name="email" id="email" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" placeholder="you@example.com">
</div>
<div id="form_layout_item_position_2" class="elevate-form-layout--item"> <input type="email" name="email" id="email" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" placeholder="you@example.com">
</div>
<div id="form_layout_item_position_3" class="elevate-form-layout--item"> <button type="button" class="elevate-button elevate-button--default elevate-button--size-l elevate-button--align-center">
submit
</button>
</div>
</div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<%= elevate_form_layout do |form_layout| %>
<% form_layout.with_item do %>
<%# TODO: Using the Input Component %>
<input type="email" name="email" id="email" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" placeholder="you@example.com">
<% end %>
<% form_layout.with_item do %>
<%# TODO: Using the Input Component %>
<input type="email" name="email" id="email" class="block w-full rounded-md border-0 py-1.5 text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 placeholder:text-gray-400 focus:ring-2 focus:ring-inset focus:ring-indigo-600 sm:text-sm sm:leading-6" placeholder="you@example.com">
<% end %>
<% form_layout.with_item do %>
<%= elevate_button(size: :large) { 'submit' } %>
<% end %>
<% end %>