This commit is contained in:
2024-06-24 00:15:38 -04:00
parent 2cc88cdf72
commit 323e9474f9
28 changed files with 632 additions and 573 deletions

View File

@@ -1,12 +1,12 @@
import React, { Component } from "react";
import Slider from "react-slick";
import publicationData from "../data/publications.json"
import Publication from "./Publication";
import "slick-carousel/slick/slick.css";
import publicationData from "../data/publications.json";
import Publication from "./Publication";
import "slick-carousel/slick/slick.css";
import "slick-carousel/slick/slick-theme.css";
import {FaArrowAltCircleRight,FaArrowAltCircleLeft} from "react-icons/fa"
import { FaArrowAltCircleRight, FaArrowAltCircleLeft } from "react-icons/fa";
export default class SimpleSlider extends Component {
constructor(props) {
constructor(props) {
super(props);
this.next = this.next.bind(this);
this.previous = this.previous.bind(this);
@@ -26,16 +26,43 @@ export default class SimpleSlider extends Component {
slidesToScroll: 1,
};
return (
<div style={{height:"auto"}}>
<Slider ref={c => (this.slider = c)} {...settings}>
{publicationData.map(({title,authors, publish_date, abstract,link}) =>(
<Publication title={title} authors={authors} publish_date={publish_date} abstract={abstract} link={link}/>
))}
<div style={{ height: "auto" }}>
<Slider ref={(c) => (this.slider = c)} {...settings}>
{publicationData.map(
({ title, authors, publish_date, abstract, link }) => (
<Publication
title={title}
authors={authors}
publish_date={publish_date}
abstract={abstract}
link={link}
/>
),
)}
</Slider>
<div style={{ textAlign: "center"}}>
<FaArrowAltCircleLeft onClick={this.previous} style={{marginTop:"40px",marginBottom:"40px",borderRadius:"3em" ,fontSize:"40px", color:"aquamarine"}}/>
<div style={{ textAlign: "center" }}>
<FaArrowAltCircleLeft
onClick={this.previous}
style={{
marginTop: "40px",
marginBottom: "40px",
borderRadius: "3em",
fontSize: "40px",
color: "aquamarine",
}}
/>
<FaArrowAltCircleRight onClick={this.next} style={{marginTop:"40px", marginBottom:"40px", borderRadius:"3em",fontSize:"40px",marginLeft:"30px", color:"salmon"}}/>
<FaArrowAltCircleRight
onClick={this.next}
style={{
marginTop: "40px",
marginBottom: "40px",
borderRadius: "3em",
fontSize: "40px",
marginLeft: "30px",
color: "salmon",
}}
/>
</div>
</div>
);