diff --git a/src/components/Carousel.js b/src/components/Carousel.js new file mode 100644 index 00000000..9009e2d8 --- /dev/null +++ b/src/components/Carousel.js @@ -0,0 +1,32 @@ +import React from 'react'; +import { Carousel } from 'react-responsive-carousel'; + +const ImageList = [ + { + image: "https://pbs.twimg.com/media/E6HnwU1WYAQUATa.jpg:large", + alt: "A scene showing multiple widgets, including sliders like an equalizer and a virtual touchscreen.", + caption: "Multiple objects working independently all at once.", + }, + { + image: "img/carousel/spatialcode.png", + alt: "To the left, a code editor showing Stardust Fusion creating several models and transforming them on the logicStep. To the right is the program running in Stardust.", + caption: "Code vs output of the Spatial Fusion demo.", + }, +] + +function CarouselImage({image, alt, caption}) { + return ( +
+ {alt} +

{caption}

+
+ ); +} + +export default () => ( + + {ImageList.map((props, idx) => ( + + ))} + +); diff --git a/src/css/custom.css b/src/css/custom.css index 09297583..5a18150a 100644 --- a/src/css/custom.css +++ b/src/css/custom.css @@ -38,4 +38,9 @@ ul.contains-task-list { li.task-list-item > input[type="checkbox"] { pointer-events: none; +} + +.gallery { + margin: 0 auto; + max-width: 1250px; } \ No newline at end of file diff --git a/src/pages/index.js b/src/pages/index.js index 47e2d2b8..8de8c396 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -5,6 +5,8 @@ import Link from '@docusaurus/Link'; import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; import styles from './index.module.css'; import HomepageFeatures from '../components/HomepageFeatures'; +import Carousel from '../components/Carousel'; +import 'react-responsive-carousel/lib/styles/carousel.min.css'; function HomepageHeader() { const {siteConfig} = useDocusaurusContext(); @@ -34,6 +36,7 @@ export default function Home() {
+
); diff --git a/static/img/carousel/spatialcode.png b/static/img/carousel/spatialcode.png new file mode 100644 index 00000000..cd6518d1 Binary files /dev/null and b/static/img/carousel/spatialcode.png differ