addet profile-mode on homepage
This commit is contained in:
parent
e2f0ef9b68
commit
89865aa831
11 changed files with 73 additions and 278 deletions
1
www/assets/img/facepunch.svg
Normal file
1
www/assets/img/facepunch.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Facepunch</title><path d="M12 0C5.388 0 0 5.388 0 12s5.388 12 12 12 12-5.388 12-12S18.629 0 12 0zm0 21.314c-5.133 0-9.297-4.164-9.297-9.297S6.867 2.72 12 2.72s9.297 4.164 9.297 9.297-4.164 9.297-9.297 9.297zM10.028 12l1.48 1.479-1.922 1.92-1.478-1.478-1.428 1.444-1.92-1.92L6.203 12l-1.377-1.377 1.92-1.904 1.36 1.377 1.411-1.41 1.921 1.903L10.03 12zm9.162-1.462-1.411 1.411 1.479 1.479-1.92 1.904-1.48-1.48-1.444 1.446-1.904-1.921 1.445-1.428-1.377-1.377 1.904-1.92 1.376 1.376 1.411-1.41 1.92 1.92z"/></svg>
|
After Width: | Height: | Size: 587 B |
|
@ -6,7 +6,7 @@ theme: paperMod
|
|||
enableRobotsTXT: true
|
||||
|
||||
params:
|
||||
defaultTheme: auto
|
||||
defaultTheme: dark
|
||||
homeInfoParams:
|
||||
Title: Welcome to my blog! Feel free to contribute some topics over on GiTea
|
||||
socialIcons:
|
||||
|
@ -19,6 +19,23 @@ params:
|
|||
enableEmoji: true
|
||||
UseHugoToc: true
|
||||
|
||||
profileMode:
|
||||
enabled: true
|
||||
title: "Hi, I'm pika!"
|
||||
subtitle: "You are currently at my dev-environment. Here I'm trying to get better in stuff like writing blogentries, and styling a website/creating one. So, take anything here with a grain of salt and have fun reading. Also be sure to checkout the GiTea instance!"
|
||||
imageUrl: "/img/facepunch.svg"
|
||||
imageWidth: 120
|
||||
imageHeight: 120
|
||||
buttons:
|
||||
- name: BlogPosts
|
||||
url: "/blog/"
|
||||
- name: Archive
|
||||
url: "/archive/"
|
||||
- name: Tutorials
|
||||
url: "/tutorials/"
|
||||
- name: GiTea
|
||||
url: "https://git.k4li.de/pika/"
|
||||
|
||||
menu:
|
||||
main:
|
||||
- identifier: Home
|
||||
|
|
|
@ -27,34 +27,6 @@
|
|||
}
|
||||
|
||||
</style>
|
||||
<style>
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--theme: rgb(29, 30, 32);
|
||||
--entry: rgb(46, 46, 51);
|
||||
--primary: rgb(218, 218, 219);
|
||||
--secondary: rgb(155, 156, 157);
|
||||
--tertiary: rgb(65, 66, 68);
|
||||
--content: rgb(196, 196, 197);
|
||||
--code-block-bg: rgb(46, 46, 51);
|
||||
--code-bg: rgb(55, 56, 62);
|
||||
--border: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
.list {
|
||||
background: var(--theme);
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-track {
|
||||
background: 0 0;
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-thumb {
|
||||
border-color: var(--theme);
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</noscript>
|
||||
|
||||
|
||||
|
@ -72,14 +44,10 @@
|
|||
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body class="list" id="top">
|
||||
<body class="list dark" id="top">
|
||||
<script>
|
||||
if (localStorage.getItem("pref-theme") === "dark") {
|
||||
document.body.classList.add('dark');
|
||||
} else if (localStorage.getItem("pref-theme") === "light") {
|
||||
if (localStorage.getItem("pref-theme") === "light") {
|
||||
document.body.classList.remove('dark')
|
||||
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
|
@ -28,34 +28,6 @@ My name is Alexander Pieck, and even though I’m in the IT business, I&rsqu
|
|||
}
|
||||
|
||||
</style>
|
||||
<style>
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--theme: rgb(29, 30, 32);
|
||||
--entry: rgb(46, 46, 51);
|
||||
--primary: rgb(218, 218, 219);
|
||||
--secondary: rgb(155, 156, 157);
|
||||
--tertiary: rgb(65, 66, 68);
|
||||
--content: rgb(196, 196, 197);
|
||||
--code-block-bg: rgb(46, 46, 51);
|
||||
--code-bg: rgb(55, 56, 62);
|
||||
--border: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
.list {
|
||||
background: var(--theme);
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-track {
|
||||
background: 0 0;
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-thumb {
|
||||
border-color: var(--theme);
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</noscript>
|
||||
|
||||
|
||||
|
@ -127,14 +99,10 @@ My name is Alexander Pieck, and even though I’m in the IT business, I&rsqu
|
|||
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body class="" id="top">
|
||||
<body class=" dark" id="top">
|
||||
<script>
|
||||
if (localStorage.getItem("pref-theme") === "dark") {
|
||||
document.body.classList.add('dark');
|
||||
} else if (localStorage.getItem("pref-theme") === "light") {
|
||||
if (localStorage.getItem("pref-theme") === "light") {
|
||||
document.body.classList.remove('dark')
|
||||
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
|
@ -27,34 +27,6 @@
|
|||
}
|
||||
|
||||
</style>
|
||||
<style>
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--theme: rgb(29, 30, 32);
|
||||
--entry: rgb(46, 46, 51);
|
||||
--primary: rgb(218, 218, 219);
|
||||
--secondary: rgb(155, 156, 157);
|
||||
--tertiary: rgb(65, 66, 68);
|
||||
--content: rgb(196, 196, 197);
|
||||
--code-block-bg: rgb(46, 46, 51);
|
||||
--code-bg: rgb(55, 56, 62);
|
||||
--border: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
.list {
|
||||
background: var(--theme);
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-track {
|
||||
background: 0 0;
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-thumb {
|
||||
border-color: var(--theme);
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</noscript>
|
||||
|
||||
|
||||
|
@ -124,14 +96,10 @@
|
|||
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body class="" id="top">
|
||||
<body class=" dark" id="top">
|
||||
<script>
|
||||
if (localStorage.getItem("pref-theme") === "dark") {
|
||||
document.body.classList.add('dark');
|
||||
} else if (localStorage.getItem("pref-theme") === "light") {
|
||||
if (localStorage.getItem("pref-theme") === "light") {
|
||||
document.body.classList.remove('dark')
|
||||
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
|
@ -28,34 +28,6 @@
|
|||
}
|
||||
|
||||
</style>
|
||||
<style>
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--theme: rgb(29, 30, 32);
|
||||
--entry: rgb(46, 46, 51);
|
||||
--primary: rgb(218, 218, 219);
|
||||
--secondary: rgb(155, 156, 157);
|
||||
--tertiary: rgb(65, 66, 68);
|
||||
--content: rgb(196, 196, 197);
|
||||
--code-block-bg: rgb(46, 46, 51);
|
||||
--code-bg: rgb(55, 56, 62);
|
||||
--border: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
.list {
|
||||
background: var(--theme);
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-track {
|
||||
background: 0 0;
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-thumb {
|
||||
border-color: var(--theme);
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</noscript>
|
||||
|
||||
|
||||
|
@ -88,14 +60,10 @@
|
|||
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body class="list" id="top">
|
||||
<body class="list dark" id="top">
|
||||
<script>
|
||||
if (localStorage.getItem("pref-theme") === "dark") {
|
||||
document.body.classList.add('dark');
|
||||
} else if (localStorage.getItem("pref-theme") === "light") {
|
||||
if (localStorage.getItem("pref-theme") === "light") {
|
||||
document.body.classList.remove('dark')
|
||||
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
|
@ -28,34 +28,6 @@
|
|||
}
|
||||
|
||||
</style>
|
||||
<style>
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--theme: rgb(29, 30, 32);
|
||||
--entry: rgb(46, 46, 51);
|
||||
--primary: rgb(218, 218, 219);
|
||||
--secondary: rgb(155, 156, 157);
|
||||
--tertiary: rgb(65, 66, 68);
|
||||
--content: rgb(196, 196, 197);
|
||||
--code-block-bg: rgb(46, 46, 51);
|
||||
--code-bg: rgb(55, 56, 62);
|
||||
--border: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
.list {
|
||||
background: var(--theme);
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-track {
|
||||
background: 0 0;
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-thumb {
|
||||
border-color: var(--theme);
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</noscript>
|
||||
|
||||
|
||||
|
@ -73,14 +45,10 @@
|
|||
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body class="list" id="top">
|
||||
<body class="list dark" id="top">
|
||||
<script>
|
||||
if (localStorage.getItem("pref-theme") === "dark") {
|
||||
document.body.classList.add('dark');
|
||||
} else if (localStorage.getItem("pref-theme") === "light") {
|
||||
if (localStorage.getItem("pref-theme") === "light") {
|
||||
document.body.classList.remove('dark')
|
||||
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
1
www/public/img/facepunch.svg
Normal file
1
www/public/img/facepunch.svg
Normal file
|
@ -0,0 +1 @@
|
|||
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><title>Facepunch</title><path d="M12 0C5.388 0 0 5.388 0 12s5.388 12 12 12 12-5.388 12-12S18.629 0 12 0zm0 21.314c-5.133 0-9.297-4.164-9.297-9.297S6.867 2.72 12 2.72s9.297 4.164 9.297 9.297-4.164 9.297-9.297 9.297zM10.028 12l1.48 1.479-1.922 1.92-1.478-1.478-1.428 1.444-1.92-1.92L6.203 12l-1.377-1.377 1.92-1.904 1.36 1.377 1.411-1.41 1.921 1.903L10.03 12zm9.162-1.462-1.411 1.411 1.479 1.479-1.92 1.904-1.48-1.48-1.444 1.446-1.904-1.921 1.445-1.428-1.377-1.377 1.904-1.92 1.376 1.376 1.411-1.41 1.92 1.92z"/></svg>
|
After Width: | Height: | Size: 587 B |
|
@ -29,34 +29,6 @@
|
|||
}
|
||||
|
||||
</style>
|
||||
<style>
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--theme: rgb(29, 30, 32);
|
||||
--entry: rgb(46, 46, 51);
|
||||
--primary: rgb(218, 218, 219);
|
||||
--secondary: rgb(155, 156, 157);
|
||||
--tertiary: rgb(65, 66, 68);
|
||||
--content: rgb(196, 196, 197);
|
||||
--code-block-bg: rgb(46, 46, 51);
|
||||
--code-bg: rgb(55, 56, 62);
|
||||
--border: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
.list {
|
||||
background: var(--theme);
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-track {
|
||||
background: 0 0;
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-thumb {
|
||||
border-color: var(--theme);
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</noscript>
|
||||
|
||||
|
||||
|
@ -87,14 +59,10 @@
|
|||
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body class="list" id="top">
|
||||
<body class="list dark" id="top">
|
||||
<script>
|
||||
if (localStorage.getItem("pref-theme") === "dark") {
|
||||
document.body.classList.add('dark');
|
||||
} else if (localStorage.getItem("pref-theme") === "light") {
|
||||
if (localStorage.getItem("pref-theme") === "light") {
|
||||
document.body.classList.remove('dark')
|
||||
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
|
||||
</script>
|
||||
|
@ -151,16 +119,12 @@
|
|||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
<main class="main">
|
||||
<article class="first-entry home-info">
|
||||
<header class="entry-header">
|
||||
<h1>Welcome to my blog! Feel free to contribute some topics over on GiTea</h1>
|
||||
</header>
|
||||
<div class="entry-content">
|
||||
|
||||
</div>
|
||||
<footer class="entry-footer">
|
||||
<div class="social-icons" >
|
||||
<main class="main"><div class="profile">
|
||||
<div class="profile_inner">
|
||||
<img draggable="false" src="https://blog.k4li.me/img/facepunch.svg" alt="profile image" title=""
|
||||
height="120" width="120" />
|
||||
<h1>Hi, I’m pika!</h1>
|
||||
<span>You are currently at my dev-environment. Here I’m trying to get better in stuff like writing blogentries, and styling a website/creating one. So, take anything here with a grain of salt and have fun reading. Also be sure to checkout the GiTea instance!</span><div class="social-icons" >
|
||||
<a href="https://git.k4li.de/pika/" target="_blank" rel="noopener noreferrer me"
|
||||
title="Gitea">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 20" fill="currentColor">
|
||||
|
@ -170,33 +134,37 @@
|
|||
</a>
|
||||
</div>
|
||||
|
||||
</footer>
|
||||
</article>
|
||||
|
||||
<article class="post-entry">
|
||||
<header class="entry-header">
|
||||
<h2 class="entry-hint-parent">A challange will get you going fast
|
||||
</h2>
|
||||
</header>
|
||||
<div class="entry-content">
|
||||
<p>A Challenge Will Get You Going A few days ago, I embarked on a new adventure: writing my first blog entry. I didn’t really know what I was doing, and to be honest, that hasn’t changed much! 😊 However, I am amazed at how straightforward and enjoyable it is to learn website development with the Hugo framework. As I mentioned before, one of my goals was to create a website for a client....</p>
|
||||
<div class="buttons">
|
||||
<a class="button" href="/blog/" rel="noopener" title="BlogPosts">
|
||||
<span class="button-inner">
|
||||
BlogPosts
|
||||
</span>
|
||||
</a>
|
||||
<a class="button" href="/archive/" rel="noopener" title="Archive">
|
||||
<span class="button-inner">
|
||||
Archive
|
||||
</span>
|
||||
</a>
|
||||
<a class="button" href="/tutorials/" rel="noopener" title="Tutorials">
|
||||
<span class="button-inner">
|
||||
Tutorials
|
||||
</span>
|
||||
</a>
|
||||
<a class="button" href="https://git.k4li.de/pika/" rel="noopener" title="GiTea">
|
||||
<span class="button-inner">
|
||||
GiTea
|
||||
<svg fill="none" shape-rendering="geometricPrecision" stroke="currentColor" stroke-linecap="round"
|
||||
stroke-linejoin="round" stroke-width="2.5" viewBox="0 0 24 24" height="14" width="14">
|
||||
<path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6"></path>
|
||||
<path d="M15 3h6v6"></path>
|
||||
<path d="M10 14L21 3"></path>
|
||||
</svg>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
<footer class="entry-footer"><span title='2024-06-20 23:15:44 +0200 CEST'>June 20, 2024</span> · 2 min · 401 words</footer>
|
||||
<a class="entry-link" aria-label="post link to A challange will get you going fast" href="https://blog.k4li.me/blog/2024/2/"></a>
|
||||
</article>
|
||||
|
||||
<article class="post-entry">
|
||||
<header class="entry-header">
|
||||
<h2 class="entry-hint-parent">About me and why I do this
|
||||
</h2>
|
||||
</header>
|
||||
<div class="entry-content">
|
||||
<p>whoami tl;dr pika aka. Alexander Pieck IT Sysadmin IT started as a hobby Homelab Enthusiast Never wanted to code… but now I might be coding… Welcome to my newly created blog! I’m not sure how good this is going to be, but I’ll try to make it as beautiful and interesting as possible.
|
||||
My name is Alexander Pieck, and even though I’m in the IT business, I’m usually the kind of sysadmin who runs the servers and hardware and gets blamed for slow internet speeds and bad password policies (spoiler: I also hate changing my password every 180 days)....</p>
|
||||
</div>
|
||||
<footer class="entry-footer"><span title='2024-06-20 19:49:35 +0200 CEST'>June 20, 2024</span> · 3 min · 527 words</footer>
|
||||
<a class="entry-link" aria-label="post link to About me and why I do this" href="https://blog.k4li.me/blog/2024/1/"></a>
|
||||
</article>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
|
||||
<footer class="footer">
|
||||
|
|
|
@ -1,10 +1,10 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en-us">
|
||||
<head>
|
||||
<title>https://blog.k4li.me/</title>
|
||||
<link rel="canonical" href="https://blog.k4li.me/">
|
||||
<title>http://localhost:1313/</title>
|
||||
<link rel="canonical" href="http://localhost:1313/">
|
||||
<meta name="robots" content="noindex">
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="refresh" content="0; url=https://blog.k4li.me/">
|
||||
<meta http-equiv="refresh" content="0; url=http://localhost:1313/">
|
||||
</head>
|
||||
</html>
|
||||
|
|
|
@ -28,34 +28,6 @@
|
|||
}
|
||||
|
||||
</style>
|
||||
<style>
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--theme: rgb(29, 30, 32);
|
||||
--entry: rgb(46, 46, 51);
|
||||
--primary: rgb(218, 218, 219);
|
||||
--secondary: rgb(155, 156, 157);
|
||||
--tertiary: rgb(65, 66, 68);
|
||||
--content: rgb(196, 196, 197);
|
||||
--code-block-bg: rgb(46, 46, 51);
|
||||
--code-bg: rgb(55, 56, 62);
|
||||
--border: rgb(51, 51, 51);
|
||||
}
|
||||
|
||||
.list {
|
||||
background: var(--theme);
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-track {
|
||||
background: 0 0;
|
||||
}
|
||||
|
||||
.list:not(.dark)::-webkit-scrollbar-thumb {
|
||||
border-color: var(--theme);
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
||||
</noscript>
|
||||
|
||||
|
||||
|
@ -73,14 +45,10 @@
|
|||
<link href="https://fonts.googleapis.com/css2?family=Noto+Color+Emoji&display=swap" rel="stylesheet">
|
||||
</head>
|
||||
|
||||
<body class="list" id="top">
|
||||
<body class="list dark" id="top">
|
||||
<script>
|
||||
if (localStorage.getItem("pref-theme") === "dark") {
|
||||
document.body.classList.add('dark');
|
||||
} else if (localStorage.getItem("pref-theme") === "light") {
|
||||
if (localStorage.getItem("pref-theme") === "light") {
|
||||
document.body.classList.remove('dark')
|
||||
} else if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
|
||||
document.body.classList.add('dark');
|
||||
}
|
||||
|
||||
</script>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue