Merge branch 'features/budget' of https://github.com/stephenkati/Budg…

…et_app into features/budget
stephenkati · Aug 7, 2023 · 8fc35e3 · 8fc35e3
2 parents 9c2f676 + a839c7a
commit 8fc35e3
Show file tree

Hide file tree

Showing 9 changed files with 101 additions and 91 deletions.
diff --git a/app/views/categories/edit.html.erb b/app/views/categories/edit.html.erb
@@ -1,23 +1,25 @@
-<%= turbo_frame_tag "edit_category" do %>
-<% end %>
   <div>
-    <div>
-      <%= link_to "<< Back", category_path(@category), class: "text-lg text-bold text-primary-focus" %>
-    </div>
     <div class="flex flex-col items-center">
 
-      <%= form_with(model: @category, url: category_path(@category), method: :patch, html: { class: "bg-white p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center gap-2" } ) do |f| %>
+      <div class="bg-primary w-full justify-center p-5 text-white flex justify-between items-center">
+        <%= link_to categories_path do %>
+          <i class="fa-solid fa-arrow-left-long"></i>
+        <% end %>
+        <h2 class="text-2xl">CATEGORY</h2>
+        <p>Category</p>
+      </div>
+
+      <%= form_with(model: @category, url: category_path(@category), method: :patch, html: { class: "p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center" } ) do |f| %>
+
         <div class="font-bold flex justify-between w-full text-accent">
-          <%= f.label :name, "Name" %>
-          <%= f.text_field :name, class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+          <%= f.text_field :name, class: "border-2 w-full bg-white text-black" %>
         </div>
 
         <div class="font-bold flex justify-between w-full text-accent">
-          <%= f.label :icon, "Icon" %>
-          <%= f.select :icon, Category::ICONS.invert, { include_blank: true }, { required: true, class: "rounded-full border-none w-3/4 bg-neutral text-white" } %>
+          <%= f.select :icon, { "None" => nil }.merge(Category::ICONS.invert), { include_blank: true }, { required: true, class: "border-2 w-full bg-white text-black" } %>
         </div>
 
-        <div class="font-bold bg-secondary hover:bg-secondary-focus px-4 py-1">
+        <div class="font-bold bg-primary hover:bg-primary-focus px-4 py-1 my-2 text-white">
           <%= f.submit "Save" %>
         </div>
       <% end %>

diff --git a/app/views/categories/index.html.erb b/app/views/categories/index.html.erb
@@ -1,4 +1,4 @@
-<div class="w-full text-accent h-full flex flex-col justify-between bg-neutral-focus">
+<div class="w-full text-accent h-full flex flex-col relative bg-neutral-focus">
   <div class="flex flex-col px-3 bg-primary py-5 h-28 justify-between">
 
     <div class="text-white flex justify-between px-4 text-xl items-center">
@@ -41,9 +41,7 @@
 
   </ul>
 
-  <%= turbo_frame_tag "new_category" do %>
-  <% end %>
-  <div class="w-full flex justify-center items-center bg-secondary p-2">
-    <%= link_to 'Add Category', new_category_path, class: "text-white w-5/6 ring-2 ring-white max-w-md py-2 text-center font-bold " %>
+  <div class="w-full flex justify-center items-center bg-secondary p-2 absolute bottom-0">
+    <%= link_to 'Add Category', new_category_path, class: "text-white w-full ring-2 ring-white max-w-md py-2 text-center font-bold " %>
   </div>
 </div>
diff --git a/app/views/categories/new.html.erb b/app/views/categories/new.html.erb
@@ -1,20 +1,22 @@
-<%= turbo_frame_tag "new_category" do %>
-<% end %>
   <div>
-    <div>
-      <%= link_to "<< Back", categories_path, class: "text-lg text-bold text-primary-focus" %>
-    </div>
     <div class="flex flex-col items-center">
-      <%= form_with model: @category, html: { class: "bg-white p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center gap-2" } do |f| %>
+
+      <div class="bg-primary w-full justify-center p-5 text-white flex justify-between items-center">
+        <%= link_to categories_path do %>
+          <i class="fa-solid fa-arrow-left-long"></i>
+        <% end %>
+        <h2 class="text-2xl">CATEGORY</h2>
+        <p>Category</p>
+      </div>
+
+      <%= form_with model: @category, html: { class: "p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center" } do |f| %>
         <div class="font-bold flex justify-between w-full text-accent">
