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 | if(dateString === '')
|
---|
13 | return ''
|
---|
14 | const date = new Date(dateString)
|
---|
15 | return `${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}`;
|
---|
16 | }
|
---|
17 |
|
---|
18 | <<<<<<< HEAD
|
---|
19 | return (
|
---|
20 | <>
|
---|
21 | <Row className="d-flex flex-row gap-0">
|
---|
22 | {props.left === "true" &&
|
---|
23 | <Col className="d-flex flex-column justify-content-center col-md-4" style={{paddingLeft: "2.6rem"}}>
|
---|
24 | <h5 style={{color: props.routes === "true" ? "white" : ""}}
|
---|
25 | className="m-auto">{getTimeAsString(props.time)}</h5>
|
---|
26 | </Col>}
|
---|
27 | <Col md="auto">
|
---|
28 | <RxDot size={"4rem"} color="#159895"></RxDot>
|
---|
29 | </Col>
|
---|
30 | <Col className="d-flex flex-column justify-content-center">
|
---|
31 | <h3 className="my-auto" style={{
|
---|
32 | ...style,
|
---|
33 | fontSize: props.routes === "true" ? "1.3rem" : "",
|
---|
34 | color: props.routes === "true" ? "#708090 " : ""
|
---|
35 | }}>{props.city}</h3>
|
---|
36 | </Col>
|
---|
37 | {props.left !== "true" && <Col className="d-flex flex-column justify-content-center">
|
---|
38 | <h5>{getTimeAsString(props.time)}</h5>
|
---|
39 | </Col>}
|
---|
40 | </Row>
|
---|
41 | <Row className="d-flex flex-row gap-0">
|
---|
42 | {props.left === "true" &&
|
---|
43 | <Col className="d-flex flex-column justify-content-center col-md-4" style={{paddingLeft: "2.6rem"}}>
|
---|
44 |
|
---|
45 | </Col>}
|
---|
46 | <Col md="auto">
|
---|
47 | <Line left={props.left}> </Line>
|
---|
48 | </Col>
|
---|
49 | <Col className="d-flex flex-column justify-content-center">
|
---|
50 | </Col>
|
---|
51 | {props.left !== "true" && <Col className="d-flex flex-column justify-content-center">
|
---|
52 |
|
---|
53 | </Col>}
|
---|
54 | </Row>
|
---|
55 | {/*<Row>*/}
|
---|
56 | {/*<Line left={props.left}> </Line>*/}
|
---|
57 | {/*</Row>*/}
|
---|
58 | </>
|
---|
59 | );
|
---|
60 | =======
|
---|
61 | return (
|
---|
62 | <>
|
---|
63 | <Row className="d-flex flex-row gap-0">
|
---|
64 | {props.left === "true" && <Col className="d-flex flex-column justify-content-center col-auto" style={{paddingLeft: "2.6rem"}}>
|
---|
65 | <h5 style={{color: props.routes === "true" ? "white" : "" }} className="m-auto">{getTimeAsString(props.time)}</h5>
|
---|
66 | </Col>}
|
---|
67 | <Col md="auto">
|
---|
68 | <RxDot size={"4rem"} color="#159895"></RxDot>
|
---|
69 | </Col>
|
---|
70 | <Col className="d-flex flex-column justify-content-center">
|
---|
71 | <h3 className="my-auto" style={{...style, fontSize: props.routes === "true" ? "1.3rem" : "", color: props.routes === "true" ? "#708090 " : ""}}>{props.city}</h3>
|
---|
72 | </Col>
|
---|
73 | {props.left !== "true" && <Col className="d-flex flex-column justify-content-center">
|
---|
74 | <h5>{getTimeAsString(props.time)}</h5>
|
---|
75 | </Col>}
|
---|
76 | </Row>
|
---|
77 | <Row>
|
---|
78 | <Line left={props.left}> </Line>
|
---|
79 | </Row>
|
---|
80 | </>
|
---|
81 | );
|
---|
82 | >>>>>>> parent of ac19a0c (authContext impl, admin panel impl, search bar fixes, reservations listings impl)
|
---|
83 | };
|
---|
84 |
|
---|
85 | export default Waypoint;
|
---|