Skip to content

Commit

Permalink
projects page
Browse files Browse the repository at this point in the history
  • Loading branch information
Lukas committed Sep 11, 2024
1 parent ddeeaad commit 05cf807
Show file tree
Hide file tree
Showing 7 changed files with 82 additions and 89 deletions.
14 changes: 13 additions & 1 deletion portfolio/src/Pages/About.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -66,4 +66,16 @@
max-width: 40%;
margin: 1vmax;

}
}


@media screen and (min-width:1050px) {
.aboutTitleText{font-size: 1.8vmax;}
.aboutLinkText{font-size: 1.2vmax;}
.titleTxt{font-size: 1.5vmax;}
.boldTxt{font-size: 1.4vmax;}
.midTxt{font-size: 1.2vmax;}
.thinTxt{font-size: 1.15vmax;}
.aboutPortraitPhoto{width: 30%;}
}

2 changes: 1 addition & 1 deletion portfolio/src/Pages/About.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,7 +36,7 @@ const About = () => {
<li className="thinTxt"><text className="midTxt">Commitment to quality: </text>I always try to find the best possible solutions before I start to code.</li>
<li className="thinTxt"><text className="midTxt">Creating with future in mind: </text>I believe that <a href={docs_link} className="aboutLinkText"> documentation</a> and good code design is very important to make sure my code can be understandable and reusable in the future. </li>
<li className="thinTxt"><text className="midTxt">Version control software: </text>I use <a href={my_github_page} className="aboutLinkText">GitHub </a> and GitKraken.</li>
<li className="thinTxt"><text className="midTxt">Tests: </text>I can write simple tests for my code in UnitTests na Pytest libraries.</li>
<li className="thinTxt"><text className="midTxt">Tests: </text>I can write simple tests for my code with UnitTests and Pytest libraries.</li>
<li className="thinTxt"><text className="midTxt">Wide range of interests: </text>3D modeling, 2D digital art, composition, color theory and more.</li>
<li className="thinTxt"><text className="midTxt">Language: </text>Polish and English.</li>
</ul>
Expand Down
6 changes: 5 additions & 1 deletion portfolio/src/Pages/Home.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -195,4 +195,8 @@
.helloText{white-space: break-spaces;}
}


@media screen and (min-width:1050px) {
.homePhoto{width: 30vmax; height: 30vmax;}
.homePhotoTxt{width: 30vmax; height: 30vmax; font-size: 1.3vmax;}
.homePhotoFit{width: 30vmax; height: 30vmax;}
}
18 changes: 16 additions & 2 deletions portfolio/src/Pages/Home.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,8 +74,22 @@ const Home = () => {
</NavLink>
</div>



<div className="homeDivMid">
<NavLink to="/projects">
<div className="homeDivInner">
<span className="boldTxt">Contact</span>
<video src={pongVideo} alt="projectsPhoto" className="homePhoto" video loop autoPlay muted />
</div>
</NavLink>
</div>
<div className="homeDivMid">
<NavLink to="/projects">
<div className="homeDivInner">
<span className="boldTxt">Contact</span>
<video src={pongVideo} alt="projectsPhoto" className="homePhoto" video loop autoPlay muted />
</div>
</NavLink>
</div>

</div>

Expand Down
5 changes: 3 additions & 2 deletions portfolio/src/Pages/Projects.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -105,10 +105,11 @@
}

.technologiesUsedPhoto{
max-width: 1.7vmax;
max-height: 1.7vmax;
margin-top: 1vmax;
margin-left: 1vmax;
display: inline;
object-fit: cover;


}

Expand Down
118 changes: 37 additions & 81 deletions portfolio/src/Pages/Projects.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,6 @@ import arduinoLogo from "../Assets/arduino-logo.png";
import cplusplusLogo from "../Assets/c++-logo.png";
import GitHubLogo from "../Assets/GitHub_Logo_White.png"
import pongVideo from "../Assets/pong_animation0000-0120.mp4"

import placeholderPhoto from "../Assets/myPhoto.jpg";
import { NavLink } from "react-router-dom";

