204 lines
6.3 KiB
Markdown
204 lines
6.3 KiB
Markdown
---
|
|
title: new template
|
|
date: 2021-08-27
|
|
tags:
|
|
- hugo
|
|
summary: >
|
|
It took me a long time,
|
|
but I finally created a hugo template I was
|
|
sketching for quite some time.
|
|
It is heavily inspired of after-dark
|
|
but I was to "dark" for me.
|
|
---
|
|
|
|
|
|
It took me a long time,
|
|
but I finally created a hugo template I was
|
|
sketching for quite some time.
|
|
It is heavily inspired of [after-dark](https://after-dark.habd.as/)
|
|
but I was to "dark" for me.
|
|
|
|
Here is a list of elements.
|
|
|
|
## Paragraphs
|
|
|
|
I found it strange that margin of headings do not intersect with
|
|
margins of the other elements.
|
|
|
|
But margins of paragraphs do intersect with other elements like divs
|
|
or anything.
|
|
|
|
{{< flexbox-half >}}
|
|
{{% flexitem %}}{{% card text="1/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="2/2" /%}}{{% /flexitem %}}
|
|
{{< /flexbox-half >}}
|
|
|
|
|
|
## Images
|
|
|
|
{{% figure
|
|
src="https://images.pexels.com/photos/262325/pexels-photo-262325.jpeg?auto=compress&cs=tinysrgb&h=750&w=1260"
|
|
width="100%" %}}
|
|
|
|
|
|
## Subsections
|
|
|
|
yey.
|
|
|
|
## Cards
|
|
|
|
If you wand to highlight something, use cards.
|
|
|
|
### with header
|
|
|
|
{{% card header="with card header" %}}
|
|
card body
|
|
{{% /card %}}
|
|
|
|
|
|
### without header
|
|
|
|
{{% card %}}
|
|
card body
|
|
{{% /card %}}
|
|
|
|
### Warnings and Notes
|
|
|
|
{{% note %}}
|
|
Awesome Note
|
|
{{% /note %}}
|
|
|
|
{{% warning %}}
|
|
Important Warning
|
|
{{% /warning %}}
|
|
|
|
|
|
## block quotes
|
|
|
|
A bit of text before
|
|
|
|
> Not really satisfied with the blockquotes yet.
|
|
|
|
a bit of text behind.
|
|
|
|
## Flex box
|
|
|
|
<br>
|
|
|
|
### flexbox half
|
|
|
|
{{< flexbox-half >}}
|
|
{{% flexitem %}}{{% card text="1/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="2/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="3/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="4/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="5/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="6/2" /%}}{{% /flexitem %}}
|
|
{{< /flexbox-half >}}
|
|
|
|
|
|
### flexbox half
|
|
|
|
{{< flexbox-half >}}
|
|
{{% flexitem %}}{{% card header="header" text="1/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card header="header" text="2/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card header="header" text="3/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card header="header" text="4/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card header="header" text="5/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card header="header" text="6/2" /%}}{{% /flexitem %}}
|
|
{{< /flexbox-half >}}
|
|
|
|
### flexbox thrid
|
|
|
|
{{< flexbox-third >}}
|
|
{{% flexitem %}}{{% card text="1/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="2/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="3/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="4/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="5/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="6/3" /%}}{{% /flexitem %}}
|
|
{{< /flexbox-third >}}
|
|
|
|
## Flex box in Big Content
|
|
|
|
{{% content-big %}}
|
|
{{< flexbox-half >}}
|
|
{{% flexitem %}}{{% card text="1/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="2/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="3/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="1/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="1/2" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="1" /%}}{{% /flexitem %}}
|
|
{{< /flexbox-half >}}
|
|
|
|
{{< flexbox-third >}}
|
|
{{% flexitem %}}{{% card text="1/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="2/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="3/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="4/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="5/3" /%}}{{% /flexitem %}}
|
|
{{% flexitem %}}{{% card text="6/3" /%}}{{% /flexitem %}}
|
|
{{< /flexbox-third >}}
|
|
|
|
|
|
{{% /content-big %}}
|
|
|
|
## Lists
|
|
|
|
of course
|
|
|
|
* la la la la la
|
|
* lo lo lo lo lo
|
|
* lololololol
|
|
* lelelelelel
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
* lululululul
|
|
|
|
## Number lists
|
|
|
|
We also have numbered lists (of course).
|
|
|
|
1. la la la la la
|
|
1. lo lo lo lo lo
|
|
1. lololololol
|
|
1. lelelelelel
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo yolo
|
|
1. lululululul
|
|
|
|
## Big parts
|
|
|
|
Big parts are useful for code
|
|
|
|
```shell
|
|
#!/usr/bin/env bash
|
|
echo "small code"
|
|
```
|
|
|
|
{{% content-big %}}
|
|
```shell
|
|
#!/usr/bin/env bash
|
|
cat <<EOF
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
very very very big code very big code very big code very big code very big code very big code very big code very big code
|
|
EOF
|
|
```
|
|
|