Merge 69585eeb14 into de9f9b312e

assets/css/compiled/main.css

@@ -2577,6 +2577,23 @@ nav .search-wrapper {
     grid-template-columns: repeat(var(--hextra-feature-grid-cols), minmax(0, 1fr))
 }
   }
+.hextra-jupyter-code-cell {
+  scrollbar-gutter: auto;
+  margin-top: 1.5rem;
+}
+.hextra-jupyter-code-cell .hextra-jupyter-code-cell-outputs-container {
+  overflow: hidden;
+  font-size: .75rem;
+}
+.hextra-jupyter-code-cell .hextra-jupyter-code-cell-outputs-container .hextra-jupyter-code-cell-outputs {
+  max-height: 50vh;
+  overflow: auto;
+}
+.hextra-jupyter-code-cell .hextra-jupyter-code-cell-outputs-container .hextra-jupyter-code-cell-outputs pre {
+  max-width: 100%;
+  overflow: auto;
+  font-size: .75rem;
+}
 html {
   font-size: 1rem;
   -webkit-font-smoothing: antialiased;

assets/css/components/jupyter.css

@@ -3,27 +3,15 @@
 
   @apply hx-mt-6;
 
-  .hextra-jupyter-code-cell-source {
-    @apply hx-text-sm;
-    .chroma,
-    pre {
-      @apply hx-m-0;
-    }
-  }
-
   .hextra-jupyter-code-cell-outputs-container {
-    @apply hx-text-xs hx-overflow-hidden hx-border hx-border-t-0 hx-rounded-b-xl dark:hx-border-neutral-800;
+    @apply hx-text-xs hx-overflow-hidden;
 
     .hextra-jupyter-code-cell-outputs {
       @apply hx-overflow-auto hx-max-h-[50vh];
 
       pre {
-        @apply hx-p-4;
+        @apply hx-text-xs hx-overflow-auto hx-max-w-full;
       }
     }
   }
 }
-
-.hextra-jupyter-code-cell:has(.hextra-jupyter-code-cell-outputs) .hextra-jupyter-code-cell-source .chroma {
-  @apply hx-rounded-b-none;
-}

assets/css/styles.css

@@ -10,6 +10,7 @@
 @import "components/scrollbar.css";
 @import "components/code-copy.css";
 @import "components/hextra/feature-grid.css";
