44 lines
1.9 KiB
Plaintext
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 %>
|