Use semantic HTML classes in table actions

Note the CSS could probably be improved to avoid duplication with other
button style definitions. However, that's fine because we're going to
change the style of the links soon.

For the same reason, I haven't bothered to style every single link the
way it was until now.

app/assets/stylesheets/admin/table_actions.scss

@@ -9,4 +9,17 @@
   > p {
     align-self: flex-start;
   }
+
+  a {
+    @include button($style: hollow);
+    border-color: $link !important;
+    color: $link !important;
+    font-size: $base-font-size;
+    margin-bottom: 0;
+
+    &.destroy-link {
+      border-color: $alert-color !important;
+      color: $alert-color !important;
+    }
+  }
 }

app/components/admin/budgets/table_actions_component.html.erb

@@ -1,10 +1,14 @@
 <%= render Admin::TableActionsComponent.new(budget, actions: [:edit], edit_text: t("admin.budgets.index.edit_budget")) do %>
   <%= link_to t("admin.budgets.index.budget_investments"),
                  admin_budget_budget_investments_path(budget_id: budget.id),
-                 class: "button hollow medium" %>
-  <%= link_to t("admin.budgets.index.edit_groups"), admin_budget_groups_path(budget) %>
+                 class: "investments-link" %>
+  <%= link_to t("admin.budgets.index.edit_groups"),
+                 admin_budget_groups_path(budget),
+                 class: "groups-link" %>
   <% if budget.poll.present? %>
-    <%= link_to t("admin.budgets.index.admin_ballots"), admin_poll_booth_assignments_path(budget.poll) %>
+    <%= link_to t("admin.budgets.index.admin_ballots"),
+                admin_poll_booth_assignments_path(budget.poll),
+                class: "ballots-link" %>
   <% else %>
     <%= link_to_create_budget_poll %>
   <% end %>

app/components/admin/budgets/table_actions_component.rb

@@ -13,10 +13,12 @@ class Admin::Budgets::TableActionsComponent < ApplicationComponent
 
       link_to t("admin.budgets.index.admin_ballots"),
         admin_polls_path(poll: {
-        name:      budget.name,
-        budget_id: budget.id,
-        starts_at: balloting_phase.starts_at,
-        ends_at:   balloting_phase.ends_at }),
+          name:      budget.name,
+          budget_id: budget.id,
+          starts_at: balloting_phase.starts_at,
+          ends_at:   balloting_phase.ends_at
+        }),
+        class: "ballots-link",
         method: :post
     end
 end

app/components/admin/hidden_table_actions_component.html.erb

@@ -2,11 +2,11 @@
   <%= link_to restore_text, restore_path,
     method: :put,
     data: { confirm: t("admin.actions.confirm") },
-    class: "button hollow warning" %>
+    class: "restore-link" %>
 
   <% unless record.confirmed_hide? %>
     <%= link_to confirm_hide_text, confirm_hide_path,
       method: :put,
-      class: "button" %>
+      class: "confirm-hide-link" %>
   <% end %>
 <% end %>

app/components/admin/organizations/table_actions_component.html.erb

@@ -2,12 +2,12 @@
   <% if can_verify? %>
     <%= link_to t("admin.organizations.index.verify"),
       verify_admin_organization_path(organization, request.query_parameters),
-      method: :put, class: "button success small-5" %>
+      method: :put, class: "verify-link" %>
   <% end %>
 
   <% if can_reject? %>
     <%= link_to t("admin.organizations.index.reject"),
       reject_admin_organization_path(organization, request.query_parameters),
-      method: :put, class: "button hollow alert small-5" %>
+      method: :put, class: "reject-link" %>
   <% end %>
 <% end %>

app/components/admin/poll/officers/officers_component.html.erb

@@ -3,7 +3,7 @@
     <tr>
       <th><%= t("admin.poll_officers.officer.name") %></th>
       <th><%= t("admin.poll_officers.officer.email") %></th>
-      <th class="small-3"><%= t("admin.actions.actions") %></th>
+      <th><%= t("admin.actions.actions") %></th>
     </tr>
   </thead>
   <tbody>
