From b3d12f76c240a059c086fe69c3b1838368f9ba43 Mon Sep 17 00:00:00 2001
From: Allie Sadler <102604716+aevesdocker@users.noreply.github.com>
Date: Thu, 5 Jun 2025 08:18:39 +0100
Subject: [PATCH] Revert "ux: touch up tabs (#22774)"

This reverts commit 17ef8a68a3a086cfa3d95414a63815f776e95e79.
---
 .vscode/docker.code-snippets              | 10 +++++-----
 assets/css/components.css                 | 12 ------------
 content/manuals/ai/model-runner/_index.md |  8 ++++----
 layouts/shortcodes/tabs.html              |  7 ++++---
 4 files changed, 13 insertions(+), 24 deletions(-)

diff --git a/.vscode/docker.code-snippets b/.vscode/docker.code-snippets
index 6f05322140dc..4342ae2890ee 100644
--- a/.vscode/docker.code-snippets
+++ b/.vscode/docker.code-snippets
@@ -23,15 +23,15 @@
     "prefix": ["admonition", "tabs"],
     "body": [
       "",
-      "{{< tabs group=\"$1\" >}}",
-      "{{< tab name=\"$2\">}}",
+      "{{< tabs >}}",
+      "{{< tab name=\"$1\">}}",
       "",
-      "$3",
+      "$2",
       "",
       "{{< /tab >}}",
-      "{{< tab name=\"$4\">}}",
+      "{{< tab name=\"$3\">}}",
       "",
-      "$5",
+      "$4",
       "",
       "{{< /tab >}}",
       "{{</tabs >}}",
diff --git a/assets/css/components.css b/assets/css/components.css
index 4e7a2234d3a0..bfb1ef702cdb 100644
--- a/assets/css/components.css
+++ b/assets/css/components.css
@@ -101,15 +101,3 @@
 .summary-bar {
   @apply my-1 mt-4 flex flex-col rounded-sm border-1 border-gray-100 bg-gray-50 p-4 dark:border-gray-800 dark:bg-gray-900;
 }
-
-.tabs {
-  @apply bg-blue/2 rounded-sm p-2;
-}
-.tablist {
-  @apply mb-1 border-b border-gray-100 dark:border-gray-800;
-}
-
-.tab-item {
-  @apply inline-block rounded-sm px-3 py-2 hover:bg-gray-100 dark:hover:bg-gray-900;
-  @apply dark:text-gray-200;
-}
diff --git a/content/manuals/ai/model-runner/_index.md b/content/manuals/ai/model-runner/_index.md
index 69cc326cdf29..56dc11dcae8c 100644
--- a/content/manuals/ai/model-runner/_index.md
+++ b/content/manuals/ai/model-runner/_index.md
@@ -83,7 +83,7 @@ You can now use the `docker model` command in the CLI and view and interact with
 
 Models are cached locally.
 
-{{< tabs group="release" >}}
+{{< tabs >}}
 {{< tab name="From Docker Desktop">}}
 
 1. Select **Models** and select the **Docker Hub** tab.
@@ -99,14 +99,14 @@ Use the [`docker model pull` command](/reference/cli/docker/).
 
 ## Run a model
 
-{{< tabs group="release" >}}
+{{< tabs >}}
 {{< tab name="From Docker Desktop">}}
 
 Select **Models** and select the **Local** tab and click the play button.
 The interactive chat screen opens.
 
 {{< /tab >}}
-{{< tab name="From the Docker CLI" >}}
+{{< tab name="From the Docker CLI">}}
 
 Use the [`docker model run` command](/reference/cli/docker/).
 
@@ -117,7 +117,7 @@ Use the [`docker model run` command](/reference/cli/docker/).
 
 To troubleshoot potential issues, display the logs:
 
-{{< tabs group="release" >}}
+{{< tabs >}}
 {{< tab name="From Docker Desktop">}}
 
 Select **Models** and select the **Logs** tab.
diff --git a/layouts/shortcodes/tabs.html b/layouts/shortcodes/tabs.html
index d8d1e3119486..3c8fff5f8361 100644
--- a/layouts/shortcodes/tabs.html
+++ b/layouts/shortcodes/tabs.html
@@ -6,7 +6,6 @@
 
 
 <div
-  class="tabs"
   {{ with $group }}
     {{ if $persist }}
       x-data="{ selected: $persist('{{ $first }}').as('{{ $groupID }}') }"
@@ -20,10 +19,10 @@
   {{ end }}
   aria-role="tabpanel"
 >
-  <div aria-role="tablist" class="tablist">
+  <div aria-role="tablist" class="space-x-2">
     {{ range (.Store.Get "tabs") }}
       <button
-        class="tab-item"
+        class="p-1"
         :class="selected === '{{ .name | urlize }}' &&
           'border-blue border-b-4 dark:border-b-blue-600'"
         {{ if $group }}
@@ -37,6 +36,7 @@
       </button>
     {{ end }}
   </div>
+  <hr class="!mt-0" />
   <div>
     {{ range (.Store.Get "tabs") }}
       <div
@@ -47,4 +47,5 @@
       </div>
     {{ end }}
   </div>
+  <hr />
 </div>