import React from 'react'
import { Card, CardDeck } from 'react-bootstrap';

export default function SensorCardDeck( {sensorCardValues} ) {
    return (
        <CardDeck>
            <Card>
                <Card.Body>
                    <Card.Title>Temperature</Card.Title>
                    <Card.Text>{sensorCardValues[0]} °C</Card.Text>
                </Card.Body>
            </Card>
            <Card>
                <Card.Body>
                    <Card.Title>Humidity</Card.Title>
                    <Card.Text>{sensorCardValues[1]} %</Card.Text>
                </Card.Body>
            </Card>
            <Card>
                <Card.Body>
                    <Card.Title>Light</Card.Title>
                    <Card.Text>{sensorCardValues[2]} %</Card.Text>
                </Card.Body>
            </Card>
            <Card>
                <Card.Body>
                    <Card.Title>Moisture</Card.Title>
                    <Card.Text>{sensorCardValues[3]} %</Card.Text>
                </Card.Body>
            </Card>
        </CardDeck>
    )
}
