✨ Add className prop to Hero block

Frontendland · Jan 2, 2025 · 640880a · 640880a
1 parent b93bf20
commit 640880a
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 6 deletions.
diff --git a/src/blocks/Hero/Hero.astro b/src/blocks/Hero/Hero.astro
@@ -18,13 +18,15 @@ const {
     buttons,
     badge,
     image,
-    reverse
+    reverse,
+    className
 } = Astro.props
 
 const classes = [
     styles.hero,
     reverse && styles.reverse,
-    image?.src && styles.flex
+    image?.src && styles.flex,
+    className
 ]
 ---
 

diff --git a/src/blocks/Hero/Hero.svelte b/src/blocks/Hero/Hero.svelte
@@ -15,13 +15,15 @@
         buttons,
         badge,
         image,
-        reverse
+        reverse,
+        className
     }: HeroProps = $props()
 
     const classes = classNames([
         styles.hero,
         reverse && styles.reverse,
-        image?.src && styles.flex
+        image?.src && styles.flex,
+        className
     ])
 </script>
 

diff --git a/src/blocks/Hero/Hero.tsx b/src/blocks/Hero/Hero.tsx
@@ -15,12 +15,14 @@ const Hero = ({
     buttons,
     badge,
     image,
-    reverse
+    reverse,
+    className
 }: HeroProps) => {
     const classes = classNames([
         styles.hero,
         reverse && styles.reverse,
-        image?.src && styles.flex
+        image?.src && styles.flex,
+        className
     ])
 
     return (

diff --git a/src/blocks/Hero/hero.ts b/src/blocks/Hero/hero.ts
@@ -21,4 +21,5 @@ export type HeroProps = {
         height: number
     } | null
     reverse?: boolean
+    className?: string
 }