diff --git a/.claude/settings.local.json b/.claude/settings.local.json new file mode 100644 index 0000000..f3fd5c2 --- /dev/null +++ b/.claude/settings.local.json @@ -0,0 +1,10 @@ +{ + "permissions": { + "allow": [ + "Bash(hugo version:*)", + "Bash(hugo --quiet:*)", + "Bash(hugo server:*)", + "Bash(git add:*)" + ] + } +} diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..8f4df9c --- /dev/null +++ b/.gitignore @@ -0,0 +1,19 @@ +# Hugo +/public/ +/resources/_gen/ +/assets/jsconfig.json +hugo_stats.json + +# OS +.DS_Store +Thumbs.db + +# Editor +.vscode/ +.idea/ +*.swp +*.swo +*~ + +# Build +node_modules/ diff --git a/.hugo_build.lock b/.hugo_build.lock new file mode 100644 index 0000000..e69de29 diff --git a/CLAUDE.md b/CLAUDE.md index 709c73f..aa570df 100644 --- a/CLAUDE.md +++ b/CLAUDE.md @@ -1,26 +1,31 @@ -# CLAUDE.md +# Project Context: Pyx Engineering AG (Hugo Website) -This file provides guidance to Claude Code (claude.ai/code) when working with code in this repository. +## 1. Corporate Identity +* **Company:** Pyx Engineering AG +* **Industry:** IT Consulting Services / [ML ops, technologies like Kafka, Elasticsearch] +* **Tone of Voice:** Professional, precise, reliable, and high-quality (Swiss engineering standard). +* **Language:** Provide a multilanguage website in English (US) and German (CH) - *Note: Always use Swiss-German spelling (no "ß", use "ss").* -## Repository Overview +## 2. Technical Stack +* **SSG:** Hugo (v0.150 or newer)) +* **Deployment:** manual deployment for now +* **Auth:** HTTPS access to Gitea repo on https://git.jammann.ch/joe/pyx-website +* **Styling:** logos available in EPS and PNG format. Choose whatever fits better -This is an asset repository for the PyX website containing logo files: -- `pyx.eps` - PyX logo in EPS format (PostScript, 2558x742) -- `pyx_hires.png` - PyX logo in PNG format (2558x742, RGB) +## 3. Content Architecture +* **Services:** Located in `/content/services/`. Each service should have a dedicated page. +* **Projects/References:** Essential for credibility. Format: Image, project scope, year, and services provided. +* **Frontmatter Requirements:** Every `.md` file must include: `title`, `description` (for SEO), `date`, and `thumbnail`. +* **Global Data:** Company address, phone, and UID are stored in `/data/company.yaml`. -## Repository Status +## 4. Claude's Operational Guidelines +* **Hugo Best Practices:** Use `partials` for reusable elements (Header/Footer). Use `shortcodes` for UI components in Markdown files. +* **Image Handling:** Always use Hugo Resource Processing (`.Resize`, `.Fill`, `.Process "webp"`) to ensure fast load times. +* **Clean Code:** Keep layouts modular. Avoid hardcoding strings; use i18n or data files where possible. +* **SEO Focus:** Ensure proper `H1` to `H3` hierarchy. Meta descriptions should be concise and professional. -This directory is not currently a git repository. To initialize version control: +## 5. Current Roadmap & Tasks +- [ ] Initialize project structure and Hugo theme. +- [ ] Draft content for "About Us" and "Core Services". +- [ ] Implement Swiss-compliant Imprint (Impressum) and Privacy Policy. -```bash -git init -git add . -git commit -m "Initial commit: Add PyX logo assets" -``` - -## Working with Assets - -When modifying or adding new logo variants: -- Maintain the existing naming convention (`pyx_*.ext`) -- Keep both vector (EPS) and raster (PNG) formats when possible -- Document resolution and format specifications for new assets diff --git a/README.md b/README.md new file mode 100644 index 0000000..1624b54 --- /dev/null +++ b/README.md @@ -0,0 +1,53 @@ +# Pyx Engineering AG Website + +Corporate website for Pyx Engineering AG built with Hugo. + +## Development + +### Prerequisites +- Hugo v0.123.7+ (Extended version recommended) + +### Local Development +```bash +# Start development server +hugo server -D + +# Build site +hugo + +# Create new content +hugo new services/my-service.md +hugo new projects/my-project.md +``` + +### Project Structure +- `/content/` - Site content (Markdown files) + - `/content/services/` - Service pages + - `/content/projects/` - Project/reference pages + - `/content/about/` - About pages +- `/data/company.yaml` - Company information (address, phone, UID) +- `/themes/pyx-theme/` - Custom Hugo theme +- `/static/images/` - Logo and static assets +- `/i18n/` - Translation files (English/German) + +### Languages +The site supports: +- English (default) +- German (Swiss spelling - use "ss" instead of "ß") + +### Content Guidelines +All content pages should include frontmatter: +```yaml +--- +title: "Page Title" +description: "SEO description" +date: 2026-02-08 +thumbnail: "image.jpg" +--- +``` + +## Deployment +Manual deployment - build with `hugo` and upload `/public/` directory to web server. + +## Repository +https://git.jammann.ch/joe/pyx-website diff --git a/archetypes/default.md b/archetypes/default.md new file mode 100644 index 0000000..7324707 --- /dev/null +++ b/archetypes/default.md @@ -0,0 +1,6 @@ +--- +title: "{{ replace .File.ContentBaseName "-" " " | title }}" +description: "" +date: {{ .Date }} +draft: true +--- diff --git a/archetypes/services.md b/archetypes/services.md new file mode 100644 index 0000000..7afcfd0 --- /dev/null +++ b/archetypes/services.md @@ -0,0 +1,14 @@ +--- +title: "{{ replace .File.ContentBaseName "-" " " | title }}" +description: "" +date: {{ .Date }} +draft: true +thumbnail: "" +weight: 10 +--- + +## Overview + +## Key Features + +## Technologies diff --git a/content/_index.de.md b/content/_index.de.md new file mode 100644 index 0000000..b96d941 --- /dev/null +++ b/content/_index.de.md @@ -0,0 +1,6 @@ +--- +title: "Pyx Engineering AG" +description: "IT Beratungsdienstleistungen - ML Ops, Kafka, Elasticsearch" +--- + +Willkommen bei Pyx Engineering AG - Ihr Partner für hochwertige IT-Beratungsdienstleistungen. diff --git a/content/_index.md b/content/_index.md new file mode 100644 index 0000000..df30523 --- /dev/null +++ b/content/_index.md @@ -0,0 +1,6 @@ +--- +title: "Pyx Engineering AG" +description: "IT Consulting Services - ML Ops, Kafka, Elasticsearch" +--- + +Welcome to Pyx Engineering AG - Your partner for high-quality IT consulting services. diff --git a/data/company.yaml b/data/company.yaml new file mode 100644 index 0000000..e1a1e36 --- /dev/null +++ b/data/company.yaml @@ -0,0 +1,9 @@ +name: Pyx Engineering AG +address: + street: "" + city: "" + postal: "" + country: "Switzerland" +phone: "" +email: "info@pyx.ch" +uid: "" diff --git a/hugo.toml b/hugo.toml new file mode 100644 index 0000000..bb5973e --- /dev/null +++ b/hugo.toml @@ -0,0 +1,48 @@ +baseURL = 'https://www.pyx.ch/' +languageCode = 'en-us' +title = 'Pyx Engineering AG' +theme = 'pyx-theme' + +# Multilingual configuration +defaultContentLanguage = 'en' +defaultContentLanguageInSubdir = false + +[languages] + [languages.en] + languageName = 'English' + weight = 1 + title = 'Pyx Engineering AG' + [languages.en.params] + description = 'IT Consulting Services - ML Ops, Kafka, Elasticsearch' + + [languages.de] + languageName = 'Deutsch' + weight = 2 + title = 'Pyx Engineering AG' + [languages.de.params] + description = 'IT Beratungsdienstleistungen - ML Ops, Kafka, Elasticsearch' + +# Image processing +[imaging] + resampleFilter = 'Lanczos' + quality = 85 + anchor = 'Smart' + +# Output formats +[outputs] + home = ['HTML', 'RSS', 'JSON'] + section = ['HTML', 'RSS'] + +# Markup +[markup] + [markup.goldmark] + [markup.goldmark.renderer] + unsafe = true + [markup.highlight] + style = 'monokai' + lineNos = false + +# Params +[params] + author = 'Pyx Engineering AG' + defaultImage = '/images/pyx_hires.png' diff --git a/i18n/de.toml b/i18n/de.toml new file mode 100644 index 0000000..f0ec291 --- /dev/null +++ b/i18n/de.toml @@ -0,0 +1,50 @@ +[home] +other = "Home" + +[about] +other = "Über uns" + +[services] +other = "Dienstleistungen" + +[projects] +other = "Projekte" + +[phone] +other = "Telefon" + +[email] +other = "E-Mail" + +[impressum] +other = "Impressum" + +[privacy] +other = "Datenschutz" + +[allRightsReserved] +other = "Alle Rechte vorbehalten" + +[readMore] +other = "Mehr erfahren" + +[exploreServices] +other = "Unsere Dienstleistungen" + +[aboutDescription] +other = "Pyx Engineering AG ist ein Schweizer IT-Beratungsunternehmen, spezialisiert auf moderne Dateninfrastruktur und Machine Learning Operations. Wir liefern hochwertige Lösungen mit Schweizer Präzision und Zuverlässigkeit." + +[mlOpsDescription] +other = "End-to-End Machine Learning Operations, von der Modellentwicklung bis zur Produktionsbereitstellung und Überwachung." + +[kafkaDescription] +other = "Apache Kafka Expertise für den Aufbau robuster, skalierbarer Echtzeit-Datenstreaming-Plattformen." + +[elasticsearchDescription] +other = "Such- und Analyselösungen auf Basis von Elasticsearch für Ihre datengetriebenen Anwendungen." + +[projectsComingSoon] +other = "Projekte folgen in Kürze" + +[projectsComingSoonDescription] +other = "Wir arbeiten derzeit daran, unsere erfolgreichen Kundenprojekte zu präsentieren. Schauen Sie bald wieder vorbei!" diff --git a/i18n/en.toml b/i18n/en.toml new file mode 100644 index 0000000..9b9e166 --- /dev/null +++ b/i18n/en.toml @@ -0,0 +1,50 @@ +[home] +other = "Home" + +[about] +other = "About" + +[services] +other = "Services" + +[projects] +other = "Projects" + +[phone] +other = "Phone" + +[email] +other = "Email" + +[impressum] +other = "Imprint" + +[privacy] +other = "Privacy Policy" + +[allRightsReserved] +other = "All rights reserved" + +[readMore] +other = "Read more" + +[exploreServices] +other = "Explore Our Services" + +[aboutDescription] +other = "Pyx Engineering AG is a Swiss IT consulting company specializing in modern data infrastructure and machine learning operations. We deliver high-quality solutions with Swiss precision and reliability." + +[mlOpsDescription] +other = "End-to-end machine learning operations, from model development to production deployment and monitoring." + +[kafkaDescription] +other = "Apache Kafka expertise for building robust, scalable real-time data streaming platforms." + +[elasticsearchDescription] +other = "Search and analytics solutions powered by Elasticsearch for your data-driven applications." + +[projectsComingSoon] +other = "Projects Coming Soon" + +[projectsComingSoonDescription] +other = "We're currently working on showcasing our successful client projects. Check back soon!" diff --git a/pyx.eps b/static/images/pyx.eps similarity index 100% rename from pyx.eps rename to static/images/pyx.eps diff --git a/pyx_hires.png b/static/images/pyx_hires.png similarity index 100% rename from pyx_hires.png rename to static/images/pyx_hires.png diff --git a/themes/pyx-theme/layouts/_default/baseof.html b/themes/pyx-theme/layouts/_default/baseof.html new file mode 100644 index 0000000..27395fb --- /dev/null +++ b/themes/pyx-theme/layouts/_default/baseof.html @@ -0,0 +1,22 @@ + + + + + + {{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} | {{ .Site.Title }}{{ end }} + + + + + {{ block "head" . }}{{ end }} + + + {{ partial "header.html" . }} + +
+ {{ block "main" . }}{{ end }} +
+ + {{ partial "footer.html" . }} + + diff --git a/themes/pyx-theme/layouts/_default/list.html b/themes/pyx-theme/layouts/_default/list.html new file mode 100644 index 0000000..aa5b5a1 --- /dev/null +++ b/themes/pyx-theme/layouts/_default/list.html @@ -0,0 +1,28 @@ +{{ define "main" }} +
+
+

