diff --git a/web/astro.config.mjs b/web/astro.config.mjs index e5f09c8..22c7b20 100644 --- a/web/astro.config.mjs +++ b/web/astro.config.mjs @@ -3,6 +3,8 @@ import tailwind from "@astrojs/tailwind"; import mdx from "@astrojs/mdx"; +import icon from "astro-icon"; + // https://astro.build/config export default defineConfig({ site: "https://www.vspace.one", @@ -16,5 +18,6 @@ export default defineConfig({ applyBaseStyles: false, }), mdx(), + icon(), ], }); diff --git a/web/bun.lockb b/web/bun.lockb index 67dd111..adf99f2 100755 Binary files a/web/bun.lockb and b/web/bun.lockb differ diff --git a/web/package.json b/web/package.json index facb215..ab9a44c 100644 --- a/web/package.json +++ b/web/package.json @@ -15,11 +15,14 @@ "@astrojs/mdx": "^3.1.6", "@astrojs/tailwind": "^5.1.0", "@astrojs/ts-plugin": "^1.10.2", + "@iconify-icons/akar-icons": "^1.2.19", + "@iconify-json/akar-icons": "^1.2.1", "@photo-sphere-viewer/core": "^5.10.0", "@photo-sphere-viewer/markers-plugin": "^5.10.0", "@photo-sphere-viewer/virtual-tour-plugin": "^5.10.0", "@unom/style": "git+https://git.unom.io/unom/style.git", "astro": "^4.15.6", + "astro-icon": "^1.1.1", "autoprefixer": "^10.4.20", "class-variance-authority": "^0.7.0", "clsx": "^2.1.1", diff --git a/web/public/pic/vspaceone_Illustrationen_Rakete_1.webp b/web/public/pic/vspaceone_Illustrationen_Rakete_1.webp new file mode 100644 index 0000000..69f3f99 Binary files /dev/null and b/web/public/pic/vspaceone_Illustrationen_Rakete_1.webp differ diff --git a/web/src/components/Cards/CardEvent.astro b/web/src/components/Cards/CardEvent.astro index ee8fd9c..6a364d7 100644 --- a/web/src/components/Cards/CardEvent.astro +++ b/web/src/components/Cards/CardEvent.astro @@ -13,11 +13,11 @@ const { event } = Astro.props;

