diff --git a/.changeset/little-pianos-poke.md b/.changeset/little-pianos-poke.md new file mode 100644 index 00000000..71579cf7 --- /dev/null +++ b/.changeset/little-pianos-poke.md @@ -0,0 +1,5 @@ +--- +"openscript-ch-website": patch +--- + +Add formation page diff --git a/src/components/Timeline.astro b/src/components/Timeline.astro new file mode 100644 index 00000000..0cd45bae --- /dev/null +++ b/src/components/Timeline.astro @@ -0,0 +1,91 @@ +--- +type Props = { + shortSpine?: boolean; +}; + +const { shortSpine = false } = Astro.props; + +const displayTriangle = shortSpine ? "none" : "absolute"; +--- + +
+
+
    + +
+
+ + diff --git a/src/components/TimelineEntry.astro b/src/components/TimelineEntry.astro new file mode 100644 index 00000000..ab31ae66 --- /dev/null +++ b/src/components/TimelineEntry.astro @@ -0,0 +1,59 @@ +--- + +--- + +
  • + +
    • + + diff --git a/src/content.config.ts b/src/content.config.ts index 972a3000..904e089e 100644 --- a/src/content.config.ts +++ b/src/content.config.ts @@ -138,6 +138,22 @@ const galleriesCollection = defineCollection({ ), }); +const formationCollection = defineCollection({ + loader: i18nContentLoader({ pattern: "**/[^_]*.yaml", base: "./src/content/formation" }), + schema: extendI18nLoaderSchema( + z.object({ + items: localized( + z.array( + z.object({ + title: z.string(), + text: z.string(), + }), + ), + ), + }), + ), +}); + export const collections = { navigation: navigationCollection, pages: pagesCollection, @@ -148,4 +164,5 @@ export const collections = { technologies: technologiesCollection, team: teamCollection, galleries: galleriesCollection, + formation: formationCollection, }; diff --git a/src/content/formation/evolution.yaml b/src/content/formation/evolution.yaml new file mode 100644 index 00000000..4e64b487 --- /dev/null +++ b/src/content/formation/evolution.yaml @@ -0,0 +1,15 @@ +items: + de: + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + en: + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod diff --git a/src/content/formation/founding.yaml b/src/content/formation/founding.yaml new file mode 100644 index 00000000..d7178403 --- /dev/null +++ b/src/content/formation/founding.yaml @@ -0,0 +1,11 @@ +items: + de: + - title: Web-Domain + text: Bereits am 24. April 2007 wurde die Domain openscript.ch registriert. + - title: Handelsregistereintrag + text: Seit dem 23. Januar 2020 sind wir im Handelsregister eingetragen. + en: + - title: Web Domain + text: The domain openscript.ch was already registered on April 24, 2007. + - title: Commercial Register Entry + text: We have been registered in the commercial register since January 23, 2020. diff --git a/src/content/formation/office.yaml b/src/content/formation/office.yaml new file mode 100644 index 00000000..4e64b487 --- /dev/null +++ b/src/content/formation/office.yaml @@ -0,0 +1,15 @@ +items: + de: + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + en: + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + - title: Lorem + text: Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod diff --git a/src/content/pages/de/past/formation.mdx b/src/content/pages/de/past/formation.mdx index c071ac02..1d95b4a7 100644 --- a/src/content/pages/de/past/formation.mdx +++ b/src/content/pages/de/past/formation.mdx @@ -2,3 +2,37 @@ path: entstehung title: Entstehung --- + +import FormationSection from "../../../../layouts/sections/FormationSection.astro"; +import Divider from "../../../../components/Divider.astro"; + + +

    Gründung

    + + Obwohl die Idee und der Name schon einige Zeit zuvor existierten, wurde die Firma offiziell im Januar 2020 von Robin gegründet. Bald nach der Gründung ist Diego als zweiten Mitgründer dazugestossen. Fortan arbeiteten die beiden daran, die ersten Softwareprojekte umzusetzen. + +     + + + + +

    Büro und Mitarbeiter

    + + Zuerst dachten wir, dass wir einfach von zu Hause aus arbeiten. Doch als wir davon erfuhren, dass in Oerlikon das ehemalige Swissôtel in eine WG für Studenten und Startups umgewandelt wird, haben wir uns sofort beworben und Glück gehabt. Die Geschichte kann [hier](https://www.srf.ch/news/schweiz/mit-rund-300-mitbewohnern-dieser-ehemalige-hotelturm-wird-zur-mega-wg) nachgelesen werden. Somit hatten wir von Februar 2021 bis Ende Jahr unser erstes Büro mitten in Oerlikon. + + Dabei haben wir festgestellt, dass es uns sehr hilft, wenn wir uns regelmässig persönlich austauschen können. Deshalb haben wir uns entschieden, auch nach der Zwischennutzung des Swissôtels ein Büro zu mieten. Schnell haben wir ein passendes Büro in Glattbrugg gefunden, welches wir seit Anfang 2022 nutzen. + + In der Zwischenzeit sind auch weitere Mitarbeiter zu uns gestossen, welche uns bei der Umsetzung unserer Projekte unterstützen. + +     + + + + +

    Entwicklung

    + + Seither haben wir uns stetig weiterentwickelt und neue Projekte realisiert, die unsere Vision und Mission unterstützen. Wir freuen uns auf die kommenden Herausforderungen und Chancen, die vor uns liegen. + + Möchtest du auch Teil unserer Reise werden? Schau dir unsere [Jobs-Seite](../zukunft/jobs) an oder nimm Kontakt auf, falls du dein Projekt mit uns umsetzen möchtest! + +     diff --git a/src/content/pages/en/past/formation.mdx b/src/content/pages/en/past/formation.mdx index 734a1ce2..4b1ec9c5 100644 --- a/src/content/pages/en/past/formation.mdx +++ b/src/content/pages/en/past/formation.mdx @@ -2,3 +2,37 @@ path: formation title: Formation --- + +import FormationSection from "../../../../layouts/sections/FormationSection.astro"; +import Divider from "../../../../components/Divider.astro"; + + +

    Founding

    + + Although the idea and name had existed for some time before, the company was officially founded by Robin in January 2020. Shortly after the founding, Diego joined as the second co-founder. From then on, the two worked together to implement the first software projects. + +     + + + + +

    Office and employees

    + + At first, we thought we would simply work from home. But when we learned that the former Swissôtel in Oerlikon was being converted into shared accommodation for students and startups, we applied immediately and were lucky. The story can be read [here](https://www.srf.ch/news/schweiz/mit-rund-300-mitbewohnern-dieser-ehemalige-hotelturm-wird-zur-mega-wg). Thus, we had our first office in the heart of Oerlikon from February 2021 until the end of the year. + + In doing so, we realized that it helps us greatly when we can exchange ideas in person regularly. Therefore, we decided to rent an office even after the interim use of the Swissôtel. We quickly found a suitable office in Glattbrugg, which we have been using since early 2022. + + In the meantime, additional employees have joined us, supporting us in the implementation of our projects. + +     + + + + +

    Evolution

    + + Since then, we have continuously evolved and realized new projects that support our vision and mission. We look forward to the upcoming challenges and opportunities that lie ahead. + + Would you like to become part of our journey? Check out our [jobs page](../future/jobs) or get in touch if you want to realize your project with us! + +     diff --git a/src/layouts/Shell.css b/src/layouts/Shell.css index 6242451d..f7187c77 100644 --- a/src/layouts/Shell.css +++ b/src/layouts/Shell.css @@ -28,6 +28,7 @@ --color-background: #ede9df; --color-black: #231f20; --color-white: #fbfffb; + --color-overlay: #f7f9f3; --size-gutter: 1rem; --size-gutter-big: 2rem; diff --git a/src/layouts/sections/FormationSection.astro b/src/layouts/sections/FormationSection.astro new file mode 100644 index 00000000..e77d415b --- /dev/null +++ b/src/layouts/sections/FormationSection.astro @@ -0,0 +1,72 @@ +--- +import { currentLocale } from "astro-nanostores-i18n:runtime"; +import Timeline from "../../components/Timeline.astro"; +import { getCollection } from "astro:content"; +import TimelineEntry from "../../components/TimelineEntry.astro"; + +type Props = { + key: string; + class?: string; + last?: boolean; + start?: boolean; +}; + +const { key, class: className, last } = Astro.props; + +const locale = currentLocale.get(); + +const timelineCollection = await getCollection("formation", (entry) => entry.data.locale === locale); + +const formationData = timelineCollection + .filter((t) => t.id.includes(key)) + .flatMap((t) => { + if (Array.isArray(t.data.items)) { + return t.data.items.map((item) => ({ ...item })); + } + return []; + }); +--- + +
    +
    + +
    +
    + + { + formationData.map((element) => ( + +
    {element.title}
    +

    {element.text}

    +     + )) + } +     +
    +
    + +