commit 385a6ccb11319609a5b1452c2d2c395325a86743 Author: koehr Date: Sun Mar 10 00:35:47 2024 +0100 initial diff --git a/README.md b/README.md new file mode 100644 index 0000000..e34cd80 --- /dev/null +++ b/README.md @@ -0,0 +1,6 @@ +# Homepage of Norman Köhring + +## Build Instructions + +This homepage uses [VSS](https://github.com/vssio/vss/). To build, use: +`vss build` or `vss serve`. diff --git a/config.toml b/config.toml new file mode 100644 index 0000000..3298f54 --- /dev/null +++ b/config.toml @@ -0,0 +1,6 @@ +title = "Norman Köhring" +description = "Homepage, Portfolio and CV of Norman Köhring" +base_url = 'https://koehr.in/' + +[build] +ignore_files = ["README.md", "TODO"] diff --git a/dist/header.jpg b/dist/header.jpg new file mode 100644 index 0000000..ee867b3 Binary files /dev/null and b/dist/header.jpg differ diff --git a/dist/index.html b/dist/index.html new file mode 100644 index 0000000..d48be67 --- /dev/null +++ b/dist/index.html @@ -0,0 +1,62 @@ + + + + + + + Norman Köhring // the codeartist — programmer and engineer based in Berlin + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Homepage of +
+ Norman + Köhring +
+ Code Artist +
+
+
+

introduction

+

Hi there! I'm a programmer, OpenSource enthusiast and hacker, based in Berlin.

+

I call myself a code artist, because programming can and should be seen as a creative process; therefore code is art. I love to craft pieces of art with code, that are beautiful and elegant in their simplicity, readability and architecture.

+
+ +
+ + + + + \ No newline at end of file diff --git a/dist/interactive-homepage.jpg b/dist/interactive-homepage.jpg new file mode 100644 index 0000000..3923d2f Binary files /dev/null and b/dist/interactive-homepage.jpg differ diff --git a/dist/style.css b/dist/style.css new file mode 100644 index 0000000..0733edc --- /dev/null +++ b/dist/style.css @@ -0,0 +1,70 @@ +:root { + --page-bg-color: #101626; + --page-fg-color: #fff8e7; + --emboss-color: #000; +} + +@media (prefers-color-scheme: light) { + :root { + --page-bg-color: #efe9d9; + --page-fg-color: #261b00; + --emboss-color: #fff; + } + + body>header { + filter: invert(); + } +} + +* { + transition: color, background-color 200ms ease; +} + +html, +body { + display: flex; + flex-flow: column nowrap; + justify-content: center; + width: 960px; + max-width: 98vw; + margin: auto; + background: var(--page-bg-color); + color: var(--page-fg-color); + font-size: 20px; + font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; +} + +body>header { + height: 420px; + background: url(/header.jpg) center no-repeat; + color: transparent; +} + +#content>h1 { + font-size: 2rem; + font-variant: small-caps; + text-shadow: 1px 1px 0 var(--emboss-color); +} + +#menu { + display: flex; + justify-content: space-between; + align-items: center; + gap: 1rem; + margin: 3rem 0 0 0; + text-align: center; +} + +#menu>a { + display: flex; + flex-flow: column nowrap; + justify-content: center; + color: white; + text-decoration: none; + font-variant: small-caps; +} + +#menu>a>img { + max-width: 400px; + aspect-ratio: 400 / 281; +} \ No newline at end of file diff --git a/index.md b/index.md new file mode 100644 index 0000000..46c79cd --- /dev/null +++ b/index.md @@ -0,0 +1,5 @@ +# introduction + +Hi there! I'm a programmer, OpenSource enthusiast and hacker, based in Berlin. + +I call myself a code artist, because programming can and should be seen as a creative process; therefore code is art. I love to craft pieces of art with code, that are beautiful and elegant in their simplicity, readability and architecture. diff --git a/layouts/index.html b/layouts/index.html new file mode 100644 index 0000000..840dbe8 --- /dev/null +++ b/layouts/index.html @@ -0,0 +1,60 @@ + + + + + + + @title // the codeartist — programmer and engineer based in Berlin + + + + + + + + + + + + + + + + + + + + + + + + + +
+ Homepage of +
+ Norman + Köhring +
+ Code Artist +
+
+
+ @contents +
+ +
+ + + + + \ No newline at end of file diff --git a/static/header.jpg b/static/header.jpg new file mode 100644 index 0000000..ee867b3 Binary files /dev/null and b/static/header.jpg differ diff --git a/static/interactive-homepage.jpg b/static/interactive-homepage.jpg new file mode 100644 index 0000000..3923d2f Binary files /dev/null and b/static/interactive-homepage.jpg differ diff --git a/static/style.css b/static/style.css new file mode 100644 index 0000000..0733edc --- /dev/null +++ b/static/style.css @@ -0,0 +1,70 @@ +:root { + --page-bg-color: #101626; + --page-fg-color: #fff8e7; + --emboss-color: #000; +} + +@media (prefers-color-scheme: light) { + :root { + --page-bg-color: #efe9d9; + --page-fg-color: #261b00; + --emboss-color: #fff; + } + + body>header { + filter: invert(); + } +} + +* { + transition: color, background-color 200ms ease; +} + +html, +body { + display: flex; + flex-flow: column nowrap; + justify-content: center; + width: 960px; + max-width: 98vw; + margin: auto; + background: var(--page-bg-color); + color: var(--page-fg-color); + font-size: 20px; + font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; +} + +body>header { + height: 420px; + background: url(/header.jpg) center no-repeat; + color: transparent; +} + +#content>h1 { + font-size: 2rem; + font-variant: small-caps; + text-shadow: 1px 1px 0 var(--emboss-color); +} + +#menu { + display: flex; + justify-content: space-between; + align-items: center; + gap: 1rem; + margin: 3rem 0 0 0; + text-align: center; +} + +#menu>a { + display: flex; + flex-flow: column nowrap; + justify-content: center; + color: white; + text-decoration: none; + font-variant: small-caps; +} + +#menu>a>img { + max-width: 400px; + aspect-ratio: 400 / 281; +} \ No newline at end of file