Expand All @@ -21,49 +20,49 @@ const Projects = () => {

return (

<div className="page">
<ScrollToTop/>
<div className="pageAboveFooter">
<Navbar />
<div className="pageContent">

<div className="aboutMidDiv">
<span className="aboutTitleText">Projects</span>

</div>

<div className="homeDivOuter">

<div className="homeDivMid">
<div className="page">
<ScrollToTop/>
<div className="pageAboveFooter">
<Navbar />
<div className="pageContent">

<div className="aboutMidDiv">
<span className="aboutTitleText">Projects</span>
</div>

<a className="homeDivInner" href={github_link}>
<span className="boldTxt">All of my Projects</span>
<img src={GitHubLogo} alt="projectsPhoto" className="homePhotoFit"></img>

</a>
<div className="homeDivOuter">

</div>
<div className="homeDivMid">
<a className="homeDivInner" href={github_link}>
<span className="boldTxt">All of my Projects</span>
<img src={GitHubLogo} alt="projectsPhoto" className="homePhotoFit"></img>
</a>
</div>

<div className="homeDivMid">
<NavLink to="/projects">
<div className="homeDivInner">
<div className="projectsTechnologiesUsed">
<span className="boldTxt">Pong</span>
<img src={pythonLogo} alt="projectsPhoto" className="technologiesUsedPhoto"></img>
</div>
<video src={pongVideo} alt="projectsPhoto" className="homePhoto" loop autoPlay muted />
<div className="homeDivMid">
<NavLink to="/projects">
<div className="homeDivInner">
<div className="projectsTechnologiesUsed">
<span className="boldTxt">Pong</span>
<img src={pythonLogo} alt="projectsPhoto" className="technologiesUsedPhoto"></img>
</div>
<video src={pongVideo} alt="projectsPhoto" className="homePhotoFit" loop autoPlay muted />
</div>
</NavLink>
</div>
</NavLink>
</div>

<div className="homeDivMid">
<NavLink to="/hobbies">
<div className="homeDivInner">
<span className="boldTxt">Hobbies</span>
<img src={pongVideo} alt="projectsPhoto" className="homePhoto"></img>
<div className="homeDivMid">
<NavLink to="/hobbies">
<div className="homeDivInner">
<div className="projectsTechnologiesUsed">
<span className="boldTxt">Arduino Heater</span>
<img src={cplusplusLogo} alt="projectsPhoto" className="technologiesUsedPhoto"></img>
<img src={arduinoLogo} alt="projectsPhoto" className="technologiesUsedPhoto"></img>
</div>
<img src={placeholderPhoto} alt="projectsPhoto" className="homePhotoFit"></img>
</div>
</NavLink>
</div>
</NavLink>
</div>


<div className="homeDivMid">
Expand All @@ -82,49 +81,6 @@ const Projects = () => {



<div className="projectsLinksDiv">
<a href={github_link} className="projectsLink">
<div className="projectsPhotoDivRight">
<img src={GitHubLogo} alt="projectsPhoto" className="projectsPhotoGitHub"></img>
</div>
<div className="projectsLinkTextDivRight">
<span className="projectsLinkTextRight">All of my Projects</span>
<span className="projectsLinkTextRightMedium">You can see them directly on my GitHub Page.</span>
</div>
</a>
</div>

<div className="projectsLinksDiv">
<NavLink to="/projects" className="projectsLink">
<div className="projectsPhotoDivRight">
<img src={pongSquare} alt="projectsPhoto" className="projectsPhoto"></img>
</div>
<div className="projectsLinkTextDivRight">
<span className="projectsLinkTextRight">Pong Game</span>
<span className="projectsLinkTextRightMedium">My take on famous oldschool game written in Python Turtle.</span>
<div className="projectsTechnologiesUsedDiv">
<img src={pythonLogo} alt="projectsPhoto" className="technologiesUsedPhoto"></img>
</div>
</div>
</NavLink>
</div>


<div className="projectsLinksDiv">
<NavLink to="/projects" className="projectsLink">
<div className="projectsPhotoDivRight">
<img src={placeholderPhoto} alt="projectsPhoto" className="projectsPhoto"></img>
</div>
<div className="projectsLinkTextDivRight">
<span className="projectsLinkTextRight">Arduino Heater</span>
<span className="projectsLinkTextRightMedium">Personal project created to control heater pump with Arduino.</span>
<div className="projectsTechnologiesUsedDiv">
<img src={cplusplusLogo} alt="projectsPhoto" className="cplusplusPhoto"></img>
<img src={arduinoLogo} alt="projectsPhoto" className="arduinoPhoto"></img>
</div>
</div>
</NavLink>
</div>


</div>
Expand Down
8 changes: 7 additions & 1 deletion portfolio/src/style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,12 @@ li {
border-radius: 1vmax;
}

@media screen and (max-width:1050px) {
@media screen and (max-width:1000px) {
.pageContent{max-width: 90vw;}
}


@media screen and (min-width:1000px) {
li{margin-top: 0.5vmax;}
}

0 comments on commit 05cf807

Please sign in to comment.