From a334fb1e4ad5ce46486806d583d62afe9a615230 Mon Sep 17 00:00:00 2001 From: Sebastian Wendel Date: Sun, 10 Mar 2024 03:02:48 +0100 Subject: [PATCH] changed components from react to astro --- src/authors/swendel.json | 15 ----- src/components/Footer.astro | 79 +++++++++++++++++++++++++ src/components/Footer.tsx | 43 -------------- src/components/Hero.astro | 54 +++++++++++++++++ src/components/HeroSection.tsx | 41 ------------- src/components/LinkButton.tsx | 4 +- src/components/Navbar.astro | 19 ++++++ src/components/Navbar.tsx | 25 -------- src/components/SectionGridContainer.tsx | 37 ------------ src/components/index.ts | 8 --- src/content/config.ts | 22 ------- src/layouts/BaseLayout.astro | 33 ++++++----- src/pages/index.astro | 5 +- src/styles/base.css | 54 ++++++++++++++++- 14 files changed, 229 insertions(+), 210 deletions(-) delete mode 100644 src/authors/swendel.json create mode 100644 src/components/Footer.astro delete mode 100644 src/components/Footer.tsx create mode 100644 src/components/Hero.astro delete mode 100644 src/components/HeroSection.tsx create mode 100644 src/components/Navbar.astro delete mode 100644 src/components/Navbar.tsx delete mode 100644 src/components/SectionGridContainer.tsx delete mode 100644 src/content/config.ts diff --git a/src/authors/swendel.json b/src/authors/swendel.json deleted file mode 100644 index db42fe3..0000000 --- a/src/authors/swendel.json +++ /dev/null @@ -1,15 +0,0 @@ -{ - "firstName": "Sebastian", - "lastName": "Wendel", - "bio": "His focus is on software development as well as platform and cloud engineering.", - "image": { - "default": "/images/sebastian_wendel.jpg", - "alt": "Portrait of Sebastian Wendel" - }, - "social": { - "mastodon": "@swendel@srx.digital", - "linkedin": "https://www.linkedin.com/in/sebastian-wendel-935b8a9a/" - }, - "chat": "swendel@srx.digital", - "homepage": "https://srx.digital/" -} \ No newline at end of file diff --git a/src/components/Footer.astro b/src/components/Footer.astro new file mode 100644 index 0000000..1f061c5 --- /dev/null +++ b/src/components/Footer.astro @@ -0,0 +1,79 @@ +--- +import SRXLogo from "@srx/assets/srx-digital-logo.svg"; +import SrxLogoR from "@srx/assets/srx-digital-logo.svg?react"; + +import { Image } from "astro:assets"; +import { + GitFork, + AtSign, + GithubIcon, + Linkedin, + MessagesSquare, + MessageSquareQuote, +} from "lucide-react"; +--- + + + + diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx deleted file mode 100644 index 1505ed9..0000000 --- a/src/components/Footer.tsx +++ /dev/null @@ -1,43 +0,0 @@ -import type React from 'react' -import SRXLogo from '@srx/assets/srx-digital-logo.svg?react' - -interface Props { - children?: React.ReactNode -} - -const Footer: React.FC = ({ children }: Props) => { - return ( - <> -
-
- -
- -
- {children} -
-
- -
-

- Du möchtest mit uns zusammenarbeiten? Wir freuen uns auf deine E-Mail. -

- -
-
- srx digital
- Development & Operations
-
- -
- Sebastian Wendel
- Wohlwillstraße 2
- 20359 Hamburg
-
-
-
- - ) -} - -export default Footer diff --git a/src/components/Hero.astro b/src/components/Hero.astro new file mode 100644 index 0000000..f63ed41 --- /dev/null +++ b/src/components/Hero.astro @@ -0,0 +1,54 @@ +--- +import { Picture } from "astro:assets"; +import { LinkButton } from "@srx/components"; +import SwendelPortrait from "@srx/assets/swendel_portrait.webp"; +--- + +
+
+

You, me, technology.

+

+ Hallo! Ich bin Sebastian aus Hamburg, spezialisiert auf + Softwareentwicklung und Plattformengineering. Meine Welt sind Linux, + Container, Cloud und Hardware, besonders wenn's um Open-Source geht. + Ich helfe Firmen, ihre Digitalstrategien erfolgreich zu realisieren. +