-          <%= f.label :name, "Name" %>
-          <%= f.text_field :name, required: true, placeholder: "Grocery", class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+          <%= f.text_field :name, required: true, placeholder: "Category", class: "border-2 w-full bg-white text-black" %>
         </div>
         <div class="font-bold flex justify-between w-full text-accent">
-          <%= f.label :icon, "Icon" %>
-          <%= f.select :icon, Category::ICONS.invert, { include_blank: true }, { required: true, class: "rounded-full border-none w-3/4 bg-neutral text-white" } %>
+          <%= f.select :icon, { "None" => nil }.merge(Category::ICONS.invert), { include_blank: true }, { required: true, class: "border-2 w-full bg-white text-black" } %>
         </div>
-        <div class="font-bold bg-secondary hover:bg-secondary-focus px-4 py-1">
+        <div class="font-bold bg-primary hover:bg-primary-focus px-4 py-1 my-2 text-white">
           <%= f.submit "Save" %>
         </div>
       <% end %>

diff --git a/app/views/categories/show.html.erb b/app/views/categories/show.html.erb
@@ -1,4 +1,4 @@
-<div class="w-full text-accent h-screen flex flex-col justify-between  bg-neutral-focus">
+<div class="w-full text-accent h-screen flex flex-col  bg-neutral-focus relative">
 
   <div class="bg-primary p-5 mb-4 w-full flex flex-col gap-2">
 
@@ -58,9 +58,7 @@
 
   </ul>
 
-  <%= turbo_frame_tag "new_transaction" do %>
-  <% end %>
-  <div class="w-full flex justify-center items-center bg-secondary p-2">
-     <%= link_to "Add Transaction", new_category_item_path(@category), class: "text-white w-5/6 ring-2 ring-white max-w-md py-2 text-center font-bold" %>
+  <div class="w-full flex justify-center items-center bg-secondary p-2 absolute bottom-0">
+     <%= link_to "Add Transaction", new_category_item_path(@category), class: "text-white w-full ring-2 ring-white max-w-md py-2 text-center font-bold" %>
   </div>
 </div>
diff --git a/app/views/devise/registrations/new.html.erb b/app/views/devise/registrations/new.html.erb
@@ -1,42 +1,41 @@
-<div class="w-full flex justify-center items-center h-full">
-  <div class="flex flex-col items-center bg-white w-max">
-
-    <h2 class="font-bold text-secondary text-2xl">Sign up</h2>
-
-    <%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { class: "p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center gap-2" }) do |f| %>
+<div class="w-full">
+  <div class="flex flex-col items-center">
+
+    <div class="bg-primary w-full justify-center p-5 text-white flex justify-between items-center">
+      <%= link_to unauthenticated_root_path do %>
+        <i class="fa-solid fa-arrow-left-long"></i>
+      <% end %>
+      <h2 class="text-2xl">SIGN UP</h2>
+      <p>Sign Up</p>
+    </div>
+
+    <%= form_for(resource, as: resource_name, url: registration_path(resource_name), html: { class: "p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center" }) do |f| %>
       <%= render "devise/shared/error_messages", resource: resource %>
 
       <div class="font-bold flex flex-col w-full text-accent items-center">
-        <%= f.label :name %>
-        <%= f.text_field :name, autofocus: true, autocomplete: "name", required: true, class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+        <%= f.text_field :name, autofocus: true, autocomplete: "name", placeholder: "name",required: true, class: "border-2 w-full bg-white text-white my-1" %>
       </div>
 
       <div class="font-bold flex flex-col w-full text-accent items-center">
-        <%= f.label :email %>
-        <%= f.email_field :email, autofocus: true, autocomplete: "email", required: true, class: "rounded-full border-none w-3/4 bg-neutral text-white w-min" %>
+        <%= f.email_field :email, autofocus: true, autocomplete: "email", placeholder: "email", required: true, class: "border-2 w-full bg-white text-white my-1" %>
       </div>
 
       <div class="font-bold flex flex-col w-full text-accent items-center">
