From a1482ac409adbbaa1d674320cfa0822822b38d2d Mon Sep 17 00:00:00 2001
From: "J. Ryan Conklin" <jryanconklin@gmail.com>
Date: Thu, 27 Aug 2020 11:39:48 -0700
Subject: [PATCH] Style Update Drupal Menu Task Links (#923)

* task: update drupal task links

* task: run format
---
 .../navigation/menu-local-task.html.twig      |  4 ++--
 .../navigation/menu-local-tasks.html.twig     |  8 +++----
 .../_patterns/00-protons/tailwind.tokens.css  | 21 +++++++++++++++++++
 3 files changed, 26 insertions(+), 7 deletions(-)

diff --git a/apps/drupal-default/particle_theme/templates/navigation/menu-local-task.html.twig b/apps/drupal-default/particle_theme/templates/navigation/menu-local-task.html.twig
index c0decf8889..05f597f791 100644
--- a/apps/drupal-default/particle_theme/templates/navigation/menu-local-task.html.twig
+++ b/apps/drupal-default/particle_theme/templates/navigation/menu-local-task.html.twig
@@ -15,10 +15,10 @@
  */
 #}
 
-{% set link_classes = ['nav-link', is_active ? 'active']|join(' ') %}
+{% set link_classes = ['task-link', is_active ? 'task-link--active' : 'task-link--inactive']|join(' ') %}
 
 {# Merge attributes/classes into link #}
-<li {{ attributes.addClass('nav-item') }}>
+<li {{ attributes.addClass('mr-3') }}>
   {{
     link|merge({
       '#options': {
diff --git a/apps/drupal-default/particle_theme/templates/navigation/menu-local-tasks.html.twig b/apps/drupal-default/particle_theme/templates/navigation/menu-local-tasks.html.twig
index bacae2aa2a..899e6a884f 100644
--- a/apps/drupal-default/particle_theme/templates/navigation/menu-local-tasks.html.twig
+++ b/apps/drupal-default/particle_theme/templates/navigation/menu-local-tasks.html.twig
@@ -11,23 +11,21 @@
  * themed in menu-local-task.html.twig.
  */
 #}
-
-{% set nav_classes = ['nav', 'nav-tabs', 'mb-2']|join(' ') %}
+{% set list_classes = ['flex']|join(' ') %}
 
 {% if primary %}
   <h2 class="visually-hidden">
     {{ 'Primary tabs'|t }}
   </h2>
-  <ul class="{{ nav_classes }}">
+  <ul class="{{ list_classes }}">
     {{ primary }}
   </ul>
 {% endif %}
-
 {% if secondary %}
   <h2 class="visually-hidden">
     {{ 'Secondary tabs'|t }}
   </h2>
-  <ul class="{{ nav_classes }}">
+  <ul class="{{ list_classes }}">
     {{ secondary }}
   </ul>
 {% endif %}
diff --git a/source/default/_patterns/00-protons/tailwind.tokens.css b/source/default/_patterns/00-protons/tailwind.tokens.css
index ae6e3f2679..d51891a4cf 100644
--- a/source/default/_patterns/00-protons/tailwind.tokens.css
+++ b/source/default/_patterns/00-protons/tailwind.tokens.css
@@ -190,3 +190,24 @@ tr {
     @apply pb-16;
   }
 }
+
+/**
+ * Drupal Theme Overrides
+ */
+
+/* Menu-Local-Task Links */
+.task-link {
+  @apply inline-block border py-1 px-3;
+}
+
+.task-link--active {
+  @apply border-blue-500 bg-blue-500 text-white;
+}
+
+.task-link--inactive {
+  @apply border-white  text-blue-500;
+}
+
+.task-link--inactive:hover {
+  @apply border-gray-200 bg-gray-200;
+}