You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
43 lines
1.2 KiB
43 lines
1.2 KiB
import React from "react"; |
|
import ArrowForwardIcon from "@mui/icons-material/ArrowForward"; |
|
import ArrowBackIcon from "@mui/icons-material/ArrowBack"; |
|
import IconButton from "@mui/material/IconButton"; |
|
import { Stack } from "@mui/system"; |
|
|
|
export function Buttons(indiceCorrente, cambiaindiceCorrente, messaggi) { |
|
return ( |
|
<Stack |
|
style={{ |
|
display: "flex", |
|
width: "100vw", |
|
position: "absolute", |
|
bottom: 20, |
|
left: 0, |
|
padding: 10, |
|
boxSizing: "border-box", |
|
}} |
|
direction="row" |
|
> |
|
<Stack |
|
style={{ |
|
display: "flex", |
|
width: "70vw", |
|
margin: "0 auto", |
|
justifyContent: "space-between", |
|
}} |
|
direction="row" |
|
> |
|
{indiceCorrente > 0 && ( |
|
<IconButton onClick={() => cambiaindiceCorrente(indiceCorrente - 1)}> |
|
<ArrowBackIcon style={{ fontSize: "3rem", color: "#ddd" }} /> |
|
</IconButton> |
|
)} |
|
{indiceCorrente < messaggi.length - 1 && ( |
|
<IconButton onClick={() => cambiaindiceCorrente(indiceCorrente + 1)}> |
|
<ArrowForwardIcon style={{ fontSize: "3rem", color: "#ddd" }} /> |
|
</IconButton> |
|
)} |
|
</Stack> |
|
</Stack> |
|
); |
|
}
|
|
|