@@ -19,14 +19,15 @@
           <% if officer.persisted? %>
             <%= render Admin::TableActionsComponent.new(officer,
               actions: [:destroy],
-              destroy_text: t("admin.poll_officers.officer.delete")
+              destroy_text: t("admin.poll_officers.officer.delete"),
+              destroy_options: { class: "destroy-officer-link" }
             ) %>
           <% else %>
             <%= render Admin::TableActionsComponent.new(actions: []) do |actions| %>
               <%= actions.link_to t("admin.poll_officers.officer.add"),
                                   add_user_path(officer),
                                   method: :post,
-                                  class: "button success expanded" %>
+                                  class: "create-officer-link" %>
             <% end %>
           <% end %>
         </td>

app/components/admin/roles/table_actions_component.html.erb

@@ -1,7 +1,10 @@
 <% if already_has_role? %>
-  <%= render Admin::TableActionsComponent.new(record, actions: actions) %>
+  <%= render Admin::TableActionsComponent.new(record,
+    actions: actions,
+    destroy_options: { class: "destroy-role-link" }
+  ) %>
 <% else %>
   <%= render Admin::TableActionsComponent.new(actions: []) do %>
-    <%= link_to add_user_text, add_user_path, method: :post, class: "button success expanded" %>
+    <%= link_to add_user_text, add_user_path, method: :post, class: "create-role-link" %>
   <% end %>
 <% end %>

app/components/admin/table_actions_component.rb

@@ -22,7 +22,7 @@ class Admin::TableActionsComponent < ApplicationComponent
     end
 
     def edit_options
-      { class: "button hollow" }.merge(options[:edit_options] || {})
+      { class: "edit-link" }.merge(options[:edit_options] || {})
     end
 
     def destroy_text
@@ -36,7 +36,7 @@ class Admin::TableActionsComponent < ApplicationComponent
     def destroy_options
       {
         method: :delete,
-        class: "button hollow alert",
+        class: "destroy-link",
         data: { confirm: destroy_confirmation }
       }.merge(options[:destroy_options] || {})
     end

app/views/admin/admin_notifications/index.html.erb

@@ -9,7 +9,7 @@
         <th><%= t("admin.admin_notifications.index.title") %></th>
         <th><%= t("admin.admin_notifications.index.segment_recipient") %></th>
         <th><%= t("admin.admin_notifications.index.sent") %></th>
-        <th class="small-5"><%= t("admin.admin_notifications.index.actions") %></th>
+        <th><%= t("admin.admin_notifications.index.actions") %></th>
       </tr>
     </thead>
     <tbody>
@@ -33,13 +33,13 @@
             <%= render Admin::TableActionsComponent.new(admin_notification) do |actions| %>
               <%= actions.link_to t("admin.admin_notifications.index.preview"),
                                   admin_admin_notification_path(admin_notification),
-                                  class: "button" %>
+                                  class: "preview-link" %>
             <% end %>
           <% else %>
             <%= render Admin::TableActionsComponent.new(actions: []) do |actions| %>
               <%= actions.link_to t("admin.admin_notifications.index.view"),
                                   admin_admin_notification_path(admin_notification),
-                                  class: "button" %>
+                                  class: "show-link" %>
             <% end %>
           <% end %>
         </td>

app/views/admin/administrators/search.html.erb

@@ -10,7 +10,7 @@
       <thead>
         <th scope="col"><%= t("admin.administrators.index.name") %></th>
         <th scope="col"><%= t("admin.administrators.index.email") %></th>
-        <th scope="col" class="small-3"><%= t("admin.shared.actions") %></th>
+        <th scope="col"><%= t("admin.shared.actions") %></th>
       </thead>
       <tbody>
         <% @users.each do |user| %>

app/views/admin/audits/_audits.html.erb

@@ -37,7 +37,7 @@
               <%= render Admin::TableActionsComponent.new(actions: []) do |actions| %>
                 <%= actions.link_to t("shared.show"),
                   admin_polymorphic_path(audit),
