Formatting

app/frontend/src/components/CV/Experience.tsx

@@ -3,7 +3,7 @@ import { defineMessages, useIntl } from "react-intl";
 
 import { Content } from "../common/Content";
 import { Headline, SubHeadline } from "../common/Headline";
-import { Spacer } from "../common/Spacer";
+import PageBreakAvoid from "../common/PageBreakAvoid";
 import { Paragraph } from "../common/Text";
 
 const messages = defineMessages({
@@ -25,44 +25,69 @@ const approxCurrentYears = {
   ),
 };
 
-const yourpassSkills = [
+const investbaySkills = [
   "DevOps",
-  "Front-End Development",
+  "Google Cloud Platform (GCP)",
-  "Back-end Operations",
+  "Amazon Web Services (AWS)",
-  "Software Development",
+  "Gitlab",
-  "Kubernetes",
+  "Terraform",
-  "TypeScript",
+  "Cloud infrastructure",
-  "Go",
+  "Cloud Applications",
-  "Linux",
+  "Software Development Life Cycle (SDLC)",
-  "Linux Server",
   "Linux System Administration",
-  "Back-End Web Development",
+  "Go",
-  "Git",
+  "TypeScript",
+  "Nix",
+  "GraphQL",
+  "gRPC",
   "PostgreSQL",
   "Node.js",
   "React.js",
+];
+
+const yourpassSkills = [
+  "DevOps",
+  "Software as a Service (SaaS)",
+  "Cloud Infrastructure",
+  "Kubernetes",
+  "Back-end Operations",
+  "Linux System Administration",
   "Amazon Web Services (AWS)",
-  "Amazon EKS",
+  "Terraform",
+  "Go (Programming Language)",
+  "gRPC",
+  "Front-End Development",
+  "React.js",
+  "Node.js",
+  "TypeScript",
+  "Nix",
+  "Software Development Life Cycle (SDLC)",
+  "Software Development",
+  "Git",
+  "PostgreSQL",
 ];
 
 const yoursystemSkills = [
   "DevOps",
-  "Front-End Development",
+  "Docker Swarm",
+  "Linux System Administration",
   "Back-end Operations",
+  "Front-End Development",
+  "Amazon Web Services (AWS)",
+  "Bash",
+  "Linux Server",
+  "Terraform",
+  "Cloud Infrastructure",
+  "Cloud Applications",
+  "Go (Programming Language)",
+  "TypeScript",
+  "Node.js",
+  "Software Development Life Cycle (SDLC)",
   "Software Development",
   "Kubernetes",
-  "TypeScript",
-  "Linux",
-  "Linux Server",
-  "Linux System Administration",
   "Back-End Web Development",
+  "GraphQL",
   "Git",
-  "Node.js",
-  "Vue.js",
-  "PHP",
-  "Bash",
-  "Amazon Web Services (AWS)",
-  "Amazon EKS",
 ];
 
 const Experience: React.FC = () => {
@@ -70,103 +95,109 @@ const Experience: React.FC = () => {
 
   return (
     <>
-      <Headline level={3}>INVESTBAY s.r.o.</Headline>
+      <PageBreakAvoid>
-      <SubHeadline level={4}>DevOps Architect</SubHeadline>
+        <Headline level={3}>INVESTBAY s.r.o.</Headline>
-      <Content>
+        <SubHeadline level={4}>DevOps Architect</SubHeadline>
-        <Paragraph>
+        <Content>
-          {intl.formatMessage(
+          <Paragraph>
-            {
+            {intl.formatMessage(
-              defaultMessage: "February 2024 - Present",
+              {
-              id: "Experience.investbay",
+                defaultMessage: "February 2024 - Present",
-            },
+                id: "Experience.investbay",
-            {
+              },
-              // not used atm
+              {
-              count: approxCurrentYears.InvestBay,
+                // not used atm
-            }
+                count: approxCurrentYears.InvestBay,
-          )}
+              }
-        </Paragraph>
+            )}
-        <Paragraph>
+          </Paragraph>
-          <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
+          <Paragraph>
-          {yourpassSkills.join(" · ")}
+            <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
-        </Paragraph>
+            {investbaySkills.join(" · ")}
-      </Content>
+          </Paragraph>
+        </Content>
+      </PageBreakAvoid>
 
-      <Headline level={3}>YOUR PASS s.r.o.</Headline>
+      <PageBreakAvoid>
-      <SubHeadline level={4}>DevOps Engineer</SubHeadline>
+        <Headline level={3}>YOUR PASS s.r.o.</Headline>
-      <Content>
+        <SubHeadline level={4}>DevOps Engineer</SubHeadline>
-        <Paragraph>
+        <Content>
-          {intl.formatMessage(
+          <Paragraph>
-            {
+            {intl.formatMessage(
-              defaultMessage: "July 2021 - Present ({count} years)",
+              {
-              id: "Experience.yourpass",
+                defaultMessage: "July 2021 - Present ({count} years)",
-            },
+                id: "Experience.yourpass",
-            {
+              },
-              count: approxCurrentYears.YourPass,
+              {
-            }
+                count: approxCurrentYears.YourPass,
-          )}
+              }
-        </Paragraph>
+            )}
-        <Paragraph>
+          </Paragraph>
-          <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
+          <Paragraph>
-          {yourpassSkills.join(" · ")}
+            <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
-        </Paragraph>
+            {yourpassSkills.join(" · ")}
-      </Content>
+          </Paragraph>
+        </Content>
+      </PageBreakAvoid>
 
-      <Spacer />
+      <PageBreakAvoid>
+        <Headline level={3}>YOUR SYSTEM s.r.o.</Headline>
+        <SubHeadline level={4}>SysOps</SubHeadline>
 
-      <Headline level={3}>YOUR SYSTEM s.r.o.</Headline>
+        <Content>
-      <SubHeadline level={4}>SysOps</SubHeadline>
+          <Paragraph>
+            {intl.formatMessage(
+              {
+                defaultMessage: "January 2022 - Present ({count} years)",
+                id: "Experience.yoursystem",
+              },
+              {
+                count: approxCurrentYears.YourSystemSysOps,
+              }
+            )}
+          </Paragraph>
+          <Paragraph>
+            <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
+            {yoursystemSkills.join(" · ")}
+          </Paragraph>
+        </Content>
 
-      <Content>
+        <SubHeadline level={4}>Lead Developer/Architect</SubHeadline>
-        <Paragraph>
+
-          {intl.formatMessage(
+        <Content>
-            {
+          <Paragraph>
-              defaultMessage: "January 2022 - Present ({count} years)",
+            {intl.formatMessage({
+              defaultMessage: "February 2016 - December 2021 (5 years)",
               id: "Experience.yoursystem",
-            },
+            })}
-            {
+          </Paragraph>
-              count: approxCurrentYears.YourSystemSysOps,
+          <Paragraph>
-            }
+            <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
-          )}
+            {yoursystemSkills.join(" · ")}
-        </Paragraph>
+          </Paragraph>
-        <Paragraph>
+        </Content>
-          <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
+      </PageBreakAvoid>
-          {yoursystemSkills.join(" · ")}
-        </Paragraph>
-      </Content>
 
-      <SubHeadline level={4}>Lead Developer/Architect</SubHeadline>
+      <PageBreakAvoid>
+        <Headline level={3}>Past experience</Headline>
+        <SubHeadline level={4}>Developer</SubHeadline>
 
-      <Content>
+        <Content>
-        <Paragraph>
+          <Paragraph>
-          {intl.formatMessage({
+            {intl.formatMessage({
-            defaultMessage: "February 2016 - December 2021 (5 years)",
+              defaultMessage: "Birth - February 2016",
-            id: "Experience.yoursystem",
+              id: "Experience.past",
-          })}
+            })}
-        </Paragraph>
+          </Paragraph>
-        <Paragraph>
+          <Paragraph>
-          <strong>{intl.formatMessage(messages.skills)}:</strong>{" "}
+            {intl.formatMessage({
-          {yoursystemSkills.join(" · ")}
+              defaultMessage:
-        </Paragraph>
+                "Working on smaller projects such as chats, forum based websites, web based presentations, most notably a system for handling the driver training center and driving school agenda... Tinkering...",
-      </Content>
+              id: "Experience.pastDescription",
-
+            })}
-      <Headline level={3}>Past experience</Headline>
+          </Paragraph>
-      <SubHeadline level={4}>Developer</SubHeadline>
+        </Content>
-
+      </PageBreakAvoid>
-      <Content>
-        <Paragraph>
-          {intl.formatMessage({
-            defaultMessage: "Birth - February 2016",
-            id: "Experience.past",
-          })}
-        </Paragraph>
-        <Paragraph>
-          {intl.formatMessage({
-            defaultMessage:
-              "Working on smaller projects such as chats, forum based websites, web based presentations, most notably a system for handling the driver training center and driving school agenda... Tinkering...",
-            id: "Experience.pastDescription",
-          })}
-        </Paragraph>
-      </Content>
     </>
   );
 };

app/frontend/src/components/CV/Skill.tsx

@@ -1,5 +1,6 @@
 import React from "react";
 
+import PageBreakAvoid from "../common/PageBreakAvoid";
 import { Spacer } from "../common/Spacer";
 import { Paragraph } from "../common/Text";
 
@@ -11,13 +12,13 @@ const Skill: React.FC<React.PropsWithChildren<SkillProps>> = (props) => {
   const { children, title } = props;
 
   return (
-    <div>
+    <PageBreakAvoid>
       <strong>{title}</strong>
       <Spacer />
       {React.Children.map(children, (c) => (
         <Paragraph>{c}</Paragraph>
       ))}
-    </div>
+    </PageBreakAvoid>
   );
 };
 

app/frontend/src/components/CV/Skills.tsx

@@ -3,6 +3,7 @@ import { useIntl } from "react-intl";
 
 import { SubHeadline } from "../common/Headline";
 import { List, ListItem } from "../common/List";
+import PageBreakAvoid from "../common/PageBreakAvoid";
 import { Spacer } from "../common/Spacer";
 import { Paragraph } from "../common/Text";
 import Skill from "./Skill";
@@ -69,12 +70,12 @@ const Skills: React.FC = () => {
         {intl.formatMessage({
           defaultMessage:
             "Deep knowledge of backend operations, mostly supporting web based applications using various technologies, programming languages and frameworks.",
-          id: "Skills.backendDevelopment",
+          id: "Skills.backendDevelopmentSum1",
         })}
         {intl.formatMessage({
           defaultMessage:
             "In recent years, the main focus was on Go to write tooling and backend services.",
-          id: "Skills.backendDevelopment",
+          id: "Skills.backendDevelopmentSum2",
         })}
       </Skill>
       <Skill title="Infrastructure operations">
@@ -99,8 +100,10 @@ const Skills: React.FC = () => {
       <List>
         {otherSkills.map((s) => (
           <ListItem key={s.title}>
-            <strong>{s.title}</strong>
+            <PageBreakAvoid>
-            {s.description && `: ${s.description}`}
+              <strong>{s.title}</strong>
+              {s.description && `: ${s.description}`}
+            </PageBreakAvoid>
           </ListItem>
         ))}
       </List>

app/frontend/src/components/CV/Summary.tsx

@@ -38,8 +38,7 @@ const Summary: React.FC = () => {
         knowledge of KNX systems.
       </Paragraph>
       <Caption>
-        -- This summary was graciously generated by an AI and then rewritten and
+        -- Summary graciously generated by an AI and curated by human
-        adjusted by a human
       </Caption>
     </>
   );

app/frontend/src/components/Layout/MainLayout.tsx

@@ -23,7 +23,7 @@ const Nav = styled("nav")({
   flex: "0 0 280px",
   width: 280,
   minHeight: "100%",
-  padding: "3rem 2rem 2rem",
+  padding: "2rem 2rem 2rem",
 
   [hideNavigationMQ]: {
     display: "none",

app/frontend/src/components/Navigation/MainNavigation.tsx

@@ -1,12 +1,23 @@
+import styled from "@emotion/styled";
 import React, { useEffect, useRef } from "react";
 import { useIntl } from "react-intl";
 
+import profile from "../../assets/profile.jpg";
 import { CONTACT_EMAIL, CONTACT_PHONE } from "../../config/environment";
 import { Contact } from "../common/Contact";
 import { List, ListItem } from "../common/List";
 import { Spacer } from "../common/Spacer";
 import NavigationHeadline from "./NavigationHeadline";
 
+const ProfileImg = styled("img")({
+  borderRadius: "50%",
+  border: "2px solid white",
+  display: "block",
+  margin: "0 auto",
+  maxWidth: "100%",
+  width: 150,
+});
+
 const getTopOffset = (input: HTMLElement) => {
   let el: HTMLElement | Element | null = input;
   let o = 0;
@@ -51,6 +62,13 @@ const MainNavigation: React.FC = () => {
       scrollPrev = window.scrollY;
       const top = getTopOffset(d);
 
+      console.log({
+        "window.innerHeight": window.innerHeight,
+        height,
+        top,
+        down,
+      });
+
       if (window.innerHeight > height) {
         d.style.marginTop = `${Math.max(window.scrollY, 0)}px`;
         return;
@@ -61,16 +79,24 @@ const MainNavigation: React.FC = () => {
         const wDelta = window.scrollY + window.innerHeight;
 
         const diff = wDelta - delta;
+        console.log({ delta, wDelta, "window.scrollY": window.scrollY, diff });
+
         if (diff > 0) {
           const sizeDelta = Math.min(window.innerHeight - height, 0);
           d.style.marginTop = `${Math.max(top + diff + sizeDelta, 0)}px`;
+          console.log({
+            sizeDelta,
+            marginTop: Math.max(top + diff + sizeDelta, 0),
+          });
         }
       } else {
         const delta = top;
         const wDelta = window.scrollY;
 
         const diff = wDelta - delta;
+        console.log({ delta, wDelta, "window.scrollY": window.scrollY, diff });
         if (diff < 0) {
+          console.log({ marginTop: Math.max(top + diff, 0) });
           d.style.marginTop = `${Math.max(top + diff, 0)}px`;
         }
       }
@@ -86,6 +112,8 @@ const MainNavigation: React.FC = () => {
 
   return (
     <div ref={ref}>
+      <ProfileImg src={profile} alt="profile picture" />
+
       <NavigationHeadline>
         {intl.formatMessage({
           defaultMessage: "Contact",

app/frontend/src/components/common/PageBreakAvoid.tsx

@@ -0,0 +1,7 @@
+import styled from "@emotion/styled";
+
+const PageBreakAvoid = styled("div")({
+  pageBreakInside: "avoid",
+});
+
+export default PageBreakAvoid;

app/server/internal/config/config.go

@@ -7,10 +7,9 @@ import (
 	"os"
 	"time"
 
+	"go.c3c.cz/cv/app/server/internal/version"
 	"go.uber.org/zap"
 	"go.uber.org/zap/zapcore"
-
-	"go.c3c.cz/cv/app/server/internal/version"
 )
 
 type FrontendConfigDef struct {

app/server/internal/httpserver/httphandler.go

@@ -14,10 +14,9 @@ import (
 	"strings"
 	"time"
 
-	"go.uber.org/zap"
-
 	"go.c3c.cz/cv/app/server/internal/files"
 	"go.c3c.cz/cv/app/server/internal/version"
+	"go.uber.org/zap"
 )
 
 type handler struct {
@@ -67,7 +66,6 @@ func (h *handler) serveFile(w http.ResponseWriter, r *http.Request, modtime time
 			gw.Reset(io.Discard)
 		}
 		err = gw.Close()
-
 		if err != nil {
 			h.logger.Warn("Could not close gzip writer", zap.Error(err))
 			return

app/server/internal/httpserver/httpserver.go

@@ -10,9 +10,8 @@ import (
 	"net/http"
 	"time"
 
-	"go.uber.org/zap"
-
 	"go.c3c.cz/cv/app/server/internal/files"
+	"go.uber.org/zap"
 )
 
 func init() {

app/server/main.go

@@ -8,12 +8,11 @@ import (
 	"os/signal"
 	"syscall"
 
-	"go.uber.org/zap"
-
 	"go.c3c.cz/cv/app/server/internal/config"
 	"go.c3c.cz/cv/app/server/internal/httpserver"
 	"go.c3c.cz/cv/app/server/internal/pprofserver"
 	"go.c3c.cz/cv/app/server/internal/version"
+	"go.uber.org/zap"
 )
 
 func main() {
@@ -33,7 +32,6 @@ func main() {
 	var err error
 
 	logger, err = config.LoggerConfig.Build()
-
 	if err != nil {
 		fmt.Println(notice)
 		fmt.Println(version.CommitTime.Format("Committed at 2006/01/02 15:04:05 MST"))

flake.nix

@@ -8,7 +8,8 @@
     {
       formatter = nix.formatter;
 
-      packages = nix.lib.forAllSystems (pkgs:
+      packages = nix.lib.forAllSystems (
+        pkgs:
         let
           version = "rev-${self.shortRev or self.dirtyShortRev}";
           package = builtins.fromJSON (builtins.readFile ./app/frontend/package.json);
@@ -42,7 +43,9 @@
               "-w"
               "-X gopkg.c3c.cz/cv/app/server/internal/version.Tag=${version}"
               "-X gopkg.c3c.cz/cv/app/server/internal/version.Commit=${self.rev or self.dirtyRev}"
-              "-X gopkg.c3c.cz/cv/app/server/internal/version.commitTime=${builtins.toString (self.lastModified or 0)}"
+              "-X gopkg.c3c.cz/cv/app/server/internal/version.commitTime=${
+                builtins.toString (self.lastModified or 0)
+              }"
             ];
             vendorHash = "sha256-44xcyVk5KcurQLkVJv1MeAj+Pfcu53664pvVgHdyv3E=";
           };
@@ -70,6 +73,19 @@
           ];
 
           commands = [
+            {
+              # Override golangci-lint for vscode, because the extension incorrectly assumes usage of global binaries is preferred
+              name = "golangci-lint";
+              command = ''
+                CMD=''${1:-}
+                if [[ "$CMD" == "run" ]]; then
+                  shift
+                  ${pkgs.golangci-lint}/bin/golangci-lint run --config ${nix.lib.golangci-config-file} $@
+                else
+                  ${pkgs.golangci-lint}/bin/golangci-lint $@
+                fi
+              '';
+            }
             {
               name = "lint";
               help = "run linters";
@@ -84,7 +100,7 @@
               help = "format & fix found issues";
               command = ''
                 ${nix.lib.cd_root}
-                nix fmt .
+                nix fmt ./*.nix
                 ${pkgs.golangci-lint}/bin/golangci-lint run --sort-results --out-format tab --config ${nix.lib.golangci-config-file} --fix --issues-exit-code 0 ./...
                 npm --prefix app/frontend run fix
               '';