feat: add team

Author: openscript

package.json

@@ -37,7 +37,7 @@
     "@fontsource/pt-sans": "^5.2.8",
     "@nanostores/i18n": "^1.2.2",
     "astro": "^5.14.1",
-    "astro-loader-i18n": "^0.7.9",
+    "astro-loader-i18n": "^0.8.0",
     "astro-nanostores-i18n": "^0.1.6",
     "embla-carousel": "^8.6.0",
     "embla-carousel-autoplay": "^8.6.0",
@@ -56,8 +56,8 @@
     "@eslint/js": "^9.36.0",
     "@openscript/unplugin-favicons": "^1.1.8",
     "@types/mdast": "^4.0.4",
-    "@types/node": "^24.5.2",
-    "@typescript-eslint/parser": "^8.44.1",
+    "@types/node": "^24.6.1",
+    "@typescript-eslint/parser": "^8.45.0",
     "@vitest/coverage-v8": "3.2.4",
     "astro-eslint-parser": "^1.2.2",
     "eslint": "^9.36.0",
@@ -67,12 +67,12 @@
     "eslint-plugin-prettier": "^5.5.4",
     "favicons": "^7.2.0",
     "globals": "^16.4.0",
-    "jiti": "^2.6.0",
+    "jiti": "^2.6.1",
     "prettier": "^3.6.2",
     "prettier-plugin-astro": "^0.14.1",
     "sirv": "^3.0.2",
-    "typescript": "^5.9.2",
-    "typescript-eslint": "^8.44.1",
+    "typescript": "^5.9.3",
+    "typescript-eslint": "^8.45.0",
     "vitest": "3.2.4"
   },
   "pnpm": {

pnpm-lock.yaml

@@ -1,4 +1,10 @@
-import { extendI18nLoaderSchema, i18nContentLoader, i18nLoader, localized as localizedSchema } from "astro-loader-i18n";
+import {
+  extendI18nLoaderSchema,
+  i18nContentLoader,
+  i18nFileLoader,
+  i18nLoader,
+  localized as localizedSchema,
+} from "astro-loader-i18n";
 import { defineCollection, z, type ImageFunction } from "astro:content";
 import { localeSlugs } from "./site.config";
 import { glob, file } from "astro/loaders";
@@ -92,11 +98,25 @@ const questionsCollection = defineCollection({
   ),
 });
 
+const teamCollection = defineCollection({
+  loader: i18nFileLoader("./src/content/team/index.yaml"),
+  schema: ({ image }) =>
+    extendI18nLoaderSchema(
+      z.object({
+        id: z.string(),
+        name: z.string(),
+        avatar: image(),
+        role: localized(z.string()),
+      }),
+    ),
+});
+
 export const collections = {
   navigation: navigationCollection,
   pages: pagesCollection,
   sections: sectionsCollection,
   referenceCompanies: referenceCompaniesCollection,
   referenceProjects: referenceProjectsCollection,
   questions: questionsCollection,
+  team: teamCollection,
 };

src/content.config.ts

@@ -7,6 +7,8 @@ import Address from "../../../layouts/groups/Address.astro";
 import Phone from "../../../layouts/groups/Phone.astro";
 import Email from "../../../layouts/groups/Email.astro";
 
+<section>
+
 Nachfolgend sind die Angaben zur Identität der Eigentümerschaft dieser Webseite zu finden:
 
 <Address />
@@ -26,3 +28,5 @@ Verweise zu Inhalte Dritter liegen ausserhalb des Verantwortungsbereichs. Die Ve
 ## Urheberrechtserklärung
 
 Die Urheber- und alle anderen Rechte an Inhalten, Bildern, Fotos oder anderen Dateien auf dieser Website, gehören ausschliesslich der oberhalb genannten Eigentümerschaft. Für die Reproduktion jeglicher Elemente ist die schriftliche Zustimmung der Eigentümerschaft als Urheberrechtsträgers im Voraus einzuholen.
+
+</section>

src/content/pages/de/imprint.mdx

@@ -2,3 +2,18 @@
 path: team
 title: Team
 ---
+
+import Divider from "../../../../components/Divider.astro";
+import TeamSection from "../../../../layouts/sections/TeamSection.astro";
+
+<section class="spotlight">
+  Lernen Sie das Team hinter unserem Unternehmen kennen - eine Gruppe von engagierten und qualifizierten Fachleuten, die mit Leidenschaft massgeschneiderte Softwarelösungen entwickeln, die auf die spezifischen Bedürfnisse unserer Kunden zugeschnitten sind. Neben unserer Expertise in der Softwareentwicklung engagieren wir uns auch für die Förderung der Berufsbildung in der Schweiz. Wir sind ein aufgeschlossenes, ganzheitliches und vertrauenswürdiges Team und freuen uns darauf, bald mit Ihnen gemeinsam in die Welt der Bits und Bytes einzutauchen.
+</section>
+
+<Divider firstSegmentColor="var(--color-white)" />
+
+<TeamSection class="white-background">
+  <h2 slot="title">Porträts</h2>
+</TeamSection>
+
+<Divider firstSegmentColor="var(--color-white)" flipVertical />

src/content/pages/de/present/team.mdx

@@ -7,6 +7,8 @@ import Address from "../../../layouts/groups/Address.astro";
 import Phone from "../../../layouts/groups/Phone.astro";
 import Email from "../../../layouts/groups/Email.astro";
 
+<section>
+
 The following contains the information about the ownership of this website:
 
 <Address />
