commit 5da70d6ceaab1f08b2b369a75fd6710eb3fcb911 Author: arian Date: Sun Feb 4 22:53:14 2024 +0100 first commit since installation of Gitea diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..f8ea838 --- /dev/null +++ b/.gitignore @@ -0,0 +1,6 @@ +node_modules +package.json +package-lock.json +.htaccess +_site +.eleventy.js diff --git a/_src/404.md b/_src/404.md new file mode 100644 index 0000000..54f3283 --- /dev/null +++ b/_src/404.md @@ -0,0 +1,7 @@ +--- +title: Oops! Not Found +layout: base +permalink: /404.html +--- + +The page you entered does not exist. [Return to Homepage](/) \ No newline at end of file diff --git a/_src/_data/site.json b/_src/_data/site.json new file mode 100644 index 0000000..688a61b --- /dev/null +++ b/_src/_data/site.json @@ -0,0 +1,5 @@ +{ + "author": "Arian Furrer", + "description": "Personal homepage", + "url": "https://arian.li" +} \ No newline at end of file diff --git a/_src/_includes/base.njk b/_src/_includes/base.njk new file mode 100644 index 0000000..7f017d9 --- /dev/null +++ b/_src/_includes/base.njk @@ -0,0 +1,71 @@ + + + + + + + + + + + + + + {{ title }} + + + + + +

+ Navigation + {% include "partials/nav-list.njk" %} +

+ +

+ {{ content | safe}} +

+ + + + + \ No newline at end of file diff --git a/_src/_includes/home.njk b/_src/_includes/home.njk new file mode 100644 index 0000000..f3dfbbb --- /dev/null +++ b/_src/_includes/home.njk @@ -0,0 +1,6 @@ +--- +layout: base +--- + + +{{ content | safe }} \ No newline at end of file diff --git a/_src/_includes/music-review.njk b/_src/_includes/music-review.njk new file mode 100644 index 0000000..0ee6ad9 --- /dev/null +++ b/_src/_includes/music-review.njk @@ -0,0 +1,35 @@ +--- +layout: base +--- + +

Review: {{ album_artist }} ‐ {{ album_name }}

+ +

+ + + + + + + + + + + + + + + + + + + + + + +

Artist	{{ album_artist }}
Album	{{ album_name }} +
Release Year	{{ album_year }}
Tracks	{{ album_tracks }}
Length	{{ album_length }}

+ +

+ {{ content | safe }} +

\ No newline at end of file diff --git a/_src/_includes/partials/nav-list.njk b/_src/_includes/partials/nav-list.njk new file mode 100644 index 0000000..bcf43c3 --- /dev/null +++ b/_src/_includes/partials/nav-list.njk @@ -0,0 +1,29 @@ +{% set navPages = collections.all | eleventyNavigation %} + +{% macro renderNavListItem(entry) %} + {% if entry.children.length %} +

+ {%- for child in entry.children %}{{ renderNavListItem(child) }}{% endfor -%} + +

+ {% else %} +

+ {{ entry.title }} +

+ {%- endif -%} +{%- endmacro %} + +

