[e9b4ba9] | 1 | import React from "react";
|
---|
| 2 | import { Container, Row, Col } from "react-bootstrap";
|
---|
| 3 | import { RxDot } from "react-icons/rx"
|
---|
| 4 | import Line from "./Line";
|
---|
| 5 |
|
---|
| 6 | const Waypoint = (props) => {
|
---|
| 7 | console.log(props.left)
|
---|
| 8 | const style = props.left === "true" ? {textAlign: "left"} : {}
|
---|
| 9 | console.log(style)
|
---|
| 10 |
|
---|
| 11 | const getTimeAsString = (dateString) => {
|
---|
| 12 | const date = new Date(dateString)
|
---|
| 13 | return `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`;
|
---|
| 14 | }
|
---|
| 15 |
|
---|
| 16 | return (
|
---|
| 17 | <>
|
---|
| 18 | <Row className="d-flex flex-row gap-0">
|
---|
[ac19a0c] | 19 | {props.left === "true" && <Col className="d-flex flex-column justify-content-center col-md-4" style={{paddingLeft: "2.6rem"}}>
|
---|
[e9b4ba9] | 20 | <h5 style={{color: props.routes === "true" ? "white" : "" }} className="m-auto">{getTimeAsString(props.time)}</h5>
|
---|
| 21 | </Col>}
|
---|
| 22 | <Col md="auto">
|
---|
| 23 | <RxDot size={"4rem"} color="#159895"></RxDot>
|
---|
| 24 | </Col>
|
---|
| 25 | <Col className="d-flex flex-column justify-content-center">
|
---|
| 26 | <h3 className="my-auto" style={{...style, fontSize: props.routes === "true" ? "1.3rem" : "", color: props.routes === "true" ? "#708090 " : ""}}>{props.city}</h3>
|
---|
| 27 | </Col>
|
---|
| 28 | {props.left !== "true" && <Col className="d-flex flex-column justify-content-center">
|
---|
| 29 | <h5>{getTimeAsString(props.time)}</h5>
|
---|
| 30 | </Col>}
|
---|
| 31 | </Row>
|
---|
[ac19a0c] | 32 | <Row className="d-flex flex-row gap-0">
|
---|
| 33 | {props.left === "true" && <Col className="d-flex flex-column justify-content-center col-md-4" style={{paddingLeft: "2.6rem"}}>
|
---|
| 34 |
|
---|
| 35 | </Col>}
|
---|
| 36 | <Col md="auto">
|
---|
| 37 | <Line left={props.left}> </Line>
|
---|
| 38 | </Col>
|
---|
| 39 | <Col className="d-flex flex-column justify-content-center">
|
---|
| 40 | </Col>
|
---|
| 41 | {props.left !== "true" && <Col className="d-flex flex-column justify-content-center">
|
---|
| 42 |
|
---|
| 43 | </Col>}
|
---|
| 44 | </Row>
|
---|
| 45 | {/*<Row>*/}
|
---|
| 46 | {/*<Line left={props.left}> </Line>*/}
|
---|
| 47 | {/*</Row>*/}
|
---|
[e9b4ba9] | 48 | </>
|
---|
| 49 | );
|
---|
| 50 | };
|
---|
| 51 |
|
---|
| 52 | export default Waypoint;
|
---|