feat: more work done

This commit is contained in:
Alexander Daichendt 2022-07-26 08:30:47 +02:00
parent 8377892747
commit ab60b4baf7
21 changed files with 160 additions and 21 deletions

View file

@ -11,3 +11,4 @@ node_modules
pnpm-lock.yaml
package-lock.json
yarn.lock
Link.svelte

14
modules.d.ts vendored Normal file
View file

@ -0,0 +1,14 @@
declare module 'mdi-svelte' {
import { SvelteComponentTyped } from 'svelte';
export interface IconProps {
path: string;
size?: number | string;
color?: string;
flip?: boolean | string;
rotate?: number;
spin?: number | boolean;
title?: string;
}
export default class Icon extends SvelteComponentTyped<IconProps> {}
}

View file

@ -4,6 +4,10 @@
<meta charset="utf-8" />
<link rel="icon" href="%sveltekit.assets%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="manifest" href="/site.webmanifest" />
%sveltekit.head%
</head>
<body>

View file

@ -9,11 +9,22 @@
const internal = !href.startsWith('http');
let spin = false;
// external props
let props: Record<string,string|boolean> = {
rel: "nofollow noreferrer noopener",
target: "_blank"
}
if(internal) {
// internal props
props = {
"sveltekit:prefetch": true
}
}
</script>
<a
rel={!internal ? 'nofollow noreferrer noopener' : ''}
target={!internal ? '_blank' : ''}
{...props}
{href}
on:mouseover={() => (spin = true)}
on:focus={() => (spin = true)}
@ -23,16 +34,14 @@
<Icon path={internal ? mdiChevronRight : mdiLinkVariant} size="1rem" {spin} />
{/if}
<span class="text"><slot /></span>
</a>
<style>
</a><style>
a {
color: var(--special-color);
text-decoration: none;
font-weight: 550;
}
a:hover {
color: var(--dark-color);
color: var(--outline-color);
}
.text {
text-decoration: underline;

View file

@ -1,8 +1,6 @@
<script lang="js">
// @ts-nocheck
import { mdiAccount } from '@mdi/js';
import { onMount } from 'svelte';
import Icon from 'mdi-svelte';
onMount(() => {
const ROOT = document.querySelector(':root');
@ -45,7 +43,7 @@
characterData: false,
attributes: true,
childList: false,
subtree: false
subtree: false,
});
setScheme();
setContrast();
@ -68,7 +66,7 @@
</script>
<label class="switch">
<input type="checkbox" on:change={toggleTheme} />
<input aria-label="Nightmode" type="checkbox" on:change={toggleTheme} />
<span class="slider round" />
</label>
@ -106,6 +104,7 @@
bottom: 4px;
background-color: gold;
transition: 0.4s;
background: radial-gradient(yellow, orange 63%, transparent calc(63% + 3px) 100%);
}
input:checked + .slider {

View file

@ -0,0 +1,29 @@
<svg
width="1.5rem"
height="1.5rem"
viewBox="0 0 54 54"
style="vertical-align: middle"
fill="currentColor"
xmlns="http://www.w3.org/2000/svg"
>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M19.4414 3.24C19.4414 1.4506 20.892 0 22.6814 0C34.6108 0 44.2814 9.67065 44.2814 21.6C44.2814 23.3894 42.8308 24.84 41.0414 24.84C39.252 24.84 37.8014 23.3894 37.8014 21.6C37.8014 13.2494 31.032 6.48 22.6814 6.48C20.892 6.48 19.4414 5.0294 19.4414 3.24Z"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M34.5586 50.76C34.5586 52.5494 33.108 54 31.3186 54C19.3893 54 9.71861 44.3294 9.71861 32.4C9.71861 30.6106 11.1692 29.16 12.9586 29.16C14.748 29.16 16.1986 30.6106 16.1986 32.4C16.1986 40.7505 22.9681 47.52 31.3186 47.52C33.108 47.52 34.5586 48.9706 34.5586 50.76Z"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M3.24 34.5601C1.4506 34.5601 -6.34076e-08 33.1095 -1.41625e-07 31.3201C-6.63074e-07 19.3907 9.67065 9.72007 21.6 9.72007C23.3894 9.72007 24.84 11.1707 24.84 12.9601C24.84 14.7495 23.3894 16.2001 21.6 16.2001C13.2495 16.2001 6.48 22.9695 6.48 31.3201C6.48 33.1095 5.0294 34.5601 3.24 34.5601Z"
/>
<path
fill-rule="evenodd"
clip-rule="evenodd"
d="M50.76 19.4399C52.5494 19.4399 54 20.8905 54 22.6799C54 34.6093 44.3294 44.2799 32.4 44.2799C30.6106 44.2799 29.16 42.8293 29.16 41.0399C29.16 39.2505 30.6106 37.7999 32.4 37.7999C40.7505 37.7999 47.52 31.0305 47.52 22.6799C47.52 20.8905 48.9706 19.4399 50.76 19.4399Z"
/>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

View file

@ -5,11 +5,21 @@
export { a };
</script>
<script lang="ts">
<script>
// @ts-nocheck
// svelte-ignore unused-export-let
export let title;
// svelte-ignore unused-export-let
export let description;
// svelte-ignore unused-export-let
export let date;
export let keywords;
</script>
<svelte:head>
<title>{title}</title>
<meta name="description" content={description} />
<meta name="keywords" content={keywords.join(', ')} />
</svelte:head>
<slot />

View file

@ -12,10 +12,16 @@
const NAV_ITEMS = [
{ href: '/blog', label: 'Blog' },
{ href: '/contact', label: 'Contact' }
{ href: '/contact', label: 'Contact' },
];
</script>
<svelte:head
><title>{$page.stuff.title} - AlexDaichendt</title>
<meta name="description" content={$page.stuff.description} />
<meta name="author" content="Alexander Daichendt" />
</svelte:head>
<div class="container upper">
<header>
<div class="header">
@ -88,19 +94,19 @@
.navItem a:after {
content: '';
position: absolute;
bottom: 0;
bottom: -2px;
right: 50%;
width: 0%;
border-bottom: 2px solid var(--outline-color);
border-bottom: 3px solid var(--outline-color);
transition: 0.3s;
}
.navItem a:before {
content: '';
position: absolute;
bottom: 0;
bottom: -2px;
left: 50%;
width: 0%;
border-bottom: 2px solid var(--outline-color);
border-bottom: 3px solid var(--outline-color);
transition: 0.3s;
}
.navItem a:hover:after {

View file

@ -8,8 +8,13 @@
return {
status: response.status,
props: {
posts: response.ok && asJson.posts
}
posts: response.ok && asJson.posts,
},
stuff: {
title: 'Blog',
description:
'My blogposts, where I occasionally document things, that I think are not accessible or badly documented.',
},
};
}
</script>

