Initial Commit

Author: JManion32

src/components/Carousel.tsx

@@ -0,0 +1,21 @@
+import '../css/carousel.css';
+import Organization from './Organization.tsx';
+
+type CarouselProps = {
+    type: string;
+}
+
+export default function Carousel({ type }: CarouselProps) {
+    return (
+        <>
+            <div>
+                <h2 className="carousel-title">{type}</h2>
+                <div className="carousel">
+                    <Organization />
+                    <Organization />
+                    <Organization />
+                </div>  
+            </div>
+        </>
+    );
+}

src/components/Organization.tsx

@@ -0,0 +1,9 @@
+import '../css/organizations.css';
+
+export default function Organization() {
+    return (
+        <div className="org">
+            
+        </div>
+    );
+}

src/css/carousel.css

@@ -0,0 +1,24 @@
+.carousel-page-container {
+    display: flex;
+    flex-direction: column;
+    gap: 4rem;
+}
+
+.carousel {
+    width: 100%;
+    background: #F1DEDE;
+    height: 20rem;
+    border-radius: 2rem;
+    padding: 1rem;
+
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 2rem;
+}
+
+.carousel-title {
+    margin: 0;
+    font-size: 1rem;
+    color: black;
+}

src/css/organizations.css

@@ -0,0 +1,6 @@
+.org {
+    height: 18rem;
+    width: 22rem;
+    border-radius: 2rem;
+    background: #D9D9D9;
+}