more consistent styling

main
Norman Köhring 4 months ago
parent 7ad81f33c3
commit 879968a7e1

10
dist/extended.css vendored

@ -11,13 +11,19 @@
gap: 4rem; gap: 4rem;
list-style: circle; list-style: circle;
background: var(--menu-bg-color); background: var(--menu-bg-color);
transition: top .3s ease-in-out; transition: all .3s ease-in-out;
} }
#main-menu > li { #main-menu > li {
padding: 0; padding: 0;
} }
body>header.small + #main-menu { body>header.small + #main-menu {
top: calc(var(--header-height) * var(--header-multiplier)); top: calc(var(--header-height-small) + 2rem);
height: 14rem;
width: 6rem;
flex-flow: column nowrap;
gap: .5rem;
align-items: stretch;
padding: 0 1rem;
} }
pre { pre {
background: var(--emboss-color); background: var(--emboss-color);

2
dist/index.html vendored

@ -3,7 +3,7 @@
<head> <head>
<meta charset=utf-8> <meta charset=utf-8>
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Norman Köhring // the codeartist — programmer and engineer based in Berlin</title> <title>Norman Köhring // the codeartist — programmer and engineer based in Berlin</title>
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
<meta content="Norman Köhring" name=author> <meta content="Norman Köhring" name=author>

1
dist/mail.svg vendored

@ -1 +1,2 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path stroke="#eacb8b" stroke-width="2" d="m21 8-3.6 2c-2 1-3 1.6-4 1.8a7 7 0 0 1-2.8 0c-1-.2-2-.7-4-1.8L3 8m3.2 11h11.6c1.1 0 1.7 0 2.1-.2.4-.2.7-.5.9-.9.2-.4.2-1 .2-2.1V8.2c0-1.1 0-1.7-.2-2.1a2 2 0 0 0-.9-.9c-.4-.2-1-.2-2.1-.2H6.2c-1.1 0-1.7 0-2.1.2a2 2 0 0 0-.9.9C3 6.5 3 7 3 8.2v7.6c0 1.1 0 1.7.2 2.1.2.4.5.7.9.9.4.2 1 .2 2.1.2Z"/></svg> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path stroke="#eacb8b" stroke-width="2" d="m21 8-3.6 2c-2 1-3 1.6-4 1.8a7 7 0 0 1-2.8 0c-1-.2-2-.7-4-1.8L3 8m3.2 11h11.6c1.1 0 1.7 0 2.1-.2.4-.2.7-.5.9-.9.2-.4.2-1 .2-2.1V8.2c0-1.1 0-1.7-.2-2.1a2 2 0 0 0-.9-.9c-.4-.2-1-.2-2.1-.2H6.2c-1.1 0-1.7 0-2.1.2a2 2 0 0 0-.9.9C3 6.5 3 7 3 8.2v7.6c0 1.1 0 1.7.2 2.1.2.4.5.7.9.9.4.2 1 .2 2.1.2Z"/></svg>

Before

Width:  |  Height:  |  Size: 414 B

After

Width:  |  Height:  |  Size: 469 B

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>/now // the codeartist — programmer and engineer based in Berlin</title> <title>/now // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,11 +31,14 @@
</head> </head>
<body> <body>
<main id="til"> <main id="now" class="posts">
<header>Now -- What I'm up to right now</header> <header>
<h1>Now -- What I'm up to right now</h1>
</header>
<p><em>This page shows what I'm up to at the moment, following the idea of the <a href="https://sive.rs/nowff">/now page</a> introduced by <a href="https://sive.rs/">Derek Sivers</a>. You can find more now pages on <a href="https://nownownow.com/">nownownow</a>.</em></p> <p><em>This page shows what I'm up to at the moment, following the idea of the <a href="https://sive.rs/nowff">/now page</a> introduced by <a href="https://sive.rs/">Derek Sivers</a>. You can find more now pages on <a href="https://nownownow.com/">nownownow</a>.</em></p>
<p>Last updated: 2024-05-12</p> <p>Last updated: 2024-05-12</p>
<p>Still live in Berlin where I am working fully remote. I'm appproaching the second anniversary at <a href="https://codegaia.io">Code Gaia</a> now and have no plans to change any of it.</p>
<h2>Priorities</h2> <h2>Priorities</h2>
<blockquote> <blockquote>
<p>I do a lot of things all the time and have a hard time to focus. Most of my energy right now hopefully flows into the following things:</p> <p>I do a lot of things all the time and have a hard time to focus. Most of my energy right now hopefully flows into the following things:</p>
@ -43,6 +46,7 @@
<ul> <ul>
<li>This homepage.</li> <li>This homepage.</li>
<li>Keeping up the pace professionally by taking up more management responsibilities.</li> <li>Keeping up the pace professionally by taking up more management responsibilities.</li>
<li>Ramping up my side-project game (mainly by doing smaller freelancing jobs).</li>
<li>Fleshing out a long form D&amp;D campaign (&quot;Out Of The Cold Shadow&quot;).</li> <li>Fleshing out a long form D&amp;D campaign (&quot;Out Of The Cold Shadow&quot;).</li>
<li>Writing down more short adventures and one-shots and publish them on <a href="https://tiskifer.dk">tiskifer.dk</a>.</li> <li>Writing down more short adventures and one-shots and publish them on <a href="https://tiskifer.dk">tiskifer.dk</a>.</li>
<li>My wedding and honeymoon in June!</li> <li>My wedding and honeymoon in June!</li>
@ -94,6 +98,6 @@ by <a href="https://openlibrary.org/authors/OL7564045A/Camille_Fournier">Camille
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

17
dist/posts.css vendored

@ -0,0 +1,17 @@
main.posts {
margin: calc(var(--header-height-small) + 2rem) auto 4rem;
}
main.posts > #content > h1 {
padding: 0;
}
main.posts article {
margin: 1rem 0;
}
main.posts article>div {
line-height: 2;
}
main.posts article>time,
main.posts article>div>a.external {
color: gray;
}

12
dist/style.css vendored

@ -3,6 +3,7 @@
--header-fg-color: #a3bd8d; --header-fg-color: #a3bd8d;
--header-height: 192px; --header-height: 192px;
--header-multiplier: .25; --header-multiplier: .25;
--header-height-small: calc(var(--header-height)*var(--header-multiplier));
--page-bg-color: #232425; --page-bg-color: #232425;
--page-fg-color: #7e9fbe; --page-fg-color: #7e9fbe;
--menu-bg-color: #000; --menu-bg-color: #000;
@ -62,7 +63,7 @@ body>header {
} }
body>#spacer { body>#spacer {
height: calc(var(--header-height) * var(--header-multiplier)); height: var(--header-height-small);
} }
body>header { body>header {
@ -87,7 +88,7 @@ body>header>svg {
body>main { body>main {
width: 960px; width: 960px;
max-width: 98vw; max-width: 98vw;
margin: var(--header-height) auto 4em; margin: var(--header-height) auto 4rem;
} }
a { a {
@ -101,14 +102,17 @@ a {
margin: 2rem 0; margin: 2rem 0;
} }
#content>h1 { #content>h1,
main.posts > header > h1 {
margin: 0 0 .25em; margin: 0 0 .25em;
padding-top: 2em;
font-size: 2rem; font-size: 2rem;
font-variant: small-caps; font-variant: small-caps;
text-shadow: 1px 1px 0 var(--emboss-color); text-shadow: 1px 1px 0 var(--emboss-color);
color: var(--header-fg-color); color: var(--header-fg-color);
} }
#content>h1 {
padding-top: 2em;
}
#menu { #menu {
display: flex; display: flex;

15
dist/til.css vendored

@ -1,15 +0,0 @@
main#til > header {
margin: 0 0 2rem 0;
font-size: 1.5em;
}
article.til {
margin: 1rem 0;
}
article.til>div {
line-height: 2;
}
article.til>time,
article.til>div>a.external {
color: gray;
}

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,14 +31,14 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<h1>There is a HTML tag for &quot;Word Break Opportunity&quot;</h1> <h1>There is a HTML tag for &quot;Word Break Opportunity&quot;</h1>
<p><a href="https://www.w3schools.com/TAGS/tag_wbr.asp">source</a></p> <p><a href="https://www.w3schools.com/TAGS/tag_wbr.asp">source</a></p>
<p>For example: <code>Kauf&lt;wbr/&gt;haus</code>.</p> <p>For example: <code>Kauf&lt;wbr/&gt;haus</code>.</p>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -78,6 +78,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,13 +31,13 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<h1>Bush refused offer to discuss Osama Bin Laden handover</h1> <h1>Bush refused offer to discuss Osama Bin Laden handover</h1>
<p><a href="https://www.theguardian.com/world/2001/oct/14/afghanistan.terrorism5">source</a></p> <p><a href="https://www.theguardian.com/world/2001/oct/14/afghanistan.terrorism5">source</a></p>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -77,6 +77,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,13 +31,13 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<p><code>git fetch $repo_url $remote_branch:$new_local_branch</code></p> <p><code>git fetch $repo_url $remote_branch:$new_local_branch</code></p>
<p><a href="https://twitter.com/lucas59356/status/1433507127570669569">source</a></p> <p><a href="https://twitter.com/lucas59356/status/1433507127570669569">source</a></p>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -77,6 +77,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,13 +31,13 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<h1>E-Mail that isn't spam is called ham!</h1> <h1>E-Mail that isn't spam is called ham!</h1>
<p><a href="https://twitter.com/claranellist/status/1433539284779220997">source</a></p> <p><a href="https://twitter.com/claranellist/status/1433539284779220997">source</a></p>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -77,6 +77,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,8 +31,10 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<h1>Adding aliases in vite with typescript needs the same alias in tsconfig</h1> <h1>Adding aliases in vite with typescript needs the same alias in tsconfig</h1>
<p>For example:</p> <p>For example:</p>
@ -67,8 +69,6 @@ export default defineConfig({
} }
</code></pre> </code></pre>
<p>The asterixes in the syntax are important (<code>alias/*</code> =&gt; <code>./path/*</code>).</p> <p>The asterixes in the syntax are important (<code>alias/*</code> =&gt; <code>./path/*</code>).</p>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -108,6 +108,6 @@ export default defineConfig({
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,16 +31,16 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<h1>There is a file system for EFI vars now</h1> <h1>There is a file system for EFI vars now</h1>
<p><a href="https://www.kernel.org/doc/html/latest/filesystems/efivarfs.html">source</a></p> <p><a href="https://www.kernel.org/doc/html/latest/filesystems/efivarfs.html">source</a></p>
<p>On kernel updates I saw a recurring &quot;EFI variables are not supported on this system&quot;, so I investigated and learned that the new EFI variables are provided via a file system that needs to be mounted first:</p> <p>On kernel updates I saw a recurring &quot;EFI variables are not supported on this system&quot;, so I investigated and learned that the new EFI variables are provided via a file system that needs to be mounted first:</p>
<pre><code class="language-sh">mount -t efivarfs efivarfs /sys/firmware/efi/efivars <pre><code class="language-sh">mount -t efivarfs efivarfs /sys/firmware/efi/efivars
</code></pre> </code></pre>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -80,6 +80,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,8 +31,10 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<h1>pwdx command shows the working path of a process</h1> <h1>pwdx command shows the working path of a process</h1>
<p><a href="https://twitter.com/mani_maranp/status/1508476973529825281">source</a></p> <p><a href="https://twitter.com/mani_maranp/status/1508476973529825281">source</a></p>
@ -40,8 +42,6 @@
<pre><code class="language-sh">% pwdx 1984 <pre><code class="language-sh">% pwdx 1984
&gt; 1984: /home/george/ttlctrl &gt; 1984: /home/george/ttlctrl
</code></pre> </code></pre>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -81,6 +81,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,8 +31,10 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<h1>Jest mocks are ...different</h1> <h1>Jest mocks are ...different</h1>
<p>If you want to mock an imported function in Jest in a way that allows you to check if it has been called, you can not do the seemingly straighforward:</p> <p>If you want to mock an imported function in Jest in a way that allows you to check if it has been called, you can not do the seemingly straighforward:</p>
@ -57,8 +59,6 @@ jest.mock('@/path/to/module', () =&gt; ({
// ...in test descriptions // ...in test descriptions
expect(thatFunction).toHaveBeenCalled() expect(thatFunction).toHaveBeenCalled()
</code></pre> </code></pre>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -98,6 +98,6 @@ expect(thatFunction).toHaveBeenCalled()
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,14 +31,14 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<h1>Disallowed Focussed Tests and how it saved my day</h1> <h1>Disallowed Focussed Tests and how it saved my day</h1>
<p>Today I was about to push a focussed test. A focussed test, you ask?</p> <p>Today I was about to push a focussed test. A focussed test, you ask?</p>
<p>In Jest (and others) one can run only a specific test, by writing <code>it.only(...</code>. Pushing this to production might create some funny or not so funny side effects though. Luckily there is the <code>no-focussed-tests</code> linter rule in <a href="https://github.com/jest-community/eslint-plugin-jest">eslint-plugin-jest</a>.</p> <p>In Jest (and others) one can run only a specific test, by writing <code>it.only(...</code>. Pushing this to production might create some funny or not so funny side effects though. Luckily there is the <code>no-focussed-tests</code> linter rule in <a href="https://github.com/jest-community/eslint-plugin-jest">eslint-plugin-jest</a>.</p>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -78,6 +78,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,8 +31,10 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<h1>Sort list of strings in Javascript</h1> <h1>Sort list of strings in Javascript</h1>
<p><a href="https://stackoverflow.com/questions/6712034/sort-array-by-firstname-alphabetically-in-javascript">source</a></p> <p><a href="https://stackoverflow.com/questions/6712034/sort-array-by-firstname-alphabetically-in-javascript">source</a></p>
@ -41,8 +43,6 @@
<p>or reversed order:</p> <p>or reversed order:</p>
<pre><code class="language-ts">users.sort((a, b) =&gt; a.firstname.localeCompare(b.firstname) * -1) <pre><code class="language-ts">users.sort((a, b) =&gt; a.firstname.localeCompare(b.firstname) * -1)
</code></pre> </code></pre>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -82,6 +82,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<base href="http://localhost:8080/"> <base href="https://koehr.in/">
<title>Today I learned // the codeartist — programmer and engineer based in Berlin</title> <title>Today I learned // the codeartist — programmer and engineer based in Berlin</title>
<meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" /> <meta name="description" content="Homepage, Portfolio and CV of Norman Köhring" />
<meta content="The personal page and weblog of Norman Köhring" name=description> <meta content="The personal page and weblog of Norman Köhring" name=description>
@ -31,8 +31,10 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
<article class="til"> <article class="til">
<time datetime="2024-05-12">2024-05-12</time> <time datetime="2024-05-12">2024-05-12</time>
@ -104,8 +106,6 @@
(<a rel="nofollow noopener" class="external" href="https://www.w3schools.com/TAGS/tag_wbr.asp" target="_blank">source</a>) (<a rel="nofollow noopener" class="external" href="https://www.w3schools.com/TAGS/tag_wbr.asp" target="_blank">source</a>)
</div> </div>
</article> </article>
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -145,6 +145,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -31,8 +31,10 @@
</head> </head>
<body> <body>
<main id="til"> <main id="now" class="posts">
<header>Now -- What I'm up to right now</header> <header>
<h1>Now -- What I'm up to right now</h1>
</header>
@contents @contents
</main> </main>
@ -74,6 +76,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -31,12 +31,12 @@
</head> </head>
<body> <body>
<main id="til"> <main id="til" class="posts">
<header>TIL -- Today I learned</header> <header>
<h1>TIL -- Today I learned</h1>
</header>
@contents @contents
<a href="/til">back</a>
</main> </main>
<div id="spacer"></div> <div id="spacer"></div>
<header id="header" class="small"> <header id="header" class="small">
@ -76,6 +76,6 @@
<li><a title="Hardware I use" href="/setup">/setup</a></li> <li><a title="Hardware I use" href="/setup">/setup</a></li>
</menu> </menu>
<link href=/extended.css rel=stylesheet> <link href=/extended.css rel=stylesheet>
<link href=/til.css rel=stylesheet> <link href=/posts.css rel=stylesheet>
<script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script> <script async data-goatcounter=https://koehr.goatcounter.com/count src=//gc.zgo.at/count.js></script>
</body> </body>

@ -2,12 +2,15 @@
Last updated: 2024-05-12 Last updated: 2024-05-12
Still live in Berlin where I am working fully remote. I'm appproaching the second anniversary at [Code Gaia](https://codegaia.io) now and have no plans to change any of it.
## Priorities ## Priorities
> I do a lot of things all the time and have a hard time to focus. Most of my energy right now hopefully flows into the following things: > I do a lot of things all the time and have a hard time to focus. Most of my energy right now hopefully flows into the following things:
* This homepage. * This homepage.
* Keeping up the pace professionally by taking up more management responsibilities. * Keeping up the pace professionally by taking up more management responsibilities.
* Ramping up my side-project game (mainly by doing smaller freelancing jobs).
* Fleshing out a long form D&D campaign ("Out Of The Cold Shadow"). * Fleshing out a long form D&D campaign ("Out Of The Cold Shadow").
* Writing down more short adventures and one-shots and publish them on [tiskifer.dk](https://tiskifer.dk). * Writing down more short adventures and one-shots and publish them on [tiskifer.dk](https://tiskifer.dk).
* My wedding and honeymoon in June! * My wedding and honeymoon in June!

@ -11,13 +11,19 @@
gap: 4rem; gap: 4rem;
list-style: circle; list-style: circle;
background: var(--menu-bg-color); background: var(--menu-bg-color);
transition: top .3s ease-in-out; transition: all .3s ease-in-out;
} }
#main-menu > li { #main-menu > li {
padding: 0; padding: 0;
} }
body>header.small + #main-menu { body>header.small + #main-menu {
top: calc(var(--header-height) * var(--header-multiplier)); top: calc(var(--header-height-small) + 2rem);
height: 14rem;
width: 6rem;
flex-flow: column nowrap;
gap: .5rem;
align-items: stretch;
padding: 0 1rem;
} }
pre { pre {
background: var(--emboss-color); background: var(--emboss-color);

@ -1 +1,2 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path stroke="#eacb8b" stroke-width="2" d="m21 8-3.6 2c-2 1-3 1.6-4 1.8a7 7 0 0 1-2.8 0c-1-.2-2-.7-4-1.8L3 8m3.2 11h11.6c1.1 0 1.7 0 2.1-.2.4-.2.7-.5.9-.9.2-.4.2-1 .2-2.1V8.2c0-1.1 0-1.7-.2-2.1a2 2 0 0 0-.9-.9c-.4-.2-1-.2-2.1-.2H6.2c-1.1 0-1.7 0-2.1.2a2 2 0 0 0-.9.9C3 6.5 3 7 3 8.2v7.6c0 1.1 0 1.7.2 2.1.2.4.5.7.9.9.4.2 1 .2 2.1.2Z"/></svg> <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><path stroke="#eacb8b" stroke-width="2" d="m21 8-3.6 2c-2 1-3 1.6-4 1.8a7 7 0 0 1-2.8 0c-1-.2-2-.7-4-1.8L3 8m3.2 11h11.6c1.1 0 1.7 0 2.1-.2.4-.2.7-.5.9-.9.2-.4.2-1 .2-2.1V8.2c0-1.1 0-1.7-.2-2.1a2 2 0 0 0-.9-.9c-.4-.2-1-.2-2.1-.2H6.2c-1.1 0-1.7 0-2.1.2a2 2 0 0 0-.9.9C3 6.5 3 7 3 8.2v7.6c0 1.1 0 1.7.2 2.1.2.4.5.7.9.9.4.2 1 .2 2.1.2Z"/></svg>

Before

Width:  |  Height:  |  Size: 414 B

After

Width:  |  Height:  |  Size: 469 B

@ -0,0 +1,17 @@
main.posts {
margin: calc(var(--header-height-small) + 2rem) auto 4rem;
}
main.posts > #content > h1 {
padding: 0;
}
main.posts article {
margin: 1rem 0;
}
main.posts article>div {
line-height: 2;
}
main.posts article>time,
main.posts article>div>a.external {
color: gray;
}

@ -3,6 +3,7 @@
--header-fg-color: #a3bd8d; --header-fg-color: #a3bd8d;
--header-height: 192px; --header-height: 192px;
--header-multiplier: .25; --header-multiplier: .25;
--header-height-small: calc(var(--header-height)*var(--header-multiplier));
--page-bg-color: #232425; --page-bg-color: #232425;
--page-fg-color: #7e9fbe; --page-fg-color: #7e9fbe;
--menu-bg-color: #000; --menu-bg-color: #000;
@ -62,7 +63,7 @@ body>header {
} }
body>#spacer { body>#spacer {
height: calc(var(--header-height) * var(--header-multiplier)); height: var(--header-height-small);
} }
body>header { body>header {
@ -87,7 +88,7 @@ body>header>svg {
body>main { body>main {
width: 960px; width: 960px;
max-width: 98vw; max-width: 98vw;
margin: var(--header-height) auto 4em; margin: var(--header-height) auto 4rem;
} }
a { a {
@ -101,14 +102,17 @@ a {
margin: 2rem 0; margin: 2rem 0;
} }
#content>h1 { #content>h1,
main.posts > header > h1 {
margin: 0 0 .25em; margin: 0 0 .25em;
padding-top: 2em;
font-size: 2rem; font-size: 2rem;
font-variant: small-caps; font-variant: small-caps;
text-shadow: 1px 1px 0 var(--emboss-color); text-shadow: 1px 1px 0 var(--emboss-color);
color: var(--header-fg-color); color: var(--header-fg-color);
} }
#content>h1 {
padding-top: 2em;
}
#menu { #menu {
display: flex; display: flex;

@ -1,15 +0,0 @@
main#til > header {
margin: 0 0 2rem 0;
font-size: 1.5em;
}
article.til {
margin: 1rem 0;
}
article.til>div {
line-height: 2;
}
article.til>time,
article.til>div>a.external {
color: gray;
}
Loading…
Cancel
Save