defined card template
This commit is contained in:
parent
ce8d4e1ef9
commit
c24cad03c8
@ -1,40 +1,22 @@
|
||||
import React, {Component} from 'react';
|
||||
import {Card, Col, Row} from 'react-bootstrap';
|
||||
|
||||
type CardProps = {
|
||||
title: string,
|
||||
content: string,
|
||||
update: Date
|
||||
}
|
||||
|
||||
|
||||
class HCard extends Component<CardProps> {
|
||||
export class SidebarCard extends Component<CardProps> {
|
||||
constructor(props: CardProps) {
|
||||
super(props)
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<Card bg="light" style={{minWidth: "15rem"}} className="mx-auto">
|
||||
<Row className="no-gutters">
|
||||
<Col md={7} className="border-right my-auto">
|
||||
<h5 className="text-center my-auto">{this.props.title}</h5>
|
||||
</Col>
|
||||
|
||||
<Col md={5}>
|
||||
<Card.Body>
|
||||
<Card.Text className="text-center my-auto">
|
||||
{this.props.content}
|
||||
</Card.Text>
|
||||
</Card.Body>
|
||||
</Col>
|
||||
</Row>
|
||||
<Card.Text className="border-top text-center">
|
||||
<small className="text-muted my-auto mx-2">Last
|
||||
updated {this.props.update.toLocaleTimeString('en-GB')}</small>
|
||||
</Card.Text>
|
||||
</Card>);
|
||||
<div className="bg-gray-300 mt-2 mx-4 rounded p-4">
|
||||
<div className="text-gray-600">{this.props.title}</div>
|
||||
<div className="mt-1 mx-auto text-center text-3xl font-semibold">{this.props.content}</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
export default HCard;
|
||||
|
Loading…
Reference in New Issue
Block a user