summaryrefslogtreecommitdiff
path: root/client/src/components/selection/ServerCard.js
diff options
context:
space:
mode:
Diffstat (limited to 'client/src/components/selection/ServerCard.js')
-rw-r--r--client/src/components/selection/ServerCard.js37
1 files changed, 37 insertions, 0 deletions
diff --git a/client/src/components/selection/ServerCard.js b/client/src/components/selection/ServerCard.js
new file mode 100644
index 0000000..93c7ad6
--- /dev/null
+++ b/client/src/components/selection/ServerCard.js
@@ -0,0 +1,37 @@
+import React, { Component } from 'react';
+import { Link } from 'react-router-dom';
+import PropTypes from 'prop-types';
+import { MDBBtn, MDBCard, MDBCardBody, MDBCardTitle, MDBCol } from 'mdbreact';
+
+export default class ServerCard extends Component {
+ render() {
+ return(
+ <React.Fragment>
+ <MDBCol size={6}>
+ <MDBCard className="server-card">
+ <MDBCardBody>
+ <img
+ width="200px"
+ alt={`Icon of ${this.props.guild.name}`}
+ className="server-card-image"
+ src={this.props.guild.icon ?
+ `https://cdn.discordapp.com/icons/${this.props.guild.id}/${this.props.guild.icon}.png?size=4096` :
+ `https://cdn.discordapp.com/embed/avatars/3.png`
+ }
+ />
+
+ <MDBCardTitle><h6><strong>{this.props.guild.name}</strong></h6></MDBCardTitle>
+ <Link to={`/server/${this.props.guild.id}`}>
+ <MDBBtn color="primary">Manage</MDBBtn>
+ </Link>
+ </MDBCardBody>
+ </MDBCard>
+ </MDBCol>
+ </React.Fragment>
+ )
+ }
+}
+
+ServerCard.propTypes = {
+ guild: PropTypes.object
+} \ No newline at end of file