From 8dabc4e5700b785da61936ab199daeea0691fc3c Mon Sep 17 00:00:00 2001
From: Michael Czechowski <mail@dailysh.it>
Date: Thu, 7 May 2026 14:41:07 +0200
Subject: [PATCH] =?UTF-8?q?dhbw=20farb-schema:=20himbeer=20(wie=20hdm=2022?=
 =?UTF-8?q?3015c)=20=E2=80=94=20highlight=20#d63384,=20h1=20#a02060,=20h2?=
 =?UTF-8?q?=20#1f2937=20(#f48fb1=20auf=20invert=20f=C3=BCr=20barrierearmut?=
 =?UTF-8?q?),=20pre/code=20#0f0f23/#d63384,=20dimmed=20#4a4a6a,=20invert-b?=
 =?UTF-8?q?g=20#001520=E2=86=92#000;=20herzlich=20willkommen=20statt=20wil?=
 =?UTF-8?q?lkommen;=20git=20kurz=20erkl=C3=A4rt?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 slides/dhbw/01_web_eng.md         | 44 ++++++++++++++++++-------------
 slides/dhbw/02_css_extended.md    | 28 ++++++++++++--------
 slides/dhbw/03_nodejs_basics.md   | 26 +++++++++++-------
 slides/dhbw/04_nodejs_advanced.md | 26 +++++++++++-------
 slides/dhbw/05_testing.md         | 26 +++++++++++-------
 slides/dhbw/06_typescript.md      | 28 ++++++++++++--------
 slides/dhbw/07_docker.md          | 26 +++++++++++-------
 slides/dhbw/08_best_practices.md  | 28 ++++++++++++--------
 8 files changed, 140 insertions(+), 92 deletions(-)

