Changed from tabular to div

This commit is contained in:
Aman Tahiliani
2022-05-09 00:55:07 +05:30
parent c9498d62cc
commit c9a9f59f97
3 changed files with 47 additions and 44 deletions

View File

@@ -2,35 +2,44 @@ import React, { Component } from "react";
import "bootstrap/dist/css/bootstrap.css"; import "bootstrap/dist/css/bootstrap.css";
import { Grid, Row, Col } from "react-bootstrap"; import { Grid, Row, Col } from "react-bootstrap";
import "./about.css"; import "./about.css";
import AmanTahilianiPortfolio from '../media/AmanTahilianiPortfolio.png' import AmanTahilianiPortfolio from "../media/AmanTahilianiPortfolio.png";
// const img = '../media/AmanTahilianiPortfolio.png' // const img = '../media/AmanTahilianiPortfolio.png'
class About extends Component { class About extends Component {
render() { render() {
return ( return (
<div className="AboutComponent"> <div className="AboutComponent">
<Row> <Row>
<Col> <Col>
<img src={AmanTahilianiPortfolio} className="NameImage"/> <img src={AmanTahilianiPortfolio} className="NameImage" />
</Col> </Col>{" "}
<Col className="InfoColumn"> <Col className="InfoColumn">
<Row> <Row>
<h2>Hi There!</h2> <h2 style={{ marginTop: "10px" }}> Hi There! </h2>{" "}
</Row> </Row>{" "}
<Row> <Row>
<h3>Let me tell you a little about myself</h3> <h3> Let me tell you a little about myself </h3>{" "}
</Row> </Row>{" "}
<Row className="Info"> <Row className="Info">
<ul> <ul>
<li>I am a final Year BTech CSE student at Jaypee Institute of Information Technology in Noida, India.</li> <li>
<li>Currently working as an SDE Intern (Backend) at <a href="https://innovaccer.com/">Innovaccer</a> as part of the DAP (Data Activation Platform).</li> I am a final Year BTech CSE student at Jaypee Institute of
<li>I enjoy designing and creating the backend logic for projects and am also proficient in frontend development.</li> Information Technology in Noida, India.{" "}
</ul> </li>{" "}
</Row> <li>
</Col> Currently working as an SDE Intern(Backend) at{" "}
<a href="https://innovaccer.com/"> Innovaccer </a> as part of
</Row> the DAP(Data Activation Platform).{" "}
</li>{" "}
<li>
I enjoy designing and creating the backend logic for projects
and am also proficient in frontend development.{" "}
</li>{" "}
</ul>{" "}
</Row>{" "}
</Col>{" "}
</Row>{" "}
</div> </div>
); );
} }

View File

@@ -8,26 +8,18 @@ class Publication extends Component {
return ( return (
<div className="publication-detail"> <div className="publication-detail">
<h3>{this.props.title}</h3> <h3>{this.props.title}</h3>
<table> <Row>
<tbody> <Col>Authors: {this.props.authors}</Col>
<tr> </Row>
<td>Authors</td> <Row>
<td>{this.props.authors}</td> <div>Publish Date: {this.props.publish_date}</div>
</tr> </Row>
<tr> <div>Link: <a href={this.props.link}>{this.props.link}</a></div>
<td>Publish Date</td> <br/>
<td>{this.props.publish_date}</td> <div style={{fontWeight:"bolder"}}>Abstract:</div>
</tr> <div>{this.props.abstract}</div>
<tr>
<td>Abstract</td>
<td>{this.props.abstract}</td>
</tr>
<tr>
<td>Link</td>
<td><a href={this.props.link}>{this.props.link}</a></td>
</tr>
</tbody>
</table>
</div> </div>
); );
} }

View File

@@ -22,11 +22,13 @@ tr:hover {
padding: 30px; padding: 30px;
margin: 40px; margin: 40px;
border: 1px solid white; border: 1px solid white;
height: auto; border-radius: 2em;
border-radius: 5em;
white-space: normal; white-space: normal;
overflow: auto; overflow: auto;
text-overflow: ellipsis; text-overflow: ellipsis;
text-align: justify;
padding-left: 5%;
padding-right: 5%;
} }
.publication-detail h3 { .publication-detail h3 {