From aa6d755402f530fb3497cf2d2a998e9b618a2bc6 Mon Sep 17 00:00:00 2001
From: Zach Gollwitzer <zach@maybe.co>
Date: Mon, 16 Sep 2024 19:18:07 -0400
Subject: [PATCH] Fix styles on import modal (#1188)

* Fix styles on import modal

* Remove stale translations
---
 app/views/imports/_type_selector.html.erb | 83 ++++++++---------------
 config/locales/views/imports/en.yml       |  6 +-
 2 files changed, 31 insertions(+), 58 deletions(-)

diff --git a/app/views/imports/_type_selector.html.erb b/app/views/imports/_type_selector.html.erb
index 9f68c343..eac0476e 100644
--- a/app/views/imports/_type_selector.html.erb
+++ b/app/views/imports/_type_selector.html.erb
@@ -29,62 +29,37 @@
           <div class="pl-14 pr-3">
             <div class="h-px bg-alpha-black-50"></div>
           </div>
-          </li>
+        </li>
+      <% end %>
+      <li>
+        <%= link_to new_import_path, class: "flex items-center gap-3 p-4 group cursor-pointer", data: { turbo: false } do %>
+          <div class="bg-indigo-500/5 rounded-md w-8 h-8 flex items-center justify-center">
+            <%= lucide_icon("file-spreadsheet", class: "w-5 h-5 text-indigo-500") %>
+          </div>
+          <span class="text-sm text-gray-900 group-hover:text-gray-700">
+            <%= t(".import_from_csv") %>
+          </span>
+          <%= lucide_icon("chevron-right", class: "w-5 h-5 text-gray-500 ml-auto") %>
         <% end %>
-        <li>
-          <%= link_to new_import_path, class: "flex items-center gap-3 p-4 group cursor-pointer", data: { turbo: false } do %>
-            <div class="bg-indigo-500/5 rounded-md w-8 h-8 flex items-center justify-center">
-              <%= lucide_icon("file-spreadsheet", class: "w-5 h-5 text-indigo-500") %>
-            </div>
-            <span class="text-sm text-gray-900 group-hover:text-gray-700">
-              <%= t(".import_from_csv") %>
-            </span>
-            <%= lucide_icon("chevron-right", class: "w-5 h-5 text-gray-500 ml-auto") %>
-          <% end %>
 
-          <div class="pl-14 pr-3">
-            <div class="h-px bg-alpha-black-50"></div>
-          </div>
-        </li>
-        <li>
-          <div class="flex items-center gap-3 p-4 group cursor-not-allowed">
-            <%= image_tag("mint-logo.jpeg", alt: "Mint logo", class: "w-8 h-8 rounded-md") %>
-            <span class="text-sm text-gray-900 group-hover:text-gray-700">
-              <%= t(".import_from_mint") %>
-            </span>
-            <span class="bg-indigo-500/5 rounded-full px-1.5 py-0.5 border border-alpha-black-25 uppercase text-xs font-medium text-indigo-500"><%= t(".soon") %></span>
-            <%= lucide_icon("chevron-right", class: "w-5 h-5 text-gray-300 ml-auto") %>
-          </div>
+        <div class="pl-14 pr-3">
+          <div class="h-px bg-alpha-black-50"></div>
+        </div>
+      </li>
+      <li>
+        <div class="flex items-center gap-3 p-4 group cursor-not-allowed">
+          <%= image_tag("mint-logo.jpeg", alt: "Mint logo", class: "w-8 h-8 rounded-md") %>
+          <span class="text-sm text-gray-400">
+            <%= t(".import_from_mint") %>
+          </span>
+          <span class="bg-indigo-500/5 rounded-full px-1.5 py-0.5 border border-alpha-black-25 uppercase text-xs font-medium text-indigo-500"><%= t(".soon") %></span>
+          <%= lucide_icon("chevron-right", class: "w-5 h-5 text-gray-300 ml-auto") %>
+        </div>
 
-          <div class="pl-14 pr-3">
-            <div class="h-px bg-alpha-black-50"></div>
-          </div>
-        </li>
-        <li>
-          <div class="flex items-center gap-3 p-4 group cursor-not-allowed">
-            <%= image_tag("empower-logo.jpeg", alt: "Mint logo", class: "w-8 h-8 border border-alpha-black-100 rounded-md") %>
-            <span class="text-sm text-gray-900 group-hover:text-gray-700">
-              <%= t(".import_from_empower") %>
-            </span>
-            <span class="bg-indigo-500/5 rounded-full px-1.5 py-0.5 border border-alpha-black-25 uppercase text-xs font-medium text-indigo-500"><%= t(".soon") %></span>
-            <%= lucide_icon("chevron-right", class: "w-5 h-5 text-gray-300 ml-auto") %>
-          </div>
-
-          <div class="pl-14 pr-3">
-            <div class="h-px bg-alpha-black-50"></div>
-          </div>
-        </li>
-        <li>
-          <div class="flex items-center gap-3 p-4 group cursor-not-allowed">
-            <%= image_tag("apple-logo.png", alt: "Mint logo", class: "w-8 h-8 rounded-md") %>
-            <span class="text-sm text-gray-900 group-hover:text-gray-700">
-              <%= t(".import_from_apple") %>
-            </span>
-            <span class="bg-indigo-500/5 rounded-full px-1.5 py-0.5 border border-alpha-black-25 uppercase text-xs font-medium text-indigo-500"><%= t(".soon") %></span>
-            <%= lucide_icon("chevron-right", class: "w-5 h-5 text-gray-300 ml-auto") %>
-          </div>
-        </li>
-        </ul>
+        <div class="pl-14 pr-3">
+          <div class="h-px bg-alpha-black-50"></div>
+        </div>
+      </li>
+    </ul>
   </div>
-
 </div>
diff --git a/config/locales/views/imports/en.yml b/config/locales/views/imports/en.yml
index 37b11f4f..c459e2f5 100644
--- a/config/locales/views/imports/en.yml
+++ b/config/locales/views/imports/en.yml
@@ -95,11 +95,9 @@ en:
       import_published: Import has started in the background
       invalid_data: Your import is invalid
     type_selector:
-      description: You can manually import transactions from CSVs or from other financial
-        apps like Mint, Empower (formerly Personal Capital) or Apple Card.
-      import_from_apple: Import from Apple Card
+      description: You can manually import transactions from CSVs or other financial
+        apps like Mint.
       import_from_csv: New import from CSV
-      import_from_empower: Import from Empower
       import_from_mint: Import from Mint
       import_transactions: Import transactions
       resume_latest_import: Resume latest import