diff --git a/slides/dhbw/01_web_eng.md b/slides/dhbw/01_web_eng.md
index 62731b0..6dcbcbe 100644
--- a/slides/dhbw/01_web_eng.md
+++ b/slides/dhbw/01_web_eng.md
@@ -11,8 +11,8 @@ title: Web Engineering
 <style>
 :root {
   --color-foreground: #1a1a2e;
-  --color-highlight: #005f8a;
-  --color-dimmed: #4a6a7a;
+  --color-highlight: #d63384;
+  --color-dimmed: #4a4a6a;
 }
 section.invert {
   --color-foreground: #fff;
@@ -21,24 +21,30 @@ section {
   font-size: 1.4rem;
 }
 h1 {
-  color: #005f8a;
+  color: #a02060;
 }
 section.invert h1 {
   color: #fff;
 }
+h2 {
+  color: #1f2937;
+}
+section.invert h2 {
+  color: #f48fb1;
+}
 pre {
-  background: #0f1e2e;
-  color: #00b4d8;
+  background: #0f0f23;
+  color: #d63384;
   border-radius: 8px;
-  border-left: 3px solid #005f8a;
+  border-left: 3px solid #d63384;
 }
 pre code {
   background: transparent;
   color: inherit;
 }
 code {
-  background: #1a3a4a;
-  color: #00b4d8;
+  background: #1a1a2e;
+  color: #d63384;
   padding: 0.15em 0.4em;
   border-radius: 4px;
 }
@@ -49,7 +55,7 @@ a {
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 ![bg cover opacity:0.2](./assets/background.png)
 
@@ -63,7 +69,7 @@ a {
 
 <!-- _class: lead -->
 
-# Willkommen!
+# Herzlich Willkommen!
 
 ## 1. Sitzung: 08.05.2026
 
@@ -202,7 +208,7 @@ Content-Type: application/json
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Onboarding
 ## Tools, Runtimes, Workflows
@@ -212,11 +218,11 @@ Content-Type: application/json
 # Werkzeuge & Betriebssystem
 
 **Was du brauchst:**
-- Terminal (zsh/bash/fish/pwsh)
-- Editor (siehe folgende Folie)
-- JavaScript-Runtime (Node.js / Bun / Deno)
-- Browser mit DevTools (Chromium / Firefox / Safari)
-- Git
+- **Terminal** (zsh / bash / fish / pwsh) — Kommandozeile
+- **Editor** (siehe folgende Folie)
+- **JavaScript-Runtime** (Node.js / Bun / Deno)
+- **Browser mit DevTools** (Chromium / Firefox / Safari)
+- **Git** — verteiltes Versionskontrollsystem (Stand der Industrie)
 
 **OS-Empfehlung:**
 
@@ -447,7 +453,7 @@ npm install express
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # HTML – Hypertext Markup Language
 
@@ -736,7 +742,7 @@ Was früher mit JavaScript gelöst wurde, kann HTML heute selbst. JS dafür einz
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # CSS – Cascading Style Sheets
 
@@ -1123,7 +1129,7 @@ p::first-letter {
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # JavaScript
 
diff --git a/slides/dhbw/02_css_extended.md b/slides/dhbw/02_css_extended.md
index 18ec44a..d24f48c 100644
--- a/slides/dhbw/02_css_extended.md
+++ b/slides/dhbw/02_css_extended.md
@@ -10,8 +10,8 @@ footer: "Michael Czechowski – SoSe 2026"
 <style>
 :root {
   --color-foreground: #1a1a2e;
-  --color-highlight: #005f8a;
-  --color-dimmed: #4a6a7a;
+  --color-highlight: #d63384;
+  --color-dimmed: #4a4a6a;
 }
 section.invert {
   --color-foreground: #fff;
@@ -20,24 +20,30 @@ section {
   font-size: 1.4rem;
 }
 h1 {
-  color: #005f8a;
+  color: #a02060;
 }
 section.invert h1 {
   color: #fff;
 }
+h2 {
+  color: #1f2937;
+}
+section.invert h2 {
+  color: #f48fb1;
+}
 pre {
-  background: #0f1e2e;
-  color: #00b4d8;
+  background: #0f0f23;
+  color: #d63384;
   border-radius: 8px;
-  border-left: 3px solid #005f8a;
+  border-left: 3px solid #d63384;
 }
 pre code {
   background: transparent;
   color: inherit;
 }
 code {
-  background: #1a3a4a;
-  color: #00b4d8;
+  background: #1a1a2e;
+  color: #d63384;
   padding: 0.15em 0.4em;
   border-radius: 4px;
 }
@@ -48,7 +54,7 @@ a {
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Web Engineering
 
@@ -75,7 +81,7 @@ Aufbauend auf den Grundlagen aus Sitzung 1.
 ---
 
 <!-- _class: invert -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # CSS: Extended
 
@@ -193,7 +199,7 @@ gap: 20px 40px;
 
 ```css
 :root {
-  --primary-color: #005f8a;
+  --primary-color: #d63384;
   --spacing: 20px;
   --radius: 8px;
 }
diff --git a/slides/dhbw/03_nodejs_basics.md b/slides/dhbw/03_nodejs_basics.md
index 3c03534..a357536 100644
--- a/slides/dhbw/03_nodejs_basics.md
+++ b/slides/dhbw/03_nodejs_basics.md
@@ -10,8 +10,8 @@ footer: "Michael Czechowski – SoSe 2026"
 <style>
 :root {
   --color-foreground: #1a1a2e;
-  --color-highlight: #005f8a;
-  --color-dimmed: #4a6a7a;
+  --color-highlight: #d63384;
+  --color-dimmed: #4a4a6a;
 }
 section.invert {
   --color-foreground: #fff;
@@ -20,24 +20,30 @@ section {
   font-size: 1.4rem;
 }
 h1 {
-  color: #005f8a;
+  color: #a02060;
 }
 section.invert h1 {
   color: #fff;
 }
+h2 {
+  color: #1f2937;
+}
+section.invert h2 {
+  color: #f48fb1;
+}
 pre {
-  background: #0f1e2e;
-  color: #00b4d8;
+  background: #0f0f23;
+  color: #d63384;
   border-radius: 8px;
-  border-left: 3px solid #005f8a;
+  border-left: 3px solid #d63384;
 }
 pre code {
   background: transparent;
   color: inherit;
 }
 code {
-  background: #1a3a4a;
-  color: #00b4d8;
+  background: #1a1a2e;
+  color: #d63384;
   padding: 0.15em 0.4em;
   border-radius: 4px;
 }
@@ -48,7 +54,7 @@ a {
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Web Engineering
 
@@ -72,7 +78,7 @@ a {
 ---
 
 <!-- _class: invert -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Node.js – Scripting, Running and Building
 
diff --git a/slides/dhbw/04_nodejs_advanced.md b/slides/dhbw/04_nodejs_advanced.md
index 4b8fed4..2a54e34 100644
--- a/slides/dhbw/04_nodejs_advanced.md
+++ b/slides/dhbw/04_nodejs_advanced.md
@@ -10,8 +10,8 @@ footer: "Michael Czechowski – SoSe 2026"
 <style>
 :root {
   --color-foreground: #1a1a2e;
-  --color-highlight: #005f8a;
-  --color-dimmed: #4a6a7a;
+  --color-highlight: #d63384;
+  --color-dimmed: #4a4a6a;
 }
 section.invert {
   --color-foreground: #fff;
@@ -20,24 +20,30 @@ section {
   font-size: 1.4rem;
 }
 h1 {
-  color: #005f8a;
+  color: #a02060;
 }
 section.invert h1 {
   color: #fff;
 }
+h2 {
+  color: #1f2937;
+}
+section.invert h2 {
+  color: #f48fb1;
+}
 pre {
-  background: #0f1e2e;
-  color: #00b4d8;
+  background: #0f0f23;
+  color: #d63384;
   border-radius: 8px;
-  border-left: 3px solid #005f8a;
+  border-left: 3px solid #d63384;
 }
 pre code {
   background: transparent;
   color: inherit;
 }
 code {
-  background: #1a3a4a;
-  color: #00b4d8;
+  background: #1a1a2e;
+  color: #d63384;
   padding: 0.15em 0.4em;
   border-radius: 4px;
 }
@@ -48,7 +54,7 @@ a {
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Web Engineering
 
@@ -71,7 +77,7 @@ a {
 ---
 
 <!-- _class: invert -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Node.js – Advanced
 
diff --git a/slides/dhbw/05_testing.md b/slides/dhbw/05_testing.md
index 9e4d86b..7b051aa 100644
--- a/slides/dhbw/05_testing.md
+++ b/slides/dhbw/05_testing.md
@@ -11,8 +11,8 @@ title: Testing
 <style>
 :root {
   --color-foreground: #1a1a2e;
-  --color-highlight: #005f8a;
-  --color-dimmed: #4a6a7a;
+  --color-highlight: #d63384;
+  --color-dimmed: #4a4a6a;
 }
 section.invert {
   --color-foreground: #fff;
@@ -21,24 +21,30 @@ section {
   font-size: 1.4rem;
 }
 h1 {
-  color: #005f8a;
+  color: #a02060;
 }
 section.invert h1 {
   color: #fff;
 }
+h2 {
+  color: #1f2937;
+}
+section.invert h2 {
+  color: #f48fb1;
+}
 pre {
-  background: #0f1e2e;
-  color: #00b4d8;
+  background: #0f0f23;
+  color: #d63384;
   border-radius: 8px;
-  border-left: 3px solid #005f8a;
+  border-left: 3px solid #d63384;
 }
 pre code {
   background: transparent;
   color: inherit;
 }
 code {
-  background: #1a3a4a;
-  color: #00b4d8;
+  background: #1a1a2e;
+  color: #d63384;
   padding: 0.15em 0.4em;
   border-radius: 4px;
 }
@@ -49,7 +55,7 @@ a {
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Web Engineering
 
@@ -60,7 +66,7 @@ a {
 ---
 
 <!-- _class: invert -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Testing
 
diff --git a/slides/dhbw/06_typescript.md b/slides/dhbw/06_typescript.md
index 508ea8d..b22e8ad 100644
--- a/slides/dhbw/06_typescript.md
+++ b/slides/dhbw/06_typescript.md
@@ -11,8 +11,8 @@ title: TypeScript
 <style>
 :root {
   --color-foreground: #1a1a2e;
-  --color-highlight: #005f8a;
-  --color-dimmed: #4a6a7a;
+  --color-highlight: #d63384;
+  --color-dimmed: #4a4a6a;
 }
 section.invert {
   --color-foreground: #fff;
@@ -21,24 +21,30 @@ section {
   font-size: 1.4rem;
 }
 h1 {
-  color: #005f8a;
+  color: #a02060;
 }
 section.invert h1 {
   color: #fff;
 }
+h2 {
+  color: #1f2937;
+}
+section.invert h2 {
+  color: #f48fb1;
+}
 pre {
-  background: #0f1e2e;
-  color: #00b4d8;
+  background: #0f0f23;
+  color: #d63384;
   border-radius: 8px;
-  border-left: 3px solid #005f8a;
+  border-left: 3px solid #d63384;
 }
 pre code {
   background: transparent;
   color: inherit;
 }
 code {
-  background: #1a3a4a;
-  color: #00b4d8;
+  background: #1a1a2e;
+  color: #d63384;
   padding: 0.15em 0.4em;
   border-radius: 4px;
 }
@@ -49,7 +55,7 @@ a {
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Web Engineering
 
@@ -60,7 +66,7 @@ a {
 ---
 
 <!-- _class: invert -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # TypeScript
 
@@ -305,7 +311,7 @@ function verify(result) {
 ---
 
 <!-- _class: invert -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Decorators
 
diff --git a/slides/dhbw/07_docker.md b/slides/dhbw/07_docker.md
index 857d63b..4af5d5d 100644
--- a/slides/dhbw/07_docker.md
+++ b/slides/dhbw/07_docker.md
@@ -11,8 +11,8 @@ title: Docker und Service Orchestration
 <style>
 :root {
   --color-foreground: #1a1a2e;
-  --color-highlight: #005f8a;
-  --color-dimmed: #4a6a7a;
+  --color-highlight: #d63384;
+  --color-dimmed: #4a4a6a;
 }
 section.invert {
   --color-foreground: #fff;
@@ -21,24 +21,30 @@ section {
   font-size: 1.4rem;
 }
 h1 {
-  color: #005f8a;
+  color: #a02060;
 }
 section.invert h1 {
   color: #fff;
 }
+h2 {
+  color: #1f2937;
+}
+section.invert h2 {
+  color: #f48fb1;
+}
 pre {
-  background: #0f1e2e;
-  color: #00b4d8;
+  background: #0f0f23;
+  color: #d63384;
   border-radius: 8px;
-  border-left: 3px solid #005f8a;
+  border-left: 3px solid #d63384;
 }
 pre code {
   background: transparent;
   color: inherit;
 }
 code {
-  background: #1a3a4a;
-  color: #00b4d8;
+  background: #1a1a2e;
+  color: #d63384;
   padding: 0.15em 0.4em;
   border-radius: 4px;
 }
@@ -49,7 +55,7 @@ a {
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Web Engineering
 
@@ -60,7 +66,7 @@ a {
 ---
 
 <!-- _class: invert -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Docker
 
diff --git a/slides/dhbw/08_best_practices.md b/slides/dhbw/08_best_practices.md
index a92d45a..bde7d56 100644
--- a/slides/dhbw/08_best_practices.md
+++ b/slides/dhbw/08_best_practices.md
@@ -11,8 +11,8 @@ title: Best Practices
 <style>
 :root {
   --color-foreground: #1a1a2e;
-  --color-highlight: #005f8a;
-  --color-dimmed: #4a6a7a;
+  --color-highlight: #d63384;
+  --color-dimmed: #4a4a6a;
 }
 section.invert {
   --color-foreground: #fff;
@@ -21,24 +21,30 @@ section {
   font-size: 1.4rem;
 }
 h1 {
-  color: #005f8a;
+  color: #a02060;
 }
 section.invert h1 {
   color: #fff;
 }
+h2 {
+  color: #1f2937;
+}
+section.invert h2 {
+  color: #f48fb1;
+}
 pre {
-  background: #0f1e2e;
-  color: #00b4d8;
+  background: #0f0f23;
+  color: #d63384;
   border-radius: 8px;
-  border-left: 3px solid #005f8a;
+  border-left: 3px solid #d63384;
 }
 pre code {
   background: transparent;
   color: inherit;
 }
 code {
-  background: #1a3a4a;
-  color: #00b4d8;
+  background: #1a1a2e;
+  color: #d63384;
   padding: 0.15em 0.4em;
   border-radius: 4px;
 }
@@ -49,7 +55,7 @@ a {
 
 <!-- _class: invert -->
 <!-- _header: '' -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Web Engineering
 
@@ -60,7 +66,7 @@ a {
 ---
 
 <!-- _class: invert -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Best Practices
 
@@ -350,7 +356,7 @@ Don't refactor what isn't working yet.
 ---
 
 <!-- _class: invert -->
-<!-- _backgroundColor: #001520 -->
+<!-- _backgroundColor: #000 -->
 
 # Viel Erfolg mit den Projekten!