-                  class: "button hollow primary" %>
+                  class: "show-link" %>
               <% end %>
             </td>
           </tr>

app/views/admin/banners/index.html.erb

@@ -13,7 +13,7 @@
       <tr id="<%= dom_id(banner) %>">
         <th scope="col"><%= Banner.human_attribute_name(:post_started_at) %></th>
         <th scope="col"><%= Banner.human_attribute_name(:post_ended_at) %></th>
-        <th scope="col" class="small-4"><%= t("admin.actions.actions") %></th>
+        <th scope="col"><%= t("admin.actions.actions") %></th>
       </tr>
     </thead>
     <tbody>

app/views/admin/budget_groups/index.html.erb

@@ -28,7 +28,8 @@
           <td>
             <%= render Admin::TableActionsComponent.new(group) do |actions| %>
               <%= actions.link_to t("admin.budget_groups.headings_manage"),
-                                  admin_budget_group_headings_path(@budget, group) %>
+                                  admin_budget_group_headings_path(@budget, group),
+                                  class: "headings-link" %>
             <% end %>
           </td>
         </tr>

app/views/admin/dashboard/actions/index.html.erb

@@ -17,7 +17,7 @@
       <th class="text-center"><%= t("admin.dashboard.actions.index.day_offset") %></th>
       <th class="text-center"><%= t("admin.dashboard.actions.index.required_supports") %></th>
       <th class="text-center"><%= t("admin.dashboard.actions.index.order") %></th>
-      <th class="small-3"><%= t("admin.actions.actions") %></th>
+      <th><%= t("admin.actions.actions") %></th>
     </tr>
   </thead>
 

app/views/admin/geozones/index.html.erb

@@ -10,7 +10,7 @@
       <th><%= t("admin.geozones.geozone.external_code") %></th>
       <th><%= t("admin.geozones.geozone.census_code") %></th>
       <th><%= t("admin.geozones.geozone.coordinates") %></th>
-      <th class="small-3"><%= t("admin.actions.actions") %></th>
+      <th><%= t("admin.actions.actions") %></th>
     </tr>
   </thead>
 

app/views/admin/managers/search.html.erb

@@ -10,7 +10,7 @@
       <thead>
         <th scope="col"><%= t("admin.managers.index.name") %></th>
         <th scope="col"><%= t("admin.managers.index.email") %></th>
-        <th scope="col" class="small-3"><%= t("admin.shared.actions") %></th>
+        <th scope="col"><%= t("admin.shared.actions") %></th>
       </thead>
       <tbody>
       <% @users.each do |user| %>

app/views/admin/milestones/_milestones.html.erb

@@ -53,7 +53,7 @@
               <% end %>
             <% end %>
           </td>
-          <td class="small-2">
+          <td>
             <%= render Admin::TableActionsComponent.new(milestone,
               destroy_text: t("admin.milestones.index.delete")
             ) %>

app/views/admin/moderators/search.html.erb

@@ -10,7 +10,7 @@
       <thead>
         <th scope="col"><%= t("admin.moderators.index.name") %></th>
         <th scope="col" class="small-6"><%= t("admin.moderators.index.email") %></th>
-        <th scope="col" class="small-3"><%= t("admin.shared.actions") %></th>
+        <th scope="col"><%= t("admin.shared.actions") %></th>
       </thead>
       <tbody>
       <% @users.each do |user| %>

app/views/admin/newsletters/index.html.erb

@@ -9,7 +9,7 @@
         <th class="small-2"><%= t("admin.newsletters.index.subject") %></th>
         <th><%= t("admin.newsletters.index.segment_recipient") %></th>
         <th><%= t("admin.newsletters.index.sent") %></th>
-        <th class="small-5"><%= t("admin.newsletters.index.actions") %></th>
+        <th><%= t("admin.newsletters.index.actions") %></th>
       </tr>
     </thead>
     <tbody>
@@ -32,7 +32,7 @@
           <%= render Admin::TableActionsComponent.new(newsletter) do |actions| %>
             <%= actions.link_to t("admin.newsletters.index.preview"),
                                 admin_newsletter_path(newsletter),