-        <div class="flex">
-          <%= f.label :password %>
-          <% if @minimum_password_length %>
-            <em>(<%= @minimum_password_length %> characters minimum)</em>
-          <% end %>
-        </div>
-        <%= f.password_field :password, autocomplete: "new-password", required: true, class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+        <%= f.password_field :password, autocomplete: "new-password", placeholder: "password", required: true, class: "border-2 w-full bg-white text-white my-1" %>
       </div>
 
       <div class="font-bold flex flex-col w-full text-accent items-center">
-        <%= f.label :password_confirmation %>
-        <%= f.password_field :password_confirmation, autocomplete: "new-password", required: true, class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+        <%= f.password_field :password_confirmation, autocomplete: "new-password", placeholder: "confirm password", required: true, class: "border-2 w-full bg-white text-white mb-2" %>
       </div>
 
-      <div class="font-bold bg-secondary hover:bg-secondary-focus px-4 py-1">
+      <div class="font-bold bg-primary hover:bg-primary-focus px-4 py-1 text-white my-2">
         <%= f.submit "Sign up" %>
       </div>
     <% end %>
 
-    <%= render "devise/shared/links" %>
+    <div class="flex flex-col gap-1 justify-center items-center">
+      <%= render "devise/shared/links" %>
+    </div>
   </div>
 </div>
 
diff --git a/app/views/devise/sessions/new.html.erb b/app/views/devise/sessions/new.html.erb
@@ -1,31 +1,38 @@
-<div class="w-full flex justify-center items-center h-full">
-  <div class="flex flex-col items-center bg-white w-max">
-    <h2 class="font-bold text-secondary text-2xl">Log in</h2>
+<div class="w-full ">
+  <div class="flex flex-col items-center">
+    <div class="bg-primary w-full justify-center p-5 text-white flex justify-between items-center">
+       <%= link_to unauthenticated_root_path do %>
+          <i class="fa-solid fa-arrow-left-long"></i>
+        <% end %>
+      <h2 class="text-2xl">Log in</h2>
+      <p>Log In</p>
+    </div>
+
+    <%= form_for(resource, as: resource_name, url: session_path(resource_name), html: { class: "px-2 my-2 text-lg w-full max-w-sm flex flex-col items-center " }) do |f| %>
 
-    <%= form_for(resource, as: resource_name, url: session_path(resource_name), html: { class: "p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center gap-2" }) do |f| %>
       <div class="font-bold flex flex-col w-full text-accent items-center">
-        <%= f.label :email %>
-        <%= f.email_field :email, autofocus: true, autocomplete: "email", class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+        <%= f.email_field :email, autofocus: true, placeholder: "email", autocomplete: "email", class: "border-2 w-full bg-white text-black" %>
       </div>
 
       <div class="font-bold flex flex-col w-full text-accent items-center">
-        <%= f.label :password %>
-        <%= f.password_field :password, autocomplete: "current-password", class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+        <%= f.password_field :password, placeholder: "password", autocomplete: "current-password", class: "border-2 w-full bg-white text-black" %>
       </div>
 
       <% if devise_mapping.rememberable? %>
-        <div class="font-bold flex w-full text-accent justify-center items-center gap-2">
+        <div class="font-bold flex w-full text-accent items-center gap-2">
           <%= f.check_box :remember_me %>
           <%= f.label :remember_me %>
         </div>
       <% end %>
 
-      <div class="font-bold bg-secondary hover:bg-secondary-focus px-4 py-1">
+      <div class="font-bold bg-primary hover:bg-primary-focus px-4 py-1 text-white">
         <%= f.submit "Log in" %>
       </div>
 
     <% end %>
 
-    <%= render "devise/shared/links" %>
+    <div class="flex flex-col gap-1 justify-center items-center">
+      <%= render "devise/shared/links" %>
+    </div>
   </div>
 </div>
diff --git a/app/views/items/edit.html.erb b/app/views/items/edit.html.erb
@@ -1,21 +1,22 @@
-<%= turbo_frame_tag "edit_transaction" do %>
-<% end %>
-
 <div>
-  <div>
-    <%= link_to "<< Back", category_path(@category), class: "text-lg text-bold text-primary-focus" %>
-  </div>
   <div class="flex flex-col items-center">
