mirror of
https://github.com/imfing/hextra.git
synced 2025-05-15 06:30:33 -04:00
Compare commits
12 Commits
4c37aa1a87
...
facb708aa1
| Author | SHA1 | Date | |
|---|---|---|---|
|
facb708aa1 | ||
|
|
36ab5287b5 | ||
|
|
9173f59392 | ||
|
|
c70900c25f | ||
|
|
cabdb421e3 | ||
|
|
de9f9b312e | ||
|
|
2af73b3d7e | ||
|
|
d1c3c40a95 | ||
|
|
086af4d173 | ||
|
|
27a70e4c12 | ||
|
|
aeb0cad979 | ||
|
|
fd38dd116f |
@ -1176,6 +1176,9 @@ video {
|
||||
.hx-text-4xl {
|
||||
font-size: 2.25rem;
|
||||
}
|
||||
.hx-text-\[\.65rem\] {
|
||||
font-size: .65rem;
|
||||
}
|
||||
.hx-text-\[10px\] {
|
||||
font-size: 10px;
|
||||
}
|
||||
@ -2269,7 +2272,6 @@ article details > summary::before {
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
z-index: 10;
|
||||
font-size: .65rem;
|
||||
}
|
||||
.steps h3 {
|
||||
counter-increment: step;
|
||||
@ -2532,30 +2534,30 @@ nav .search-wrapper {
|
||||
.hamburger-menu svg.open > g:nth-of-type(2) path {
|
||||
transform: translate3d(0, -4px, 0);
|
||||
}
|
||||
.hextra-scrollbar {
|
||||
.hextra-scrollbar, .hextra-scrollbar * {
|
||||
scrollbar-width: thin; /* Firefox */
|
||||
scrollbar-color: oklch(55.55% 0 0 / 40%) transparent; /* Firefox */
|
||||
|
||||
scrollbar-gutter: stable;
|
||||
}
|
||||
.hextra-scrollbar::-webkit-scrollbar {
|
||||
.hextra-scrollbar::-webkit-scrollbar, .hextra-scrollbar *::-webkit-scrollbar {
|
||||
height: 0.75rem;
|
||||
width: 0.75rem;
|
||||
}
|
||||
.hextra-scrollbar::-webkit-scrollbar-track {
|
||||
.hextra-scrollbar::-webkit-scrollbar-track, .hextra-scrollbar *::-webkit-scrollbar-track {
|
||||
background-color: transparent;
|
||||
}
|
||||
.hextra-scrollbar::-webkit-scrollbar-thumb {
|
||||
.hextra-scrollbar::-webkit-scrollbar-thumb, .hextra-scrollbar *::-webkit-scrollbar-thumb {
|
||||
border-radius: 10px;
|
||||
}
|
||||
.hextra-scrollbar:hover::-webkit-scrollbar-thumb {
|
||||
.hextra-scrollbar:hover::-webkit-scrollbar-thumb, .hextra-scrollbar *:hover::-webkit-scrollbar-thumb {
|
||||
border: 3px solid transparent;
|
||||
background-color: var(--tw-shadow-color);
|
||||
background-clip: content-box;
|
||||
--tw-shadow-color: rgb(115 115 115 / 0.2);
|
||||
--tw-shadow: var(--tw-shadow-colored);
|
||||
}
|
||||
.hextra-scrollbar:hover::-webkit-scrollbar-thumb:hover {
|
||||
.hextra-scrollbar:hover::-webkit-scrollbar-thumb:hover, .hextra-scrollbar *:hover::-webkit-scrollbar-thumb:hover {
|
||||
--tw-shadow-color: rgb(115 115 115 / 0.4);
|
||||
--tw-shadow: var(--tw-shadow-colored);
|
||||
}
|
||||
@ -2577,6 +2579,27 @@ 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;
|
||||
}
|
||||
.hextra-badge {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
}
|
||||
html {
|
||||
font-size: 1rem;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
3
assets/css/components/badge.css
Normal file
3
assets/css/components/badge.css
Normal file
@ -0,0 +1,3 @@
|
||||
.hextra-badge {
|
||||
@apply hx-inline-flex hx-items-center;
|
||||
}
|
||||
@ -38,5 +38,4 @@
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
z-index: 10;
|
||||
font-size: .65rem;
|
||||
}
|
||||
|
||||
17
assets/css/components/jupyter.css
Normal file
17
assets/css/components/jupyter.css
Normal file
@ -0,0 +1,17 @@
|
||||
.hextra-jupyter-code-cell {
|
||||
scrollbar-gutter: auto;
|
||||
|
||||
@apply hx-mt-6;
|
||||
|
||||
.hextra-jupyter-code-cell-outputs-container {
|
||||
@apply hx-text-xs hx-overflow-hidden;
|
||||
|
||||
.hextra-jupyter-code-cell-outputs {
|
||||
@apply hx-overflow-auto hx-max-h-[50vh];
|
||||
|
||||
pre {
|
||||
@apply hx-text-xs hx-overflow-auto hx-max-w-full;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -1,4 +1,4 @@
|
||||
.hextra-scrollbar {
|
||||
.hextra-scrollbar, .hextra-scrollbar * {
|
||||
scrollbar-width: thin; /* Firefox */
|
||||
scrollbar-color: oklch(55.55% 0 0 / 40%) transparent; /* Firefox */
|
||||
|
||||
|
||||
@ -10,6 +10,8 @@
|
||||
@import "components/scrollbar.css";
|
||||
@import "components/code-copy.css";
|
||||
@import "components/hextra/feature-grid.css";
|
||||
@import "components/jupyter.css";
|
||||
@import "components/badge.css";
|
||||
|
||||
html {
|
||||
@apply hx-text-base hx-antialiased;
|
||||
|
||||
@ -36,6 +36,8 @@ hugo-full: >
|
||||
<path fill="#fff" d="M1320.72 89.15c58.79 0 106.52 47.73 106.52 106.51 0 58.8-47.73 106.52-106.52 106.52-58.78 0-106.52-47.73-106.52-106.52 0-58.78 47.74-106.51 106.52-106.51zm0 39.57c36.95 0 66.94 30 66.94 66.94a66.97 66.97 0 0 1-66.94 66.94c-36.95 0-66.94-29.99-66.94-66.94a66.97 66.97 0 0 1 66.93-66.94h.01zm-283.8 65.31c0 47.18-8.94 60.93-26.81 80.58-17.87 19.65-41.57 27.57-71.1 27.57-27 0-48.75-9.58-67.61-26.23-20.88-18.45-36.08-47.04-36.08-78.95 0-31.37 11.72-58.48 32.49-78.67 18.22-17.67 45.34-29.18 73.3-29.18 33.77 0 68.83 15.98 90.44 47.53l-31.73 26.82c-13.45-25.03-32.94-33.46-60.82-34.26-30.83-.88-64.77 28.53-62.25 67.75 1.4 21.94 11.65 59.65 60.96 66.57 25.9 3.63 55.36-24.02 55.36-39.04H944.4v-37.5h92.5V194l.02.03zm-562.6-94.65h42.29v112.17c0 17.8.49 29.33 1.47 34.61 1.69 8.48 4.81 14.37 11.17 19.5 6.37 5.13 13.8 6.59 24.84 6.59 11.2 0 14.96-1.74 20.66-6.6 5.69-4.85 9.12-9.46 10.28-16.53 1.15-7.07 3.07-18.8 3.07-35.18V99.38h42.28v108.78c0 24.86-1.07 42.43-3.21 52.69-2.14 10.27-6.08 18.93-11.82 26-5.74 7.06-13.42 12.69-23.03 16.88-9.62 4.19-22.16 6.28-37.65 6.28-18.7 0-32.87-2.28-42.52-6.85-9.66-4.57-17.3-10.5-22.9-17.8-5.61-7.3-9.3-14.95-11.08-22.96-2.58-11.86-3.88-29.38-3.88-52.55V99.38h.03zM93.91 299.92V92.7h43.35v75.48h71.92V92.7h43.48v207.22h-43.48v-90.61h-71.92v90.61z"/>
|
||||
</svg>
|
||||
|
||||
jupyter: <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="currentColor" d="M7.157 22.201A1.784 1.799 0 0 1 5.374 24a1.784 1.799 0 0 1-1.784-1.799a1.784 1.799 0 0 1 1.784-1.799a1.784 1.799 0 0 1 1.783 1.799M20.582 1.427a1.415 1.427 0 0 1-1.415 1.428a1.415 1.427 0 0 1-1.416-1.428A1.415 1.427 0 0 1 19.167 0a1.415 1.427 0 0 1 1.415 1.427M4.992 3.336A1.047 1.056 0 0 1 3.946 4.39a1.047 1.056 0 0 1-1.047-1.055A1.047 1.056 0 0 1 3.946 2.28a1.047 1.056 0 0 1 1.046 1.056m7.336 1.517c3.769 0 7.06 1.38 8.768 3.424a9.36 9.36 0 0 0-3.393-4.547a9.24 9.24 0 0 0-5.377-1.728A9.24 9.24 0 0 0 6.95 3.73a9.36 9.36 0 0 0-3.394 4.547c1.713-2.04 5.004-3.424 8.772-3.424m.001 13.295c-3.768 0-7.06-1.381-8.768-3.425a9.36 9.36 0 0 0 3.394 4.547A9.24 9.24 0 0 0 12.33 21a9.24 9.24 0 0 0 5.377-1.729a9.36 9.36 0 0 0 3.393-4.547c-1.712 2.044-5.003 3.425-8.772 3.425Z" /></svg>
|
||||
|
||||
warning: <svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M12 9v3.75m-9.303 3.376c-.866 1.5.217 3.374 1.948 3.374h14.71c1.73 0 2.813-1.874 1.948-3.374L13.949 3.378c-.866-1.5-3.032-1.5-3.898 0L2.697 16.126zM12 15.75h.007v.008H12v-.008z"></path></svg>
|
||||
one: <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewBox="-1 0 19 19"><path d="M16.417 9.6A7.917 7.917 0 1 1 8.5 1.683 7.917 7.917 0 0 1 16.417 9.6zM9.666 6.508H8.248L6.09 8.09l.806 1.103 1.222-.945v4.816h1.547z"></path></svg>
|
||||
cards: <svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="currentColor" stroke-width="1.5" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M6 6.878V6a2.25 2.25 0 0 1 2.25-2.25h7.5A2.25 2.25 0 0 1 18 6v.878m-12 0c.235-.083.487-.128.75-.128h10.5c.263 0 .515.045.75.128m-12 0A2.25 2.25 0 0 0 4.5 9v.878m13.5-3A2.25 2.25 0 0 1 19.5 9v.878m0 0a2.246 2.246 0 0 0-.75-.128H5.25c-.263 0-.515.045-.75.128m15 0A2.25 2.25 0 0 1 21 12v6a2.25 2.25 0 0 1-2.25 2.25H5.25A2.25 2.25 0 0 1 3 18v-6c0-.98.626-1.813 1.5-2.122"></path></svg>
|
||||
|
||||
224
exampleSite/assets/example.ipynb
Normal file
224
exampleSite/assets/example.ipynb
Normal file
File diff suppressed because one or more lines are too long
@ -186,10 +186,10 @@ To customize the [favicon](https://en.wikipedia.org/wiki/Favicon) for your site,
|
||||
{{< /filetree/folder >}}
|
||||
{{< /filetree/container >}}
|
||||
|
||||
Include both `favicon.ico` and `favicon.svg` files in your project to ensure your site's favicons display correctly.
|
||||
Include `favicon.ico`, `favicon.svg` and `favicon-dark.svg` files in your project to ensure your site's favicons display correctly.
|
||||
|
||||
While `favicon.ico` is generally for older browsers, `favicon.svg` is supported by modern ones. The optional `favicon-dark.svg` can be included for a tailored experience in dark mode.
|
||||
Feel free to use tools like [favicon.io](https://favicon.io/) or [favycon](https://github.com/ruisaraiva19/favycon) to generate these icons.
|
||||
While `favicon.ico` is generally for older browsers, `favicon.svg` and `favicon-dark.svg` are supported by modern browsers.
|
||||
Use tools like [favicon.io](https://favicon.io/) or [favycon](https://github.com/ruisaraiva19/favycon) to generate such icons.
|
||||
|
||||
### Theme Configuration
|
||||
|
||||
|
||||
@ -24,5 +24,6 @@ Hextra provides a collection of beautiful shortcodes to enhance your content.
|
||||
Additional shortcodes provided by Hugo and Hextra:
|
||||
|
||||
{{< cards >}}
|
||||
{{< card link="jupyter" title="Jupyter Notebook" icon="jupyter" tag="alpha" >}}
|
||||
{{< card link="others" title="Others" icon="view-grid" >}}
|
||||
{{< /cards >}}
|
||||
|
||||
@ -22,7 +22,7 @@ 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="../callout" title="Card with tag" icon="tag" tag= "A custom tag" */>}}
|
||||
{{</* card link="/" title="No Icon" */>}}
|
||||
{{</* /cards */>}}
|
||||
```
|
||||
|
||||
79
exampleSite/content/docs/guide/shortcodes/jupyter.md
Normal file
79
exampleSite/content/docs/guide/shortcodes/jupyter.md
Normal file
@ -0,0 +1,79 @@
|
||||
---
|
||||
title: "Jupyter Notebook Component"
|
||||
linktitle: "Jupyter Notebook"
|
||||
math: true
|
||||
sidebar:
|
||||
exclude: true
|
||||
---
|
||||
|
||||
{{< callout >}}Experimental feature to include Jupyter Notebooks via a shortcode. Note that not all cell types are supported.{{< /callout >}}
|
||||
|
||||
[Jupyter Notebook](https://jupyter.org/) is a language-agnostic HTML notebook application for [Project Jupyter](https://jupyter.org/). It allows you to create and share documents that contain live code, equations, visualizations, and narrative text.
|
||||
|
||||
<!--more-->
|
||||
|
||||
## How to use
|
||||
|
||||
### Using a local notebook
|
||||
|
||||
To use the Jupyter Notebook shortcode, you need to have a Jupyter Notebook file in your project. Similar to how you would [add images](../../organize-files#add-images) to the project, you can add Jupyter Notebooks to the `assets` folder.
|
||||
|
||||
{{< filetree/container >}}
|
||||
{{< filetree/folder name="assets" >}}
|
||||
{{< filetree/file name="notebook.ipynb" >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< filetree/folder name="content" >}}
|
||||
{{< filetree/folder name="docs" >}}
|
||||
{{< filetree/file name="my-page.md" >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< /filetree/container >}}
|
||||
|
||||
Include the Jupyter Notebook in the page using the `jupyter` shortcode:
|
||||
|
||||
```markdown {filename="content/docs/my-page.md"}
|
||||
---
|
||||
title: My Page
|
||||
math: true
|
||||
---
|
||||
|
||||
{{%/* jupyter "notebook.ipynb" */%}}
|
||||
```
|
||||
|
||||
Alternatively, you can utilize the [page bundles][page-bundles] feature of Hugo to organize the Jupyter Notebooks together with the Markdown file.
|
||||
|
||||
{{< filetree/container >}}
|
||||
{{< filetree/folder name="content" >}}
|
||||
{{< filetree/folder name="docs" >}}
|
||||
{{< filetree/folder name="my-page" >}}
|
||||
{{< filetree/file name="index.md" >}}
|
||||
{{< filetree/file name="notebook.ipynb" >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< /filetree/folder >}}
|
||||
{{< /filetree/container >}}
|
||||
|
||||
```markdown {filename="content/docs/my-page/index.md"}
|
||||
---
|
||||
title: My Page
|
||||
math: true
|
||||
---
|
||||
|
||||
{{%/* jupyter "notebook.ipynb" */%}}
|
||||
```
|
||||
|
||||
### Using a remote notebook
|
||||
|
||||
You can also use a remote notebook by providing the URL to the notebook file. For example, to include [What is the Jupyter Notebook](https://github.com/jupyter/notebook/blob/main/docs/source/examples/Notebook/What%20is%20the%20Jupyter%20Notebook.ipynb) notebook in the page, you can use the following shortcode:
|
||||
|
||||
```
|
||||
{{%/* jupyter "https://raw.githubusercontent.com/jupyter/notebook/main/docs/source/examples/Notebook/What%20is%20the%20Jupyter%20Notebook.ipynb" */%}}
|
||||
```
|
||||
|
||||
## Example Notebook
|
||||
|
||||
{{< callout type="info" >}}The following is an example of a notebook file that is included in the project assets folder.{{< /callout >}}
|
||||
|
||||
{{% jupyter "example.ipynb" %}}
|
||||
|
||||
[page-bundles]: https://gohugo.io/content-management/page-bundles/#leaf-bundles
|
||||
@ -10,6 +10,41 @@ sidebar:
|
||||
These shortcodes are considered less stable and may be changed anytime.
|
||||
{{< /callout >}}
|
||||
|
||||
## Badge
|
||||
|
||||
```
|
||||
{{</* badge "Badge" */>}}
|
||||
```
|
||||
|
||||
Result:
|
||||
|
||||
{{< badge "Badge" >}}
|
||||
|
||||
Variants:
|
||||
|
||||
```
|
||||
{{</* badge content="info" type="info" */>}}
|
||||
{{</* badge content="warning" type="warning" */>}}
|
||||
{{</* badge content="error" type="error" */>}}
|
||||
```
|
||||
|
||||
Result:
|
||||
|
||||
{{< badge content="info" type="info" >}}
|
||||
{{< badge content="warning" type="warning" >}}
|
||||
{{< badge content="error" type="error" >}}
|
||||
|
||||
With link:
|
||||
|
||||
```
|
||||
{{</* badge content="Releases" link="https://github.com/imfing/hextra/releases" */>}}
|
||||
```
|
||||
|
||||
Result:
|
||||
|
||||
{{< badge content="Releases" link="https://github.com/imfing/hextra/releases" >}}
|
||||
|
||||
|
||||
## YouTube
|
||||
|
||||
Embed a YouTube video.
|
||||
|
||||
@ -191,6 +191,7 @@
|
||||
"data-[state=selected]:hx-block",
|
||||
"data-[state=selected]:hx-border-primary-500",
|
||||
"data-[state=selected]:hx-text-primary-600",
|
||||
"dataframe",
|
||||
"filename",
|
||||
"first:hx-mt-0",
|
||||
"focus:hx-bg-white",
|
||||
@ -208,6 +209,7 @@
|
||||
"group-hover:hx-underline",
|
||||
"group-open:before:hx-rotate-90",
|
||||
"hamburger-menu",
|
||||
"hextra-badge",
|
||||
"hextra-card",
|
||||
"hextra-card-icon",
|
||||
"hextra-card-image",
|
||||
@ -222,6 +224,9 @@
|
||||
"hextra-filetree",
|
||||
"hextra-filetree-folder",
|
||||
"hextra-footer",
|
||||
"hextra-jupyter-code-cell",
|
||||
"hextra-jupyter-code-cell-outputs",
|
||||
"hextra-jupyter-code-cell-outputs-container",
|
||||
"hextra-pdf",
|
||||
"hextra-scrollbar",
|
||||
"hextra-sidebar-collapsible-button",
|
||||
@ -460,6 +465,7 @@
|
||||
"hx-sticky",
|
||||
"hx-text-2xl",
|
||||
"hx-text-4xl",
|
||||
"hx-text-[.65rem]",
|
||||
"hx-text-[10px]",
|
||||
"hx-text-[color:hsl(var(--primary-hue),100%,50%)]",
|
||||
"hx-text-base",
|
||||
@ -484,7 +490,6 @@
|
||||
"hx-text-white",
|
||||
"hx-text-xl",
|
||||
"hx-text-xs",
|
||||
"hx-text-xxs",
|
||||
"hx-text-yellow-900",
|
||||
"hx-to-gray-600",
|
||||
"hx-top-0",
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
|
||||
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
|
||||
<div class="content">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ if .Title }}<h1>{{ .Title }}</h1>{{ end }}
|
||||
{{ .Content }}
|
||||
</div>
|
||||
<div class="hx-mt-16"></div>
|
||||
@ -14,4 +14,4 @@
|
||||
</main>
|
||||
</article>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -5,7 +5,7 @@
|
||||
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
|
||||
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
|
||||
<br class="hx-mt-1.5 hx-text-sm" />
|
||||
<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
|
||||
{{ if .Title }}<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>{{ end }}
|
||||
<div class="hx-mb-16"></div>
|
||||
<div class="content">
|
||||
{{ .Content }}
|
||||
@ -15,4 +15,4 @@
|
||||
</main>
|
||||
</article>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -3,10 +3,10 @@
|
||||
{{ partial "sidebar.html" (dict "context" . "disableSidebar" true "displayPlaceholder" false) }}
|
||||
<article class="hx-w-full hx-break-words hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-pt-4 hx-pb-8 hx-pl-[max(env(safe-area-inset-left),1.5rem)] hx-pr-[max(env(safe-area-inset-left),1.5rem)]">
|
||||
<br class="hx-mt-1.5 hx-text-sm" />
|
||||
<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
|
||||
{{ if .Title }}<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>{{ end }}
|
||||
<div class="content">
|
||||
{{ .Content }}
|
||||
</div>
|
||||
</article>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -5,7 +5,7 @@
|
||||
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
|
||||
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
|
||||
<br class="hx-mt-1.5 hx-text-sm" />
|
||||
<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
|
||||
{{ if .Title }}<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>{{ end }}
|
||||
<div class="content">{{ .Content }}</div>
|
||||
{{- $pages := partial "utils/sort-pages" (dict "page" . "by" site.Params.blog.list.sortBy "order" site.Params.blog.list.sortOrder) -}}
|
||||
{{- range $pages }}
|
||||
@ -31,4 +31,4 @@
|
||||
</article>
|
||||
<div class="max-xl:hx-hidden hx-h-0 hx-w-64 hx-shrink-0"></div>
|
||||
</div>
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
@ -5,7 +5,7 @@
|
||||
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
|
||||
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
|
||||
{{ partial "breadcrumb.html" . }}
|
||||
<h1 class="hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
|
||||
{{ if .Title }}<h1 class="hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>{{ end }}
|
||||
<div class="hx-mt-4 hx-mb-16 hx-text-gray-500 hx-text-sm hx-flex hx-items-center hx-flex-wrap hx-gap-y-2">
|
||||
{{- with $date := .Date }}<span class="hx-mr-1">{{ partial "utils/format-date" $date }}</span>{{ end -}}
|
||||
{{- $lazyLoading := site.Params.enableImageLazyLoading | default true -}}
|
||||
@ -45,4 +45,4 @@
|
||||
</main>
|
||||
</article>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -6,7 +6,7 @@
|
||||
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
|
||||
{{ partial "breadcrumb.html" . }}
|
||||
<div class="content">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ if .Title }}<h1>{{ .Title }}</h1>{{ end }}
|
||||
{{ .Content }}
|
||||
</div>
|
||||
{{ partial "components/last-updated.html" . }}
|
||||
@ -15,4 +15,4 @@
|
||||
</main>
|
||||
</article>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -6,7 +6,7 @@
|
||||
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
|
||||
{{ partial "breadcrumb.html" . }}
|
||||
<div class="content">
|
||||
<h1>{{ .Title }}</h1>
|
||||
{{ if .Title }}<h1>{{ .Title }}</h1>{{ end }}
|
||||
{{ .Content }}
|
||||
</div>
|
||||
{{ partial "components/last-updated.html" . }}
|
||||
@ -15,4 +15,4 @@
|
||||
</main>
|
||||
</article>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -4,11 +4,11 @@
|
||||
{{ partial "toc.html" . }}
|
||||
<article class="hx-w-full hx-break-words hx-flex hx-min-h-[calc(100vh-var(--navbar-height))] hx-min-w-0 hx-justify-center hx-pb-8 hx-pr-[calc(env(safe-area-inset-right)-1.5rem)]">
|
||||
<main class="hx-w-full hx-min-w-0 hx-max-w-6xl hx-px-6 hx-pt-4 md:hx-px-12">
|
||||
<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>
|
||||
{{ if .Title }}<h1 class="hx-text-center hx-mt-2 hx-text-4xl hx-font-bold hx-tracking-tight hx-text-slate-900 dark:hx-text-slate-100">{{ .Title }}</h1>{{ end }}
|
||||
<div class="content">
|
||||
{{ .Content }}
|
||||
</div>
|
||||
</main>
|
||||
</article>
|
||||
</div>
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
@ -1,4 +1,26 @@
|
||||
{{- $lang := site.Language.LanguageCode | default `en` -}}
|
||||
{{ $default_chinese := "zh-CN" }}
|
||||
|
||||
{{ $sl := site.Language }}
|
||||
{{ $giscus_lang := $sl.Lang | default `en` }}
|
||||
|
||||
{{/*
|
||||
Special case for Chinese.
|
||||
Giscus uses the geophraphical language code for these.
|
||||
See: https://github.com/giscus/giscus/tree/main/locales
|
||||
*/}}
|
||||
{{ if eq $giscus_lang "zh" }}
|
||||
{{/* Create a code formatted for Giscus: zh-CN or zn-TW. */}}
|
||||
{{ $code := lower $sl.LanguageCode }}
|
||||
|
||||
{{ if (hasSuffix $code "-cn") }}
|
||||
{{ $giscus_lang = "zh-CN" }}
|
||||
{{ else if (hasSuffix $code "-tw") }}
|
||||
{{ $giscus_lang = "zh-TW" }}
|
||||
{{ else }}
|
||||
{{ $giscus_lang = $default_chinese }}
|
||||
{{ end }}
|
||||
{{ end }}
|
||||
|
||||
|
||||
{{- with site.Params.comments.giscus -}}
|
||||
<script>
|
||||
@ -38,7 +60,7 @@
|
||||
"data-emit-metadata": "{{ (string .emitMetadata) | default 0 }}",
|
||||
"data-input-position": "{{ .inputPosition | default `top` }}",
|
||||
"data-theme": getGiscusTheme(),
|
||||
"data-lang": "{{ .lang | default $lang }}",
|
||||
"data-lang": "{{ .lang | default $giscus_lang }}",
|
||||
"crossorigin": "anonymous",
|
||||
"async": "",
|
||||
};
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
{{- if and (not hugo.IsProduction) (eq hugo.Environment "theme") }}
|
||||
{{- $styles := resources.Get "css/styles.css" }}
|
||||
{{- $styles = $styles | resources.PostCSS (dict "inlineImports" true) }}
|
||||
{{- $styles = $styles | postCSS (dict "inlineImports" true) }}
|
||||
<link href="{{ $styles.RelPermalink }}" rel="stylesheet" />
|
||||
{{- else }}
|
||||
{{- $styles := resources.Get "css/compiled/main.css" -}}
|
||||
|
||||
@ -60,12 +60,18 @@
|
||||
{{- end -}}
|
||||
<script>
|
||||
// TODO: make render options configurable
|
||||
// Reference: https://katex.org/docs/autorender#api
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
renderMathInElement(document.body, {
|
||||
delimiters: [
|
||||
{ left: "$$", right: "$$", display: true },
|
||||
{ left: "$", right: "$", display: false },
|
||||
{ left: "\\(", right: "\\)", display: false },
|
||||
{ left: "\\begin{equation}", right: "\\end{equation}", display: true },
|
||||
{left: "\\begin{align}", right: "\\end{align}", display: true},
|
||||
{left: "\\begin{alignat}", right: "\\end{alignat}", display: true},
|
||||
{left: "\\begin{gather}", right: "\\end{gather}", display: true},
|
||||
{left: "\\begin{CD}", right: "\\end{CD}", display: true},
|
||||
{ left: "\\[", right: "\\]", display: true },
|
||||
],
|
||||
throwOnError: false,
|
||||
|
||||
16
layouts/partials/shortcodes/badge.html
Normal file
16
layouts/partials/shortcodes/badge.html
Normal file
@ -0,0 +1,16 @@
|
||||
{{- $content := .content -}}
|
||||
{{- $type := .type -}}
|
||||
{{- $class := .class | default "" -}}
|
||||
{{- $border := .border | default false -}}
|
||||
|
||||
{{- $defaultClass := "hx-text-gray-600 hx-bg-gray-100 dark:hx-bg-neutral-800 dark:hx-text-neutral-200 hx-border-gray-200 dark:hx-border-neutral-700" -}}
|
||||
{{- $warningClass := "hx-border-yellow-100 hx-bg-yellow-50 hx-text-yellow-900 dark:hx-border-yellow-200/30 dark:hx-bg-yellow-700/30 dark:hx-text-yellow-200" -}}
|
||||
{{- $infoClass := "hx-border-blue-200 hx-bg-blue-100 hx-text-blue-900 dark:hx-border-blue-200/30 dark:hx-bg-blue-900/30 dark:hx-text-blue-200" -}}
|
||||
{{- $errorClass := "hx-border-red-200 hx-bg-red-100 hx-text-red-900 dark:hx-border-red-200/30 dark:hx-bg-red-900/30 dark:hx-text-red-200" -}}
|
||||
|
||||
{{- $borderClass := cond (eq $border true) "hx-border" "" -}}
|
||||
{{- $badgeClass := cond (eq $type "info") $infoClass (cond (eq $type "warning") $warningClass (cond (eq $type "error") $errorClass $defaultClass)) -}}
|
||||
<div class="hextra-badge {{ $class }}">
|
||||
<div class="hx-inline-flex hx-items-center hx-rounded-full hx-px-2.5 hx-leading-6 hx-text-[.65rem] {{ $borderClass }} {{ $badgeClass }}">{{- $content -}}</div>
|
||||
</div>
|
||||
{{- /* Strip trailing newline. */ -}}
|
||||
@ -54,15 +54,13 @@
|
||||
{{- end -}}
|
||||
|
||||
{{- if $tag }}
|
||||
{{ $defaultClass := "hx-text-gray-600 hx-text-xxs hx-bg-gray-100 dark:hx-bg-neutral-800 dark:hx-text-neutral-200" }}
|
||||
{{ $warningClass := "hx-border-yellow-100 hx-bg-yellow-50 hx-text-yellow-900 dark:hx-border-yellow-200/30 dark:hx-bg-yellow-700/30 dark:hx-text-yellow-200" }}
|
||||
{{ $infoClass := "hx-border-blue-200 hx-bg-blue-100 hx-text-blue-900 dark:hx-border-blue-200/30 dark:hx-bg-blue-900/30 dark:hx-text-blue-200" }}
|
||||
{{ $errorClass := "hx-border-red-200 hx-bg-red-100 hx-text-red-900 dark:hx-border-red-200/30 dark:hx-bg-red-900/30 dark:hx-text-red-200" }}
|
||||
|
||||
{{ $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>
|
||||
</div>
|
||||
{{- partial "shortcodes/badge.html" (dict
|
||||
"content" $tag
|
||||
"type" $tagType
|
||||
"class" "hextra-card-tag"
|
||||
"border" true
|
||||
)
|
||||
-}}
|
||||
{{- end -}}
|
||||
</a>
|
||||
{{- /* Strip trailing newline. */ -}}
|
||||
|
||||
33
layouts/shortcodes/badge.html
Normal file
33
layouts/shortcodes/badge.html
Normal file
@ -0,0 +1,33 @@
|
||||
{{- if .IsNamedParams -}}
|
||||
{{- $content := .Get "content" -}}
|
||||
{{- $type := .Get "type" | default "" -}}
|
||||
{{- $class := .Get "class" | default "" -}}
|
||||
{{- $link := .Get "link" | default "" -}}
|
||||
|
||||
{{- if $link -}}
|
||||
<a href="{{ $link }}" title="{{ $content | plainify }}" target="_blank">
|
||||
{{- partial "shortcodes/badge.html" (dict
|
||||
"content" $content
|
||||
"type" $type
|
||||
"class" $class
|
||||
"border" true
|
||||
)
|
||||
-}}
|
||||
</a>
|
||||
{{- else -}}
|
||||
{{- partial "shortcodes/badge.html" (dict
|
||||
"content" $content
|
||||
"type" $type
|
||||
"class" $class
|
||||
"border" true
|
||||
)
|
||||
-}}
|
||||
{{- end -}}
|
||||
{{- else -}}
|
||||
{{- $content := .Get 0 -}}
|
||||
{{- partial "shortcodes/badge.html" (dict
|
||||
"content" $content
|
||||
"border" true
|
||||
)
|
||||
-}}
|
||||
{{- end -}}
|
||||
81
layouts/shortcodes/jupyter.html
Normal file
81
layouts/shortcodes/jupyter.html
Normal file
@ -0,0 +1,81 @@
|
||||
{{/* Render Jupyter Notebook */}}
|
||||
{{- $path := .Get 0 -}}
|
||||
{{- $data := "" -}}
|
||||
{{- $page := .Page -}}
|
||||
|
||||
{{- $isLocal := not (urls.Parse $path).Scheme -}}
|
||||
{{- $isPage := and (eq .Page.Kind "page") (not .Page.BundleType) -}}
|
||||
|
||||
{{/* https://gohugo.io/functions/transform/unmarshal/ */}}
|
||||
{{- if (not $isLocal) -}}
|
||||
{{- with resources.GetRemote $path -}}
|
||||
{{- with unmarshal .Content -}}{{- $data = . -}}{{- end -}}
|
||||
{{- else -}}
|
||||
{{- errorf "Remote resource not found: %s" $path -}}
|
||||
{{- end -}}
|
||||
{{- else if (not $isPage) -}}
|
||||
{{- with .Page.Resources.Get $path -}}
|
||||
{{- with unmarshal .Content -}}{{- $data = . -}}{{- end -}}
|
||||
{{- else -}}
|
||||
{{- errorf "Local resource not found: %s" $path -}}
|
||||
{{- end -}}
|
||||
{{- else -}}
|
||||
{{- with resources.Get $path -}}
|
||||
{{- with unmarshal .Content -}}{{- $data = . -}}{{- end -}}
|
||||
{{- else -}}
|
||||
{{- errorf "Local resource not found: %s" $path -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
|
||||
{{- $language := index $data "metadata" "language_info" "name" | default "python" -}}
|
||||
|
||||
{{- with index $data "cells" -}}
|
||||
{{- range $cell := . -}}
|
||||
{{- if eq (index $cell "cell_type") "code" -}}
|
||||
{{- $source := index $cell "source" -}}
|
||||
{{- $sourceContent := (cond (reflect.IsSlice $source) (delimit $source "") $source) -}}
|
||||
{{- with ($sourceContent | strings.Chomp) -}}
|
||||
{{ (printf "\n\n```%s\n%s\n```\n" $language .) | safeHTML -}}
|
||||
{{- end -}}
|
||||
|
||||
<div class="hextra-jupyter-code-cell hextra-scrollbar">
|
||||
{{- $outputs := index $cell "outputs" -}}
|
||||
{{- with $outputs -}}
|
||||
<div class="hextra-jupyter-code-cell-outputs-container">
|
||||
<div class="hextra-jupyter-code-cell-outputs">
|
||||
{{- range $output := . -}}
|
||||
{{- if eq (index $output "output_type") "display_data" -}}
|
||||
{{- $data := index $output "data" -}}
|
||||
{{- $image := index $data "image/png" -}}
|
||||
{{- if $image -}}
|
||||
<img src="data:image/png;base64,{{- $image -}}" alt="image" />
|
||||
{{- end -}}
|
||||
{{- else if eq (index $output "output_type") "stream" -}}
|
||||
{{- $text := index $output "text" -}}
|
||||
{{- $textContent := (cond (reflect.IsSlice $text) (delimit $text "") $text) -}}
|
||||
<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">{{- $textContent -}}</pre>
|
||||
{{- $html := index $data "text/html" -}}
|
||||
{{- if $html -}}
|
||||
{{- $htmlText := delimit $html "" -}}
|
||||
<div>
|
||||
{{- $htmlText | safeHTML -}}
|
||||
</div>
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
</div>
|
||||
</div>
|
||||
{{- end -}}
|
||||
</div>
|
||||
{{- else if eq (index $cell "cell_type") "markdown" -}}
|
||||
{{- $source := index $cell "source" }}
|
||||
{{- $sourceContent := (cond (reflect.IsSlice $source) (delimit $source "") $source) }}
|
||||
{{ (printf "\n%s\n" $sourceContent) | safeHTML }}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
{{- end -}}
|
||||
7
package-lock.json
generated
7
package-lock.json
generated
@ -980,11 +980,10 @@
|
||||
}
|
||||
},
|
||||
"node_modules/micromatch": {
|
||||
"version": "4.0.7",
|
||||
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.7.tgz",
|
||||
"integrity": "sha512-LPP/3KorzCwBxfeUuZmaR6bG2kdeHSbe0P2tY3FLRU4vYrjYz5hI4QZwV0njUx3jeuKe67YukQ1LSPZBKDqO/Q==",
|
||||
"version": "4.0.8",
|
||||
"resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.8.tgz",
|
||||
"integrity": "sha512-PXwfBhYu0hBCPw8Dn0E+WDYb7af3dSLVWKi3HGv84IdF4TyFoC0ysxFd0Goxw7nSv4T/PzEJQxsYsEiFCKo2BA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"braces": "^3.0.3",
|
||||
"picomatch": "^2.3.1"
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user