arian/eleventy-homepage
arian
/
eleventy-homepage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: arian:7920b68a2d7beebf6c038092af103e6b60702c31
Branches Tags
arian:master
...
compare: arian:56b21e8ba71dff4d707674b060e230f93d6c0d03
Branches Tags
arian:master

2 Commits
7920b68a2d ... 56b21e8ba7

Author SHA1 Message Date
Arian Furrer 56b21e8ba7 rewrote some of index 2024-05-25 14:08:48 +02:00
Arian Furrer 79361b3c44 reworked part of the page 2024-05-25 14:08:35 +02:00
4 changed files with 57 additions and 11 deletions
Show Stats Expand all files Collapse all files

25
.eleventy.js
View File

@ -1,19 +1,40 @@
// Add Syntax Highlighting plugin // Add Syntax Highlighting plugin
const syntaxHighlight = require("@11ty/eleventy-plugin-syntaxhighlight"); const syntaxHighlight = require("@11ty/eleventy-plugin-syntaxhighlight");
// Add Inclusive Language plugin // Add Inclusive Language plugin
const inclusiveLangPlugin = require("@11ty/eleventy-plugin-inclusive-language"); // const inclusiveLangPlugin = require("@11ty/eleventy-plugin-inclusive-language");
// Add Naviagation plugin // Add Naviagation plugin
const eleventyNavigationPlugin = require("@11ty/eleventy-navigation"); const eleventyNavigationPlugin = require("@11ty/eleventy-navigation");
// Add read time // Add read time
const emojiReadTime = require("@11tyrocks/eleventy-plugin-emoji-readtime"); const emojiReadTime = require("@11tyrocks/eleventy-plugin-emoji-readtime");
// make external links safer
const safeLinks = require('@sardine/eleventy-plugin-external-links');
// add a read progress bar to the page
const readerBar = require('eleventy-plugin-reader-bar');
// toc
const markdownIt = require('markdown-it');
const markdownItAnchor = require('markdown-it-anchor');
const pluginTOC = require('eleventy-plugin-toc')
module.exports = function(eleventyConfig) { module.exports = function(eleventyConfig) {
eleventyConfig.addPlugin(syntaxHighlight); // syntax highlighting eleventyConfig.addPlugin(syntaxHighlight); // syntax highlighting
eleventyConfig.addPlugin(inclusiveLangPlugin); // inclusive language // eleventyConfig.addPlugin(inclusiveLangPlugin); // inclusive language
eleventyConfig.addPlugin(eleventyNavigationPlugin); // navigation eleventyConfig.addPlugin(eleventyNavigationPlugin); // navigation
eleventyConfig.addPlugin(emojiReadTime, { eleventyConfig.addPlugin(emojiReadTime, {
emoji: "💠" emoji: "💠"
}); // read emojiReadTime }); // read emojiReadTime
eleventyConfig.addPlugin(safeLinks); // safeLinks plugin
eleventyConfig.addPlugin(readerBar); // progress bar
eleventyConfig.addPlugin(pluginTOC, {
tags: ['h1', 'h2', 'h3', 'h4', 'h5'],
wrapper: 'div',
ul: true
}) // Table of Contents
// toc
eleventyConfig.setLibrary(
'md',
markdownIt().use(markdownItAnchor)
)
// add stylesheet // add stylesheet
eleventyConfig.addPassthroughCopy("_src/style.css"); eleventyConfig.addPassthroughCopy("_src/style.css");

17
_src/_includes/base.njk
View File

@ -21,7 +21,7 @@
<title>{{ title }}</title> <title>{{ title }}</title>
</head> </head>
<body class="page--{% if page.fileSlug %}{{ page.fileSlug }}{% endif %}"> <body class="page--{% if page.fileSlug %}{{ page.fileSlug }}{% endif %}">
<div class="reader-bar-start">
<div class="header"> <div class="header">
<h1 class="website-title"><i>{{ title }}</i></h1> <h1 class="website-title"><i>{{ title }}</i></h1>
</div> </div>
@ -33,10 +33,21 @@
</div> </div>
<div class="column right content"> <div class="column right content">
{% if content | toc | safe %}
<details class="table-of-contents">
<summary class="toc-header">Table of Contents</summary>
<p>
{{ content | toc | safe}}
</p>
</details>
{% endif %}
{{ content | safe}} {{ content | safe}}
</div> </div>
</div> </div>
{% readerBar 8px, "white" %}
<div class="footer"> <div class="footer">
<div class="f-table-td"> <div class="f-table-td">
<strong>Dev</strong> <strong>Dev</strong>
@ -68,6 +79,6 @@
<p>&copy; {{ year }} {{ site.author }}</p> <p>&copy; {{ year }} {{ site.author }}</p>
</div> </div>
</div> </div>
</div>
</body> </body>
</html> </html>

10
_src/index.md
View File

@ -8,15 +8,13 @@ layout: home
# Welcome to my Personal Homepage! # Welcome to my Personal Homepage!
Feel free to have a look Feel free to have a look
# Content # Disclaimer
I just put here whatever I feel like is appropriate. I (almost) always write reviews for albums I buy, both because it's fun and to prepare for my English Advanced certificate. Sometimes, it takes a while but eventually I want to have reviewed every album I bought. Anything on this page is styled by me, and built with [eleventy](https://11ty.dev). I am far from a designer and I **always** put functionality before design. I will never say my site is pretty, nor do I want it to be. I just want to put random stuff in here that I want the world to see, so please don't try to tell me my site is ugly &ndash; it's intentional. The only things my design are trying to achieve is ease of use (for me, not necessarily you), and being dark enough to not [digitally flashbang](https://counterstrike.fandom.com/wiki/Flashbang) someone reading it. Also, different colours highlight different things, even if they don't seem to immediately make sense, it's what makes sense to me.
Some of my public projects are linked in the footer but not all of them.
# Who am I # Who am I
My name is Arian Furrer (as you can guess by the footer) and I was born in March 2005. I am currently in an apprenticeship for System Engineering, which I'll finish in August of 2024. My name is Arian Furrer (as you can guess by the footer) and I was born in March 2005. I am currently in an apprenticeship for System Engineering, which I'll finish in August of 2024.
For anything related to my professional life, check my [LinkedIn Profile](https://www.linkedin.com/in/arian-furrer-295a6a2b3/). I will not respond to any entity or person that uses LinkedIn Premium / Pro / whatever it's called. If you're **that** desperate for attention, I suggest getting a hobby. For anything related to my professional life, check my [LinkedIn Profile](https://www.linkedin.com/in/arian-furrer/). I will not respond to any entity or person that uses LinkedIn Premium / Pro / whatever it's called. If you're **that** desperate for attention, I suggest getting a hobby.
## Skills ## Skills
As a system engineer, my biggest skills are related to administering Linux servers & desktop environments, Windows Server 2016 and newer, and scripting in Bash and PowerShell. Other than that I consider myself good at problem-solving, which I credit my autism for. As a system engineer, my biggest skills are related to administering Linux servers & desktop environments, Windows Server 2016 and newer, and scripting in Bash and PowerShell. Other than that I consider myself good at problem-solving, which I credit my autism for.
@ -24,7 +22,7 @@ As a system engineer, my biggest skills are related to administering Linux serve
## Hobbies ## Hobbies
In my free time, I maintain a number of private and public web-pages, such as this one, [my notes from the first year of the apprenticeship (DE)](https://azo-notes.arian.li), a [PlantUML Instance](https://uml.arian.li) and more. In my free time, I maintain a number of private and public web-pages, such as this one, [my notes from the first year of the apprenticeship (DE)](https://azo-notes.arian.li), a [PlantUML Instance](https://uml.arian.li) and more.
I also read books (see my list of finished books [here](/reading/list-of-finished-books/)), collect music (Discogs link is in the footer) and play the electric guitar. I also read books (see my list of finished books [here](/reading/list-of-finished-books/), and my backlog [here](/reading/book-backlog)), collect music (Discogs link is in the footer) and play the electric guitar.
I visit my local scene's Smash Ultimate tournaments frequently as well. I visit my local scene's Smash Ultimate tournaments frequently as well.

16
_src/style.css
View File

@ -105,6 +105,8 @@ h4::before, h5::before, h6::before {
.website-title { .website-title {
font-size: 40pt; font-size: 40pt;
color: #6272a4; color: #6272a4;
margin-top: 5px !important;
margin-bottom: 5px !important;
} }
.website-title::before { .website-title::before {
@ -269,4 +271,18 @@ hr {
.content strong { .content strong {
color: var(--highlight-cyan); color: var(--highlight-cyan);
}
.content {
margin-top: 20px;
}
.table-of-contents {
border: 1px solid white;
padding: 5px;
}
.toc-header {
font-weight: bold;
color: var(--highlight-cyan);
} }