gruh
19
themes/bl/exampleSite/content/samples/_index.md
Executable file
|
@ -0,0 +1,19 @@
|
|||
---
|
||||
title: "Samples"
|
||||
description: "See what's possible with Blowfish."
|
||||
|
||||
cascade:
|
||||
showEdit: false
|
||||
showSummary: false
|
||||
hideFeatureImage: false
|
||||
---
|
||||
|
||||
{{< lead >}}
|
||||
Blowfish brings your content to life. :heart_eyes:
|
||||
{{< /lead >}}
|
||||
|
||||
This section contains some demo pages that show how Blowfish renders different types of content. You can also see an example [taxonomy listing]({{< ref "tags" >}}) page.
|
||||
|
||||
_**Sidenote:** This page is just a standard Blowfish article listing and Hugo has been configured to generate a `samples` content type and display article summaries._
|
||||
|
||||
---
|
BIN
themes/bl/exampleSite/content/samples/charts/featured.jpg
Normal file
After Width: | Height: | Size: 42 KiB |
87
themes/bl/exampleSite/content/samples/charts/index.md
Executable file
|
@ -0,0 +1,87 @@
|
|||
---
|
||||
title: "Charts"
|
||||
date: 2019-03-06
|
||||
description: "Guide to Chart.js usage in Blowfish"
|
||||
summary: "Blowfish includes Chart.js for powerful charts and data visualisations."
|
||||
tags: ["chart", "sample", "graph", "shortcodes"]
|
||||
showDate: false
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
Blowfish includes support for Chart.js using the `chart` shortcode. Simply wrap the chart markup within the shortcode. Blowfish automatically themes charts to match the configured `colorScheme` parameter, however the colours can be customised using normal Chart.js syntax.
|
||||
|
||||
Refer to the [chart shortcode]({{< ref "docs/shortcodes#chart" >}}) docs for more details.
|
||||
|
||||
The examples below are a small selection taken from the [official Chart.js docs](https://www.chartjs.org/docs/latest/samples). You can also [view the page source](https://raw.githubusercontent.com/nunocoracao/blowfish/main/exampleSite/content/samples/charts/index.md) on GitHub to see the markup.
|
||||
|
||||
## Bar chart
|
||||
|
||||
<!-- prettier-ignore-start -->
|
||||
{{< chart >}}
|
||||
type: 'bar',
|
||||
data: {
|
||||
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
|
||||
datasets: [{
|
||||
label: 'My First Dataset',
|
||||
data: [65, 59, 80, 81, 56, 55, 40],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.2)',
|
||||
'rgba(255, 159, 64, 0.2)',
|
||||
'rgba(255, 205, 86, 0.2)',
|
||||
'rgba(75, 192, 192, 0.2)',
|
||||
'rgba(54, 162, 235, 0.2)',
|
||||
'rgba(153, 102, 255, 0.2)',
|
||||
'rgba(201, 203, 207, 0.2)'
|
||||
],
|
||||
borderColor: [
|
||||
'rgb(255, 99, 132)',
|
||||
'rgb(255, 159, 64)',
|
||||
'rgb(255, 205, 86)',
|
||||
'rgb(75, 192, 192)',
|
||||
'rgb(54, 162, 235)',
|
||||
'rgb(153, 102, 255)',
|
||||
'rgb(201, 203, 207)'
|
||||
],
|
||||
borderWidth: 1
|
||||
}]
|
||||
}
|
||||
{{< /chart >}}
|
||||
<!-- prettier-ignore-end -->
|
||||
|
||||
## Line chart
|
||||
|
||||
<!-- prettier-ignore-start -->
|
||||
{{< chart >}}
|
||||
type: 'line',
|
||||
data: {
|
||||
labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
|
||||
datasets: [{
|
||||
label: 'My First Dataset',
|
||||
data: [65, 59, 80, 81, 56, 55, 40],
|
||||
tension: 0.2
|
||||
}]
|
||||
}
|
||||
{{< /chart >}}
|
||||
<!-- prettier-ignore-end -->
|
||||
|
||||
## Doughnut chart
|
||||
|
||||
<!-- prettier-ignore-start -->
|
||||
{{< chart >}}
|
||||
type: 'doughnut',
|
||||
data: {
|
||||
labels: ['Red', 'Blue', 'Yellow'],
|
||||
datasets: [{
|
||||
label: 'My First Dataset',
|
||||
data: [300, 50, 100],
|
||||
backgroundColor: [
|
||||
'rgba(255, 99, 132, 0.7)',
|
||||
'rgba(54, 162, 235, 0.7)',
|
||||
'rgba(255, 205, 86, 0.7)'
|
||||
],
|
||||
borderWidth: 0,
|
||||
hoverOffset: 4
|
||||
}]
|
||||
}
|
||||
{{< /chart >}}
|
||||
<!-- prettier-ignore-end -->
|
After Width: | Height: | Size: 70 KiB |
102
themes/bl/exampleSite/content/samples/diagrams-flowcharts/index.md
Executable file
|
@ -0,0 +1,102 @@
|
|||
---
|
||||
title: "Diagrams and Flowcharts"
|
||||
date: 2019-03-06
|
||||
description: "Guide to Mermaid usage in Blowfish"
|
||||
summary: "It's easy to add diagrams and flowcharts to articles using Mermaid."
|
||||
tags: ["mermaid", "sample", "diagram", "shortcodes"]
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
Mermaid diagrams are supported in Blowfish using the `mermaid` shortcode. Simply wrap the diagram markup within the shortcode. Blowfish automatically themes Mermaid diagrams to match the configured `colorScheme` parameter.
|
||||
|
||||
Refer to the [mermaid shortcode]({{< ref "docs/shortcodes#mermaid" >}}) docs for more details.
|
||||
|
||||
The examples below are a small selection taken from the [official Mermaid docs](https://mermaid-js.github.io/mermaid/). You can also [view the page source](https://raw.githubusercontent.com/nunocoracao/blowfish/main/exampleSite/content/samples/diagrams-flowcharts/index.md) on GitHub to see the markup.
|
||||
|
||||
## Flowchart
|
||||
|
||||
<div style="background-color:white; padding: 20px">
|
||||
{{< mermaid >}}
|
||||
graph TD
|
||||
A[Christmas] -->|Get money| B(Go shopping)
|
||||
B --> C{Let me think}
|
||||
B --> G[/Another/]
|
||||
C ==>|One| D[Laptop]
|
||||
C -->|Two| E[iPhone]
|
||||
C -->|Three| F[Car]
|
||||
subgraph Section
|
||||
C
|
||||
D
|
||||
E
|
||||
F
|
||||
G
|
||||
end
|
||||
{{< /mermaid >}}
|
||||
</div>
|
||||
|
||||
## Sequence diagram
|
||||
|
||||
<div style="background-color:white; padding: 20px">
|
||||
{{< mermaid >}}
|
||||
sequenceDiagram
|
||||
autonumber
|
||||
par Action 1
|
||||
Alice->>John: Hello John, how are you?
|
||||
and Action 2
|
||||
Alice->>Bob: Hello Bob, how are you?
|
||||
end
|
||||
Alice->>+John: Hello John, how are you?
|
||||
Alice->>+John: John, can you hear me?
|
||||
John-->>-Alice: Hi Alice, I can hear you!
|
||||
Note right of John: John is perceptive
|
||||
John-->>-Alice: I feel great!
|
||||
loop Every minute
|
||||
John-->Alice: Great!
|
||||
end
|
||||
{{< /mermaid >}}
|
||||
</div>
|
||||
|
||||
## Class diagram
|
||||
|
||||
<div style="background-color:white; padding: 20px">
|
||||
{{< mermaid >}}
|
||||
classDiagram
|
||||
Animal "1" <|-- Duck
|
||||
Animal <|-- Fish
|
||||
Animal <--o Zebra
|
||||
Animal : +int age
|
||||
Animal : +String gender
|
||||
Animal: +isMammal()
|
||||
Animal: +mate()
|
||||
class Duck{
|
||||
+String beakColor
|
||||
+swim()
|
||||
+quack()
|
||||
}
|
||||
class Fish{
|
||||
-int sizeInFeet
|
||||
-canEat()
|
||||
}
|
||||
class Zebra{
|
||||
+bool is_wild
|
||||
+run()
|
||||
}
|
||||
{{< /mermaid >}}
|
||||
</div>
|
||||
|
||||
## Entity relationship diagram
|
||||
|
||||
<div style="background-color:white; padding: 20px">
|
||||
{{< mermaid >}}
|
||||
erDiagram
|
||||
CUSTOMER }|..|{ DELIVERY-ADDRESS : has
|
||||
CUSTOMER ||--o{ ORDER : places
|
||||
CUSTOMER ||--o{ INVOICE : "liable for"
|
||||
DELIVERY-ADDRESS ||--o{ ORDER : receives
|
||||
INVOICE ||--|{ ORDER : covers
|
||||
ORDER ||--|{ ORDER-ITEM : includes
|
||||
PRODUCT-CATEGORY ||--|{ PRODUCT : contains
|
||||
PRODUCT ||--o{ ORDER-ITEM : "ordered in"
|
||||
{{< /mermaid >}}
|
||||
</div>
|
||||
|
BIN
themes/bl/exampleSite/content/samples/emoji/featured.jpg
Normal file
After Width: | Height: | Size: 46 KiB |
20
themes/bl/exampleSite/content/samples/emoji/index.md
Executable file
|
@ -0,0 +1,20 @@
|
|||
---
|
||||
title: "Emoji :parachute:"
|
||||
date: 2019-03-05
|
||||
description: "Guide to Emoji usage in Blowfish"
|
||||
summary: "📖🏞️🧗🏽🐉🧙🏽♂️🧚🏽👸"
|
||||
tags: ["emoji", "sample"]
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
Emoji is supported throughout Blowfish by default. Emoji can be used in titles, menu items and article content.
|
||||
|
||||
{{< alert >}}
|
||||
**Note:** The rendering of these glyphs depends on the browser and the platform. To style the emoji you can either use a third party emoji font or a font stack.
|
||||
{{< /alert >}}
|
||||
|
||||
Emoji replacements are automatic throughout Blowfish, so you can use shorthand codes in your content and front matter and they will be converted to their corresponding symbols at build time.
|
||||
|
||||
**Example:** `see_no_evil` :see_no_evil:, `hear_no_evil` :hear_no_evil:, `speak_no_evil` :speak_no_evil:.
|
||||
|
||||
The [Emoji cheat sheet](http://www.emoji-cheat-sheet.com/) is a useful reference for emoji shorthand codes.
|
BIN
themes/bl/exampleSite/content/samples/external/featured.jpg
vendored
Normal file
After Width: | Height: | Size: 40 KiB |
15
themes/bl/exampleSite/content/samples/external/index.md
vendored
Executable file
|
@ -0,0 +1,15 @@
|
|||
---
|
||||
title: "An External Article"
|
||||
date: 2019-01-24
|
||||
externalUrl: "https://nunocoracao.com/projects/"
|
||||
summary: "The `externalUrl` front matter parameter can link to any URL."
|
||||
showReadingTime: true
|
||||
_build:
|
||||
render: "false"
|
||||
list: "local"
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
This page uses the `externalUrl` front matter parameter to link to an article outside of this Hugo website.
|
||||
|
||||
It's great for things like linking to posts on Medium or to research papers you may have hosted on third party websites.
|
BIN
themes/bl/exampleSite/content/samples/icons/featured.jpg
Normal file
After Width: | Height: | Size: 53 KiB |
111
themes/bl/exampleSite/content/samples/icons/index.md
Normal file
|
@ -0,0 +1,111 @@
|
|||
---
|
||||
title: "Icons"
|
||||
date: 2020-08-14
|
||||
lastmod: 2022-03-09
|
||||
draft: false
|
||||
description: "Icon support in Blowfish."
|
||||
slug: "icons"
|
||||
tags: ["icons", "sample", "shortcodes"]
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
Blowfish has built-in support for a number of [FontAwesome 6](https://fontawesome.com/icons) icons. These can be included in your website through either the [icon partial]({{< ref "docs/partials#icon" >}}) or [icon shortcode]({{< ref "docs/shortcodes#icon" >}}).
|
||||
|
||||
Additionally, custom icons are also fully supported. Simply provide your own SVG icon assets by placing them in the `assets/icons/` directory in the root of your project. Any icons in the icons directory will then be available to use throughout the theme. In order achieve automatic color filling every SVG path needs fill="currentColor" XML attribute.
|
||||
|
||||
The full list of built-in icons and their corresponding names can referenced below.
|
||||
|
||||
| Icon name | Preview |
|
||||
| -------------------- | --------------------------------- |
|
||||
| amazon | {{< icon amazon >}} |
|
||||
| apple | {{< icon apple >}} |
|
||||
| bars | {{< icon bars >}} |
|
||||
| bell | {{< icon bell >}} |
|
||||
| blogger | {{< icon blogger >}} |
|
||||
| bomb | {{< icon bomb >}} |
|
||||
| bug | {{< icon bug >}} |
|
||||
| check | {{< icon check >}} |
|
||||
| circle-info | {{< icon circle-info >}} |
|
||||
| code | {{< icon code>}} |
|
||||
| codepen | {{< icon codepen >}} |
|
||||
| comment | {{< icon comment >}} |
|
||||
| dev | {{< icon dev >}} |
|
||||
| discourse | {{< icon discourse >}} |
|
||||
| docker | {{< icon docker >}} |
|
||||
| download | {{< icon download >}} |
|
||||
| dribbble | {{< icon dribbble >}} |
|
||||
| edit | {{< icon edit >}} |
|
||||
| email | {{< icon email >}} |
|
||||
| envelope | {{< icon envelope >}} |
|
||||
| eye | {{< icon eye >}} |
|
||||
| facebook | {{< icon facebook >}} |
|
||||
| fire | {{< icon fire >}} |
|
||||
| flickr | {{< icon flickr >}} |
|
||||
| fork | {{< icon fork >}} |
|
||||
| foursquare | {{< icon foursquare >}} |
|
||||
| ghost | {{< icon ghost >}} |
|
||||
| github | {{< icon github >}} |
|
||||
| gitlab | {{< icon gitlab >}} |
|
||||
| globe | {{< icon globe >}} |
|
||||
| goodreads | {{< icon goodreads >}} |
|
||||
| google | {{< icon google >}} |
|
||||
| graduation-cap | {{< icon graduation-cap >}} |
|
||||
| hackernews | {{< icon hackernews >}} |
|
||||
| hashnode | {{< icon hashnode >}} |
|
||||
| heart-empty | {{< icon heart-empty >}} |
|
||||
| heart | {{< icon heart >}} |
|
||||
| image | {{< icon image >}} |
|
||||
| instagram | {{< icon instagram >}} |
|
||||
| keybase | {{< icon keybase >}} |
|
||||
| kickstarter | {{< icon kickstarter >}} |
|
||||
| ko-fi | {{< icon ko-fi >}} |
|
||||
| lastfm | {{< icon lastfm >}} |
|
||||
| lightbulb | {{< icon lightbulb >}} |
|
||||
| link | {{< icon link >}} |
|
||||
| linkedin | {{< icon linkedin >}} |
|
||||
| list | {{< icon list >}} |
|
||||
| location-dot | {{< icon location-dot >}} |
|
||||
| lock | {{< icon lock >}} |
|
||||
| mastodon | {{< icon mastodon >}} |
|
||||
| medium | {{< icon medium >}} |
|
||||
| microsoft | {{< icon microsoft >}} |
|
||||
| moon | {{< icon moon >}} |
|
||||
| mug-hot | {{< icon mug-hot >}} |
|
||||
| music | {{< icon music >}} |
|
||||
| orcid | {{< icon orcid >}} |
|
||||
| patreon | {{< icon patreon >}} |
|
||||
| paypal | {{< icon paypal >}} |
|
||||
| pencil | {{< icon pencil >}} |
|
||||
| pgpkey | {{< icon pgpkey >}} |
|
||||
| phone | {{< icon phone >}} |
|
||||
| pinterest | {{< icon pinterest >}} |
|
||||
| poo | {{< icon poo >}} |
|
||||
| reddit | {{< icon reddit >}} |
|
||||
| researchgate | {{< icon researchgate >}} |
|
||||
| rss | {{< icon rss >}} |
|
||||
| rss-square | {{< icon rss-square >}} |
|
||||
| scale-balanced | {{< icon scale-balanced >}} |
|
||||
| search | {{< icon search >}} |
|
||||
| shield | {{< icon shield >}} |
|
||||
| skull-crossbones | {{< icon skull-crossbones >}} |
|
||||
| slack | {{< icon slack >}} |
|
||||
| snapchat | {{< icon snapchat >}} |
|
||||
| soundcloud | {{< icon soundcloud >}} |
|
||||
| stack-overflow | {{< icon stack-overflow >}} |
|
||||
| star | {{< icon star >}} |
|
||||
| steam | {{< icon steam >}} |
|
||||
| stripe | {{< icon stripe >}} |
|
||||
| substack | {{< icon substack >}} |
|
||||
| sun | {{< icon sun >}} |
|
||||
| tag | {{< icon tag >}} |
|
||||
| telegram | {{< icon telegram >}} |
|
||||
| tiktok | {{< icon tiktok >}} |
|
||||
| triangle-exclamation | {{< icon triangle-exclamation >}} |
|
||||
| tumblr | {{< icon tumblr >}} |
|
||||
| twitch | {{< icon twitch >}} |
|
||||
| twitter | {{< icon twitter >}} |
|
||||
| wand-magic-sparkles | {{< icon wand-magic-sparkles >}} |
|
||||
| whatsapp | {{< icon whatsapp >}} |
|
||||
| x-twitter | {{< icon x-twitter >}} |
|
||||
| xmark | {{< icon xmark >}} |
|
||||
| youtube | {{< icon youtube >}} |
|
BIN
themes/bl/exampleSite/content/samples/markdown/featured.jpg
Normal file
After Width: | Height: | Size: 98 KiB |
146
themes/bl/exampleSite/content/samples/markdown/index.md
Executable file
|
@ -0,0 +1,146 @@
|
|||
---
|
||||
title: "Markdown"
|
||||
date: 2019-03-11
|
||||
description: "Sample article showcasing basic Markdown syntax and formatting for HTML elements."
|
||||
tags: ["markdown", "css", "html", "sample"]
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
This article offers a sample of basic Markdown formatting that can be used in Blowfish, also it shows how some basic HTML elements are decorated.
|
||||
|
||||
<!--more-->
|
||||
|
||||
## Headings
|
||||
|
||||
The following HTML `<h1>`—`<h6>` elements represent six levels of section headings. `<h1>` is the highest section level while `<h6>` is the lowest.
|
||||
|
||||
# H1
|
||||
|
||||
## H2
|
||||
|
||||
### H3
|
||||
|
||||
#### H4
|
||||
|
||||
##### H5
|
||||
|
||||
###### H6
|
||||
|
||||
## Paragraph
|
||||
|
||||
Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.
|
||||
|
||||
Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.
|
||||
|
||||
## Blockquotes
|
||||
|
||||
The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations.
|
||||
|
||||
### Blockquote without attribution
|
||||
|
||||
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.
|
||||
> **Note** that you can use _Markdown syntax_ within a blockquote.
|
||||
|
||||
### Blockquote with attribution
|
||||
|
||||
> Don't communicate by sharing memory, share memory by communicating.<br>
|
||||
> — <cite>Rob Pike[^1]</cite>
|
||||
|
||||
[^1]: The above quote is excerpted from Rob Pike's [talk `about` nothing](https://www.youtube.com/watch?v=PAAkCSZUG1c) during Gopherfest, November 18, 2015.
|
||||
|
||||
## Tables
|
||||
|
||||
Tables aren't part of the core Markdown spec, but Hugo supports supports them out-of-the-box.
|
||||
|
||||
| Name | Age |
|
||||
| ----- | --- |
|
||||
| Bob | 27 |
|
||||
| Alice | 23 |
|
||||
|
||||
### Inline Markdown within tables
|
||||
|
||||
| Italics | Bold | Code |
|
||||
| --------- | -------- | ------ |
|
||||
| _italics_ | **bold** | `code` |
|
||||
|
||||
## Code Blocks
|
||||
|
||||
### Code block with backticks
|
||||
|
||||
```html
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<title>Example HTML5 Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<p>Test</p>
|
||||
</body>
|
||||
</html>
|
||||
```
|
||||
|
||||
### Code block indented with four spaces
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Example HTML5 Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<p>Test</p>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
### Code block with Hugo's internal highlight shortcode
|
||||
|
||||
{{< highlight html "linenos=table,hl_lines=4 7-9" >}}
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Example HTML5 Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<p>Test</p>
|
||||
</body>
|
||||
</html>
|
||||
{{< /highlight >}}
|
||||
|
||||
## List Types
|
||||
|
||||
### Ordered List
|
||||
|
||||
1. First item
|
||||
2. Second item
|
||||
3. Third item
|
||||
|
||||
### Unordered List
|
||||
|
||||
- List item
|
||||
- Another item
|
||||
- And another item
|
||||
|
||||
### Nested list
|
||||
|
||||
- Fruit
|
||||
- Apple
|
||||
- Orange
|
||||
- Banana
|
||||
- Dairy
|
||||
- Milk
|
||||
- Cheese
|
||||
|
||||
## Other Elements — abbr, sub, sup, kbd, mark
|
||||
|
||||
<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.
|
||||
|
||||
H<sub>2</sub>O
|
||||
|
||||
X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
|
||||
|
||||
Press <kbd>CTRL</kbd>+<kbd>ALT</kbd>+<kbd>Delete</kbd> to end the session.
|
||||
|
||||
Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and other small creatures.
|
After Width: | Height: | Size: 55 KiB |
50
themes/bl/exampleSite/content/samples/mathematical-notation/index.md
Executable file
|
@ -0,0 +1,50 @@
|
|||
---
|
||||
title: Mathematical notation
|
||||
date: 2019-03-08
|
||||
description: A brief sample of mathematical notation in Blowfish.
|
||||
tags: ["sample", "katex", "maths", "shortcodes"]
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
KaTeX can be used to render mathematical notation within articles.
|
||||
|
||||
<!--more-->
|
||||
|
||||
{{< katex >}}
|
||||
|
||||
Blowfish will only bundle the KaTeX assets into your project if you make use of mathematical notation. In order for this to work, simply include the [`katex` shortcode]({{< ref "docs/shortcodes#katex" >}}) within the article. Example below:
|
||||
|
||||
```md
|
||||
{{</* katex */>}}
|
||||
```
|
||||
Any KaTeX syntax on that page will then be automatically rendered. Use the online reference of [supported TeX functions](https://katex.org/docs/supported.html) for the available syntax.
|
||||
|
||||
## Inline notation
|
||||
|
||||
Inline notation can be generated by wrapping the expression in `\\(` and `\\)` delimiters.
|
||||
|
||||
**Example:**
|
||||
|
||||
```tex
|
||||
% KaTeX inline notation
|
||||
Inline notation: \\(\varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887…\\)
|
||||
```
|
||||
|
||||
Inline notation: \\(\varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887…\\)
|
||||
|
||||
## Block notation
|
||||
|
||||
Alternatively, block notation can be generated using `$$` delimiters. This will output the expression in its own HTML block.
|
||||
|
||||
**Example:**
|
||||
|
||||
```tex
|
||||
% KaTeX block notation
|
||||
$$
|
||||
\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } }
|
||||
$$
|
||||
```
|
||||
|
||||
$$
|
||||
\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } }
|
||||
$$
|
After Width: | Height: | Size: 43 KiB |
|
@ -0,0 +1,15 @@
|
|||
---
|
||||
title: "Multiple Authors"
|
||||
date: 2022-10-12
|
||||
draft: false
|
||||
description: "Sample for a multiple author setup"
|
||||
tags: ["authors", "sample"]
|
||||
summary: "A quick example of how multiple authors could be used."
|
||||
showAuthor: false
|
||||
authors:
|
||||
- "nunocoracao"
|
||||
- "secondauthor"
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
This is an example of how an article with multiple authors will look like.
|
40
themes/bl/exampleSite/content/samples/placeholder-text/index.md
Executable file
|
@ -0,0 +1,40 @@
|
|||
---
|
||||
title: "Placeholder Text"
|
||||
date: "2019-03-09"
|
||||
lastmod: "2022-01-24"
|
||||
draft: false
|
||||
description: "Lorem Ipsum Dolor Si Amet"
|
||||
tags: ["markdown", "text", "sample", "latin"]
|
||||
showDateUpdated: true
|
||||
xml: false
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
Lorem est tota propiore conpellat pectoribus de pectora summo. <!--more-->Redit teque digerit hominumque toris verebor lumina non cervice subde tollit usus habet Arctonque, furores quas nec ferunt. Quoque montibus nunc caluere tempus inhospita parcite confusaque translucet patri vestro qui optatis lumine cognoscere flos nubis! Fronde ipsamque patulos Dryopen deorum.
|
||||
|
||||
1. Exierant elisi ambit vivere dedere
|
||||
2. Duce pollice
|
||||
3. Eris modo
|
||||
4. Spargitque ferrea quos palude
|
||||
|
||||
Rursus nulli murmur; hastile inridet ut ab gravi sententia! Nomine potitus silentia flumen, sustinet placuit petis in dilapsa erat sunt. Atria tractus malis.
|
||||
|
||||
1. Comas hunc haec pietate fetum procerum dixit
|
||||
2. Post torum vates letum Tiresia
|
||||
3. Flumen querellas
|
||||
4. Arcanaque montibus omnes
|
||||
5. Quidem et
|
||||
|
||||
## Vagus elidunt
|
||||
|
||||
<svg xmlns="http://www.w3.org/2000/svg" overflow="visible" viewBox="0 0 496 373" height="186" width="248"><g fill="none"><path stroke="#000" stroke-width="2" d="M.599 372.348L495.263 1.206M.312.633l494.95 370.853M.312 372.633L247.643.92M248.502.92l246.76 370.566M330.828 123.869V1.134M330.396 1.134L165.104 124.515"></path><path stroke="#ED1C24" stroke-width="2" d="M275.73 41.616h166.224v249.05H275.73zM54.478 41.616h166.225v249.052H54.478z"></path><path stroke="#000" stroke-width="2" d="M.479.375h495v372h-495zM247.979.875v372"></path><ellipse cx="498.729" cy="177.625" rx="2" ry="1.25"></ellipse><ellipse cx="247.229" cy="377.375" rx="2" ry="1.25"></ellipse></g></svg>
|
||||
|
||||
[The Van de Graaf Canon](https://en.wikipedia.org/wiki/Canons_of_page_construction#Van_de_Graaf_canon)
|
||||
|
||||
### Mane refeci capiebant unda mulcebat
|
||||
|
||||
Victa caducifer, malo vulnere contra dicere aurato, ludit regale, voca! Retorsit colit est profanae esse virescere furit nec; iaculi matertera et visa est, viribus. Divesque creatis, tecta novat collumque vulnus est, parvas. **Faces illo pepulere** tempus adest. Tendit flamma, ab opes virum sustinet, sidus sequendo urbis.
|
||||
|
||||
Iubar proles corpore raptos vero auctor imperium; sed et huic: manus caeli Lelegas tu lux. Verbis obstitit intus oblectamina fixis linguisque ausus sperare Echionides cornuaque tenent clausit possit. Omnia putatur. Praeteritae refert ausus; ferebant e primus lora nutat, vici quae mea ipse. Et iter nil spectatae vulnus haerentia iuste et exercebat, sui et.
|
||||
|
||||
Eurytus Hector, materna ipsumque ut Politen, nec, nate, ignari, vernum cohaesit sequitur. Vel **mitis temploque** vocatus, inque alis, _oculos nomen_ non silvis corpore coniunx ne displicet illa. Crescunt non unus, vidit visa quantum inmiti flumina mortis facto sic: undique a alios vincula sunt iactata abdita! Suspenderat ego fuit tendit: luna, ante urbem Propoetides **parte**.
|
BIN
themes/bl/exampleSite/content/samples/rich-content/featured.jpg
Normal file
After Width: | Height: | Size: 24 KiB |
36
themes/bl/exampleSite/content/samples/rich-content/index.md
Executable file
|
@ -0,0 +1,36 @@
|
|||
---
|
||||
title: "Rich Content"
|
||||
date: 2019-03-10
|
||||
description: "A brief description of Hugo Shortcodes"
|
||||
summary: "This is an _example_ of a **rich** content summary."
|
||||
tags: ["shortcodes", "privacy", "sample", "gist", "twitter", "youtube", "vimeo"]
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
Hugo ships with several [built-in shortcodes](https://gohugo.io/content-management/shortcodes/#use-hugos-built-in-shortcodes) for rich content, along with a [privacy config](https://gohugo.io/about/hugo-and-gdpr/) and a set of _simple shortcodes_ that enable static and no-JS versions of various social media embeds.
|
||||
|
||||
## YouTube
|
||||
|
||||
Below is an example using the built-in `youtube` shortcode.
|
||||
|
||||
{{< youtube ZJthWmvUzzc >}}
|
||||
|
||||
## Twitter
|
||||
|
||||
This example uses the `twitter_simple` shortcode to output a Tweet. It requires two named parameters `user` and `id`.
|
||||
|
||||
{{< twitter_simple user="DesignReviewed" id="1085870671291310081" >}}
|
||||
|
||||
Alternatively, the `tweet` shortcode can be used to embed a fully marked up Twitter card.
|
||||
|
||||
## Gist
|
||||
|
||||
The `gist` shortcode can be used to embed a GitHub Gist. It requires two unnamed parameters: the username and ID of the Gist.
|
||||
|
||||
{{< gist nunocoracao 2779792841f7ffa7c7e62dc4d38626d4 >}}
|
||||
|
||||
## Vimeo
|
||||
|
||||
The `vimeo_simple` shortcode will embed a Vimeo video.
|
||||
|
||||
{{< vimeo_simple 48912912 >}}
|
After Width: | Height: | Size: 86 KiB |
|
@ -0,0 +1,38 @@
|
|||
---
|
||||
title: "Thumbnails"
|
||||
date: 2022-09-26
|
||||
draft: false
|
||||
description: "Turn on thumbnails for your articles."
|
||||
slug: "thumbnail_sample"
|
||||
tags: ["thumbnail", "sample"]
|
||||
summary: "A quick example of how to start using Thumbnails in your artciles."
|
||||
type: 'sample'
|
||||
---
|
||||
|
||||
A quick example of how to start using Thumbnails in your articles.
|
||||
|
||||
If your average directory for an article looks like this:
|
||||
|
||||
```shell
|
||||
content
|
||||
└── awesome_article.md
|
||||
```
|
||||
|
||||
You need to change it from a single markdown file into a folder. Create a directory with the same name of the article, inside create a `index.md` file. You'll get a structure similar to what's below.
|
||||
|
||||
```shell
|
||||
content
|
||||
└── awesome_article
|
||||
└── featured.png
|
||||
```
|
||||
|
||||
Inside the article you can now add an image file (almost all formats are supported but we recommend `.png` or `.jpg`) that starts with `feature*`. Example below.
|
||||
|
||||
```shell
|
||||
content
|
||||
└── awesome_article
|
||||
├── index.md
|
||||
└── featured.png
|
||||
```
|
||||
|
||||
This will tell Blowfish that this article has a feature image that can be used both as a thumbnail across your website as well as for <a target="_blank" href="https://oembed.com/">oEmbed</a> cards across social platforms. As an example, you can try copy pasting the URL of this article into a platform that shows oEmbeds (e.g. Twitter, WhatsApp, Telegram, etc) and see what is displayed.
|