|
1 | 1 | import React, { Component } from "react";
|
2 |
| -import { Link } from 'react-router-dom'; |
3 |
| -import Heart from './Heart'; |
| 2 | +import { Link } from "react-router-dom"; |
| 3 | +import Heart from "./Heart"; |
4 | 4 |
|
5 | 5 | class MentorList extends Component {
|
6 |
| - render() { |
7 |
| - return ( |
8 |
| - <div className="col-sm-4"> |
9 |
| - <Link to={{ pathname: '/MentorList', state: { id: this.props.data } }} className="card"> |
10 |
| - <div className="thumbnail" style={ { backgroundImage: `url(${this.props.data.image})` } } alt="Card cap" /> |
11 |
| - <div className="content-card"> |
12 |
| - <h3>{this.props.data.name}</h3> |
13 |
| - <p className="tags">{this.props.data.technology}</p> |
14 |
| - <div className="bottom-info"> |
15 |
| - <p>{this.props.data.country}</p> |
16 |
| - <Heart {...this.props.data} /> |
17 |
| - </div> |
18 |
| - </div> |
19 |
| - </Link> |
| 6 | + render() { |
| 7 | + return ( |
| 8 | + <div className="col-sm-4 "> |
| 9 | + <Link |
| 10 | + to={{ pathname: "/MentorList", state: { id: this.props.data } }} |
| 11 | + className="card" |
| 12 | + > |
| 13 | + <div className="text-center"> |
| 14 | + {" "} |
| 15 | + <img |
| 16 | + className="img-thumbnail img-fluid rounded-circle thumbnail" |
| 17 | + src={this.props.data.image} |
| 18 | + alt={this.props.data.name} |
| 19 | + />{" "} |
| 20 | + </div> |
| 21 | + |
| 22 | + <div className="content-card"> |
| 23 | + <h3>{this.props.data.name}</h3> |
| 24 | + <p className="tags">{this.props.data.technology}</p> |
| 25 | + <div className="bottom-info"> |
| 26 | + <p>{this.props.data.country}</p> |
| 27 | + <Heart {...this.props.data} /> |
20 | 28 | </div>
|
21 |
| - ); |
22 |
| - } |
| 29 | + </div> |
| 30 | + </Link> |
| 31 | + </div> |
| 32 | + ); |
| 33 | + } |
23 | 34 | }
|
24 | 35 | export default MentorList;
|
0 commit comments