updates

Author: ArthurFlag

assets/css/components.css

@@ -38,13 +38,13 @@
     @apply bg-gray-50 dark:bg-gray-900;
   }
   .admonition-header {
-    @apply flex items-center gap-2;
+    @apply flex flex-wrap items-center gap-2;
   }
   .admonition-title {
     @apply font-semibold;
   }
   .admonition-content {
-    @apply min-w-0 flex-1;
+    @apply w-full min-w-0 flex-1 flex-wrap overflow-x-auto break-words;
     color: var(--tw-prose-body);
   }
   .admonition-note {

assets/css/global.css

@@ -63,8 +63,12 @@ input[type="search"]::-ms-clear {
   hr {
     @apply mt-8 mb-4;
   }
-  > h1 {
-    @apply mt-3! mb-5! text-4xl!;
+  :where(h1):not(:where([class~="not-prose"], [class~="not-prose"] *)) {
+    color: var(--tw-prose-headings);
+    font-weight: 500 !important;
+    margin-top: 0;
+    margin-bottom: 0.2em !important;
+    line-height: 1.1111111;
   }
   > h2 {
     @apply mt-5! mb-3! text-3xl!;

assets/css/utilities.css

@@ -121,7 +121,7 @@
 @utility navbar-group-font-title {
   font-size: var(--color-navbar-group-font-title-size);
   @apply font-semibold uppercase;
-  color: var(--color-navbar-text-dark);
+  color: var(--color-navbar-text);
   .dark & {
     color: var(--color-navbar-text-dark);
   }

assets/icons/toolkit.svg renamed to assets/icons/toolbox.svg

@@ -50,4 +50,4 @@ The following example assumes you have already installed and set up Claude Deskt
    Take a screenshot of docs.docker.com and then invert the colors
    ```
 
-Once you've given your consent to use the new tools, Claude spins up the Puppeteer MCP server inside a container, navigates to the target URL, captures and modify the page, and returns the screenshot.
+Once you've given your consent to use the new tools, Claude spins up the Puppeteer MCP server inside a container, navigates to the target URL, captures and modify the page, and returns the screenshot.

content/manuals/ai/mcp-catalog-and-toolkit/toolkit.md

@@ -179,7 +179,7 @@
       "border-gray-200",
       "border-gray-300",
       "border-gray-400",
-      "border-gray-700",
+      "border-gray-600",
       "border-green-400",
       "border-l-2",
       "border-l-magenta-light",
@@ -524,7 +524,8 @@
       "text-gray",
       "text-gray-100",
       "text-gray-200",
-      "text-gray-700",
+      "text-gray-400",
+      "text-gray-600",
       "text-gray-800",
       "text-left",
       "text-lg",

hugo_stats.json

@@ -67,12 +67,12 @@ <h1 class="text-2xl">Get Docker</h1>
             <img
               class="dark:hidden"
               alt="Low-fi desktop app"
-              src="/assets/images/app-wf-1.svg"
+              src="/assets/images/app-wf-light-1.svg"
             />
             <img
               class="hidden dark:block"
               alt="Low-fi desktop app"
-              src="/assets/images/app-wf-1.svg"
+              src="/assets/images/app-wf-dark-1.svg"
             />
           </div>
         </div>
@@ -191,12 +191,12 @@ <h2 class="font-medium">
               <img
                 class="dark:hidden"
                 alt="Low-fi desktop app"
-                src="/assets/images/app-wf-2.svg"
+                src="/assets/images/app-wf-light-2.svg"
               />
               <img
                 class="hidden dark:block"
                 alt="Low-fi desktop app"
-                src="/assets/images/app-wf-2.svg"
+                src="/assets/images/app-wf-dark-2.svg"
               />
             </div>
           </div>

layouts/index.html

@@ -2,7 +2,7 @@
   id="breadcrumbs"
   {{- $breadcrumbTitles := slice }}
   data-pagefind-ignore
-  class="mb-4 flex min-w-0 items-center gap-3 text-gray-200 dark:text-gray-300"
+  class="mb-4 flex min-w-0 items-center gap-2 text-gray-400 dark:text-gray-300"
 >
   {{ range .Ancestors.Reverse }}
     {{ $breadcrumbTitles = $breadcrumbTitles | append .LinkTitle }}

layouts/partials/admonitions/icons/info.svg

@@ -1,4 +1,4 @@
-<div class="card not-prose">
+<div class="card">
   {{ if .link }}
     <a href="{{ .link }}" class="card-link">
   {{ end }}
@@ -8,14 +8,10 @@
       {{ end }}
       {{ with .icon }}
       <div class="card-icon">
-        {{ if (and (in . "/") (not (in . "svg"))) }} 
+        {{ if (in . "/") }}
           <img class="card-img" src="{{ . }}" alt="">
-        {{ else if (in . "svg") }}
-          <span class="card-img svg">
-            {{ partial "utils/svg" . }}
-          </span>
         {{ else }}
-          <span class="card-img svg">
+          <span class="card-img">
             {{ partial "icon" . }}
           </span>
         {{ end }}