- {event.start.toLocaleDateString("de-DE", { year: "numeric" })} + {event.start?.toLocaleDateString("de-DE", { year: "numeric" })} { - event.start.toLocaleDateString("de-DE", { + event.start?.toLocaleDateString("de-DE", { month: "long", day: "numeric", }) diff --git a/web/src/components/Cards/CardParticipate.astro b/web/src/components/Cards/CardParticipate.astro new file mode 100644 index 0000000..f130a92 --- /dev/null +++ b/web/src/components/Cards/CardParticipate.astro @@ -0,0 +1,21 @@ +--- +import Card from "@/components/Card.astro"; + +export type Props = { + title: string; +}; + +const { title } = Astro.props; +--- + + +
+
+ +
+

{title}

+
+
+ +
+ diff --git a/web/src/components/Cards/CardSponsor.astro b/web/src/components/Cards/CardSponsor.astro index e322763..d818946 100644 --- a/web/src/components/Cards/CardSponsor.astro +++ b/web/src/components/Cards/CardSponsor.astro @@ -1,6 +1,6 @@ --- import type { z } from "astro:content"; -import { Sponsor } from "@/content/config"; +import type { Sponsor } from "@/content/config"; import Card from "../Card.astro"; type Props = { diff --git a/web/src/components/Heading.astro b/web/src/components/Heading.astro index 92b7ac4..ac7902f 100644 --- a/web/src/components/Heading.astro +++ b/web/src/components/Heading.astro @@ -4,12 +4,13 @@ import type { HTMLAttributes } from "astro/types"; import { type VariantProps, cva } from "class-variance-authority"; const heading = cva( - "max-w-3xl m-[var(--section-heading-margin)] overflow-hidden", + "max-w-3xl m-[var(--section-heading-margin)] overflow-hidden font-display", { variants: { main: { true: "font-bold text-transparent animated-heading \ - bg-gradient-to-t from-transparent to-primary bg-clip-text", + bg-gradient-to-t from-transparent to-primary bg-clip-text \ + ", false: "font-semibold", }, animated: { @@ -20,6 +21,10 @@ const heading = cva( true: "py-4", false: "p-0", }, + hasIcon: { + true: "", + false: "", + }, }, }, ); @@ -33,6 +38,7 @@ export interface Props const { main = false, padding = true, + hasIcon = false, subtitle, id, class: propsClass, @@ -45,6 +51,13 @@ const titleClass = cn( ---
+ { + hasIcon && ( +
+ +
+ ) + } { main ? (

diff --git a/web/src/components/InfoSlide.astro b/web/src/components/InfoSlide.astro index a855e12..16ddeea 100644 --- a/web/src/components/InfoSlide.astro +++ b/web/src/components/InfoSlide.astro @@ -11,27 +11,29 @@ const { } = Astro.props; --- -
-
+<> +
+
- {imageAlt} -
-
-

{title}

-

{text}

+ > + {imageAlt} +
+
+

{title}

+

{text}

+
-
+ diff --git a/web/src/components/Layout/Header.astro b/web/src/components/Layout/Header.astro index 38daf9e..67e4f04 100644 --- a/web/src/components/Layout/Header.astro +++ b/web/src/components/Layout/Header.astro @@ -24,7 +24,7 @@ import Logo from "../Logo/Logo.astro";

vspace.one

@@ -43,8 +43,8 @@ import Logo from "../Logo/Logo.astro"; class="animate-in slide-in-from-top-10 ease-out-quart duration-1000 absolute top-header w-full bg-neutral p-main left-0 lg:hidden hidden flex flex-col gap-3 -z-30" > - StandortUnterstütze uns FAQ - Unterstütze uns!Besuche uns!
- StandortUnterstütze uns FAQ - Unterstütze uns!Besuche uns!

diff --git a/web/src/lib/animate-heading.ts b/web/src/lib/animate-heading.ts index cd9a715..d2aff4a 100644 --- a/web/src/lib/animate-heading.ts +++ b/web/src/lib/animate-heading.ts @@ -1,47 +1,60 @@ -import { animate, spring, stagger } from "motion"; +//import { animate, spring, stagger } from "motion"; -export default function animateHeading(e: Element, options?: { delay?: number, once?: boolean }) { - const id = Math.floor(Math.random() * 100).toString(); +export default function animateHeading( + _e: Element, + _options?: { delay?: number; once?: boolean }, +) { + return; - e.id = id; + // Currently disabled since theres no handling of line breaks yet + /* + const id = Math.floor(Math.random() * 100).toString(); - if (e.textContent) { - e.innerHTML = e.textContent.replace( - /\S/g, - `$&`, - ); + ); - const updatedElement = document.getElementById(id)!; + const updatedElement = document.getElementById(id)!; - console.log("updated", updatedElement); + console.log("updated", updatedElement); - const letters = updatedElement.querySelectorAll(`:scope > .letter`); + const letters = updatedElement.querySelectorAll(`:scope > .letter`); + let didAppear = false; - let didAppear = false; + const observer = new IntersectionObserver( + () => { + console.log("inview"); - const observer = new IntersectionObserver( - () => { - console.log("inview"); + if (options?.once && didAppear) { + return; + } - if (options?.once && didAppear) { - return; - } + animate( + letters, + { y: [50, 0] }, + { + easing: spring({ stiffness: 100, damping: 40 }), + delay: stagger(0.02, { + start: + options?.delay !== undefined + ? didAppear + ? 0 + : options.delay + : 0, + }), + }, + ); + didAppear = true; + }, + { threshold: 0.01 }, + ); - animate( - letters, - { y: [50, 0] }, - { - easing: spring({ stiffness: 100, damping: 40 }), - delay: stagger(0.02, { start: options?.delay !== undefined ? didAppear ? 0 : options.delay : 0 }), - }, - ); - didAppear = true; - }, - { threshold: 0.01 }, - ); - - observer.observe(e); - } -} \ No newline at end of file + observer.observe(e); + } */ +} diff --git a/web/src/pages/support/join.astro b/web/src/pages/support/join.astro index f082be4..5ed3d4d 100644 --- a/web/src/pages/support/join.astro +++ b/web/src/pages/support/join.astro @@ -24,13 +24,13 @@ import RootLayout from "@/layouts/RootLayout.astro"; Lade dir unter Downloads die Beitrittserklärung herunter, bring sie mit in den Space und drücke sie einem der Vorstände in die Hände. Dafür eignet sich beispielsweise das regelmäßig stattfindende Treffen am - Dienstagabend.
+ Dienstagabend.

Alternativ schicke sie an folgende Adresse:
vspace.one e.V
Am Krebsgraben 15
- 78048 Villingen
+ 78048 Villingen

Oder an folgende E-Mail Adresse:
diff --git a/web/src/sections/InfoSlideshow.astro b/web/src/sections/InfoSlideshow.astro index 6a4f974..a88fce5 100644 --- a/web/src/sections/InfoSlideshow.astro +++ b/web/src/sections/InfoSlideshow.astro @@ -1,8 +1,13 @@ --- import InfoSlide from "@/components/InfoSlide.astro"; import { infoSlides } from "@/content/info-slides"; +import Heading from "@/components/Heading.astro"; --- +
+ Einblicke +
+
{infoSlides.map((e) => )} diff --git a/web/src/sections/Introduction.astro b/web/src/sections/Introduction.astro index 0ef2045..322ad16 100644 --- a/web/src/sections/Introduction.astro +++ b/web/src/sections/Introduction.astro @@ -1,23 +1,35 @@ --- import Heading from "@/components/Heading.astro"; +import vspaceOneRakete from "../../public/pic/vspaceone_Illustrationen_Rakete_1.webp"; +import { Image } from "astro:assets"; --- -
- Was wir machen - -

- Unser Ziel ist der Wissensaustausch sowie die Bildung aller interessierten - in den Bereichen neuartiger computergestützter Technologien (wie zum - Beispiel aber nicht ausschließlich 3D-Druck, CNC, Internet der Dinge und - Robotik), der Elektrotechnik und Elektronik sowie auch auf Gebieten der - Reparatur und Wartung. -
- Natürlich aber auch ganz im Sinne aller anderen Hacker- und Makerspaces das bieten - einer Plattform, um seinen Interessen in diesen Gebieten nachzugehen von Programmieren - bis Holz- und Metallwerken ist fast alles dabei. -
- Dazu haben wir eine immer größer werdende offene Werkstatt, die für jeden zugänglich - sein soll! -

- Mehr Fragen zu uns und was wir machen beantworten wir hier! +
+
+ Was wir machen +

+ Unser Ziel ist der Wissensaustausch sowie die Bildung aller interessierten + in den Bereichen neuartiger computergestützter Technologien (wie zum + Beispiel aber nicht ausschließlich 3D-Druck, CNC, Internet der Dinge und + Robotik), der Elektrotechnik und Elektronik sowie auch auf Gebieten der + Reparatur und Wartung. +
+ Natürlich aber auch ganz im Sinne aller anderen Hacker- und Makerspaces das + bieten einer Plattform, um seinen Interessen in diesen Gebieten nachzugehen + von Programmieren bis Holz- und Metallwerken ist fast alles dabei. +
+ Dazu haben wir eine immer größer werdende offene Werkstatt, die für jeden zugänglich + sein soll! +

+ Mehr Fragen zu uns und was wir machen beantworten wir hier! +
+
+ Ein 3D Rendering einer Rakete +
diff --git a/web/src/sections/Participate.astro b/web/src/sections/Participate.astro index c6b2155..9755c27 100644 --- a/web/src/sections/Participate.astro +++ b/web/src/sections/Participate.astro @@ -1,32 +1,36 @@ --- -import Card from "@/components/Card.astro"; +import CardParticipate from "@/components/Cards/CardParticipate.astro"; import Heading from "@/components/Heading.astro"; +import { Icon } from "astro-icon/components"; +import { HeartHandshake, Binoculars, UsersRound } from "lucide-astro"; ---
Mitmachen
- -

Vorbeischauen

-

+ + +

Du möchtest uns und unsere Räumlichkeiten gerne persönlich kennenlernen? Schau doch Dienstags ab 19:00 bei uns in der Am Krebsgraben 15 in Villingen vorbei. Dienstags findet bei uns jede Woche der Chaostreff statt.

- - -

Mitglied werden

-

+ + + + +

Bei uns kann Jeder und Jede mitmachen. Interessierte Schüler, Studenten und Erwachsene, die sich für kreativen Umgang mit Technik begeistern sind willkommen. Wenn euch gefällt was wir tun und ihr uns unterstützen wollt findet ihr unser Beitrittsformular hier.

- - -

Telegram

-

+ + + + +

Für die regelmäßige Kommunikation verwenden wir Telegramgruppe und - - -

Spenden

-

+ + + + +

Dir gefällt was wir machen, hast aber keine Möglichkeit oder Lust Mitglied zu werden? Gerne nehmen wir wie hier beschrieben deine Spende als Überweisung an.

- +
diff --git a/web/src/sections/SpaceState.astro b/web/src/sections/SpaceState.astro index 6307d0b..d8265a1 100644 --- a/web/src/sections/SpaceState.astro +++ b/web/src/sections/SpaceState.astro @@ -17,7 +17,7 @@ const spaceData = await getSpaceData(); )} >
-

+

{spaceData.state.open ? "Offen" : "Geschlossen"}

diff --git a/web/tailwind.config.cjs b/web/tailwind.config.cjs index 080a306..a9c4bf9 100644 --- a/web/tailwind.config.cjs +++ b/web/tailwind.config.cjs @@ -5,6 +5,9 @@ module.exports = { content: ["./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}"], theme: { extend: { + fontFamily: { + display: ["Ubuntu"], + }, screens: { "2xl": "1400px", "3xl": "1850px" }, borderRadius: { card: "0.5rem", @@ -65,7 +68,7 @@ module.exports = { }, plugins: [ require("tailwindcss-animate"), - plugin(function ({ addVariant }) { + plugin(({ addVariant }) => { addVariant("hocus", ["&:hover", "&:focus"]); }), ],