From d666a4da635dfbc1448e40faa094cf43338b7dc4 Mon Sep 17 00:00:00 2001 From: Oliver Davies Date: Sat, 13 Apr 2024 15:10:41 +0100 Subject: [PATCH] Style local tasks --- .../custom/opdavies/assets/tailwind.config.ts | 1 + .../navigation/menu-local-task.html.twig | 23 +++++++++++++++++ .../navigation/menu-local-tasks.html.twig | 25 +++++++++++++++++++ 3 files changed, 49 insertions(+) create mode 100644 web/themes/custom/opdavies/templates/navigation/menu-local-task.html.twig create mode 100644 web/themes/custom/opdavies/templates/navigation/menu-local-tasks.html.twig diff --git a/web/themes/custom/opdavies/assets/tailwind.config.ts b/web/themes/custom/opdavies/assets/tailwind.config.ts index b068086..a935515 100644 --- a/web/themes/custom/opdavies/assets/tailwind.config.ts +++ b/web/themes/custom/opdavies/assets/tailwind.config.ts @@ -16,6 +16,7 @@ export default { 400: "#60a5fa", }, current: "currentColor", + gray: colours.stone, grey: colours.stone, inherit: "inherit", transparent: "transparent", diff --git a/web/themes/custom/opdavies/templates/navigation/menu-local-task.html.twig b/web/themes/custom/opdavies/templates/navigation/menu-local-task.html.twig new file mode 100644 index 0000000..0b20a88 --- /dev/null +++ b/web/themes/custom/opdavies/templates/navigation/menu-local-task.html.twig @@ -0,0 +1,23 @@ +{# +/** + * @file + * Theme override for a local task link. + * + * Available variables: + * - attributes: HTML attributes for the wrapper element. + * - is_active: Whether the task item is an active tab. + * - link: A rendered link element. + * + * Note: This template renders the content for each task item in + * menu-local-tasks.html.twig. + * + * @see template_preprocess_menu_local_task() + */ +#} + + {% if is_active %} + {{ link|add_class('inline-block p-4 text-blue-primary border-b-2 border-blue-primary rounded-t-lg active dark:text-blue-400 dark:border-blue-400') }} + {% else %} + {{ link|add_class('inline-block p-4 border-b-2 border-transparent rounded-t-lg hover:text-gray-600 hover:border-gray-300 dark:hover:text-gray-300') }} + {% endif %} + diff --git a/web/themes/custom/opdavies/templates/navigation/menu-local-tasks.html.twig b/web/themes/custom/opdavies/templates/navigation/menu-local-tasks.html.twig new file mode 100644 index 0000000..a276cee --- /dev/null +++ b/web/themes/custom/opdavies/templates/navigation/menu-local-tasks.html.twig @@ -0,0 +1,25 @@ +{# +/** + * @file + * Theme override to display primary and secondary local tasks. + * + * Available variables: + * - primary: HTML list items representing primary tasks. + * - secondary: HTML list items representing secondary tasks. + * + * Each item in these variables (primary and secondary) can be individually + * themed in menu-local-task.html.twig. + */ +#} +
+
+ {% if primary %} +

{{ 'Primary tabs'|t }}

+
    {{ primary }}
+ {% endif %} + {% if secondary %} +

{{ 'Secondary tabs'|t }}

+
    {{ secondary }}
+ {% endif %} +
+