46 lines
1.5 KiB
JavaScript
46 lines
1.5 KiB
JavaScript
import React, { useEffect, useState } from "react";
|
|
import Image from "next/image";
|
|
import Flickity from "react-flickity-component";
|
|
import "flickity/css/flickity.css";
|
|
import styles from "./AutoGallery.module.sass";
|
|
|
|
export class AutoGallery extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = { activeItem: 1 };
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<Flickity
|
|
className={styles.carousel} // default ''
|
|
elementType={"div"} // default 'div'
|
|
options={{ prevNextButtons: true, wrapAround: true, autoPlay: 5000 }} // takes flickity options {}
|
|
disableImagesLoaded={false} // default false
|
|
reloadOnUpdate // default false
|
|
static // default false
|
|
>
|
|
<div className={styles.slide}>
|
|
<img className={styles.bgimg} src="/portfolio_bath.webp" alt="bath" />
|
|
<div className={styles.overlay}>
|
|
<h2>My Bachelor Thesis</h2>
|
|
<p>on calibration and software inside a custom power supply</p>
|
|
<p>see more...</p>
|
|
</div>
|
|
</div>
|
|
<div className={styles.slide}>
|
|
<img className={styles.bgimg} src="/portfolio_math.webp" alt="math" />
|
|
<div className={styles.overlay}>
|
|
<h2>My Master Thesis</h2>
|
|
<p>
|
|
on analysis, design and optimization of a analogue Pre-Amplifier
|
|
with the goal of transitioning to a newer manufacturing node.
|
|
</p>
|
|
<p>see more...</p>
|
|
</div>
|
|
</div>
|
|
</Flickity>
|
|
);
|
|
}
|
|
}
|