+ + + +
+ + +
+ + diff --git a/src/components/HeroSection.tsx b/src/components/HeroSection.tsx deleted file mode 100644 index 6505a56..0000000 --- a/src/components/HeroSection.tsx +++ /dev/null @@ -1,41 +0,0 @@ -import React from 'react' - -interface Props { - title: string - subtitle?: string - buttonCaption?: string -} - -const HeroSection: React.FC = ({ title, subtitle, buttonCaption }: Props) => { - return ( - <> -
-

- {title} -

- {subtitle &&

{subtitle}

} - {buttonCaption} -
- -
-
- - - - { - -
-
- - ) -} - -export default HeroSection diff --git a/src/components/LinkButton.tsx b/src/components/LinkButton.tsx index 90c8a14..5a6bd9f 100644 --- a/src/components/LinkButton.tsx +++ b/src/components/LinkButton.tsx @@ -4,7 +4,6 @@ interface Props { caption: string className?: string href?: string - dark?: boolean newTab?: boolean small?: boolean } @@ -12,13 +11,12 @@ interface Props { const LinkButton: React.FC = ({ caption, className, - dark = false, href, newTab, small, }: Props) => { return ( - {caption} diff --git a/src/components/Navbar.astro b/src/components/Navbar.astro new file mode 100644 index 0000000..ecac198 --- /dev/null +++ b/src/components/Navbar.astro @@ -0,0 +1,19 @@ +--- +import SrxLogo from "@srx/assets/srx-digital-logo.svg?react"; +--- + + + + diff --git a/src/components/Navbar.tsx b/src/components/Navbar.tsx deleted file mode 100644 index df99f93..0000000 --- a/src/components/Navbar.tsx +++ /dev/null @@ -1,25 +0,0 @@ -import type { Props } from 'astro' -import type React from 'react' -import { useState } from 'react' -import { SectionGridContainer } from '@srx/components' -import SrxLogo from '@srx/assets/srx-digital-logo.svg?react' - -const Navbar: React.FC = ({ }) => { - const [navListOpen] = useState(false) - - return ( - -
- -
- - ) -} - -export default Navbar diff --git a/src/components/SectionGridContainer.tsx b/src/components/SectionGridContainer.tsx deleted file mode 100644 index 887b943..0000000 --- a/src/components/SectionGridContainer.tsx +++ /dev/null @@ -1,37 +0,0 @@ -import type React from 'react' -import type { ElementType } from 'react' - -interface SectionGridContainerProps { - children: React.ReactNode - className?: string - innerClassName?: string - breakpoint?: 'lg' | 'xl' | '2xl' - as?: ElementType -} - -const SectionGridContainer: React.FC = ({ - children, - className, - innerClassName, - breakpoint = 'lg', - as: Tag = 'section', -}) => { - const innerGridBreakpointClasses = { - lg: 'lg:grid-cols-inner lg:gap-4', - xl: 'xl:grid-cols-inner xl:gap-4', - '2xl': '2xl:grid-cols-inner 2xl:gap-4', - } - - return ( -
- - {children} - -
- ) -} -export default SectionGridContainer diff --git a/src/components/index.ts b/src/components/index.ts index a0e75cd..0c0c632 100644 --- a/src/components/index.ts +++ b/src/components/index.ts @@ -1,13 +1,5 @@ -import Navbar from "@srx/components/Navbar"; -import HeroSection from "@srx/components/HeroSection"; -import Footer from "@srx/components/Footer"; -import SectionGridContainer from "@srx/components/SectionGridContainer"; import LinkButton from "@srx/components/LinkButton"; export { - Navbar, - HeroSection, - Footer, - SectionGridContainer, LinkButton, } \ No newline at end of file diff --git a/src/content/config.ts b/src/content/config.ts deleted file mode 100644 index b5f9a9e..0000000 --- a/src/content/config.ts +++ /dev/null @@ -1,22 +0,0 @@ -import { z, defineCollection } from 'astro:content' - -const authorCollection = defineCollection({ - type: 'data', - schema: z.object({ - firstName: z.string(), - lastName: z.string(), - image: z.object({ - default: z.string(), - webp: z.string().optional(), - alt: z.string(), - }), - chat: z.string().optional(), - social: z.string().optional(), - homepage: z.string().optional(), - }), - }) - - export const collections = { - authors: authorCollection, - } - \ No newline at end of file diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index 27f1f87..d5e182a 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -1,9 +1,10 @@ --- +import "@srx/styles/base.css"; import "@fontsource-variable/literata"; import "@fontsource-variable/manrope"; import "@fontsource-variable/martian-mono"; -import "@srx/styles/base.css"; -import { Footer, Navbar, SectionGridContainer } from "@srx/components"; +import Navbar from "@srx/components/Navbar.astro"; +import Footer from "@srx/components/Footer.astro"; interface Props { metaTitle?: string; @@ -26,9 +27,11 @@ const { metaDate, metaSchema, } = Astro.props; + +const isProduction = import.meta.env.MODE === "production"; --- - + {`${metaTitle} - ${metaSubtitle}`} @@ -76,17 +79,19 @@ const { /> ) } + { + isProduction && ( +