adds "all projects" page
This commit is contained in:
parent
0954ee9cb6
commit
b783ff4fb4
12 changed files with 193 additions and 89 deletions
|
@ -2,6 +2,7 @@
|
|||
<HTML>
|
||||
|
||||
<header>
|
||||
<link rel = "stylesheet" href = "pages\basic.css">
|
||||
<link rel = "stylesheet" href = "pages\mainpage.css">
|
||||
<link rel = "stylesheet" href = "pages\effects.css">
|
||||
<link rel = "icon" href = "images\Icon.ico">
|
||||
|
@ -15,7 +16,7 @@
|
|||
|
||||
<body>
|
||||
<div id = "introScreenSpace">
|
||||
<h1>
|
||||
<h1 id = "Title">
|
||||
<div id = "siteTitle">Nye "Ro" Evans</div>
|
||||
<div class = "subTitle">Portfolio</div>
|
||||
</h1>
|
||||
|
@ -129,6 +130,9 @@
|
|||
|
||||
</div>
|
||||
|
||||
<div id="galleryOutroLink">
|
||||
<a href = "pages/AllProjects.html">See all my projects here</a>
|
||||
</div>
|
||||
|
||||
<div class = "textBox" id= "outroText">
|
||||
I hope you like my work! If you ever want to contact me, my Email, Github and Social Medias can be found below.
|
||||
|
|
15
pages/AllProjects.css
Normal file
15
pages/AllProjects.css
Normal file
|
@ -0,0 +1,15 @@
|
|||
.projectThumbnail{
|
||||
width: 16vh;
|
||||
margin-left: 3vw;
|
||||
}
|
||||
|
||||
.item{
|
||||
display: flex;
|
||||
margin-top: 4vh;
|
||||
}
|
||||
|
||||
.itemText{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 10px;
|
||||
}
|
|
@ -2,23 +2,80 @@
|
|||
<HTML>
|
||||
|
||||
<header>
|
||||
<link rel = "stylesheet" href = "pages\mainpage.css">
|
||||
<link rel = "stylesheet" href = "pages\effects.css">
|
||||
<link rel = "icon" href = "images\Icon.ico">
|
||||
<link rel = "stylesheet" href = "basic.css">
|
||||
<link rel = "stylesheet" href = "AllProjects.css">
|
||||
<link rel = "stylesheet" href = "effects.css">
|
||||
<link rel = "icon" href = "..\images\Icon.ico">
|
||||
|
||||
<meta charset="UTF-8">
|
||||
<title>Nye Evans Portfolio</title>
|
||||
</header>
|
||||
|
||||
<body>
|
||||
<!-- <h1>All Projects</h1> -->
|
||||
<h1>Things I have done:</h1>
|
||||
|
||||
<a href = "./gallery/aardvark-work/aardvark-work.html" class = "galleryLink">
|
||||
<div class = "item">
|
||||
<img src = "./gallery/aardvark-work/projectHeaderImage.png" class = "orangeBorder projectThumbnail"></img>
|
||||
<div class = "itemText">
|
||||
<h2>Your mum</h2>
|
||||
<div>
|
||||
lmao I did ur mom
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</a>
|
||||
<a href = "./gallery/epq-project/epq-project.html" class = "galleryLink">
|
||||
<div class = "item">
|
||||
<img src = "./gallery/epq-project/projectHeaderImage.png" class = "orangeBorder projectThumbnail"></img>
|
||||
<div class = "itemText">
|
||||
<h2>And also your dad</h2>
|
||||
<div>
|
||||
I am bisexual
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</a>
|
||||
<a href = "./gallery/mind-map/mind-map.html" class = "galleryLink">
|
||||
<div class = "item">
|
||||
<img src = "./gallery/mind-map/projectHeaderImage.png" class = "orangeBorder projectThumbnail"></img>
|
||||
<div class = "itemText">
|
||||
<h2>I fucked both your parents</h2>
|
||||
<div>
|
||||
they were totally into it because Im cool as hell B)
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href = "./gallery/cat-tower-defence/cat-tower-defence.html" class = "galleryLink">
|
||||
<div class = "item">
|
||||
<img src = "./gallery/cat-tower-defence/projectHeaderImage.png" class = "orangeBorder projectThumbnail"></img>
|
||||
<div class = "itemText">
|
||||
<h2>*breakdown*</h2>
|
||||
<div>
|
||||
I'm doin' your mom, yes, yours!
|
||||
First saw her in the Walmart pickin' out your drawers
|
||||
Big Dolly Parton hair like an '80s prom queen
|
||||
But her ass was lookin' good all up in them mom-jeans
|
||||
I approached her in the checkout line, and said, "Yo baby, wassup?"
|
||||
She had two gallons of milk, and I was starin' at her jugs
|
||||
Five minutes later, she agreed to get with me
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div id = "socialBar">
|
||||
<div id = "backButtonContainer">
|
||||
<a onclick = "history.back()" class = "backButton"> <-Back to main page</a>
|
||||
</div>
|
||||
|
||||
<div id = "socialBar" style = "margin-top: 3vh;">
|
||||
<a href = "https://twitter.com/Wi__Ro" target="_blank">Twitter</a>
|
||||
 