-                                class: "button" %>
+                                class: "preview-link" %>
           <% end %>
         </td>
       </tr>

app/views/admin/poll/booth_assignments/_booth_assignment.html.erb

@@ -31,8 +31,7 @@
                             admin_poll_booth_assignments_path(@poll, booth_id: booth.id),
                             method: :post,
                             remote: true,
-                            title: t("admin.booth_assignments.manage.actions.assign"),
-                            class: "button hollow expanded" %>
+                            class: "assign-booth-link" %>
       <% end %>
     <% end %>
   </td>

app/views/admin/poll/booths/_booth.html.erb

@@ -10,7 +10,7 @@
       <%= render Admin::TableActionsComponent.new(actions: []) do |actions| %>
         <%= actions.link_to t("admin.booths.booth.shifts"),
                             new_admin_booth_shift_path(booth),
-                            class: "button hollow" %>
+                            class: "shifts-link" %>
       <% end %>
     <% else %>
       <%= render Admin::TableActionsComponent.new(booth,

app/views/admin/poll/polls/_poll.html.erb

@@ -14,7 +14,7 @@
     ) do |actions| %>
       <%= actions.link_to t("admin.actions.configure"),
                           admin_poll_path(poll),
-                          class: "button hollow " %>
+                          class: "configure-link" %>
     <% end %>
   </td>
 </tr>

app/views/admin/poll/polls/_questions.html.erb

@@ -8,11 +8,11 @@
     <%= t("admin.polls.show.no_questions") %>
   </div>
 <% else %>
-  <table class="fixed margin">
+  <table class="margin">
     <thead>
       <tr>
         <th><%= t("admin.polls.show.table_title") %></th>
-        <th class="small-6"><%= t("admin.actions.actions") %></th>
+        <th><%= t("admin.actions.actions") %></th>
       </tr>
     </thead>
     <% @poll.questions.each do |question| %>
@@ -30,7 +30,7 @@
         <td>
           <%= render Admin::TableActionsComponent.new(question) do |actions| %>
             <%= actions.link_to t("admin.polls.show.edit_answers"), admin_question_path(question),
-                                                                    class: "button hollow" %>
+                                                                    class: "answers-link" %>
           <% end %>
         </td>
       </tr>

app/views/admin/poll/polls/booth_assignments.html.erb

@@ -18,7 +18,7 @@
             <%= render Admin::TableActionsComponent.new(actions: []) do |actions| %>
               <%= actions.link_to t("admin.booth_assignments.manage_assignments"),
                                   manage_admin_poll_booth_assignments_path(poll),
-                                  class: "button hollow" %>
+                                  class: "manage-link" %>
             <% end %>
           </td>
         </tr>

app/views/admin/poll/questions/_questions.html.erb

@@ -7,12 +7,12 @@
     <%= t("admin.questions.index.no_questions") %>
   </div>
 <% else %>
-  <table class="fixed">
+  <table>
     <thead>
       <tr>
         <th><%= t("admin.questions.index.table_question") %></th>
         <th><%= t("admin.questions.index.table_poll") %></th>
-        <th class="small-4"><%= t("admin.actions.actions") %></th>
+        <th><%= t("admin.actions.actions") %></th>
       </tr>
     </thead>
     <tbody>
@@ -29,7 +29,7 @@
           <td>
             <%= render Admin::TableActionsComponent.new(question) do |actions| %>
               <%= actions.link_to t("admin.polls.show.edit_answers"), admin_question_path(question),
-                                                                      class: "button hollow" %>
+                                                                      class: "answers-link" %>
             <% end %>
           </td>
         </tr>

app/views/admin/poll/questions/_successful_proposals.html.erb

@@ -1,4 +1,4 @@
-<table class="fixed">
+<table>
   <thead>
     <tr>
       <th class="small-9"><%= t("admin.questions.index.table_proposal") %></th>
@@ -16,10 +16,10 @@
         </td>
         <td>
           <%= render Admin::TableActionsComponent.new(actions: []) do |actions| %>