-    <%= form_with(model: @item, url: category_item_path(@category), method: :patch, html: { class: "bg-white p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center gap-2" } ) do |f| %>
+
+  <div class="bg-primary w-full justify-center p-5 text-white flex justify-between items-center">
+    <%= link_to category_path(@category) do %>
+      <i class="fa-solid fa-arrow-left-long"></i>
+    <% end %>
+    <h2 class="text-2xl">TRANSACTION</h2>
+    <p>Transaction</p>
+  </div>
+
+    <%= form_with(model: @item, url: category_item_path(@category), method: :patch, html: { class: "p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center " } ) do |f| %>
       <div class="font-bold flex justify-between w-full text-accent ">
-        <%= f.label :name %>
-        <%= f.text_field :name, class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+        <%= f.text_field :name, class: "border-2 w-full bg-white text-black" %>
       </div>
       <div class="font-bold flex justify-between w-full text-accent">
-        <%= f.label :amount %>
-        <%= f.number_field :amount, class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+        <%= f.number_field :amount, class: "border-2 w-full bg-white text-black" %>
       </div>
-      <div class="font-bold bg-secondary hover:bg-secondary-focus px-4 py-1">
+      <div class="font-bold bg-primary hover:bg-primary-focus px-4 py-1 my-2 text-white">
         <%= f.submit "Save" %>
       </div>
     <% end %>

diff --git a/app/views/items/new.html.erb b/app/views/items/new.html.erb
@@ -1,21 +1,22 @@
-<%= turbo_frame_tag "new_transaction" do %>
-<% end %>
-
 <div>
-  <div>
-    <%= link_to "<< Back", category_path(@category), class: "text-lg text-bold text-primary-focus" %>
-  </div>
   <div class="flex flex-col items-center">
-      <%= form_with(model: @item, url: category_items_path(@category), html: { class: "bg-white p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center gap-2" }) do |f| %>
+
+    <div class="bg-primary w-full justify-center p-5 text-white flex justify-between items-center">
+      <%= link_to category_path(@category) do %>
+        <i class="fa-solid fa-arrow-left-long"></i>
+      <% end %>
+      <h2 class="text-2xl">TRANSACTION</h2>
+      <p>Transaction</p>
+    </div>
+
+      <%= form_with(model: @item, url: category_items_path(@category), html: { class: "p-2 my-2 text-lg w-full max-w-sm flex flex-col items-center" }) do |f| %>
         <div class="font-bold flex justify-between w-full text-accent">
-          <%= f.label :name %>
-          <%= f.text_field :name, required: true, class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+          <%= f.text_field :name, required: true, placeholder: "name", class: "border-2 w-full bg-white text-black" %>
         </div>
         <div class="font-bold flex justify-between w-full text-accent">
-          <%= f.label :amount %>
-          <%= f.number_field :amount, required: true, class: "rounded-full border-none w-3/4 bg-neutral text-white" %>
+          <%= f.number_field :amount, required: true, placeholder: "amount", class: "border-2 w-full bg-white text-black" %>
         </div>
-        <div class="font-bold bg-secondary hover:bg-secondary-focus px-4 py-1">
+        <div class="font-bold bg-primary hover:bg-primary-focus px-4 py-1 my-2 text-white">
           <%= f.submit "Save" %>
         </div>
     <% end %>

diff --git a/app/views/users/splash.html.erb b/app/views/users/splash.html.erb
@@ -4,9 +4,11 @@
     <h2 class="font-bold text-primary text-2xl"> Smart Wallet </h2>
   </div>
 
-  <div class="flex flex-col items-center justify-center gap-2">
-    <%= button_to "LOG IN", new_user_session_path, class: "bg-primary text-white px-7 py-2" %>
-    <%= button_to "SIGN UP", new_user_registration_path, class: "hover:bg-neutral-focus px-7 py-2" %>
+  <div class="flex justify-center w-full ">
+    <div class="w-5/6 flex-col items-center gap-2 max-w-sm">
+      <%= link_to "LOG IN", new_user_session_path, class: "w-full bg-primary text-white text-center flex justify-center py-2" %>
+      <%= button_to "SIGN UP", new_user_registration_path, class: "w-full text-center flex justify-center py-2" %>
+    </div>
   </div>
 
 </div>