{{ .Title }}

+ {{ if .Description }} +

{{ .Description }}

+ {{ end }} +
+ +
+ {{ range .Pages }} +
+

{{ .Title }}

+ {{ if .Params.thumbnail }} + {{ $image := .Resources.GetMatch .Params.thumbnail }} + {{ if $image }} + {{ .Title }} + {{ end }} + {{ end }} + {{ if .Description }} +

{{ .Description }}

+ {{ end }} + Read more +
+ {{ end }} +
+
+{{ end }} diff --git a/themes/pyx-theme/layouts/_default/single.html b/themes/pyx-theme/layouts/_default/single.html new file mode 100644 index 0000000..7b93a8d --- /dev/null +++ b/themes/pyx-theme/layouts/_default/single.html @@ -0,0 +1,23 @@ +{{ define "main" }} +
+
+

{{ .Title }}

+ {{ if .Params.date }} + + {{ end }} +
+ + {{ if .Params.thumbnail }} +
+ {{ $image := .Resources.GetMatch .Params.thumbnail }} + {{ if $image }} + {{ .Title }} + {{ end }} +
+ {{ end }} + +
+ {{ .Content }} +
+
+{{ end }} diff --git a/themes/pyx-theme/layouts/index.html b/themes/pyx-theme/layouts/index.html new file mode 100644 index 0000000..abb4eda --- /dev/null +++ b/themes/pyx-theme/layouts/index.html @@ -0,0 +1,91 @@ +{{ define "main" }} + +
+
+ +

