mirror of
https://github.com/AmanTahiliani/Portfolio.git
synced 2026-08-08 04:06:15 -04:00
Compare commits
19 Commits
v0.0.1-bet
...
dark-mode-
| Author | SHA1 | Date | |
|---|---|---|---|
|
c7c331d5e9 | ||
|
|
a4925d5944 | ||
|
|
c21eda8c6b | ||
|
|
0ffd128e69 | ||
|
|
d6e5d1f184 | ||
|
|
c3df99e6c9 | ||
|
|
f3a115e610 | ||
|
|
0422ef27d2 | ||
|
|
654012bc5c | ||
|
|
323e9474f9 | ||
|
|
2cc88cdf72 | ||
|
|
4aed6b824d | ||
|
|
86c08a95e1 | ||
|
|
b17cdcc7bc | ||
|
|
dbc791915e | ||
|
|
16150f39c4 | ||
|
|
3c66ae69dc | ||
|
|
5dd2413463 | ||
|
|
fde5b601b6 |
14843
package-lock.json
generated
Normal file
14843
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
@@ -1,12 +1,17 @@
|
||||
{
|
||||
"name": "my-app",
|
||||
"version": "0.1.0",
|
||||
"proxy": "http://localhost:8000",
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@fortawesome/fontawesome-svg-core": "^6.1.1",
|
||||
"@fortawesome/free-solid-svg-icons": "^6.1.1",
|
||||
"@fortawesome/react-fontawesome": "^0.2.0",
|
||||
"@testing-library/jest-dom": "^5.14.1",
|
||||
"@testing-library/react": "^13.0.0",
|
||||
"@testing-library/user-event": "^13.2.1",
|
||||
"bootstrap": "^5.1.3",
|
||||
"prettier": "^3.3.2",
|
||||
"react": "^18.1.0",
|
||||
"react-bootstrap": "^2.3.1",
|
||||
"react-dom": "^18.1.0",
|
||||
@@ -14,6 +19,7 @@
|
||||
"react-router-dom": "^6.3.0",
|
||||
"react-scripts": "5.0.1",
|
||||
"react-slick": "^0.29.0",
|
||||
"react-transition-group": "^4.4.5",
|
||||
"slick-carousel": "^1.8.1",
|
||||
"web-vitals": "^2.1.0"
|
||||
},
|
||||
|
||||
BIN
public/android-chrome-192x192.png
Normal file
BIN
public/android-chrome-192x192.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
BIN
public/android-chrome-512x512.png
Normal file
BIN
public/android-chrome-512x512.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
BIN
public/apple-touch-icon.png
Normal file
BIN
public/apple-touch-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.8 KiB |
BIN
public/favicon-16x16.png
Normal file
BIN
public/favicon-16x16.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 562 B |
BIN
public/favicon-32x32.png
Normal file
BIN
public/favicon-32x32.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.8 KiB After Width: | Height: | Size: 15 KiB |
@@ -1,20 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
|
||||
<link rel="icon" href="favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<meta
|
||||
name="description"
|
||||
content="Web site created using create-react-app"
|
||||
/>
|
||||
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css">
|
||||
<!--
|
||||
manifest.json provides metadata used when your web app is installed on a
|
||||
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
|
||||
-->
|
||||
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
|
||||
<link rel="manifest" href="manifest.json" />
|
||||
<!--
|
||||
Notice the use of %PUBLIC_URL% in the tags above.
|
||||
It will be replaced with the URL of the `public` folder during the build.
|
||||
@@ -24,8 +21,9 @@
|
||||
work correctly both with client-side routing and a non-root public URL.
|
||||
Learn how to configure a non-root public URL by running `npm run build`.
|
||||
-->
|
||||
<title>React App</title>
|
||||
<title>Aman Tahiliani</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 5.2 KiB After Width: | Height: | Size: 15 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9.4 KiB After Width: | Height: | Size: 58 KiB |
@@ -1,25 +1,19 @@
|
||||
{
|
||||
"short_name": "React App",
|
||||
"name": "Create React App Sample",
|
||||
"name": "",
|
||||
"short_name": "",
|
||||
"icons": [
|
||||
{
|
||||
"src": "favicon.ico",
|
||||
"sizes": "64x64 32x32 24x24 16x16",
|
||||
"type": "image/x-icon"
|
||||
"src": "/android-chrome-192x192.png",
|
||||
"sizes": "192x192",
|
||||
"type": "image/png"
|
||||
},
|
||||
{
|
||||
"src": "logo192.png",
|
||||
"type": "image/png",
|
||||
"sizes": "192x192"
|
||||
},
|
||||
{
|
||||
"src": "logo512.png",
|
||||
"type": "image/png",
|
||||
"sizes": "512x512"
|
||||
"src": "/android-chrome-512x512.png",
|
||||
"sizes": "512x512",
|
||||
"type": "image/png"
|
||||
}
|
||||
],
|
||||
"start_url": ".",
|
||||
"display": "standalone",
|
||||
"theme_color": "#000000",
|
||||
"background_color": "#ffffff"
|
||||
"theme_color": "#ffffff",
|
||||
"background_color": "#ffffff",
|
||||
"display": "standalone"
|
||||
}
|
||||
|
||||
88
src/App.css
88
src/App.css
@@ -1,73 +1,101 @@
|
||||
.App {
|
||||
.App {
|
||||
text-align: center;
|
||||
background-color: #282c34;
|
||||
background-color: var(--background-primary);
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0px;
|
||||
left: 0px;
|
||||
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
|
||||
color: azure;
|
||||
}
|
||||
font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
|
||||
color: var(--text-primary);
|
||||
overflow-x: hidden;
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
.App-logo {
|
||||
html {
|
||||
scroll-behavior: smooth;
|
||||
}
|
||||
|
||||
section {
|
||||
opacity: 0;
|
||||
transform: translateY(20px);
|
||||
transition: opacity 0.6s ease-out, transform 0.6s ease-out;
|
||||
}
|
||||
|
||||
section.visible {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
.App-logo {
|
||||
height: 40vmin;
|
||||
pointer-events: none;
|
||||
}
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
@media (prefers-reduced-motion: no-preference) {
|
||||
.App-logo {
|
||||
animation: App-logo-spin infinite 20s linear;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.App-header {
|
||||
background-color: #282c34;
|
||||
.App-header {
|
||||
background-color: var(--background-primary);
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: calc(10px + 2vmin);
|
||||
color: white;
|
||||
}
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.App-link {
|
||||
color: #61dafb;
|
||||
}
|
||||
.App-link {
|
||||
color: var(--accent-primary);
|
||||
}
|
||||
|
||||
@keyframes App-logo-spin {
|
||||
@keyframes App-logo-spin {
|
||||
from {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
to {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.About {
|
||||
.About {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
top: 120px;
|
||||
bottom: 0px;
|
||||
left: 0px;
|
||||
right: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
hr {
|
||||
hr {
|
||||
width: 70%;
|
||||
margin-left: 15% !important;
|
||||
margin-right: 15% !important;
|
||||
border: 10px solid aquamarine;
|
||||
}
|
||||
border: 10px solid var(--hr-color);
|
||||
}
|
||||
|
||||
.publications {
|
||||
margin-top: 230px;
|
||||
}
|
||||
.publications, .Experience, .DevTools, .Contact {
|
||||
margin-top: 100px;
|
||||
padding: 40px 0;
|
||||
}
|
||||
|
||||
.slick-dots button:before {
|
||||
.section-title {
|
||||
margin-bottom: 40px;
|
||||
transform: translateY(0);
|
||||
transition: transform 0.4s ease-out;
|
||||
}
|
||||
|
||||
section:hover .section-title {
|
||||
transform: translateY(-5px);
|
||||
}
|
||||
|
||||
.slick-dots button:before {
|
||||
color: grey !important;
|
||||
}
|
||||
}
|
||||
|
||||
.slick-dots li.slick-active button:before {
|
||||
.slick-dots li.slick-active button:before {
|
||||
color: White !important;
|
||||
}
|
||||
}
|
||||
|
||||
141
src/App.js
141
src/App.js
@@ -1,25 +1,146 @@
|
||||
import logo from "./logo.svg";
|
||||
import React, { useState, useEffect } from "react";
|
||||
import {
|
||||
BrowserRouter as Router,
|
||||
Route,
|
||||
Routes,
|
||||
useLocation,
|
||||
} from "react-router-dom";
|
||||
import { ThemeProvider, useTheme } from './context/ThemeContext';
|
||||
import './css/theme.css';
|
||||
import ThemeToggle from './components/ThemeToggle';
|
||||
import { CSSTransition, TransitionGroup } from "react-transition-group";
|
||||
import "./App.css";
|
||||
import "./css/home.css";
|
||||
import Header from "./components/Header";
|
||||
import About from "./components/About";
|
||||
import Publication from "./components/Publication";
|
||||
import publicationData from "./components/publications.json"
|
||||
import { getByTitle } from "@testing-library/react";
|
||||
import SimpleSlider from "./components/publicationSlider";
|
||||
import Experience from "./components/Experience";
|
||||
import Contact from "./components/contact";
|
||||
import DevToolsComponent from "./components/devtools";
|
||||
import SocialMedia from "./components/SocialMedia";
|
||||
|
||||
function Portfolio() {
|
||||
const { isDarkMode } = useTheme();
|
||||
|
||||
useEffect(() => {
|
||||
const observer = new IntersectionObserver((entries) => {
|
||||
entries.forEach(entry => {
|
||||
if (entry.isIntersecting) {
|
||||
entry.target.classList.add('visible');
|
||||
}
|
||||
});
|
||||
}, { threshold: 0.1 });
|
||||
|
||||
document.querySelectorAll('section').forEach((section) => {
|
||||
observer.observe(section);
|
||||
});
|
||||
|
||||
return () => observer.disconnect();
|
||||
}, []);
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<div className="App">
|
||||
<meta name="Aman Tahiliani's Portfolio"></meta>
|
||||
<ThemeToggle />
|
||||
<nav>
|
||||
<Header />
|
||||
</nav>
|
||||
<hr></hr>
|
||||
<About className ="About" id="About"/>
|
||||
<div className="publications" id="Publications">
|
||||
<h2 style={{color:"salmon", fontSize:"50px"}}><b>Publications</b></h2>
|
||||
<SimpleSlider/>
|
||||
<main>
|
||||
<section>
|
||||
<About className="About" id="About" />
|
||||
</section>
|
||||
<section className="publications" id="Publications">
|
||||
<h2 className="section-title" style={{ color: "salmon", fontSize: "50px" }}>
|
||||
<b>Publications</b>
|
||||
</h2>
|
||||
<SimpleSlider />
|
||||
</section>
|
||||
|
||||
</div>
|
||||
<section className="Experience" id="Experience">
|
||||
<h2 className="section-title" style={{ color: "salmon", fontSize: "50px" }}>
|
||||
<b>Experience</b>
|
||||
</h2>
|
||||
<Experience />
|
||||
</section>
|
||||
<section className="DevTools" id="DevTools">
|
||||
<h2 className="section-title" style={{ color: "salmon", fontSize: "50px" }}>
|
||||
<b>Dev Tools</b>
|
||||
</h2>
|
||||
<DevToolsComponent />
|
||||
</section>
|
||||
<section className="Contact" id="Contact">
|
||||
<h2 className="section-title" style={{ color: "cyan", fontSize: "50px" }}>
|
||||
<b>Social Links</b>
|
||||
</h2>
|
||||
<SocialMedia
|
||||
style={{ color: "white" }}
|
||||
useColorIcons={false}
|
||||
whiteIcons={true}
|
||||
/>
|
||||
</section>
|
||||
</main>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function Books() {
|
||||
return (
|
||||
<div>
|
||||
<h2>Books Page</h2>
|
||||
{/* Add your books content here */}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
function Home() {
|
||||
const { isDarkMode } = useTheme();
|
||||
|
||||
return (
|
||||
<div className="home">
|
||||
<ThemeToggle />
|
||||
<div className="content">
|
||||
<div className="intro">
|
||||
<h1>Welcome to Aman Tahiliani's Space</h1>
|
||||
<p>Software Developer | Tech Enthusiast</p>
|
||||
<nav>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="/portfolio">Developer Portfolio</a>
|
||||
</li>
|
||||
{/* <li>
|
||||
<a href="/reviews">Book, TV and Movie Reviews</a>
|
||||
</li> */}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer">
|
||||
<SocialMedia />
|
||||
</div>
|
||||
{/* <div className="Contact" id="Contact">
|
||||
<h2 style={{color:"salmon", fontSize:"50px", marginTop:"60px"}}><b>Contact Me!</b></h2>
|
||||
<Contact/>
|
||||
</div> */}
|
||||
</div>
|
||||
|
||||
|
||||
);
|
||||
}
|
||||
|
||||
function App() {
|
||||
return (
|
||||
<ThemeProvider>
|
||||
<Router>
|
||||
<div>
|
||||
<Routes>
|
||||
<Route path="/" element={<Home />} />
|
||||
<Route path="/portfolio" element={<Portfolio />} />
|
||||
<Route path="/reviews" element={<Books />} />
|
||||
</Routes>
|
||||
</div>
|
||||
</Router>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
export default App;
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import { render, screen } from '@testing-library/react';
|
||||
import App from './App';
|
||||
import { render, screen } from "@testing-library/react";
|
||||
import App from "./App";
|
||||
|
||||
test('renders learn react link', () => {
|
||||
test("renders learn react link", () => {
|
||||
render(<App />);
|
||||
const linkElement = screen.getByText(/learn react/i);
|
||||
expect(linkElement).toBeInTheDocument();
|
||||
|
||||
@@ -1,11 +1,16 @@
|
||||
import React, { Component } from "react";
|
||||
import "bootstrap/dist/css/bootstrap.css";
|
||||
import { Grid, Row, Col } from "react-bootstrap";
|
||||
import "./about.css";
|
||||
import "../css/about.css";
|
||||
import AmanTahilianiPortfolio from "../media/AmanTahilianiPortfolio.png";
|
||||
import { Button } from "bootstrap";
|
||||
import resume from "../media/AmanTahilianiResumeMay22.pdf"
|
||||
import resume from "../media/Aman_Tahiliani_Resume.pdf";
|
||||
// const img = '../media/AmanTahilianiPortfolio.png'
|
||||
import { library } from "@fortawesome/fontawesome-svg-core";
|
||||
import { faFileDownload } from "@fortawesome/free-solid-svg-icons";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
|
||||
library.add(faFileDownload);
|
||||
|
||||
class About extends Component {
|
||||
render() {
|
||||
@@ -25,21 +30,47 @@ class About extends Component {
|
||||
<Row className="Info">
|
||||
<ul>
|
||||
<li>
|
||||
I am a final Year BTech CSE student at Jaypee Institute of
|
||||
Information Technology in Noida, India.{" "}
|
||||
Currently working at <a href="https://rimidi.com/">Rimidi</a>,
|
||||
a Software as a Service (SaaS) startup, full-time as a
|
||||
Software Engineer with a special emphasis on data
|
||||
interoperabiltiy and building a robust set of tools to enable
|
||||
secure flow of sensitive patient health information across
|
||||
health systems.
|
||||
</li>
|
||||
<li>
|
||||
Graduated from Georgia Tech in 2024 with a Master's Of Science
|
||||
degree in Computer Science (MSCS), with emphasis on Computing
|
||||
Systems and Machine Learning. (#GoJackets{" \uD83D\uDC1D"})
|
||||
</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>{" "}
|
||||
<li>
|
||||
I enjoy designing and creating the backend logic for projects
|
||||
and am also proficient in frontend development.{" "}
|
||||
Interned as an SDE (Backend) at{" "}
|
||||
<a href="https://innovaccer.com/">Innovaccer</a> twice as part
|
||||
of the Data Activation Platform and Licence
|
||||
Management/Platform Configuration Teams.{" "}
|
||||
</li>{" "}
|
||||
</ul>{" "}
|
||||
</Row>{" "}
|
||||
<button style={{borderRadius:"0.8em", width:"auto",height:"40px", fontSize:"larger", backgroundColor:"rgb(5, 255, 180)"}}><a href={resume} style= {{color: "black", textDecoration: "none"}} download="AmanTahilianiResume.pdf">My Resume</a></button>
|
||||
<button
|
||||
style={{
|
||||
borderRadius: "0.8em",
|
||||
width: "auto",
|
||||
height: "40px",
|
||||
fontSize: "larger",
|
||||
backgroundColor: "rgb(5, 255, 180)",
|
||||
}}
|
||||
onClick={() => {
|
||||
const link = document.createElement("a");
|
||||
link.href = resume;
|
||||
link.download = "Aman_Tahiliani_Resume.pdf";
|
||||
link.click();
|
||||
window.open(resume, "_blank");
|
||||
}}
|
||||
>
|
||||
<FontAwesomeIcon icon="file-download" style={{color: "black", marginRight: "4px"}} />{" "}
|
||||
<span style={{ color: "black", textDecoration: "none" }}>
|
||||
Resume
|
||||
</span>
|
||||
</button>
|
||||
</Col>{" "}
|
||||
</Row>{" "}
|
||||
</div>
|
||||
|
||||
40
src/components/Experience.js
Normal file
40
src/components/Experience.js
Normal file
@@ -0,0 +1,40 @@
|
||||
import React, { Component } from "react";
|
||||
import "bootstrap/dist/css/bootstrap.css";
|
||||
// import { Row, Col} from "react-bootstrap";
|
||||
import "../css/experience.css";
|
||||
import ExperienceCard from "./experienceCard";
|
||||
import experienceData from "../data/experience.json";
|
||||
import InnovaccerLogo from "../media/logos/companies/innovaccerLogo.png";
|
||||
import Medsupervision from "../media/logos/companies/logo.png";
|
||||
import GeorgiaTech from "../media/logos/companies/GeorgiaTech.png";
|
||||
import Rimidi from "../media/logos/companies/rimidi.png";
|
||||
|
||||
const logos = {
|
||||
Innovaccer: InnovaccerLogo,
|
||||
Medsupervision: Medsupervision,
|
||||
"Georgia Tech": GeorgiaTech,
|
||||
Rimidi: Rimidi,
|
||||
};
|
||||
|
||||
class Experience extends Component {
|
||||
render() {
|
||||
return (
|
||||
<div className="ExperienceComponent">
|
||||
{experienceData.map(({ company, title, points, term }) => (
|
||||
<div>
|
||||
<ExperienceCard
|
||||
company={company}
|
||||
title={title}
|
||||
points={points}
|
||||
photo={logos[company]}
|
||||
term={term}
|
||||
/>
|
||||
<hr />
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Experience;
|
||||
@@ -1,7 +1,7 @@
|
||||
import React, { Component } from "react";
|
||||
import "bootstrap/dist/css/bootstrap.css";
|
||||
import { Row, Col } from "react-bootstrap";
|
||||
import "./header.css";
|
||||
import "../css/header.css";
|
||||
|
||||
class Header extends Component {
|
||||
render() {
|
||||
@@ -19,7 +19,7 @@ class Header extends Component {
|
||||
<a href="#About">About</a>
|
||||
</Col>
|
||||
<Col>
|
||||
<a href="#Publications">Publications</a>
|
||||
<a href="#Experience">Experience</a>
|
||||
</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
@@ -28,14 +28,19 @@ class Header extends Component {
|
||||
</Col>
|
||||
<Col xs={12} md={5}>
|
||||
<Row className="navRow nonNameCol">
|
||||
|
||||
<Col>
|
||||
<a>Experience</a>
|
||||
<a href="#DevTools">Devtools</a>
|
||||
</Col>
|
||||
<Col>
|
||||
<a>Devtools</a>
|
||||
<a href="#Publications">Publications</a>
|
||||
</Col>
|
||||
<Col>
|
||||
<a>Contact Me!</a>
|
||||
<a
|
||||
href="#Contact"
|
||||
>
|
||||
Social Links
|
||||
</a>
|
||||
</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
import React, { Component } from "react";
|
||||
import "bootstrap/dist/css/bootstrap.css";
|
||||
import { Row, Col, TabContainer } from "react-bootstrap";
|
||||
import "./publication.css";
|
||||
import "../css/publication.css";
|
||||
|
||||
class Publication extends Component {
|
||||
render() {
|
||||
@@ -14,12 +14,12 @@ class Publication extends Component {
|
||||
<Row>
|
||||
<div>Publish Date: {this.props.publish_date}</div>
|
||||
</Row>
|
||||
<div>Link: <a href={this.props.link}>{this.props.link}</a></div>
|
||||
<br/>
|
||||
<div style={{fontWeight:"bolder"}}>Abstract:</div>
|
||||
<div>
|
||||
Link: <a href={this.props.link}>{this.props.link}</a>
|
||||
</div>
|
||||
<br />
|
||||
<div style={{ fontWeight: "bolder" }}>Abstract:</div>
|
||||
<div>{this.props.abstract}</div>
|
||||
|
||||
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
52
src/components/SocialMedia.js
Normal file
52
src/components/SocialMedia.js
Normal file
@@ -0,0 +1,52 @@
|
||||
import React from 'react';
|
||||
import PropTypes from 'prop-types';
|
||||
import '../css/socialmedia.css';
|
||||
|
||||
const socialIcons = {
|
||||
instagram: {
|
||||
flat: 'https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/instagram.svg',
|
||||
color: 'https://upload.wikimedia.org/wikipedia/commons/a/a5/Instagram_icon.png',
|
||||
link: 'https://instagram.com/amantahiliani'
|
||||
},
|
||||
linkedin: {
|
||||
flat: 'https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/linkedin.svg',
|
||||
color: 'https://upload.wikimedia.org/wikipedia/commons/c/ca/LinkedIn_logo_initials.png',
|
||||
link: 'https://www.linkedin.com/in/amantahiliani/'
|
||||
},
|
||||
github: {
|
||||
flat: 'https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/github.svg',
|
||||
color: 'https://upload.wikimedia.org/wikipedia/commons/9/91/Octicons-mark-github.svg',
|
||||
link: 'https://github.com/AmanTahiliani'
|
||||
},
|
||||
goodreads: {
|
||||
flat: 'https://cdn.jsdelivr.net/npm/simple-icons@v5/icons/goodreads.svg',
|
||||
color: 'https://upload.wikimedia.org/wikipedia/commons/4/4e/Goodreads_%27g%27_logo.svg',
|
||||
link: 'https://www.goodreads.com/amantahiliani'
|
||||
}
|
||||
};
|
||||
|
||||
function SocialMedia({ useColorIcons = false, whiteIcons = false }) {
|
||||
const iconType = useColorIcons ? 'color' : 'flat';
|
||||
const iconClass = whiteIcons ? 'social-icon white' : 'social-icon';
|
||||
|
||||
return (
|
||||
<div className="social-media">
|
||||
{/* <h2>Contact Me!</h2> */}
|
||||
<ul>
|
||||
{Object.entries(socialIcons).map(([platform, obj]) => (
|
||||
<li key={platform}>
|
||||
<a href={obj['link']} target="_blank" rel="noopener noreferrer">
|
||||
<img src={obj[iconType]} alt={platform} className={iconClass} />
|
||||
</a>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
SocialMedia.propTypes = {
|
||||
useColorIcons: PropTypes.bool,
|
||||
whiteIcons: PropTypes.bool
|
||||
};
|
||||
|
||||
export default SocialMedia;
|
||||
19
src/components/ThemeToggle.js
Normal file
19
src/components/ThemeToggle.js
Normal file
@@ -0,0 +1,19 @@
|
||||
import React from 'react';
|
||||
import { useTheme } from '../context/ThemeContext';
|
||||
import '../css/ThemeToggle.css';
|
||||
|
||||
const ThemeToggle = () => {
|
||||
const { isDarkMode, toggleTheme } = useTheme();
|
||||
|
||||
return (
|
||||
<button
|
||||
className="theme-toggle"
|
||||
onClick={toggleTheme}
|
||||
aria-label="Toggle theme"
|
||||
>
|
||||
{isDarkMode ? '☀️' : '🌙'}
|
||||
</button>
|
||||
);
|
||||
};
|
||||
|
||||
export default ThemeToggle;
|
||||
@@ -1,54 +0,0 @@
|
||||
.AboutComponent {
|
||||
opacity: 5;
|
||||
width: 100%;
|
||||
margin-top: 80px;
|
||||
padding-top: 5.5%;
|
||||
padding-bottom: 4%;
|
||||
}
|
||||
|
||||
h1 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.NameImage {
|
||||
height: 350px;
|
||||
width: 350px;
|
||||
border-radius: 5.7em;
|
||||
border: 2px solid black;
|
||||
}
|
||||
|
||||
.InfoColumn h2 {
|
||||
color: rgb(5, 255, 180);
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.InfoColumn h3 {
|
||||
margin-bottom: 30px;
|
||||
color: salmon;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
li {
|
||||
text-align: justify;
|
||||
padding-left: 5%;
|
||||
}
|
||||
|
||||
.InfoColumn {
|
||||
padding-right: 5%;
|
||||
}
|
||||
|
||||
li>a {
|
||||
color: hotpink;
|
||||
}
|
||||
|
||||
.Info {
|
||||
font-size: larger;
|
||||
}
|
||||
|
||||
.Info li {
|
||||
margin-top: 10px;
|
||||
list-style-type: square;
|
||||
}
|
||||
54
src/components/contact.js
Normal file
54
src/components/contact.js
Normal file
@@ -0,0 +1,54 @@
|
||||
import React from "react";
|
||||
import "bootstrap/dist/css/bootstrap.css";
|
||||
import { FaGithub, FaLinkedin, FaInstagram, FaEnvelope } from "react-icons/fa";
|
||||
import "../css/contact.css";
|
||||
|
||||
function Contact() {
|
||||
return (
|
||||
<div className="social-links">
|
||||
<a
|
||||
href="https://github.com/yourusername"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="social-link"
|
||||
aria-label="GitHub Profile"
|
||||
>
|
||||
<FaGithub className="social-icon" />
|
||||
<span className="social-text">GitHub</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://linkedin.com/in/yourusername"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="social-link"
|
||||
aria-label="LinkedIn Profile"
|
||||
>
|
||||
<FaLinkedin className="social-icon" />
|
||||
<span className="social-text">LinkedIn</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="https://instagram.com/yourusername"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="social-link"
|
||||
aria-label="Instagram Profile"
|
||||
>
|
||||
<FaInstagram className="social-icon" />
|
||||
<span className="social-text">Instagram</span>
|
||||
</a>
|
||||
|
||||
<a
|
||||
href="mailto:your.email@example.com"
|
||||
className="social-link"
|
||||
aria-label="Email Contact"
|
||||
>
|
||||
<FaEnvelope className="social-icon" />
|
||||
<span className="social-text">Email</span>
|
||||
</a>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
export default Contact;
|
||||
28
src/components/devtools.js
Normal file
28
src/components/devtools.js
Normal file
@@ -0,0 +1,28 @@
|
||||
import React, { Component } from "react";
|
||||
import "../css/devtools.css";
|
||||
import Languages from "../data/programmingLaguages.json";
|
||||
|
||||
const logos = {
|
||||
Python: "https://upload.wikimedia.org/wikipedia/commons/c/c3/Python-logo-notext.svg",
|
||||
Java: "https://upload.wikimedia.org/wikipedia/en/3/30/Java_programming_language_logo.svg",
|
||||
"C++": "https://upload.wikimedia.org/wikipedia/commons/1/18/ISO_C%2B%2B_Logo.svg",
|
||||
JavaScript: "https://upload.wikimedia.org/wikipedia/commons/6/6a/JavaScript-logo.png",
|
||||
};
|
||||
|
||||
class DevToolsComponent extends Component {
|
||||
render() {
|
||||
return (
|
||||
<div>
|
||||
<div className="dev-tools-container">
|
||||
{Languages.map(({ name }) => (
|
||||
<div className="dev-tool" key={name}>
|
||||
<img src={logos[name]} alt={name} className="dev-tool-logo" />
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default DevToolsComponent;
|
||||
54
src/components/experienceCard.js
Normal file
54
src/components/experienceCard.js
Normal file
@@ -0,0 +1,54 @@
|
||||
import React, { Component } from "react";
|
||||
import "bootstrap/dist/css/bootstrap.css";
|
||||
import { Row, Col, TabContainer } from "react-bootstrap";
|
||||
import "../css/experience.css";
|
||||
|
||||
class ExperienceCard extends Component {
|
||||
render() {
|
||||
return (
|
||||
<div
|
||||
className="experience-detail"
|
||||
style={{ marginTop: "30px", marginBottom: "30px" }}
|
||||
>
|
||||
<Row>
|
||||
<Col xs={12} md={5} className="Company1">
|
||||
<img src={this.props.photo} className="Company-Image" />
|
||||
{/* <h3 className="Company">{this.props.company}</h3> */}
|
||||
<h4>({this.props.term})</h4>
|
||||
</Col>
|
||||
<Col xs={12} md={7}>
|
||||
<div className="experience-details">
|
||||
<h3 className="JobTitle">{this.props.title}</h3>
|
||||
<hr />
|
||||
<div>
|
||||
<ul>
|
||||
{this.props.points.map((item, i) => (
|
||||
<li>{item}</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</Col>
|
||||
</Row>
|
||||
</div>
|
||||
|
||||
// <div className="experience-detail">
|
||||
// <h3>{this.props.title}</h3>
|
||||
// <Row>
|
||||
// <Col>Authors: {this.props.authors}</Col>
|
||||
// </Row>
|
||||
// <Row>
|
||||
// <div>Publish Date: {this.props.publish_date}</div>
|
||||
// </Row>
|
||||
// <div>
|
||||
// Link: <a href={this.props.link}>{this.props.link}</a>
|
||||
// </div>
|
||||
// <br />
|
||||
// <div style={{ fontWeight: "bolder" }}>Abstract:</div>
|
||||
// <div>{this.props.abstract}</div>
|
||||
// </div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default ExperienceCard;
|
||||
@@ -1,45 +0,0 @@
|
||||
.menu-header {
|
||||
padding-left: 50px;
|
||||
padding-right: 50px;
|
||||
height: "50px";
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.navRow {
|
||||
height: 100%;
|
||||
margin-top: 40px;
|
||||
line-height: 100%;
|
||||
}
|
||||
|
||||
.NameCol {
|
||||
font-size: xx-large;
|
||||
font-weight: bold;
|
||||
color: salmon;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.nonNameCol {
|
||||
font-size: larger;
|
||||
padding-top: 1%;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.header a:link {
|
||||
text-decoration: none;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.header a:visited {
|
||||
text-decoration: none;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.header a:hover {
|
||||
text-decoration: none;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.header a:active {
|
||||
text-decoration: none;
|
||||
color: aquamarine;
|
||||
}
|
||||
@@ -1,41 +0,0 @@
|
||||
table,
|
||||
th,
|
||||
td {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
th,
|
||||
td {
|
||||
padding: 15px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
tr {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
tr:hover {
|
||||
background-color: salmon;
|
||||
}
|
||||
|
||||
.publication-detail {
|
||||
padding: 30px;
|
||||
margin: 40px;
|
||||
border: 1px solid white;
|
||||
border-radius: 2em;
|
||||
white-space: normal;
|
||||
overflow: auto;
|
||||
text-overflow: ellipsis;
|
||||
text-align: justify;
|
||||
padding-left: 5%;
|
||||
padding-right: 5%;
|
||||
}
|
||||
|
||||
.publication-detail h3 {
|
||||
font-size: xx-large;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.publication-detail a {
|
||||
color: aquamarine
|
||||
}
|
||||
@@ -1,10 +1,10 @@
|
||||
import React, { Component } from "react";
|
||||
import Slider from "react-slick";
|
||||
import publicationData from "./publications.json"
|
||||
import publicationData from "../data/publications.json";
|
||||
import Publication from "./Publication";
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
import {FaArrowAltCircleRight,FaArrowAltCircleLeft} from "react-icons/fa"
|
||||
import { FaArrowAltCircleRight, FaArrowAltCircleLeft } from "react-icons/fa";
|
||||
export default class SimpleSlider extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
@@ -26,16 +26,43 @@ export default class SimpleSlider extends Component {
|
||||
slidesToScroll: 1,
|
||||
};
|
||||
return (
|
||||
<div style={{height:"auto"}}>
|
||||
<Slider ref={c => (this.slider = c)} {...settings}>
|
||||
{publicationData.map(({title,authors, publish_date, abstract,link}) =>(
|
||||
<Publication title={title} authors={authors} publish_date={publish_date} abstract={abstract} link={link}/>
|
||||
))}
|
||||
<div style={{ height: "auto" }}>
|
||||
<Slider ref={(c) => (this.slider = c)} {...settings}>
|
||||
{publicationData.map(
|
||||
({ title, authors, publish_date, abstract, link }) => (
|
||||
<Publication
|
||||
title={title}
|
||||
authors={authors}
|
||||
publish_date={publish_date}
|
||||
abstract={abstract}
|
||||
link={link}
|
||||
/>
|
||||
),
|
||||
)}
|
||||
</Slider>
|
||||
<div style={{ textAlign: "center"}}>
|
||||
<FaArrowAltCircleLeft onClick={this.previous} style={{marginTop:"40px",marginBottom:"40px",borderRadius:"3em" ,fontSize:"40px", color:"aquamarine"}}/>
|
||||
<div style={{ textAlign: "center" }}>
|
||||
<FaArrowAltCircleLeft
|
||||
onClick={this.previous}
|
||||
style={{
|
||||
marginTop: "40px",
|
||||
marginBottom: "40px",
|
||||
borderRadius: "3em",
|
||||
fontSize: "40px",
|
||||
color: "aquamarine",
|
||||
}}
|
||||
/>
|
||||
|
||||
<FaArrowAltCircleRight onClick={this.next} style={{marginTop:"40px", marginBottom:"40px", borderRadius:"3em",fontSize:"40px",marginLeft:"30px", color:"salmon"}}/>
|
||||
<FaArrowAltCircleRight
|
||||
onClick={this.next}
|
||||
style={{
|
||||
marginTop: "40px",
|
||||
marginBottom: "40px",
|
||||
borderRadius: "3em",
|
||||
fontSize: "40px",
|
||||
marginLeft: "30px",
|
||||
color: "salmon",
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -1,22 +0,0 @@
|
||||
[{
|
||||
"title": "Framework for determining the suitability of blockchain: Criteria and issues to consider",
|
||||
"authors": "Vikas Hassija, Sherali Zeadally, Ishan Jain, Aman Tahiliani, Vinay Chamola, Shashank Gupta",
|
||||
"publish_date": "29 July 2021",
|
||||
"abstract": "Various distributed ledger technologies (DLTs), such as blockchain, have evolved significantly in recent years. These technologies provide a robust and effective solution for providing confidentiality, integrity, nonrepudiation, authentication, and transparency. While blockchain has many advantages, it has various limitations as well, such as complexity, low throughput, privacy, and so on. We discuss the issues that must be considered when deciding whether to use these technologies in a given case or not. We describe the operation of blockchain, application areas where blockchain is suitable, and those where it is not. We also discuss the applicability of other emerging DLTs, apart from blockchain technology, such as Hashgraph, Zcash, Nano coin, and IOTA.",
|
||||
"link": "https://onlinelibrary.wiley.com/doi/abs/10.1002/ett.4334"
|
||||
},
|
||||
{
|
||||
"title": "Privacy-Preserving and Incentivized Contact Tracing for COVID-19 Using Blockchain",
|
||||
"authors": "Naren, Aman Tahiliani, Vikas Hassija, Vinay Chamola, Salil S. Kanhere, Mohsen Guizani",
|
||||
"publish_date": "27 September 2021",
|
||||
"abstract": "Many countries across the world have not been entirely successful in their attempts to contain the spread of the COVID-19 virus, which has caused, quite possibly, one of the greatest disasters of the 21st century. A rich variety of contact tracing applications, each offering its own unique set of features, are currently being used to track the spread of the virus from person to person, and isolate/quarantine suspected individuals. However, existing approaches have not been very successful since they lack incentives to motivate users to use them actively. Although each solution provides some form of privacy protection and data security, loopholes do exist, and there is scope for improvement. In this context, we explore the use of blockchain to help in advancing contact tracing applications. In this article, we describe how blockchain could offer enhanced data security and functionality without compromising users' privacy. The effectiveness of contact tracing applications improves with the user base. In this regard, we explore how blockchain-based smart contracts can be used to offer incentives to users at various stages of the contact tracing process. Next, we lay down a plan for future contact tracing frameworks that provide the advantages of blockchain and user incentives, and all the best features available in current solutions.",
|
||||
"link": "https://ieeexplore.ieee.org/abstract/document/9548968"
|
||||
},
|
||||
{
|
||||
"title": "Machine Unlearning: Its Need and Implementation Strategies",
|
||||
"authors": "Aman Tahiliani, Vikas Hassija, Vinay Chamola, Mohsen Guizani",
|
||||
"publish_date": "05 August 2021",
|
||||
"abstract": " Generally when users share information about themselves on some online platforms, they knowingly or unknowingly allow this data to be used by the companies behind these companies for various purposes including selling this information to advertisers as well as using it to better enrich their predictive models. In the event of the user changing their minds on allowing such data about them to be able to be used by the companies, it becomes a strenuous task for the companies to get rid of the influence of this collected data, especially when it has been used to train their machine learning models. Recent legislations by governing bodies, like the European Union, grant people the right to choose where data about them may be used, including a right to have their data and its resulting influence be completely removed from a company’s databases and machine learning models. To be able to do this at scale new machine unlearning solutions need to be invented. In this paper, we look at some of these early models of machine unlearning strategies that have been proposed.",
|
||||
"link": "https://dl.acm.org/doi/abs/10.1145/3474124.3474158"
|
||||
}
|
||||
]
|
||||
26
src/context/ThemeContext.js
Normal file
26
src/context/ThemeContext.js
Normal file
@@ -0,0 +1,26 @@
|
||||
import React, { createContext, useState, useContext } from 'react';
|
||||
|
||||
const ThemeContext = createContext();
|
||||
|
||||
export const ThemeProvider = ({ children }) => {
|
||||
const [isDarkMode, setIsDarkMode] = useState(true);
|
||||
|
||||
const toggleTheme = () => {
|
||||
setIsDarkMode(!isDarkMode);
|
||||
document.documentElement.setAttribute('data-theme', !isDarkMode ? 'dark' : 'light');
|
||||
};
|
||||
|
||||
return (
|
||||
<ThemeContext.Provider value={{ isDarkMode, toggleTheme }}>
|
||||
{children}
|
||||
</ThemeContext.Provider>
|
||||
);
|
||||
};
|
||||
|
||||
export const useTheme = () => {
|
||||
const context = useContext(ThemeContext);
|
||||
if (context === undefined) {
|
||||
throw new Error('useTheme must be used within a ThemeProvider');
|
||||
}
|
||||
return context;
|
||||
};
|
||||
30
src/css/ThemeToggle.css
Normal file
30
src/css/ThemeToggle.css
Normal file
@@ -0,0 +1,30 @@
|
||||
.theme-toggle {
|
||||
position: fixed;
|
||||
top: 20px;
|
||||
right: 20px;
|
||||
z-index: 1000;
|
||||
background: none;
|
||||
border: 2px solid var(--accent-primary);
|
||||
color: var(--text-primary);
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
font-size: 20px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: all 0.3s ease;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.theme-toggle:hover {
|
||||
transform: scale(1.1);
|
||||
background-color: var(--accent-primary);
|
||||
color: var(--background-primary);
|
||||
}
|
||||
|
||||
.theme-toggle:focus {
|
||||
outline: none;
|
||||
box-shadow: 0 0 0 2px var(--accent-secondary);
|
||||
}
|
||||
54
src/css/about.css
Normal file
54
src/css/about.css
Normal file
@@ -0,0 +1,54 @@
|
||||
.AboutComponent {
|
||||
opacity: 5;
|
||||
width: 100%;
|
||||
margin-top: 80px;
|
||||
padding-top: 5.5%;
|
||||
padding-bottom: 4%;
|
||||
}
|
||||
|
||||
h1 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.NameImage {
|
||||
height: 350px;
|
||||
width: 350px;
|
||||
border-radius: 5.7em;
|
||||
border: 2px solid black;
|
||||
}
|
||||
|
||||
.InfoColumn h2 {
|
||||
color: rgb(5, 255, 180);
|
||||
font-size: 40px;
|
||||
}
|
||||
|
||||
.InfoColumn h3 {
|
||||
margin-bottom: 30px;
|
||||
color: salmon;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-position: inside;
|
||||
}
|
||||
|
||||
li {
|
||||
text-align: justify;
|
||||
padding-left: 5%;
|
||||
}
|
||||
|
||||
.InfoColumn {
|
||||
padding-right: 5%;
|
||||
}
|
||||
|
||||
li > a {
|
||||
color: hotpink;
|
||||
}
|
||||
|
||||
.Info {
|
||||
font-size: larger;
|
||||
}
|
||||
|
||||
.Info li {
|
||||
margin-top: 10px;
|
||||
list-style-type: square;
|
||||
}
|
||||
42
src/css/contact.css
Normal file
42
src/css/contact.css
Normal file
@@ -0,0 +1,42 @@
|
||||
input,
|
||||
textarea {
|
||||
background-color: black;
|
||||
width: 35%;
|
||||
height: 40px;
|
||||
margin-top: 25px;
|
||||
margin-bottom: 5px;
|
||||
color: white;
|
||||
/* padding-top: 5.5%;
|
||||
padding-bottom: 4%; */
|
||||
padding: auto;
|
||||
padding-left: 15px;
|
||||
border: none;
|
||||
border-bottom: 2px solid aquamarine;
|
||||
font-size: larger;
|
||||
}
|
||||
input[type="text"]:focus {
|
||||
border: none;
|
||||
border-bottom: 3px solid salmon;
|
||||
outline: none;
|
||||
}
|
||||
.MessageBox {
|
||||
height: auto;
|
||||
display: inline-block;
|
||||
/* text-overflow: ellipsis; */
|
||||
}
|
||||
.MessageBox[type="textarea"]:focus {
|
||||
border: 3px solid salmon;
|
||||
outline: none;
|
||||
}
|
||||
button {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 30px;
|
||||
border: 2px solid rgb(122, 224, 143);
|
||||
color: darkblue;
|
||||
border-radius: 0.8em;
|
||||
width: auto;
|
||||
height: 40px;
|
||||
font-size: larger;
|
||||
font-weight: 600;
|
||||
background-color: rgb(5, 255, 180);
|
||||
}
|
||||
50
src/css/devtools.css
Normal file
50
src/css/devtools.css
Normal file
@@ -0,0 +1,50 @@
|
||||
.dev-tools-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.dev-tool {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
padding-left: 3%;
|
||||
padding-right: 3%;
|
||||
}
|
||||
|
||||
.dev-tool-logo {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
object-fit: contain;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.dev-tool-logo:hover {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
@keyframes toolAnimation {
|
||||
from {
|
||||
opacity: 0;
|
||||
transform: translateY(20px);
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 768px) {
|
||||
.dev-tool {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (max-width: 480px) {
|
||||
.dev-tool {
|
||||
width: 120px;
|
||||
}
|
||||
}
|
||||
52
src/css/experience.css
Normal file
52
src/css/experience.css
Normal file
@@ -0,0 +1,52 @@
|
||||
.ExperienceComponent {
|
||||
opacity: 5;
|
||||
margin-top: 60px;
|
||||
padding-top: 20px;
|
||||
padding-bottom: 3%;
|
||||
margin-left: 4%;
|
||||
margin-right: 4%;
|
||||
}
|
||||
|
||||
.Company-Image {
|
||||
width: 65%;
|
||||
border: 3px solid #b5ead7;
|
||||
border-radius: 10px;
|
||||
margin-bottom: 10%;
|
||||
margin-top: 10%;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.Company {
|
||||
font-size: 50px;
|
||||
font-weight: bold;
|
||||
font-style: normal;
|
||||
color: lightyellow;
|
||||
margin-bottom: 5%;
|
||||
margin-top: 10%;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style-position: outside;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.Company1 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.experience-details {
|
||||
padding-left: 3%;
|
||||
padding-top: 2%;
|
||||
padding-right: 3%;
|
||||
width: 90%;
|
||||
border: 2px solid white;
|
||||
border-radius: 15px;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.JobTitle {
|
||||
color: #baffc9;
|
||||
font-weight: bold;
|
||||
font-size: 30px;
|
||||
}
|
||||
45
src/css/header.css
Normal file
45
src/css/header.css
Normal file
@@ -0,0 +1,45 @@
|
||||
.menu-header {
|
||||
padding-left: 50px;
|
||||
padding-right: 50px;
|
||||
height: "50px";
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.navRow {
|
||||
height: 100%;
|
||||
margin-top: 40px;
|
||||
line-height: 100%;
|
||||
}
|
||||
|
||||
.NameCol {
|
||||
font-size: xx-large;
|
||||
font-weight: bold;
|
||||
color: salmon;
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.nonNameCol {
|
||||
font-size: larger;
|
||||
padding-top: 1%;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.header a:link {
|
||||
text-decoration: none;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.header a:visited {
|
||||
text-decoration: none;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.header a:hover {
|
||||
text-decoration: none;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.header a:active {
|
||||
text-decoration: none;
|
||||
color: aquamarine;
|
||||
}
|
||||
102
src/css/home.css
Normal file
102
src/css/home.css
Normal file
@@ -0,0 +1,102 @@
|
||||
.home {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
min-height: 100vh;
|
||||
background-color: var(--background-primary);
|
||||
}
|
||||
|
||||
.content {
|
||||
flex-grow: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.intro {
|
||||
text-align: center;
|
||||
animation: fadeIn 1s ease-in-out;
|
||||
}
|
||||
|
||||
|
||||
.intro h1 {
|
||||
font-size: 3em;
|
||||
color: var(--text-primary);
|
||||
animation: slideIn 1s ease-in-out;
|
||||
}
|
||||
|
||||
.intro p {
|
||||
font-size: 1.5em;
|
||||
color: var(--text-secondary);
|
||||
animation: slideIn 1s ease-in-out;
|
||||
}
|
||||
|
||||
.intro nav ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.intro nav ul li {
|
||||
display: inline;
|
||||
margin: 0 15px;
|
||||
animation: fadeIn 1s ease-in-out;
|
||||
}
|
||||
|
||||
.intro nav ul li a {
|
||||
text-decoration: none;
|
||||
color: var(--link-color);
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
.intro nav ul li a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Transition animations */
|
||||
.fade-enter {
|
||||
opacity: 0;
|
||||
transform: scale(0.9);
|
||||
}
|
||||
|
||||
.fade-enter-active {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
transition: opacity 300ms, transform 300ms;
|
||||
}
|
||||
|
||||
.fade-exit {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
|
||||
.fade-exit-active {
|
||||
opacity: 0;
|
||||
transform: scale(0.9);
|
||||
transition: opacity 300ms, transform 300ms;
|
||||
}
|
||||
|
||||
/* Keyframes for animations */
|
||||
@keyframes fadeIn {
|
||||
from {
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slideIn {
|
||||
from {
|
||||
transform: translateY(-20px);
|
||||
}
|
||||
to {
|
||||
transform: translateY(0);
|
||||
}
|
||||
}
|
||||
.footer {
|
||||
width: 100%;
|
||||
padding: 20px 0;
|
||||
background-color: var(--background-primary);
|
||||
text-align: center;
|
||||
}
|
||||
41
src/css/publication.css
Normal file
41
src/css/publication.css
Normal file
@@ -0,0 +1,41 @@
|
||||
table,
|
||||
th,
|
||||
td {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
th,
|
||||
td {
|
||||
padding: 15px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
tr {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
tr:hover {
|
||||
background-color: salmon;
|
||||
}
|
||||
|
||||
.publication-detail {
|
||||
padding: 30px;
|
||||
margin: 40px;
|
||||
border: 1px solid white;
|
||||
border-radius: 2em;
|
||||
white-space: normal;
|
||||
overflow: auto;
|
||||
text-overflow: ellipsis;
|
||||
text-align: justify;
|
||||
padding-left: 5%;
|
||||
padding-right: 5%;
|
||||
}
|
||||
|
||||
.publication-detail h3 {
|
||||
font-size: xx-large;
|
||||
color: aquamarine;
|
||||
}
|
||||
|
||||
.publication-detail a {
|
||||
color: aquamarine;
|
||||
}
|
||||
47
src/css/socialmedia.css
Normal file
47
src/css/socialmedia.css
Normal file
@@ -0,0 +1,47 @@
|
||||
.social-media {
|
||||
margin-top: 50px;
|
||||
margin-bottom: 100px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.social-media h2 {
|
||||
font-size: 1.5em;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.social-media ul {
|
||||
list-style-type: none;
|
||||
padding: 0;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.social-media ul li {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 10px;
|
||||
padding-left: 3%;
|
||||
padding-right: 3%;
|
||||
}
|
||||
|
||||
.social-media ul li a {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.social-icon {
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
transition: fill 0.3s ease;
|
||||
}
|
||||
|
||||
.social-icon.white {
|
||||
filter: invert(1);
|
||||
}
|
||||
|
||||
.social-media ul li a:hover .social-icon {
|
||||
fill: salmon;
|
||||
}
|
||||
30
src/css/theme.css
Normal file
30
src/css/theme.css
Normal file
@@ -0,0 +1,30 @@
|
||||
:root[data-theme='light'] {
|
||||
--background-primary: #f0f0f0;
|
||||
--background-secondary: #ffffff;
|
||||
--text-primary: #333333;
|
||||
--text-secondary: #666666;
|
||||
--accent-primary: #3498db;
|
||||
--accent-secondary: #2980b9;
|
||||
--border-color: #dddddd;
|
||||
--section-title: #e74c3c;
|
||||
--link-color: #3498db;
|
||||
--hr-color: #2ecc71;
|
||||
}
|
||||
|
||||
:root[data-theme='dark'] {
|
||||
--background-primary: #000000;
|
||||
--background-secondary: #1a1a1a;
|
||||
--text-primary: #ffffff;
|
||||
--text-secondary: #cccccc;
|
||||
--accent-primary: #61dafb;
|
||||
--accent-secondary: #4fa3d1;
|
||||
--border-color: #333333;
|
||||
--section-title: #ff6b6b;
|
||||
--link-color: #61dafb;
|
||||
--hr-color: #00ffbf;
|
||||
}
|
||||
|
||||
/* Theme transition */
|
||||
* {
|
||||
transition: background-color 0.3s ease, color 0.3s ease;
|
||||
}
|
||||
62
src/data/experience.json
Normal file
62
src/data/experience.json
Normal file
@@ -0,0 +1,62 @@
|
||||
[
|
||||
{
|
||||
"company": "Rimidi",
|
||||
"title": "Software Engineer",
|
||||
"points": [
|
||||
"Building Interoperable Health data parsers in order to be able to ingest health information from any US Electronic Health Record systems and write information back to them.",
|
||||
"Focused on upgrades to the existing Rimidi Infrastructure to aid with efforts towards containerization and integration of cloud-first architecture.",
|
||||
"Owner of the Rimidify (Data interpretation) and EhrMes (Data Writeback) micro-services and domain expert on FHIR and HL7 specs."
|
||||
],
|
||||
"term": "June 2024 - Present"
|
||||
},
|
||||
{
|
||||
"company": "Georgia Tech",
|
||||
"title": "Graduate Teaching Assistant (CS 6440)",
|
||||
"points": [
|
||||
"Working under the guidance of Dr. Jon Duke as a teaching assistant for his course CS-6440 Introduction to Health Informatics in Spring 2023 to mentor students about Healthcare IT, including technologies such as HL7 FHIR. Interoperability, Clinical Decision Support (CDS) and the use of LLMs in healthcare.",
|
||||
"Helped students gain hands on experience with new healthcare technologies such as Hapi FHIR (R4), Mirth Connect, creation of SMART on FHIR applications and more using Python, Java, Docker and Heroku. ",
|
||||
"Responsibilities include grading of student assignments and examinations for the first half of the semester and mentoring students for their course projects by guiding them on the scope and viability of their project."
|
||||
],
|
||||
"term": "Jan 2023 - Present"
|
||||
},
|
||||
{
|
||||
"company": "Rimidi",
|
||||
"title": "Software Engineering Intern",
|
||||
"points": [
|
||||
"Spearheaded the creation of a universal data-standardization microservice capable of processing patient health information, including smart-device and lab data from 7 EHRs (including Epic and Cerner) regardless of FHIR API variations (DSTU, STU3, and R4), facilitating a 30% improvement in patient data refresh times compared to the monolith.",
|
||||
"Slashed 3+ hours of integration effort per week through enabling push-pull based tenant mapping sync functionality.",
|
||||
"Championed code cleanliness and maintainability, achieving robust 94% test coverage and logging, guaranteeing efficiency and scalability for future growth"
|
||||
],
|
||||
"term": "May 2023 - Dec 2023"
|
||||
},
|
||||
{
|
||||
"company": "Innovaccer",
|
||||
"title": "Software Development Engineer Intern (Data Platform)",
|
||||
"points": [
|
||||
"Worked as part of the Data Activation Platform team to create and maintain FHIR enabling microservices responsible for parsing and standardizing healthcare data from different sources spanning different data formats such as HL7, CCLF, CCDA etc.",
|
||||
"Developed the Aggregator Metrics microservice to collect metadata of time taken by DAP microservices to process data for each customer and source type and aggregating them into Snowflake tables in order to represent them in graphical manner.",
|
||||
"Created a framework for reporting of success and failure metrics of Merge and Split jobs in EMPI (Enterprise Master Patient Index) service."
|
||||
],
|
||||
"term": "Feb 2022 - July 2022"
|
||||
},
|
||||
{
|
||||
"company": "Innovaccer",
|
||||
"title": "Summer Intern SDE (Backend- License Management)",
|
||||
"points": [
|
||||
"Created and maintained the backend for two platform level services, License Management and Platform Configuration, as one of three Backend engineers in a team of 9.",
|
||||
"Maintained over 25 API endpoints using Django RestFramework and ported existing MongoDB collections to PostgreSQL.",
|
||||
"Optimized a critical API endpoint by reducing the response time from 16 seconds down to under 3 using Redis Caching and bulk creation/updation."
|
||||
],
|
||||
"term": "May 2021 - August 2021"
|
||||
},
|
||||
{
|
||||
"company": "Medsupervision",
|
||||
"title": "Web Development Intern",
|
||||
"points": [
|
||||
"Created frontend views and components for the MEDSupervision healthcare platform as per design, using ReactJs framework",
|
||||
"Designed the frontend as well as backend for a Medicine Comparison tool, which suggests alternate medicines containing same or similar salts, using Flask and React.",
|
||||
"Optimized website load times."
|
||||
],
|
||||
"term": "Oct 2020 - April 2021"
|
||||
}
|
||||
]
|
||||
14
src/data/programmingLaguages.json
Normal file
14
src/data/programmingLaguages.json
Normal file
@@ -0,0 +1,14 @@
|
||||
[
|
||||
{
|
||||
"name": "Python"
|
||||
},
|
||||
{
|
||||
"name": "Java"
|
||||
},
|
||||
{
|
||||
"name": "C++"
|
||||
},
|
||||
{
|
||||
"name": "JavaScript"
|
||||
}
|
||||
]
|
||||
30
src/data/publications.json
Normal file
30
src/data/publications.json
Normal file
@@ -0,0 +1,30 @@
|
||||
[
|
||||
{
|
||||
"title": "Framework for determining the suitability of blockchain: Criteria and issues to consider",
|
||||
"authors": "Vikas Hassija, Sherali Zeadally, Ishan Jain, Aman Tahiliani, Vinay Chamola, Shashank Gupta",
|
||||
"publish_date": "29 July 2021",
|
||||
"abstract": "Various distributed ledger technologies (DLTs), such as blockchain, have evolved significantly in recent years. These technologies provide a robust and effective solution for providing confidentiality, integrity, nonrepudiation, authentication, and transparency. While blockchain has many advantages, it has various limitations as well, such as complexity, low throughput, privacy, and so on. We discuss the issues that must be considered when deciding whether to use these technologies in a given case or not. We describe the operation of blockchain, application areas where blockchain is suitable, and those where it is not. We also discuss the applicability of other emerging DLTs, apart from blockchain technology, such as Hashgraph, Zcash, Nano coin, and IOTA.",
|
||||
"link": "https://onlinelibrary.wiley.com/doi/abs/10.1002/ett.4334"
|
||||
},
|
||||
{
|
||||
"title": "Privacy-Preserving and Incentivized Contact Tracing for COVID-19 Using Blockchain",
|
||||
"authors": "Naren, Aman Tahiliani, Vikas Hassija, Vinay Chamola, Salil S. Kanhere, Mohsen Guizani",
|
||||
"publish_date": "27 September 2021",
|
||||
"abstract": "Many countries across the world have not been entirely successful in their attempts to contain the spread of the COVID-19 virus, which has caused, quite possibly, one of the greatest disasters of the 21st century. A rich variety of contact tracing applications, each offering its own unique set of features, are currently being used to track the spread of the virus from person to person, and isolate/quarantine suspected individuals. However, existing approaches have not been very successful since they lack incentives to motivate users to use them actively. Although each solution provides some form of privacy protection and data security, loopholes do exist, and there is scope for improvement. In this context, we explore the use of blockchain to help in advancing contact tracing applications. In this article, we describe how blockchain could offer enhanced data security and functionality without compromising users' privacy. The effectiveness of contact tracing applications improves with the user base. In this regard, we explore how blockchain-based smart contracts can be used to offer incentives to users at various stages of the contact tracing process. Next, we lay down a plan for future contact tracing frameworks that provide the advantages of blockchain and user incentives, and all the best features available in current solutions.",
|
||||
"link": "https://ieeexplore.ieee.org/abstract/document/9548968"
|
||||
},
|
||||
{
|
||||
"title": "Machine Unlearning: Its Need and Implementation Strategies",
|
||||
"authors": "Aman Tahiliani, Vikas Hassija, Vinay Chamola, Mohsen Guizani",
|
||||
"publish_date": "05 August 2021",
|
||||
"abstract": " Generally when users share information about themselves on some online platforms, they knowingly or unknowingly allow this data to be used by the companies behind these companies for various purposes including selling this information to advertisers as well as using it to better enrich their predictive models. In the event of the user changing their minds on allowing such data about them to be able to be used by the companies, it becomes a strenuous task for the companies to get rid of the influence of this collected data, especially when it has been used to train their machine learning models. Recent legislations by governing bodies, like the European Union, grant people the right to choose where data about them may be used, including a right to have their data and its resulting influence be completely removed from a company’s databases and machine learning models. To be able to do this at scale new machine unlearning solutions need to be invented. In this paper, we look at some of these early models of machine unlearning strategies that have been proposed.",
|
||||
"link": "https://dl.acm.org/doi/abs/10.1145/3474124.3474158"
|
||||
},
|
||||
{
|
||||
"title": "A Solution to Evade Social Media Distraction",
|
||||
"authors": " Aman Tahiliani, Adarsh Kumar Verma, Shubham Agrawal, Kavita Pandey",
|
||||
"publish_date": "04 August 2022",
|
||||
"abstract": " With the rapidly growing numbers of people who have access to a smartphone and an internet connection, the usage of these mobile devices, especially to consume content on social media has also seen a drastic increase. This was accelerated even more due to the pandemic. Such an increased screen time due to social media consumption has left many people feeling less productive, instead focusing on their screens even while at work. A common method people try in order to combat this problem is by deleting or disabling their social media accounts altogether. However, such a tactic more often than not is only a temporary fix as most of the people who try it revert back to their habits in less than a week, or, start feeling a common fear of missing out on their social media updates. In this paper we detail the negative effects of social media addiction, look at suggested methods of combating social media addiction and also propose a method to be able to keep up with the happenings of your social media without feeling the constant need to check their phones repeatedly.",
|
||||
"link": "https://dl.acm.org/doi/abs/10.1145/3549206.3549298"
|
||||
}
|
||||
]
|
||||
@@ -1,13 +1,13 @@
|
||||
body {
|
||||
margin: 0;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
|
||||
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
|
||||
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
|
||||
"Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
|
||||
sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
code {
|
||||
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
|
||||
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
|
||||
monospace;
|
||||
}
|
||||
|
||||
14
src/index.js
14
src/index.js
@@ -1,14 +1,14 @@
|
||||
import React from 'react';
|
||||
import ReactDOM from 'react-dom/client';
|
||||
import './index.css';
|
||||
import App from './App';
|
||||
import reportWebVitals from './reportWebVitals';
|
||||
import React from "react";
|
||||
import ReactDOM from "react-dom/client";
|
||||
import "./index.css";
|
||||
import App from "./App";
|
||||
import reportWebVitals from "./reportWebVitals";
|
||||
|
||||
const root = ReactDOM.createRoot(document.getElementById('root'));
|
||||
const root = ReactDOM.createRoot(document.getElementById("root"));
|
||||
root.render(
|
||||
<React.StrictMode>
|
||||
<App />
|
||||
</React.StrictMode>
|
||||
</React.StrictMode>,
|
||||
);
|
||||
|
||||
// If you want to start measuring performance in your app, pass a function
|
||||
|
||||
Binary file not shown.
BIN
src/media/Aman_Tahiliani_Resume.pdf
Normal file
BIN
src/media/Aman_Tahiliani_Resume.pdf
Normal file
Binary file not shown.
BIN
src/media/logos/companies/GeorgiaTech.png
Normal file
BIN
src/media/logos/companies/GeorgiaTech.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
BIN
src/media/logos/companies/innovaccerLogo.png
Normal file
BIN
src/media/logos/companies/innovaccerLogo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.7 KiB |
BIN
src/media/logos/companies/logo.png
Normal file
BIN
src/media/logos/companies/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
src/media/logos/companies/rimidi.png
Normal file
BIN
src/media/logos/companies/rimidi.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
src/media/logos/languages/JavaScript.webp
Normal file
BIN
src/media/logos/languages/JavaScript.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 33 KiB |
BIN
src/media/logos/languages/c++.png
Normal file
BIN
src/media/logos/languages/c++.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 11 KiB |
BIN
src/media/logos/languages/java-logo.png
Normal file
BIN
src/media/logos/languages/java-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
BIN
src/media/logos/languages/python-logo.png
Normal file
BIN
src/media/logos/languages/python-logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 175 KiB |
1
src/media/logos/social_media/github.svg
Normal file
1
src/media/logos/social_media/github.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg height="512px" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512" width="512px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="_x31_42-github"><g><path d="M179.858,392.884c0,1.855-2.133,3.339-4.822,3.339c-3.062,0.277-5.193-1.205-5.193-3.339c0-1.854,2.132-3.34,4.823-3.34 C177.448,389.267,179.858,390.75,179.858,392.884z M151.017,388.709c-0.649,1.857,1.205,3.988,3.987,4.544 c2.411,0.928,5.194,0,5.75-1.853c0.558-1.856-1.205-3.988-3.987-4.824C154.355,385.929,151.666,386.855,151.017,388.709 L151.017,388.709z M192.008,387.133c-2.689,0.65-4.544,2.411-4.267,4.544c0.279,1.854,2.69,3.063,5.473,2.413 c2.69-0.65,4.544-2.413,4.266-4.267C197.201,388.06,194.698,386.855,192.008,387.133z M253.032,31.747 c-128.634,0-227.031,97.656-227.031,226.291c0,102.851,64.732,190.862,157.197,221.839c11.871,2.133,16.044-5.194,16.044-11.223 c0-5.75-0.277-37.469-0.277-56.942c0,0-64.921,13.911-78.554-27.639c0,0-10.572-26.988-25.782-33.944 c0,0-21.238-14.56,1.484-14.281c0,0,23.094,1.856,35.799,23.928c20.31,35.799,54.346,25.505,67.607,19.383 c2.134-14.839,8.162-25.133,14.84-31.254c-51.843-5.75-104.149-13.263-104.149-102.479c0-25.504,7.048-38.302,21.888-54.625 c-2.411-6.028-10.295-30.882,2.411-62.972c19.383-6.028,63.99,25.041,63.99,25.041c18.55-5.194,38.489-7.883,58.242-7.883 c19.755,0,39.694,2.689,58.241,7.883c0,0,44.611-31.161,63.993-25.041c12.705,32.181,4.822,56.944,2.412,62.972 c14.84,16.415,23.926,29.212,23.926,54.625c0,89.496-54.625,96.636-106.466,102.479c8.532,7.325,15.765,21.238,15.765,43.032 c0,31.253-0.277,69.928-0.277,77.531c0,6.028,4.266,13.355,16.044,11.223c92.742-30.79,155.62-118.802,155.62-221.652 C485.999,129.403,381.665,31.747,253.032,31.747z M116.146,351.614c-1.206,0.927-0.928,3.061,0.647,4.82 c1.484,1.485,3.617,2.133,4.823,0.93c1.205-0.93,0.927-3.061-0.649-4.823C119.484,351.057,117.352,350.408,116.146,351.614z M106.129,344.102c-0.648,1.205,0.278,2.688,2.134,3.616c1.483,0.929,3.339,0.649,3.988-0.649 c0.648-1.205-0.278-2.688-2.133-3.617C108.263,342.895,106.777,343.174,106.129,344.102z M136.178,377.116 c-1.483,1.206-0.927,3.989,1.205,5.75c2.133,2.134,4.822,2.413,6.028,0.927c1.205-1.204,0.649-3.987-1.206-5.748 C140.165,375.912,137.383,375.633,136.178,377.116z M125.605,363.485c-1.484,0.926-1.484,3.337,0,5.47 c1.484,2.134,3.988,3.061,5.193,2.134c1.483-1.206,1.483-3.617,0-5.75C129.5,363.207,127.09,362.278,125.605,363.485 L125.605,363.485z"/></g></g><g id="Layer_1"/></svg>
|
||||
|
After Width: | Height: | Size: 2.6 KiB |
1
src/media/logos/social_media/goodreads.svg
Normal file
1
src/media/logos/social_media/goodreads.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg height="512px" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512" width="512px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="_x31_49-goodreads"><g><path d="M121.789,388.382h2.515c11.413,0,22.914,0,34.324,0.094c1.439,0,2.786-0.361,3.236,1.886 c6.379,31.358,26.956,49.061,56.519,57.416c24.17,6.828,48.61,7.009,73.051,1.618c30.37-6.65,50.318-25.429,61.101-54.273 c7.188-19.319,9.613-39.354,9.884-59.753c0.09-5.21,0.27-42.231-0.18-47.441l-0.808-0.27c-0.72,1.348-1.53,2.605-2.248,3.953 c-19.856,38.729-55.081,60.562-94.707,62.09c-92.549,3.594-152.211-51.218-154.547-158.324 c-0.449-21.295,1.618-42.141,7.458-62.628c18.509-63.886,67.03-106.208,138.285-106.746c55.08-0.36,91.201,34.773,104.41,63.167 c0.45,0.987,1.167,2.066,2.156,1.707V35.529h39.806c0,251.86,0.089,298.495,0.089,298.495 c-0.089,70.534-23.989,129.121-92.55,145.742c-62.448,15.185-142.867,4.313-176.112-51.396 C126.282,416.239,122.867,402.941,121.789,388.382L121.789,388.382z M253.244,58.801c-47.173-0.45-97.491,36.57-103.332,120.223 c-3.684,53.014,13.298,109.802,64.245,133.525c24.801,11.59,66.763,13.477,97.312-7.819 c42.771-29.83,56.339-87.158,49.241-138.375C351.994,102.469,317.759,58.531,253.244,58.801z" style="fill:#7D5024;"/></g></g><g id="Layer_1"/></svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
1
src/media/logos/social_media/instagram.svg
Normal file
1
src/media/logos/social_media/instagram.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg height="512px" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512" width="512px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="_x31_73-instagram"><g><linearGradient gradientUnits="userSpaceOnUse" id="SVGID_1_" x1="74.3496" x2="393.8339" y1="83.7275" y2="386.7129"><stop offset="0" style="stop-color:#FEC053"/><stop offset="0.3273" style="stop-color:#F2203E"/><stop offset="0.6485" style="stop-color:#B729A8"/><stop offset="1" style="stop-color:#5342D6"/></linearGradient><path d="M256.052,138.088c-65.268,0-117.913,52.646-117.913,117.912 c0,65.267,52.645,117.91,117.913,117.91c65.267,0,117.911-52.644,117.911-117.91C373.963,190.734,321.318,138.088,256.052,138.088 z M256.052,332.659c-42.177,0-76.659-34.38-76.659-76.659c0-42.279,34.378-76.657,76.659-76.657 c42.277,0,76.657,34.378,76.657,76.657C332.709,298.279,298.229,332.659,256.052,332.659L256.052,332.659z M406.288,133.266 c0,15.291-12.315,27.502-27.502,27.502c-15.292,0-27.502-12.314-27.502-27.502c0-15.188,12.313-27.503,27.502-27.503 C393.973,105.763,406.288,118.077,406.288,133.266z M484.382,161.177c-1.743-36.839-10.158-69.474-37.148-96.36 c-26.886-26.887-59.52-35.302-96.36-37.148c-37.971-2.155-151.777-2.155-189.747,0c-36.739,1.743-69.372,10.159-96.361,37.046 c-26.99,26.887-35.302,59.52-37.149,96.36c-2.155,37.969-2.155,151.777,0,189.747c1.745,36.842,10.159,69.473,37.149,96.361 c26.989,26.887,59.521,35.301,96.361,37.148c37.969,2.154,151.776,2.154,189.747,0c36.841-1.744,69.475-10.161,96.36-37.148 c26.887-26.889,35.302-59.52,37.148-96.361C486.538,312.853,486.538,199.147,484.382,161.177z M435.329,391.563 c-8.004,20.112-23.5,35.61-43.716,43.716c-30.273,12.009-102.108,9.236-135.562,9.236c-33.456,0-105.393,2.669-135.563-9.236 c-20.114-8.005-35.611-23.498-43.717-43.716C64.766,361.29,67.538,289.455,67.538,256s-2.669-105.391,9.234-135.562 c8.006-20.114,23.5-35.61,43.717-43.716c30.273-12.007,102.107-9.236,135.563-9.236c33.453,0,105.391-2.668,135.562,9.236 c20.113,8.002,35.609,23.5,43.716,43.716c12.007,30.272,9.237,102.107,9.237,135.562S447.336,361.392,435.329,391.563z" style="fill:url(#SVGID_1_);"/></g></g><g id="Layer_1"/></svg>
|
||||
|
After Width: | Height: | Size: 2.3 KiB |
1
src/media/logos/social_media/linkedin.svg
Normal file
1
src/media/logos/social_media/linkedin.svg
Normal file
@@ -0,0 +1 @@
|
||||
<?xml version="1.0" ?><!DOCTYPE svg PUBLIC '-//W3C//DTD SVG 1.1//EN' 'http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd'><svg height="512px" style="enable-background:new 0 0 512 512;" version="1.1" viewBox="0 0 512 512" width="512px" xml:space="preserve" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><g id="_x32_01-linkedin"><g><rect height="316.249" style="fill:#0274B3;" width="102.59" x="26.623" y="169.75"/><path d="M408.65,173.458c-1.092-0.341-2.123-0.715-3.268-1.037c-1.381-0.313-2.754-0.577-4.16-0.8 c-5.443-1.095-11.414-1.871-18.408-1.871c-59.805,0-97.746,43.617-110.238,60.461V169.75h-102.59v316.249h102.588V313.501 c0,0,77.525-108.273,110.24-28.754v201.252h102.563V272.588C485.377,224.804,452.717,184.986,408.65,173.458z" style="fill:#0274B3;"/><path d="M76.802,126.626c27.708,0,50.176-22.522,50.176-50.313c0-27.785-22.469-50.312-50.176-50.312 c-27.71,0-50.179,22.526-50.179,50.312C26.623,104.103,49.092,126.626,76.802,126.626z" style="fill:#0274B3;"/></g></g><g id="Layer_1"/></svg>
|
||||
|
After Width: | Height: | Size: 1.0 KiB |
@@ -1,6 +1,6 @@
|
||||
const reportWebVitals = onPerfEntry => {
|
||||
const reportWebVitals = (onPerfEntry) => {
|
||||
if (onPerfEntry && onPerfEntry instanceof Function) {
|
||||
import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
|
||||
import("web-vitals").then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
|
||||
getCLS(onPerfEntry);
|
||||
getFID(onPerfEntry);
|
||||
getFCP(onPerfEntry);
|
||||
|
||||
@@ -2,4 +2,4 @@
|
||||
// allows you to do things like:
|
||||
// expect(element).toHaveTextContent(/react/i)
|
||||
// learn more: https://github.com/testing-library/jest-dom
|
||||
import '@testing-library/jest-dom';
|
||||
import "@testing-library/jest-dom";
|
||||
|
||||
2
src/views/Portfolio.js
Normal file
2
src/views/Portfolio.js
Normal file
@@ -0,0 +1,2 @@
|
||||
import React from "react";
|
||||
import "./App.css";
|
||||
Reference in New Issue
Block a user