From 3adc1917f6fab83aa9670d78366a243de093368d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?R=C3=A2u=20Cao?= <raucao@kip.pe>
Date: Tue, 27 Jun 2023 19:18:33 +0200
Subject: [PATCH] Improve outline button style, use everywhere

---
 app/assets/stylesheets/components/buttons.css         | 8 ++++----
 app/views/admin/settings/services/_discourse.html.erb | 6 +++---
 app/views/invitations/index.html.erb                  | 2 +-
 app/views/services/lightning/index.html.erb           | 6 +++---
 app/views/settings/_account.html.erb                  | 4 ++--
 app/views/settings/_profile.html.erb                  | 6 +++---
 6 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/app/assets/stylesheets/components/buttons.css b/app/assets/stylesheets/components/buttons.css
index d8730db..b879634 100644
--- a/app/assets/stylesheets/components/buttons.css
+++ b/app/assets/stylesheets/components/buttons.css
@@ -14,12 +14,12 @@
     @apply py-1 px-2 text-sm;
   }
 
-  .btn-outline {
-    @apply border-2 border-gray-100 hover:bg-gray-100;
+  .btn-icon {
+    @apply py-2 px-3;
   }
 
-  .btn-icon {
-    @apply px-3;
+  .btn-outline {
+    @apply py-2 border-2 border-gray-100 hover:bg-gray-100;
   }
 
   .btn-gray {
diff --git a/app/views/admin/settings/services/_discourse.html.erb b/app/views/admin/settings/services/_discourse.html.erb
index a4b557f..63cd589 100644
--- a/app/views/admin/settings/services/_discourse.html.erb
+++ b/app/views/admin/settings/services/_discourse.html.erb
@@ -30,14 +30,14 @@
       <input type="text" class="grow" disabled="disabled"
              value="https://<%= Setting.accounts_domain %>/discourse/connect"
              data-clipboard-target="source" />
-      <button class="btn-md btn-icon btn-blue shrink-0"
+      <button class="btn-md btn-icon btn-outline shrink-0"
               data-clipboard-target="trigger" data-action="clipboard#copy"
               title="Copy to clipboard">
         <span class="content-initial">
-          <%= render partial: "icons/copy", locals: { custom_class: "text-white h-4 w-4 inline" } %>
+          <%= render partial: "icons/copy", locals: { custom_class: "text-blue-600 h-4 w-4 inline" } %>
         </span>
         <span class="content-active hidden">
-          <%= render partial: "icons/check", locals: { custom_class: "text-white h-4 w-4 inline" } %>
+          <%= render partial: "icons/check", locals: { custom_class: "text-blue-600 h-4 w-4 inline" } %>
         </span>
       </button>
     </li>
diff --git a/app/views/invitations/index.html.erb b/app/views/invitations/index.html.erb
index e54ee68..f78851e 100644
--- a/app/views/invitations/index.html.erb
+++ b/app/views/invitations/index.html.erb
@@ -8,7 +8,7 @@
       </p>
       <ul class="md:w-3/4">
         <% @invitations_unused.each do |invitation| %>
-          <li class="mb-2 flex gap-1" data-controller="clipboard modal">
+          <li class="mb-3 flex gap-1" data-controller="clipboard modal">
             <input type="text" disabled class="relative grow font-mono"
                    value="<%= invitation_url(invitation.token) %>"
                    data-clipboard-target="source" />
diff --git a/app/views/services/lightning/index.html.erb b/app/views/services/lightning/index.html.erb
index 58a7c12..982fee1 100644
--- a/app/views/services/lightning/index.html.erb
+++ b/app/views/services/lightning/index.html.erb
@@ -16,14 +16,14 @@
       <input type="text" id="user_address" class="grow"
              value=<%= current_user.address %> disabled="disabled"
              data-clipboard-target="source" />
-      <button id="copy-user-address" class="btn-md btn-icon btn-blue shrink-0"
+      <button id="copy-user-address" class="btn-md btn-icon btn-outline shrink-0"
               data-clipboard-target="trigger" data-action="clipboard#copy"
               title="Copy to clipboard">
         <span class="content-initial">
-          <%= render partial: "icons/copy", locals: { custom_class: "text-white h-4 w-4 inline" } %>
+          <%= render partial: "icons/copy", locals: { custom_class: "text-blue-600 h-4 w-4 inline" } %>
         </span>
         <span class="content-active hidden">
-          <%= render partial: "icons/check", locals: { custom_class: "text-white h-4 w-4 inline" } %>
+          <%= render partial: "icons/check", locals: { custom_class: "text-blue-600 h-4 w-4 inline" } %>
         </span>
       </button>
     </p>
diff --git a/app/views/settings/_account.html.erb b/app/views/settings/_account.html.erb
index 5726230..b1b3430 100644
--- a/app/views/settings/_account.html.erb
+++ b/app/views/settings/_account.html.erb
@@ -13,13 +13,13 @@
             'settings--account--email-target': 'emailField'
           }, required: true %>
       <button type="button" id="edit-email"
-              class="btn-md btn-icon btn-blue shrink-0 hidden initial-visible"
+              class="btn-md btn-icon btn-outline shrink-0 hidden initial-visible"
               data-settings--account--email-target="editEmailButton"
               data-action="settings--account--email#editEmail"
               title="Edit email address">
         <span class="">
           <%= render partial: "icons/edit-3", locals: {
-                custom_class: "text-white h-4 w-4 inline" } %>
+                custom_class: "text-blue-600 h-4 w-4 inline" } %>
         </span>
       </button>
     </p>
diff --git a/app/views/settings/_profile.html.erb b/app/views/settings/_profile.html.erb
index e72430c..b3424aa 100644
--- a/app/views/settings/_profile.html.erb
+++ b/app/views/settings/_profile.html.erb
@@ -7,14 +7,14 @@
     <input type="text" id="user_address" class="grow"
            value=<%= @user.address %> disabled="disabled"
            data-clipboard-target="source" />
-    <button id="copy-user-address" class="btn-md btn-icon btn-blue shrink-0"
+    <button id="copy-user-address" class="btn-md btn-icon btn-outline shrink-0"
             data-clipboard-target="trigger" data-action="clipboard#copy"
             title="Copy to clipboard">
       <span class="content-initial">
-        <%= render partial: "icons/copy", locals: { custom_class: "text-white h-4 w-4 inline" } %>
+        <%= render partial: "icons/copy", locals: { custom_class: "text-blue-600  h-4 w-4 inline" } %>
       </span>
       <span class="content-active hidden">
-        <%= render partial: "icons/check", locals: { custom_class: "text-white h-4 w-4 inline" } %>
+        <%= render partial: "icons/check", locals: { custom_class: "text-blue-600  h-4 w-4 inline" } %>
       </span>
     </button>
   </p>