|
||||
<a href="mailto:WillowRo@outlook.com" target="_blank">Email</a>
|
||||
|
|
86
pages/basic.css
Normal file
86
pages/basic.css
Normal file
|
@ -0,0 +1,86 @@
|
|||
@import url("reset.css");
|
||||
|
||||
@font-face{
|
||||
font-family:"roboto";
|
||||
font-weight: 100;
|
||||
src: url("../fonts/Roboto/RobotoMono-VariableFont_wght.ttf")
|
||||
}
|
||||
html{
|
||||
font: 100%;
|
||||
}
|
||||
|
||||
body{
|
||||
color: #ffd256;
|
||||
background-color: #181818;
|
||||
font-family: "roboto";
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
button{
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
color: #ffd256;
|
||||
}
|
||||
|
||||
|
||||
button:focus {
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
a:link:not(.galleryLink), a:visited:not(.galleryLink){
|
||||
color: #ffd256;
|
||||
border-radius: 2px;
|
||||
transition: background-color 0.5s, color 0.5s;
|
||||
}
|
||||
|
||||
.galleryLink{
|
||||
text-decoration: none;
|
||||
color:#ffd256;
|
||||
}
|
||||
|
||||
h1{
|
||||
font-size: clamp(1.2rem, 4vw, 4rem);
|
||||
|
||||
padding-left: 6;
|
||||
|
||||
margin-top: 4vh;
|
||||
|
||||
height: 20vh;
|
||||
text-align: center;
|
||||
|
||||
}
|
||||
|
||||
.subTitle{
|
||||
font-size: 30%;
|
||||
padding-top: 10;
|
||||
padding-left: 5;
|
||||
}
|
||||
|
||||
#socialBar{
|
||||
display: flex;
|
||||
margin-bottom: 5vh;
|
||||
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#backButtonContainer{
|
||||
text-align: center;
|
||||
margin-bottom: 7vh;
|
||||
margin-top: 7vh;
|
||||
}
|
||||
|
||||
|
||||
.orangeBorder{
|
||||
border: 2px solid transparent;
|
||||
border-radius: 5px;
|
||||
|
||||
padding: 5px;
|
||||
|
||||
transition: border 0.5s;
|
||||
}
|
||||
|
||||
.orangeBorder:hover{
|
||||
border: 2px solid #ffd256;
|
||||
padding: 5px;
|
||||
}
|
|
@ -1,6 +1,7 @@
|
|||
<!doctype html>
|
||||
<HTML>
|
||||
<header>
|
||||
<link rel = "stylesheet" href = "..\..\basic.css">
|
||||
<link rel = "stylesheet" href = "..\blog-post-default.css">
|
||||
<link rel = "stylesheet" href = "..\..\effects.css">
|
||||
</header>
|
||||
|
@ -46,7 +47,7 @@
|
|||
</div>
|
||||
|
||||
<div id = "backButtonContainer">
|
||||
<a href = "../../../index.html#galleryHeader" class = "backButton"> <-Back to main page</a>
|
||||
<a onclick = "history.back()" class = "backButton"> <-Back</a>
|
||||
</div>
|
||||
</body>
|
||||
</HTML>
|
|
@ -62,11 +62,6 @@ iframe:hover{
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
#backButtonContainer{
|
||||
text-align: center;
|
||||
margin-bottom: 7vh;
|
||||
margin-top: 7vh;
|
||||
}
|
||||
|
||||
|
||||
@media (orientation:portrait){
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
<!doctype html>
|
||||
<HTML>
|
||||
<header>
|
||||
<link rel = "stylesheet" href = "..\..\basic.css">
|
||||
<link rel = "stylesheet" href = "..\blog-post-default.css">
|
||||
<link rel = "stylesheet" href = "..\..\effects.css">
|
||||
</header>
|
||||
|
@ -26,7 +27,7 @@
|
|||
</div>
|
||||
|
||||
<div id = "backButtonContainer">
|
||||
<a href = "../../../index.html#galleryHeader" class = "backButton"> <-Back to main page</a>
|
||||
<a onclick = "history.back()" class = "backButton"> <-Back</a>
|
||||
</div>
|
||||
</body>
|
||||
</HTML>
|
|
@ -2,6 +2,7 @@
|
|||
<!doctype html>
|
||||
<HTML>
|
||||
<header>
|
||||
<link rel = "stylesheet" href = "..\..\basic.css">
|
||||
<link rel = "stylesheet" href = "..\blog-post-default.css">
|
||||
<link rel = "stylesheet" href = "..\..\effects.css">
|
||||
</header>
|
||||
|
@ -31,7 +32,7 @@
|
|||
</div>
|
||||
|
||||
<div id = "backButtonContainer">
|
||||
<a href = "../../../index.html#galleryHeader" class = "backButton"> <-Back to main page</a>
|
||||
<a onclick = "history.back()" class = "backButton"> <-Back</a>
|
||||
</div>
|
||||
</body>
|
||||
</HTML>
|
|
@ -1,11 +1,12 @@
|
|||
<HTML>
|
||||
<header>
|
||||
<link rel = "stylesheet" href = "..\..\basic.css">
|
||||
<link rel = "stylesheet" href = "..\blog-post-default.css">
|
||||
<link rel = "stylesheet" href = "..\..\effects.css">
|
||||
</header>
|
||||
<body>
|
||||
<h1>
|
||||
EPQ Project
|
||||
Mind Mapping Software
|
||||
</h1>
|
||||
<div class = "textBox">
|
||||
<h2>What it is</h2>
|
||||
|
@ -27,7 +28,7 @@
|
|||
</div>
|
||||
|
||||
<div id = "backButtonContainer">
|
||||
<a href = "../../../index.html#galleryHeader" class = "backButton"> <-Back to main page</a>
|
||||
<a onclick = "history.back()" class = "backButton"> <-Back</a>
|
||||
</div>
|
||||
</body>
|
||||
</HTML>
|
|
@ -1,6 +1,7 @@
|
|||
<!doctype html>
|
||||
<HTML>
|
||||
<header>
|
||||
<link rel = "stylesheet" href = "..\..\basic.css">
|
||||
<link rel = "stylesheet" href = "..\blog-post-default.css">
|
||||
<link rel = "stylesheet" href = "..\..\effects.css">
|
||||
</header>
|
||||
|
@ -24,7 +25,7 @@
|
|||
</div>
|
||||
|
||||
<div id = "backButtonContainer">
|
||||
<a href = "../../../index.html" class = "backButton"> <-Back to main page</a>
|
||||
<a onclick = "history.back()" class = "backButton"> <-Back</a>
|
||||
</div>
|
||||
</body>
|
||||
</HTML>
|
|
@ -1,40 +1,4 @@
|
|||
@import url("reset.css");
|
||||
|
||||
@font-face{
|
||||
font-family:"roboto";
|
||||
font-weight: 100;
|
||||
src: url("../fonts/Roboto/RobotoMono-VariableFont_wght.ttf")
|
||||
}
|
||||
html{
|
||||
font: 100%;
|
||||
}
|
||||
|
||||
body{
|
||||
color: #ffd256;
|
||||
background-color: #181818;
|
||||
font-family: "roboto";
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
button{
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
color: #ffd256;
|
||||
}
|
||||
|
||||
|
||||
button:focus {
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
a:link:not(.galleryLink), a:visited:not(.galleryLink){
|
||||
color: #ffd256;
|
||||
border-radius: 2px;
|
||||
transition: background-color 0.5s, color 0.5s;
|
||||
}
|
||||
|
||||
h1{
|
||||
#siteTitle h1{
|
||||
font-size: clamp(1.2rem, 4vw, 4rem);
|
||||
|
||||
padding-left: 6;
|
||||
|
@ -49,26 +13,6 @@ h1{
|
|||
|
||||
}
|
||||
|
||||
.subTitle{
|
||||
font-size: 30%;
|
||||
padding-top: 10;
|
||||
padding-left: 5;
|
||||
}
|
||||
|
||||
.orangeBorder{
|
||||
border: 2px solid transparent;
|
||||
border-radius: 5px;
|
||||
|
||||
padding: 5px;
|
||||
|
||||
transition: border 0.5s;
|
||||
}
|
||||
|
||||
.orangeBorder:hover{
|
||||
border: 2px solid #ffd256;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
.textBox{
|
||||
text-align: center;
|
||||
font-size: clamp(1rem, 1.2vw, 3rem);
|
||||
|
@ -109,7 +53,7 @@ h1{
|
|||
}
|
||||
|
||||
.galleryItem{
|
||||
height: 13vw;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
|
||||
|
@ -146,7 +90,7 @@ h1{
|
|||
width: 78.5vw;
|
||||
height: 19vh;
|
||||
transition: visibility 0.3s, opacity 0.5s;
|
||||
margin-top: 14.85vw;
|
||||
margin-top: 20.85vh;
|
||||
}
|
||||
|
||||
.popupTongue{
|
||||
|
@ -154,8 +98,8 @@ h1{
|
|||
opacity: 0;
|
||||
transition: visibility 0.3s, opacity 0.5s;
|
||||
|
||||
width: 1.85vw;
|
||||
height: 1.85vw;
|
||||
width: 1.85vh;
|
||||
height: 1.85vh;
|
||||
margin-left: 5vw;
|
||||
}
|
||||
|
||||
|
@ -184,6 +128,11 @@ h1{
|
|||
font-weight: 700;
|
||||
}
|
||||
|
||||
#galleryOutroLink{
|
||||
text-align: center;
|
||||
margin-top: 5vh;
|
||||
}
|
||||
|
||||
#outroText{
|
||||
margin-top: 12vh;
|
||||
margin-bottom: 20vh;
|
||||
|
@ -191,12 +140,5 @@ h1{
|
|||
margin-right: 27vw;
|
||||
}
|
||||
|
||||
#socialBar{
|
||||
display: flex;
|
||||
margin-bottom: 5vh;
|
||||
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
|
Loading…
Add table
Reference in a new issue