Skip to content

Commit

Permalink
certifications
Browse files Browse the repository at this point in the history
  • Loading branch information
@sairohitp
sairohitp committed Jan 15, 2024
1 parent 66779e8 commit bab89d6
Show file tree
Hide file tree
Showing 11 changed files with 264 additions and 255 deletions.
5 changes: 5 additions & 0 deletions src/App.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import Experience from "./pages/Experience/Experience"
import Projects from "./pages/Projects/Projects"
import Education from "./pages/Education/Education"
import Achievements from "./pages/Achievements/Achievements"
import Certifications from "./pages/Certifications/Certifications";
import Recommendations from "./pages/Recommendations/Recommendations";

// h1 22
// h2 20
Expand All @@ -24,6 +26,9 @@ function App() {
<Route path="/projects" element={<Projects />} />
<Route path="/education" element={<Education />} />
<Route path="/achievements" element={<Achievements />} />

<Route path="/certifications" element={<Certifications />} />
<Route path="/recommendations" element={<Recommendations />} />
{/* <Route path="/*" element={<404 />} /> */}
</Routes>
{/*
Expand Down
80 changes: 38 additions & 42 deletions src/components/awards/Award.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,54 +2,50 @@ import React from 'react'
import AwardsCSS from "./Awards.module.css"

const Award = (props) => {
return (
<div className = {AwardsCSS.awardstrip}>
return (
<div className={AwardsCSS.awardstrip}>

<div>
<img src = {props.awardIMG} className = {AwardsCSS.awardIMG} alt = ""></img>
<div>
<img src={props.awardIMG} className={AwardsCSS.awardIMG} alt=""></img>
</div>

<div className={AwardsCSS.awardContent}>



<div className={AwardsCSS.awardSubheadings}>

<div className={AwardsCSS.awardSubheading}>
<div><h3>{props.awardTitle}</h3></div>
<div><h6>{props.awardDate}</h6></div>
</div>

<div className={AwardsCSS.awardSubheading}>
<div><h6>{props.awardSubtitle1Left}</h6></div>
<div><h6>{props.awardSubtitle1Right}</h6></div>
</div>

<div className = {AwardsCSS.awardContent}>

<div className = {AwardsCSS.awardContentSubheadings}>

<div>
<span className = {AwardsCSS.awardPosition}>{props.awardRank}</span>
</div>

<div className = {AwardsCSS.awardSubheadings}>

<div className = {AwardsCSS.awardSubheading}>
<div><h3>{props.awardTitle}</h3></div>
<div><h5>{props.awardDate}</h5></div>
</div>

<div className = {AwardsCSS.awardSubheading}>
<div><h5>{props.awardSubtitle1Left}</h5></div>
<div><h5>{props.awardSubtitle1Right}</h5></div>
</div>

<div className = {AwardsCSS.awardSubheading}>
<div><h5>{props.awardSubtitle2Left}</h5></div>
<div><h5>{props.awardSubtitle2Right}</h5></div>
</div>

</div>

</div>

<div className = {AwardsCSS.awardContentDescription}>
<p>
{props.awardDescriptionLine1}<br/>
{props.awardDescriptionLine2}<br/>
{props.awardDescriptionLine3}
</p>
</div>

<div className={AwardsCSS.awardSubheading}>
<div><h6>{props.awardSubtitle2Left}</h6></div>
<div><h6>{props.awardSubtitle2Right}</h6></div>
</div>

</div>
)



<div className={AwardsCSS.awardContentDescription}>
<p>
{props.awardDescriptionLine1}<br />
{props.awardDescriptionLine2}<br />
{props.awardDescriptionLine3}
</p>
</div>

</div>

</div>
)
}

export default Award
105 changes: 49 additions & 56 deletions src/components/awards/Awards.module.css
View file
Original file line number Diff line number Diff line change
@@ -1,75 +1,64 @@
/* Hide scrollbar for Chrome, Safari and Opera */
#parentsection::-webkit-scrollbar {
display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
#parentsection {
-ms-overflow-style: none;
/* IE and Edge */
scrollbar-width: none;
/* Firefox */
}

#parentsection {
padding: 100px 0px 50px 0px;
border-bottom: 1px solid #e6e6e6;
display: flex;
align-items: center;
}

#sectiontitle {
transform: rotate(-90deg);
font-size: 50px;
font-style: normal;
font-weight: 900;
line-height: 50px;
position: absolute;
right: 1105px;
top: 43%;
}
left: 50%;
transform: translate(-50%, 0%);
width: 1220px;
height: calc(100% - 200px);
/* 100% of the viewport height - height of the footer */
overflow-y: scroll;
padding: 20px;
z-index: 10;
}

.sectionbody {
margin: 0px auto;
position: relative;
}

.subsectionbody {
display: flex;
flex-direction: column;
gap: 50px;
align-items: center;
width: 1080px;
gap: 40px;
}

.subsectionbody > div:first-child {
.subsectionbody {
display: flex;
flex-direction: column;
gap: 50px;
align-items: center;
width: 1080px;
}

.pagiation {
display: inline-flex;
gap: 40px;
align-items: center;
gap: 10px;
width: 100%;
}

.awardstrip {
display: flex;
align-items: flex-start;
gap: 40px;
width: 1080px;
align-items: center;
gap: 30px;
width: 100%;
}

.awardIMG {
width: 300px;
height: 173px;
border-radius: 10px;
border: 0.2px solid rgba(0, 0, 0, 0.50);
object-fit: cover;
height: 173px;
border-radius: 15px;
border: 0.2px solid rgba(0, 0, 0, 0.50);
object-fit: cover;
}

.awardContent {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 20px;
width: 100%;
}

.awardContentSubheadings {
display: flex;
align-items: center;
gap: 30px;
flex-direction: column;
align-items: flex-start;
gap: 20px;
width: 100%;
}

Expand All @@ -81,21 +70,25 @@ width: 100%;
width: 100%;
}

.awardSubheadings h3 {
font-weight: 700;
}

.awardPosition {
color: #000;
font-size: 90px;
font-style: normal;
font-weight: 900;
line-height: 90px;
font-size: 90px;
font-style: normal;
font-weight: 900;
line-height: 90px;
}

.awardSubheading {
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
justify-content: space-between;
align-items: center;
width: 100%;
}

.awardSubheading > div:first-child > h5 {
font-weight: 600;
.awardSubheading>div:first-child>h6 {
font-weight: 700;
}
22 changes: 11 additions & 11 deletions src/components/certifications/Certificate.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,18 +6,18 @@ import Skill from './Skill'
const Certificate = (props) => {
return (
<div className={CertificationsCSS.card}>
<img src = {props.certificateIMG} alt = ""></img>
<h5>{props.certificateTitle}</h5>
<div className = {CertificationsCSS.certficaionSubtitle}>
<div><h5>{props.certificateIssuer}</h5></div>
<div><h5>{props.certificateDate}</h5></div>
</div>

<div className={CertificationsCSS.plainskillrow}>
{props.skill}
</div>
<img src={props.certificateIMG} alt=""></img>
<h5>{props.certificateTitle}</h5>
<div className={CertificationsCSS.certficaionSubtitle}>
<div><h5>{props.certificateIssuer}</h5></div>
<div><h5>{props.certificateDate}</h5></div>
</div>

</div>
<div className={CertificationsCSS.plainskillrow}>
{props.skill}
</div>

</div>
)
}

Expand Down
100 changes: 0 additions & 100 deletions src/components/certifications/Certifications.js
View file

This file was deleted.

Loading

0 comments on commit bab89d6

Please sign in to comment.