-            <%= actions.link_to t("admin.shared.view"), proposal_path(proposal), class: "button hollow" %>
+            <%= actions.link_to t("admin.shared.view"), proposal_path(proposal), class: "show-link" %>
             <%= actions.link_to t("admin.questions.index.create_question"),
                   new_admin_question_path(proposal_id: proposal.id),
-                  class: "button hollow" %>
+                  class: "new-link" %>
           <% end %>
         </td>
       </tr>

app/views/admin/poll/questions/answers/documents.html.erb

@@ -44,7 +44,7 @@
                                   document.attachment.url,
                                   target: "_blank",
                                   rel: "nofollow",
-                                  class: "button hollow" %>
+                                  class: "download-link" %>
 
             <% end %>
           </td>

app/views/admin/poll/shifts/_shifts.html.erb

@@ -1,5 +1,5 @@
 <h3><%= t("admin.poll_shifts.new.shifts") %></h3>
-<table class="fixed">
+<table>
   <thead>
     <tr>
       <th><%= t("admin.poll_shifts.new.date") %></th>

app/views/admin/site_customization/pages/index.html.erb

@@ -16,7 +16,7 @@
         <th><%= t("admin.site_customization.pages.page.created_at") %></th>
         <th><%= t("admin.site_customization.pages.page.updated_at") %></th>
         <th><%= t("admin.site_customization.pages.page.status") %></th>
-        <th class="small-4"><%= t("admin.actions.actions") %></th>
+        <th><%= t("admin.actions.actions") %></th>
       </tr>
     </thead>
     <tbody>
@@ -31,13 +31,13 @@
           <%= render Admin::TableActionsComponent.new(page) do |actions| %>
             <%= actions.link_to t("admin.site_customization.pages.page.see_cards"),
                                 admin_site_customization_page_cards_path(page),
-                                class: "button hollow expanded" %>
+                                class: "cards-link" %>
 
             <% if page.status == "published" %>
               <%= actions.link_to t("admin.site_customization.pages.index.see_page"),
                                   page.url,
                                   target: "_blank",
-                                  class: "button hollow" %>
+                                  class: "show-link" %>
             <% end %>
           <% end %>
         </td>

app/views/admin/system_emails/index.html.erb

@@ -22,16 +22,16 @@
           <% if system_email_actions.include?("view") %>
             <%= actions.link_to t("admin.shared.view"),
                                 admin_system_email_view_path(system_email_title),
-                                class: "button hollow" %>
+                                class: "show-link" %>
           <% end %>
 
           <% if system_email_actions.include?("preview_pending") %>
             <%= actions.link_to t("admin.system_emails.preview_pending.action"),
                                 admin_system_email_preview_pending_path(system_email_title),
-                                class: "button" %>
+                                class: "preview-pending-link" %>
             <%= actions.link_to t("admin.system_emails.preview_pending.send_pending"),
                                 admin_system_email_send_pending_path(system_email_title),
-                                class: "button success",
+                                class: "send-pending-link",
                                 method: :put %>
           <% end %>
 

app/views/admin/valuators/_valuator_row.html.erb

@@ -22,7 +22,7 @@
     <%= render Admin::TableActionsComponent.new(valuator) do |actions| %>
       <%= actions.link_to t("admin.shared.view"),
         admin_valuator_path(valuator),
-        class: "button hollow" %>
+        class: "show-link" %>
     <% end %>
   </td>
 </tr>

app/views/admin/valuators/_valuators.html.erb

@@ -5,7 +5,7 @@
     <th scope="col"><%= t("admin.valuators.index.description") %></th>
     <th scope="col"><%= t("admin.valuators.index.group") %></th>
     <th scope="col"><%= t("admin.valuators.index.abilities") %></th>
-    <th scope="col" class="small-3"><%= t("admin.actions.actions") %></th>
+    <th scope="col"><%= t("admin.actions.actions") %></th>
   </thead>
   <tbody>
     <% valuators.each do |valuator| %>