View file

@ -1,6 +1,13 @@
---
date: '22-05-08'
title: 'Arrow OS on Redmi Note 7'
description: 'Learn how to install ArrowOS, based on Android 12 on your Redmi Note 7 (lavender) phone! Also installs root and microG for a BigTech free phone.'
keywords:
- ArrowOS
- Redmi Note 7
- Lavender
- root
- microG
---
# How to: Redmi Note 7 with ArrowOs (Android 12), root, microG

View file

@ -1,7 +1,19 @@
<script context="module" lang="ts">
export async function load() {
return {
stuff: {
title: 'Contact',
description: 'All the communication channels for contacting Alex Daichendt ',
},
};
}
</script>
<script>
import { mdiEmailEditOutline } from '@mdi/js';
import { mdiGithub } from '@mdi/js';
import Icon from 'mdi-svelte';
import Element from '../components/element.svelte';
import Link from '../components/Link.svelte';
</script>
@ -16,12 +28,19 @@
<Icon path={mdiGithub} />
Github: <Link disableIcon href="https://github.com/AlexDaichendt">AlexDaichendt</Link>
</li>
<li>
<span style="font-size:1rem"><Element /></span>
Element: @alexdaichendt:matrix.org
</li>
</ul>
I don't use any social media.
I usually reply within a couple minutes - if it is important.
<style>
ul {
list-style-type: none;
}
li {
margin-bottom: 0.5rem;
}
</style>

View file

@ -1,3 +1,14 @@
<script context="module" lang="ts">
export async function load() {
return {
stuff: {
title: 'Impressum',
description: 'The impressum I have to include for Germany.',
},
};
}
</script>
<h1>Impressum</h1>
<p>Information according to §5 TMG:</p>

View file

@ -1,3 +1,15 @@
<script context="module" lang="ts">
export async function load() {
return {
stuff: {
title: 'Home',
description:
'Alex Daichendt"s website, blog, and yard of stuffs and things of modern tech.',
},
};
}
</script>
<script lang="ts">
import Link from '../components/Link.svelte';
import type { Skill } from '../types';
@ -9,7 +21,7 @@
{ name: 'LXC / Docker', started: 2021 },
{ name: 'FaaS', started: 2021 },
{ name: 'git', started: 2016 },
{ name: 'Linux administration (Debian)', started: 2017 }
{ name: 'Linux administration (Debian)', started: 2017 },
];
const SKILLS: Skill[] = _SKILLS.map((skill) => {
const years = new Date().getFullYear() - skill.started;
@ -25,7 +37,7 @@
Programming has been a hobby of mine since my teens. Been working on countless projects for
various games. Recently, I started to dabble my feet in DevOps. My formal education I received at <Link
href="https://www.tum.de/">TUM</Link
>; currently I am persuing my Masters.
>, currently I am persuing my Masters.
</p>
<h2>Skills</h2>

View file

@ -1,3 +1,15 @@
<script context="module" lang="ts">
export async function load() {
return {
stuff: {
title: 'Privacy',
description:
'The privacy policy I have to include even though I don"t collect any data or use shady services.',
},
};
}
</script>
<h1>Privacy Policy for AlexDaichendt</h1>
<p>

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

BIN
static/apple-touch-icon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

BIN
static/favicon-16x16.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 601 B

BIN
static/favicon-32x32.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
static/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

1
static/site.webmanifest Normal file
View file

@ -0,0 +1 @@
{"name":"","short_name":"","icons":[{"src":"/android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"/android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}