+{%- for entry in navPages %}{{ renderNavListItem(entry) }}{%- endfor -%} + \ No newline at end of file diff --git a/_src/_includes/test.njk b/_src/_includes/test.njk new file mode 100644 index 0000000..133bedd --- /dev/null +++ b/_src/_includes/test.njk @@ -0,0 +1,8 @@ +--- +layout: base +--- + +{{ content | safe }} + +{% set navPages = collections.all | eleventyNavigation %} +{{ navPages | dump | safe }} \ No newline at end of file diff --git a/_src/_media/favicon.png b/_src/_media/favicon.png new file mode 100644 index 0000000..91a39da Binary files /dev/null and b/_src/_media/favicon.png differ diff --git a/_src/index.md b/_src/index.md new file mode 100644 index 0000000..cbe7c04 --- /dev/null +++ b/_src/index.md @@ -0,0 +1,8 @@ +--- +eleventyNavigation: + key: Home +title: Home +layout: home +--- + +**This is a WIP and nothing is final!** diff --git a/_src/music-reviews/index.md b/_src/music-reviews/index.md new file mode 100644 index 0000000..f89c549 --- /dev/null +++ b/_src/music-reviews/index.md @@ -0,0 +1,12 @@ +--- +eleventyNavigation: + key: Music Reviews +title: Music Reviews +description: Sitemap for all Music Reviews +--- + +# All Reviews + +{% for review in collections.music_reviews %} +- [{{ review.data.album_artist }} — {{ review.data.album_name }}]({{ review.url }}) +{% endfor %} diff --git a/_src/music-reviews/iron-maiden/index.md b/_src/music-reviews/iron-maiden/index.md new file mode 100644 index 0000000..c301a7f --- /dev/null +++ b/_src/music-reviews/iron-maiden/index.md @@ -0,0 +1,6 @@ +--- +eleventyNavigation: + key: Iron Maiden + parent: Music Reviews +permalink: false +--- \ No newline at end of file diff --git a/_src/music-reviews/iron-maiden/iron-maiden.json b/_src/music-reviews/iron-maiden/iron-maiden.json new file mode 100644 index 0000000..f530216 --- /dev/null +++ b/_src/music-reviews/iron-maiden/iron-maiden.json @@ -0,0 +1,3 @@ +{ + "album_artist": "Iron Maiden" +} \ No newline at end of file diff --git a/_src/music-reviews/iron-maiden/somewhere-in-time.md b/_src/music-reviews/iron-maiden/somewhere-in-time.md new file mode 100644 index 0000000..8edc356 --- /dev/null +++ b/_src/music-reviews/iron-maiden/somewhere-in-time.md @@ -0,0 +1,12 @@ +--- +title: Somewhere in Time +eleventyNavigation: + key: Somewhere in Time + parent: Iron Maiden +album_name: Somewhere in Time +album_tracks: 8 +album_length: 51 min 40 sec +album_year: 1985 +--- + +This is a test. The review for this album will be written soon \ No newline at end of file diff --git a/_src/music-reviews/music-reviews.json b/_src/music-reviews/music-reviews.json new file mode 100644 index 0000000..3f16077 --- /dev/null +++ b/_src/music-reviews/music-reviews.json @@ -0,0 +1,4 @@ +{ + "layout": "music-review", + "tags": "music_reviews" +} \ No newline at end of file diff --git a/_src/music-reviews/sylvatica/ashes-and-snow.md b/_src/music-reviews/sylvatica/ashes-and-snow.md new file mode 100644 index 0000000..3d726e1 --- /dev/null +++ b/_src/music-reviews/sylvatica/ashes-and-snow.md @@ -0,0 +1,12 @@ +--- +title: Ashes and Snow +eleventyNavigation: + key: Ashes and Snow + parent: Sylvatica +album_name: Ashes and Snow +album_tracks: 7 +album_length: 42 min 58 sec +album_year: 2021 +--- + +This is a test. The review for this album will be written soon diff --git a/_src/music-reviews/sylvatica/index.md b/_src/music-reviews/sylvatica/index.md new file mode 100644 index 0000000..a75a5ec --- /dev/null +++ b/_src/music-reviews/sylvatica/index.md @@ -0,0 +1,6 @@ +--- +eleventyNavigation: + key: Sylvatica + parent: Music Reviews +permalink: false +--- \ No newline at end of file diff --git a/_src/music-reviews/sylvatica/sylvatica.json b/_src/music-reviews/sylvatica/sylvatica.json new file mode 100644 index 0000000..52dada5 --- /dev/null +++ b/_src/music-reviews/sylvatica/sylvatica.json @@ -0,0 +1,3 @@ +{ + "album_artist": "Sylvatica" +} \ No newline at end of file diff --git a/_src/style.css b/_src/style.css new file mode 100644 index 0000000..2e8301a --- /dev/null +++ b/_src/style.css @@ -0,0 +1,234 @@ +/* VARIABLES */ + +:root { + --header-background: #282a36; + --nav-background: #282a36; + --footer-background: #282a36; + --content-background: #44475a; + --table-borders: #f8f8f2; + --link-not-visited: #50fa7b; + --link-hover: #f1fa8c; + --link-visited: #ffb86c; + --font-color: #f8f8f2; +} + +/* STYLING */ + +* { + box-sizing: border-box; +} + +body { + font-family: 'Fira Sans', 'Open Sans', 'sans-serif'; + font-size: 13pt; + color: var(--font-color); + background-color: var(--content-background); + padding: 0; +} + +a:link { + color: var(--link-not-visited); +} + +a:visited { + color: var(--link-visited); +} + +a:hover { + color: var(--link-hover); +} + +h1, h2, h3, h4, h5, h6 { + font-weight: bold; + font-family: 'Open Sans'; +} + +h1, h2 { + font-size: 20pt; +} + +h1 { + color: #bd93f9; +} + +h2, h3 { + font-style: italic; + color: #ff79c6; +} + +h3, h4 { + font-size: 18pt; +} + +h4 { + font-style: italic; +} + +h5, h6 { + font-size: 16pt; +} + +.header, +.footer, +.column { + margin: 0; +} + +.header { + background-color: var(--header-background); + padding: 4px; + text-align: center; + position: sticky; + z-index: 999; + top: 0; +} + +.website-title { + font-size: 40pt; + color: #6272a4; +} + +/* Create three unequal columns that floats next to each other */ +.column { + float: left; + padding: 10px; + overflow: auto; +} + +.column.right { + width: 75%; + background-color: var(--content-background); +} + +.column.left { + width: 25%; + background-color: var(--nav-background); + left: 0; + margin-top: 20px; + margin-bottom: 20px; + padding-top: 20px; + padding-bottom: 20px; +} + +/* Clear floats after the columns */ +.row:after { + content: ""; + display: table; + clear: both; + font-size: 1px; + height: 1px; + background-color: var(--content-background); +} + +/* Style the footer */ +.footer { + background-color: var(--footer-background); + padding: 10px; + display: grid; + grid-template-columns: 25% 25% 25% 25%; + bottom: 0; + position: static; + width: 100%; +} + +/* Responsive layout - makes the three columns stack on top of each other instead of next to each other */ +@media (max-width: 600px) { + .column.side, .column.middle { + width: 100%; + } +} + +table { + border-collapse: collapse; +} + +td, th { + border: 1px solid white; + padding: 5px !important; +} + +.f-table-td { + float: left; + padding: 20px; + display: table-cell; +} + +.f-table { + border: none; + width: 100% !important; + max-height: max-content !important; +} + +hr { + width: 100%; +} + +/* navigation */ + +:where([role="list"]) { + list-style: none; + padding-inline-start: 0; +} + +.nav-list { + color: var(--link-not-visited); + user-select: none; +} + +.nav-list a { + color: inherit; + text-decoration: none; + display: block; +} + +.nav-list summary { + cursor: pointer; + display: block; + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 512'%3E%3Cpath d='M118.6 105.4l128 127.1C252.9 239.6 256 247.8 256 255.1s-3.125 16.38-9.375 22.63l-128 127.1c-9.156 9.156-22.91 11.9-34.88 6.943S64 396.9 64 383.1V128c0-12.94 7.781-24.62 19.75-29.58S109.5 96.23 118.6 105.4z' fill='%236A89FE'/%3E%3C/svg%3E"); + background-repeat: no-repeat; + background-position: right center; + background-size: 1.125em 1.125em; +} + +.nav-list details[open] > summary { + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M310.6 246.6l-127.1 128C176.4 380.9 168.2 384 160 384s-16.38-3.125-22.63-9.375l-127.1-128C.2244 237.5-2.516 223.7 2.438 211.8S19.07 192 32 192h255.1c12.94 0 24.62 7.781 29.58 19.75S319.8 237.5 310.6 246.6z' fill='%236A89FE'/%3E%3C/svg%3E"); +} + +.nav-list summary::-webkit-details-marker { + display: none; +} + +.nav-list a, +.nav-list summary { + padding-block: .375rem; + transition: color .1s ease-in-out; +} + +.nav-list a:hover, +.nav-list a[aria-current="page"], +.nav-list summary:hover, +.nav-list .is-active summary { + color: var(--link-hover); +} + +.nav-list details > [role="list"] { + padding-inline-start: .75rem; +} + +.nav-list > li, +.nav-list .is-active summary { + position: relative; +} + +.nav-list > li > a[aria-current="page"]:before, +.nav-list .is-active summary:before { + content: ""; + display: block; + width: 4px; + height: 100%; + background-color: #6A89FE; + position: absolute; + inset-inline-start: -2rem; + inset-block-start: 0; + inset-block-end: 0; +} \ No newline at end of file diff --git a/_src/test.md b/_src/test.md new file mode 100644 index 0000000..550800b --- /dev/null +++ b/_src/test.md @@ -0,0 +1,11 @@ +--- +eleventyNavigation: + key: Test +title: Test Page +description: Testpage +layout: test +--- + +# TEST + +page url = {{ page.url }} \ No newline at end of file diff --git a/_src/theming.md b/_src/theming.md new file mode 100644 index 0000000..ace09d5 --- /dev/null +++ b/_src/theming.md @@ -0,0 +1,148 @@ +--- +eleventyNavigation: + key: Theming + order: 99999999 +title: Theming +layout: base +--- + +The backend for this site is [11ty (Eleventy)](https://11ty.dev) + +The layout of this site is a basic 2 column layout, adapted from [W3Schools](https://www.w3schools.com/howto/howto_css_three_columns.asp). + +The color scheme for both the site and code blocks is [Dracula](https://draculatheme.com/). Since there is only one Cyan and one Purple, I decided to make unvisited links Green, visited links Orange and Links that are being hovered on Yellow. + +For fonts, I use **Fira Sans** for everything except headings, which use **Open Sans**. Both are available on [Google Fonts](https://fonts.google.com/). + +The navigation I stole from [this blog](https://www.mikeaparicio.com/posts/2022-08-19-nested-navigation-in-eleventy/) and adapted it to my needs. I am working on making the current page expanded if there are subpages but it doesn't want to work. + +Also, the footer not being at the bottom for short pages is annoying but I don't know how to fix it. + +***** + +See all elements below: + +***** + +**Bold Text**, *Italics text (asterisks)*, _italics text (underscores)_, ~~strikethrough text~~ + +***** + +Unordered list + +- unordered list item 1 + - list item 1.1 + - list item 1.2 + - list item 1.3 +- unordered list item 2 +- unordered list item 3 + - list item 3.1 +- unordered list item 4 + +Ordered list + +1. first item +2. second item + +***** + +Mixed list + +1. First + - Bullet 1 + - Bullet 2 +2. Second +3. Third + - Bullet 1 + - Bullet 2 + - Bullet 2.1 + - Bullet 2.2 +4. Fourth + +***** + +# Heading 1 +## Heading 2 +### Heading 3 +#### Heading 4 +##### Heading 5 +###### Heading 6 + +***** + +Quotes + +> quote level 1 + +Nested quotes + +> quote level 1 +> next line +>> quote level 2 +>> next line +>>> quote level 3 +>>> next line +>>> next next line + +***** + +PowerShell code + +```powershell +Connect-VIServer +$vms = Get-VM +ForEach ($vm in $vms) { + Write-Output $vm.Name +} +``` + +Bash code + +```bash +function log() { + + # logs strings to both the terminal and a file + # usage: log { 1 | 2 | 3 } 'String' + # 1 => INFORMATION + # 2 => ERROR + # 3 => DEBUG + + if [ "$LOGFILE" = "" ]; then + LOGFILE=/dev/null + fi + if [ "$NORMAL" = "" ]; then + NORMAL='\e[0m' + fi + if [ "$PURPLE" = "" ]; then + PURPLE='\e[35m' + fi + if [ "$CYAN" = "" ]; then + CYAN='\e[36m' + fi + + case $1 in + 1) + msg_type="INFORMATION" + ;; + + 2) + msg_type="ERROR" + ;; + + 3) + msg_type="DEBUG" + ;; + + *) + echo "Wrong input; exiting" + exit 1 + esac + + msg="[${PURPLE}$(date -Ins)${NORMAL}] [${CYAN}${msg_type}${NORMAL}]: $2" + # tee command from + # (omits coloring in logfile) + echo -e "${msg}" | tee >(sed $'s/\033[[][^A-Za-z]*[A-Za-z]//g' >> ${LOGFILE}) +} +``` + +`inline code`