{{ .Site.Title }}

+

{{ .Site.Params.description }}

+ {{ i18n "exploreServices" }} +
+
+
+ + +
+
+

{{ i18n "about" }}

+
+ {{ .Content }} +

{{ i18n "aboutDescription" }}

+
+
+
+ + +
+
+

{{ i18n "services" }}

+
+ {{ range where .Site.Pages "Section" "services" }} +
+

{{ .Title }}

+ {{ if .Description }} +

{{ .Description }}

+ {{ else }} +

{{ .Summary }}

+ {{ end }} +
+ {{ end }} + {{ if eq (len (where .Site.Pages "Section" "services")) 0 }} + +
+

ML Operations

+

{{ i18n "mlOpsDescription" }}

+
+
+

Kafka Solutions

+

{{ i18n "kafkaDescription" }}

+
+
+

Elasticsearch

+

{{ i18n "elasticsearchDescription" }}

+
+ {{ end }} +
+
+
+ + +
+
+

{{ i18n "projects" }}

+
+ {{ range where .Site.Pages "Section" "projects" }} +
+ {{ if .Params.thumbnail }} + {{ $image := .Resources.GetMatch .Params.thumbnail }} + {{ if $image }} + {{ .Title }} + {{ end }} + {{ end }} +
+

{{ .Title }}

