Jason Jordan
74 lines
4.9 KiB
Plaintext
74 lines
4.9 KiB
Plaintext
<div class="bg-deepcove h-full w-full flex flex-col">
|
|
<div class="flex items-center">
|
|
<%= link_to employer_path(@employer.slug), class: "flex items-center h-14 space-x" do %>
|
|
<div class="flex items-center h-14 text-bluemana hover:text-bronze">
|
|
<%= icon "arrow-big-left-dash", library: "lucide", class: "h-full w-20 text-center" %>
|
|
<div class="w-full pb-1 font-bold text-2xl">
|
|
<%= "Back to Employer" %>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</div>
|
|
<div class="flex space-x-6 my-5 font-bold text-4xl">
|
|
<h1 class="text-platinum">ID Card Plans:</h1>
|
|
<h1 class="text-atmosphere">(<%= @employer.name %>)</h1>
|
|
</div>
|
|
<%= form_with model: @setup, url: update_plans_employer_id_card_setup_index_path(@employer.slug), local: true, multipart: true do |f| %>
|
|
<div class="flex flex-col space-y-6 pb-10">
|
|
<div class="w-full flex my-8" data-controller="add-plan" data-add-plan-form-color-value="<%= IdCard::Setup::FORM_COLORS.to_json %>" >
|
|
<div class="flex flex-wrap w-full" data-add-plan-target="container">
|
|
<% @setup.plans.each_with_index do |plan, index| %>
|
|
<%= f.fields_for :plans, plan do |plan_fields| %>
|
|
<div class="inline-flex flex-col justify-end pr-6 w-1/4 relative pl-1 plan-item" data-controller="benefits-template-picker">
|
|
<div class="absolute left-0 top-[2%] h-[98%] border-l-4 <%= "border-#{IdCard::Setup::FORM_COLORS[index]}" %> "></div>
|
|
<div class="font-bold text-2xl <%= "text-#{IdCard::Setup::FORM_COLORS[index]}" %> -ml-[6px] z-2 w-full">
|
|
<%= "Plan #{index + 1}" %>
|
|
</div>
|
|
<%= render 'plan_fields', plan_fields: plan_fields, f: f, index: index %>
|
|
<div class="text-xl text-left font-bold pl-[2px] mb-[-4px] z-1 <%= "text-#{IdCard::Setup::FORM_COLORS[index]}" %>">
|
|
Benefit Values
|
|
</div>
|
|
<div class="w-full h-[3px] rounded-r <%= "bg-#{index % 2 == 1 ? 'bronze' : 'copper'}" %> ml-[3px]"></div>
|
|
<%= plan_fields.fields_for :plan_benefits do |plan_benefits_fields| %>
|
|
<%= render 'plan_benefits_fields', plan_benefits_fields: plan_benefits_fields %>
|
|
<% end %>
|
|
<div class="mt-4 pl-1">
|
|
<%= plan_fields.hidden_field :_destroy %>
|
|
<%= button_tag "Remove Plan #{index + 1}", class: "cursor-pointer bg-deepcove hover:bg-brightlava text-xl font-bold text-copper hover:text-platinum py-2 px-4 font-semibold leading-tight rounded-lg border-3 border-copper w-full", data: { action: "add-plan#remove" } %>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
<% end %>
|
|
<%= button_tag "Add a Plan", class: "cursor-pointer text-2xl font-bold py-2 pr-6 mt-10 w-[calc(24%-1rem)] w-1/4 h-[200px] text-[#E0E0E0] rounded-lg font-medium border border-[#E0E0E0] bg-[#173057] hover:bg-transparent hover:shadow-[0_0_10px_3px_#93c5fd] transition-colors duration-150", data: { action: "add-plan#add", add_plan_target: "button" } %>
|
|
</div>
|
|
<template data-add-plan-target="template">
|
|
<%= f.fields_for :plans, @setup.plans.build, child_index: 'NEW_RECORD' do |plan_fields| %>
|
|
<div class="inline-flex flex-col justify-end pr-6 w-1/4 relative pl-1 plan-item" data-controller="benefits-template-picker">
|
|
<div class="absolute left-0 top-[2%] h-[98%] border-l-4 border-NEXT_COLOR"></div>
|
|
<div class="font-bold text-2xl text-NEXT_COLOR -ml-[6px] z-2 w-full">
|
|
<%= "Plan NEW_PLAN" %>
|
|
</div>
|
|
<%= render 'plan_fields', plan_fields: plan_fields, f: f, index: "NEW_RECORD".to_i %>
|
|
<div class="text-xl text-left font-bold pl-[2px] mb-[-4px] z-1 text-NEXT_COLOR">
|
|
Benefit Values
|
|
</div>
|
|
<div class="w-full h-[3px] rounded-r bg-NEXT_SECONDARY_COLOR ml-[3px]"></div>
|
|
<%= plan_fields.fields_for :plan_benefits do |plan_benefits_fields| %>
|
|
<%= render 'plan_benefits_fields', plan_benefits_fields: plan_benefits_fields %>
|
|
<% end %>
|
|
<div class="mt-4 pl-1">
|
|
<%= plan_fields.hidden_field :_destroy %>
|
|
<%= button_tag "Remove Plan NEW_PLAN", class: "cursor-pointer bg-deepcove hover:bg-brightlava text-xl font-bold text-NEXT_SECONDARY_COLOR hover:text-platinum py-2 px-4 font-semibold leading-tight rounded-lg border-3 border-NEXT_SECONDARY_COLOR w-full", data: { action: "add-plan#remove" } %>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</template>
|
|
</div>
|
|
</div>
|
|
<div class="flex space-x-3 py-8">
|
|
<%= f.submit "Save Plans", {class: "px-8"} %>
|
|
</div>
|
|
</div>
|
|
<% end %>
|
|
</div>
|