Files
fizzy/app/views/splats/_form.html.erb
T
2024-07-24 13:42:06 -05:00

44 lines
1.9 KiB
Plaintext

<%= form_with model: splat, class: "flex flex-column gap full-width" do | form | %>
<%= form.label :title, class: "flex flex-column justify-start align-start" do %>
<%= form.text_field :title, class: "input full-width", required: true, placeholder: "Name it…" %>
<% end %>
<fieldset class="flex flex-column unpad margin-block-end borderless justify-space-between">
<legend class="for-screen-reader">Color</legend>
<div class="flex align-center gap">
<% Splat.colors.keys.each do | color | %>
<label class="btn btn--circle txt-medium" style="--btn-background: <%= color -%>" >
<%= form.radio_button :color, color %>
<%= image_tag "check.svg", aria: { hidden: "true" }, size: 24, class: "checked" %>
<span class="for-screen-reader"><%= color %></span>
</label>
<% end %>
</div>
</fieldset>
<fieldset class="flex flex-column unpad margin-block-end borderless justify-space-between">
<legend class="for-screen-reader">Category</legend>
<div class="flex align-center gap flex-wrap">
<%= collection_check_boxes(:splat, :category_ids, Category.all, :id, :title) do | category | %>
<%= category.label(class: "btn txt-medium") { category.check_box + tag.span(category.text) } %>
<% end %>
<label class="btn txt-medium" >
<%= image_tag "add.svg", aria: { hidden: "true" }, size: 24 %>
<span class="for-screen-reader">Add a category</span>
</label>
</div>
</fieldset>
<%= form.label :body, class: "flex flex-column justify-start align-start" do %>
<%= form.text_area :body, class: "input full-width", rows: 10, placeholder: "Details…" %>
<% end %>
<%= form.button class: "btn btn--reversed" do %>
<%= image_tag "check.svg", aria: { hidden: "true" }, size: 24%>
<span class="for-screen-reader">Save</span>
<% end %>
<% end %>