+ {{ if .Description }} +

{{ .Description }}

+ {{ end }} +
+
+ {{ end }} + {{ if eq (len (where .Site.Pages "Section" "projects")) 0 }} + +
+
+

{{ i18n "projectsComingSoon" }}

+

{{ i18n "projectsComingSoonDescription" }}

+
+
+ {{ end }} +
+
+
+{{ end }} diff --git a/themes/pyx-theme/layouts/partials/footer.html b/themes/pyx-theme/layouts/partials/footer.html new file mode 100644 index 0000000..65e0dea --- /dev/null +++ b/themes/pyx-theme/layouts/partials/footer.html @@ -0,0 +1,34 @@ + diff --git a/themes/pyx-theme/layouts/partials/header.html b/themes/pyx-theme/layouts/partials/header.html new file mode 100644 index 0000000..e771afd --- /dev/null +++ b/themes/pyx-theme/layouts/partials/header.html @@ -0,0 +1,23 @@ +
+ +
diff --git a/themes/pyx-theme/static/css/style.css b/themes/pyx-theme/static/css/style.css new file mode 100644 index 0000000..248844e --- /dev/null +++ b/themes/pyx-theme/static/css/style.css @@ -0,0 +1,371 @@ +/* Reset and Base Styles */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +:root { + --primary-blue: #0066cc; + --text-black: #1a1a1a; + --background-white: #ffffff; + --light-gray: #f5f5f5; + --medium-gray: #e0e0e0; +} + +html { + scroll-behavior: smooth; + scroll-snap-type: y mandatory; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; + color: var(--text-black); + background: var(--background-white); + line-height: 1.6; +} + +/* Header */ +header { + position: fixed; + top: 0; + left: 0; + right: 0; + background: rgba(255, 255, 255, 0.95); + backdrop-filter: blur(10px); + z-index: 1000; + border-bottom: 1px solid var(--medium-gray); +} + +header nav { + max-width: 1200px; + margin: 0 auto; + padding: 1rem 2rem; + display: flex; + justify-content: space-between; + align-items: center; +} + +header nav a.logo { + display: flex; + align-items: center; +} + +header nav img { + height: 32px; + width: auto; +} + +header nav ul { + display: flex; + list-style: none; + gap: 2rem; + align-items: center; +} + +header nav a { + color: var(--text-black); + text-decoration: none; + font-weight: 500; + transition: color 0.3s ease; +} + +header nav a:hover { + color: var(--primary-blue); +} + +header .language-switcher { + gap: 0.5rem; +} + +header .language-switcher a { + padding: 0.25rem 0.75rem; + border: 1px solid var(--medium-gray); + border-radius: 4px; + font-size: 0.9rem; +} + +header .language-switcher a:hover { + background: var(--light-gray); + border-color: var(--primary-blue); +} + +/* Main Content */ +main { + margin-top: 65px; +} + +/* Section Styles */ +section { + min-height: 100vh; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + padding: 4rem 2rem; + scroll-snap-align: start; +} + +section:nth-child(even) { + background: var(--light-gray); +} + +.section-content { + max-width: 1200px; + width: 100%; +} + +/* Hero Section */ +.hero { + text-align: center; +} + +.hero .logo { + max-width: 400px; + width: 100%; + height: auto; + margin-bottom: 2rem; +} + +.hero h1 { + font-size: 3rem; + font-weight: 700; + margin-bottom: 1rem; + color: var(--text-black); +} + +.hero p { + font-size: 1.5rem; + color: #666; + margin-bottom: 2rem; +} + +.hero .cta { + display: inline-block; + padding: 1rem 2rem; + background: var(--primary-blue); + color: white; + text-decoration: none; + border-radius: 8px; + font-weight: 600; + transition: background 0.3s ease, transform 0.2s ease; +} + +.hero .cta:hover { + background: #0052a3; + transform: translateY(-2px); +} + +/* Services Section */ +.services { + background: var(--light-gray); +} + +.services h2 { + font-size: 2.5rem; + margin-bottom: 3rem; + text-align: center; + color: var(--text-black); +} + +.service-list { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; + width: 100%; +} + +.service-list article { + background: white; + padding: 2rem; + border-radius: 8px; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); + transition: transform 0.3s ease, box-shadow 0.3s ease; +} + +.service-list article:hover { + transform: translateY(-4px); + box-shadow: 0 4px 16px rgba(0, 102, 204, 0.2); +} + +.service-list h3 { + font-size: 1.5rem; + margin-bottom: 1rem; + color: var(--primary-blue); +} + +.service-list h3 a { + color: var(--primary-blue); + text-decoration: none; +} + +.service-list p { + color: #666; + line-height: 1.8; +} + +/* About Section */ +.about { + background: white; +} + +.about h2 { + font-size: 2.5rem; + margin-bottom: 2rem; + text-align: center; +} + +.about .content { + max-width: 800px; + margin: 0 auto; + font-size: 1.1rem; + line-height: 1.8; + color: #444; +} + +/* Projects Section */ +.projects h2 { + font-size: 2.5rem; + margin-bottom: 3rem; + text-align: center; +} + +.project-list { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); + gap: 2rem; + width: 100%; +} + +.project-list article { + background: white; + border-radius: 8px; + overflow: hidden; + box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1); + transition: transform 0.3s ease; +} + +.project-list article:hover { + transform: translateY(-4px); +} + +.project-list img { + width: 100%; + height: 200px; + object-fit: cover; +} + +.project-list .project-content { + padding: 1.5rem; +} + +.project-list h3 { + font-size: 1.3rem; + margin-bottom: 0.5rem; + color: var(--text-black); +} + +/* Footer */ +footer { + background: var(--text-black); + color: white; + padding: 3rem 2rem 1rem; +} + +.footer-content { + max-width: 1200px; + margin: 0 auto; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 2rem; + margin-bottom: 2rem; +} + +footer h3 { + color: var(--primary-blue); + margin-bottom: 1rem; +} + +footer a { + color: #ccc; + text-decoration: none; + transition: color 0.3s ease; +} + +footer a:hover { + color: var(--primary-blue); +} + +footer ul { + list-style: none; +} + +footer li { + margin-bottom: 0.5rem; +} + +.footer-bottom { + max-width: 1200px; + margin: 0 auto; + padding-top: 2rem; + border-top: 1px solid #444; + text-align: center; + color: #888; +} + +/* Scroll Indicator */ +.scroll-indicator { + position: absolute; + bottom: 2rem; + left: 50%; + transform: translateX(-50%); + animation: bounce 2s infinite; +} + +.scroll-indicator::before { + content: "↓"; + font-size: 2rem; + color: var(--primary-blue); +} + +@keyframes bounce { + 0%, 20%, 50%, 80%, 100% { + transform: translateX(-50%) translateY(0); + } + 40% { + transform: translateX(-50%) translateY(-10px); + } + 60% { + transform: translateX(-50%) translateY(-5px); + } +} + +/* Responsive */ +@media (max-width: 768px) { + header nav { + flex-direction: column; + gap: 1rem; + } + + header nav ul { + gap: 1rem; + } + + .hero h1 { + font-size: 2rem; + } + + .hero p { + font-size: 1.2rem; + } + + section { + min-height: auto; + padding: 3rem 1rem; + } + + .service-list, + .project-list { + grid-template-columns: 1fr; + } +} diff --git a/themes/pyx-theme/theme.toml b/themes/pyx-theme/theme.toml new file mode 100644 index 0000000..320fc5c --- /dev/null +++ b/themes/pyx-theme/theme.toml @@ -0,0 +1,10 @@ +name = "Pyx Theme" +license = "Proprietary" +description = "Custom theme for Pyx Engineering AG" +homepage = "https://www.pyx.ch/" +tags = ["corporate", "multilingual", "business"] +min_version = "0.123.0" + +[author] + name = "Pyx Engineering AG" + homepage = "https://www.pyx.ch/"