+@import "components/jupyter.css";
 
 html {
   @apply hx-text-base hx-antialiased;

exampleSite/content/docs/guide/shortcodes/cards.md

@@ -7,8 +7,8 @@ linkTitle: Cards
 
 {{< cards >}}
   {{< card link="../callout" title="Callout" icon="warning" >}}
-  {{< card link="../callout" title="Card with tag" icon="tag" tag="custom tag">}}
-  {{< card link="/" title="No Icon" >}}
+  {{< card link="../callout" title="Card with tag" icon="tag" tag="A custom tag with Tooltip" tagtooltip="Tooltip for Tag">}}
+  {{< card link="/" title="No Icon, but with Tooltip" linktooltip="Tooltip for Link" >}}
 {{< /cards >}}
 
 {{< cards >}}
@@ -22,8 +22,8 @@ linkTitle: Cards
 ```
 {{</* cards */>}}
   {{</* card link="../callout" title="Callout" icon="warning" */>}}
-  {{</* card link="../callout" title="Card with tag" icon="warning" tag= "A custom tag" */>}}
-  {{</* card link="/" title="No Icon" */>}}
+  {{</* card link="../callout" title="Card with tag" tag="A custom tag with Tooltip" tagtooltip="Tooltip for Tag" */>}}
+  {{</* card link="/" title="No Icon, but with Tooltip" linktooltip="Tooltip for Link" */>}}
 {{</* /cards */>}}
 ```
 
@@ -37,14 +37,16 @@ linkTitle: Cards
 
 ## Card Parameters
 
-| Parameter  | Description                                                     |
-|----------- |-----------------------------------------------------------------|
-| `link`     | URL (internal or external).                                     |
-| `title`    | Title heading for the card.                                     |
-| `subtitle` | Subtitle heading (supports Markdown).                           |
-| `icon`     | Name of the icon.                                               |
-| `tag`      | Text in tag.                                                    |
-| `tagColor` | Color of the tag: `gray` (default), `yellow`, `red` and `blue`. |
+| Parameter     | Description                                                           |
+|---------------|-----------------------------------------------------------------------|
+| `link`        | URL (internal or external).                                           |
+| `title`       | Title heading for the card.                                           |
+| `linktooltip` | Tooltip (title-attribut) for the link.                                |
+| `subtitle`    | Subtitle heading (supports Markdown).                                 |
+| `icon`        | Name of the icon.                                                     |
+| `tag`         | Text in tag.                                                          |
+| `tagType`     | Type of the tag: `info` (blue), `warning` (yellow) and `error` (red). |
+| `tagtooltip`  | Tooltip (title-attribut) for the Tag.                                 |
   
 ## Image Card
 

layouts/partials/shortcodes/card.html

@@ -1,6 +1,7 @@
 {{- $page := .page -}}
 {{- $link := .link -}}
 {{- $title := .title -}}
+{{- $linktooltip := .linktooltip -}}
 {{- $icon := .icon -}}
 {{- $subtitle := .subtitle -}}
 {{- $image := .image -}}
@@ -9,6 +10,7 @@
 {{- $imageStyle := .imageStyle -}}
 {{- $tag := .tag -}}
 {{- $tagType := .tagType -}}
+{{- $tagtooltip := .tagtooltip -}}
 
 {{ $linkClass := "hover:hx-border-gray-300 hx-bg-transparent hx-shadow-sm dark:hx-border-neutral-800 hover:hx-bg-slate-50 hover:hx-shadow-md dark:hover:hx-border-neutral-700 dark:hover:hx-bg-neutral-900" }}
 {{- with $image -}}
@@ -25,6 +27,7 @@
     href="{{ $href }}"
     {{ with $external }}target="_blank" rel="noreferrer"{{ end -}}
   {{- end -}}
+  {{- with $linktooltip }}title="{{- . -}}"{{ end -}}
 >
   {{- with $image -}}
     <img
@@ -61,7 +64,7 @@
 
     {{ $tagClass := cond (eq $tagType "info") $infoClass (cond (eq $tagType "warning") $warningClass (cond (eq $tagType "error") $errorClass $defaultClass)) }}
     <div class="hextra-card-tag">
-      <span class="hx-inline-block hx-rounded-full hx-px-2.5 hx-leading-6 {{ $tagClass }}">{{ $tag }}</span>
+      <span class="hx-inline-block hx-rounded-full hx-px-2.5 hx-leading-6 {{ $tagClass }}" {{- with $tagtooltip }}title="{{- . -}}"{{ end -}} >{{ $tag }}</span>
     </div>
   {{- end -}}
 </a>

layouts/shortcodes/card.html

@@ -1,6 +1,7 @@
 {{- $context := . -}}
 {{- $link := .Get "link" -}}
 {{- $title := .Get "title" -}}
+{{- $linktooltip := .Get "linktooltip" -}}
 {{- $icon := .Get "icon" -}}
 {{- $subtitle := .Get "subtitle" -}}
 {{- $image := .Get "image" -}}
@@ -9,6 +10,7 @@
 {{- $imageStyle := .Get "imageStyle" -}}
 {{- $tag := .Get "tag" -}}
 {{- $tagType := .Get "tagType" -}}
+{{- $tagtooltip := .Get "tagtooltip" -}}
 
 {{/* Image processing options */}}
 {{- $method := .Get "method" | default "Resize" | humanize -}}
@@ -44,6 +46,7 @@
   "page"        .Page
   "link"        $link
   "title"       $title
+  "linktooltip" $linktooltip
   "icon"        $icon
   "subtitle"    $subtitle
   "image"       $image
@@ -52,5 +55,6 @@
   "imageStyle"  $imageStyle
   "tag"         $tag
   "tagType"     $tagType
+  "tagtooltip"  $tagtooltip
   )
 -}}

layouts/shortcodes/jupyter.html

@@ -53,12 +53,12 @@
                 {{- else if eq (index $output "output_type") "stream" -}}
                   {{- $text := index $output "text" -}}
                   {{- $textContent := (cond (reflect.IsSlice $text) (delimit $text "") $text) -}}
-                  <pre class="not-prose hx-text-sm">{{- $textContent -}}</pre>
+                  <pre class="not-prose">{{- $textContent -}}</pre>
                 {{- else if eq (index $output "output_type") "execute_result" -}}
                   {{- $data := index $output "data" -}}
                   {{- $text := index $data "text/plain" -}}
                   {{- $textContent := (cond (reflect.IsSlice $text) (delimit $text "") $text) -}}
-                  <pre class="not-prose hx-text-sm">{{- $textContent -}}</pre>
+                  <pre class="not-prose">{{- $textContent -}}</pre>
                   {{- $html := index $data "text/html" -}}
                   {{- if $html -}}
                     {{- $htmlText := delimit $html "" -}}