@@ -26,3 +28,5 @@ The website contains links to content maintained by third parties, which are out
 ## Copyright Statement
 
 The copyright and all other rights to content, images, photos, or other files on this website belong exclusively to the owner stated above. Written consent from the owner as the copyright holder must be obtained in advance for the reproduction of any elements.
+
+</section>

src/content/pages/en/imprint.mdx

@@ -2,3 +2,18 @@
 path: team
 title: Team
 ---
+
+import Divider from "../../../../components/Divider.astro";
+import TeamSection from "../../../../layouts/sections/TeamSection.astro";
+
+<section>
+  Meet the team behind our company - a group of dedicated and skilled professionals who are passionate about creating custom software solutions that are tailored to the specific needs of our clients. We take great pride in our work and are committed to delivering the highest quality products and services. In addition to our software development expertise, we are also committed to advancing vocational education in Switzerland. We believe that providing apprenticeship opportunities and modern educational content to students is an important way to ensure that the next generation of software developers is well-equipped to meet the demands of the industry. As a team, we are open-minded, holacratic, and trustworthy, and we look forward to the opportunity to work together and embark on an adventure in the world of bits and bytes with you soon.
+</section>
+
+<Divider firstSegmentColor="var(--color-white)" />
+
+<TeamSection class="white-background">
+  <h2 slot="title">Portraits</h2>
+</TeamSection>
+
+<Divider firstSegmentColor="var(--color-white)" flipVertical />

src/content/pages/en/present/team.mdx

@@ -9,18 +9,18 @@ import ReferenceIcon from '../../../../res/dogli.svg';
 
 <SpotlightSection>
 
-  <BackgroundVideo videoSrc={ValuesVideo} videoType="mp4" />
-  <div slot="overlay" data-slide-id="0" class="align-center">
-    <h3>Nahtlos</h3>
-    <p>Wir entwickeln Software, die sich nahtlos in Ihren bestehenden Arbeitsablauf integriert.</p>
-    <Button href="/present/values" withArrow>Unsere Werte entdecken</Button>
-  </div>
   <BackgroundImage image={CollaborationImage} />
-  <div slot="overlay" data-slide-id="1" class="align-end">
+  <div slot="overlay" data-slide-id="0" class="align-end">
     <h3>Gemeinsam auf dem richtigen Weg</h3>
     <p>Finden wir gemeinsam den richtigen Weg, um Ihre Software Wirklichkeit werden zu lassen.</p>
     <Button href="/future/collaboration" withArrow>Mit uns zusammenarbeiten</Button>
   </div>
+  <BackgroundVideo videoSrc={ValuesVideo} videoType="mp4" />
+  <div slot="overlay" data-slide-id="1" class="align-center">
+    <h3>Nahtlos</h3>
+    <p>Wir entwickeln Software, die sich nahtlos in Ihren bestehenden Arbeitsablauf integriert.</p>
+    <Button href="/present/values" withArrow>Unsere Werte entdecken</Button>
+  </div>
   <BackgroundIcon image={ReferenceIcon} dominantColor="#155263" otherColor="#0D2F39" />
   <div slot="overlay" data-slide-id="2" class="align-start">
     <h3>Die ultimative Hunde-Bereicherungs-App</h3>

src/content/sections/de/Spotlight.mdx

@@ -1,6 +1,6 @@
 import ToolsSection from "../../../layouts/sections/ToolsSection.astro";
 
-<ToolsSection>
+<ToolsSection class="dark-background">
   <h2 slot="title">Womit wir arbeiten</h2>
 
   Dies ist eine Auswahl der Werkzeuge und Technologien, die wir täglich verwenden. Wir sind überzeugt, dass jede Programmiersprache, jedes Framework oder Tool Bereiche hat, in denen es besonders geeignet ist, und andere, in denen es weniger passt. Ein wichtiger Faktor bei unserer Werkzeugwahl ist die Nachhaltigkeit und langfristige Verfügbarkeit der eingesetzten Technologien.

src/content/sections/de/Tools.mdx

@@ -9,18 +9,18 @@ import ReferenceIcon from '../../../../res/dogli.svg';
 
 <SpotlightSection>
 
-  <BackgroundVideo videoSrc={ValuesVideo} videoType="mp4" />
-  <div slot="overlay" data-slide-id="0" class="align-center">
-    <h3>Seamless</h3>
-    <p>We build software that integrates seamlessly into your existing workflow.</p>
-    <Button href="/present/values" withArrow>Discover our values</Button>
-  </div>
   <BackgroundImage image={CollaborationImage} />
-  <div slot="overlay" data-slide-id="1" class="align-end">
+  <div slot="overlay" data-slide-id="0" class="align-end">
     <h3>Together on the right path</h3>
     <p>Let's find together the right path to bring your software to reality.</p>
     <Button href="/future/collaboration" withArrow>Collaborate with us</Button>
   </div>
+  <BackgroundVideo videoSrc={ValuesVideo} videoType="mp4" />
+  <div slot="overlay" data-slide-id="1" class="align-center">
+    <h3>Seamless</h3>
+    <p>We build software that integrates seamlessly into your existing workflow.</p>
+    <Button href="/present/values" withArrow>Discover our values</Button>
+  </div>
   <BackgroundIcon image={ReferenceIcon} dominantColor="#155263" otherColor="#0D2F39" />
   <div slot="overlay" data-slide-id="2" class="align-start">
     <h3>Ultimate dog enrichment app</h3>