DressOrc/Portfolio
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

removed secondary gallery, replaced filler with actual text

Browse source 
almost done!
This commit is contained in:
Nye Evans 2021-01-04 18:24:33 +00:00
parent c096339b44
commit 3556ba1a36
3 changed files with 35 additions and 69 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
pages/gallery.js
View file

@ -19,11 +19,10 @@ function updateSlide(){
} else if (currentSlide < 0){
currentSlide = slides.length-1;
}
document.getElementById("programGalleryTitle").innerHTML = slides[currentSlide].title;
document.getElementById("programGalleryCaption").innerHTML = slides[currentSlide].caption;
document.getElementById("programGalleryImage").src = slides[currentSlide].image;
document.getElementById("programGalleryLink").href = slides[currentSlide].link;
document.querySelector(".galleryTitle").innerHTML = slides[currentSlide].title;
document.querySelector(".galleryCaption").innerHTML = slides[currentSlide].caption;
document.querySelector(".galleryImage").src = slides[currentSlide].image;
document.querySelector(".galleryLink").href = slides[currentSlide].link;
}
console.log("script loaded");
updateSlide();

35
pages/index.html
View file

@ -19,8 +19,9 @@
</div>
<h2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Hey I'm Nye, welcome to my portfolio! I'm an aspiring software developer who's fluent in C++, C# and Python, with an intrest in lower level langauges like Assembly.
Most of my work is software based, with Python and C++, although I sometimes dabble in game design with groups of friends, in Unity, Unreal Engine and some solo level design in Source 1.
When I'm not programming I'm most often drawing, playing board games, video games or baking.
</h2>
<div style = "width: 100%; height: auto; text-align: center;">
@ -28,8 +29,10 @@
</div>
<h3 style = "margin-bottom: 5vh;">
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
I love creating and working with large libraries and building intricate systems. The feeling of using systems and classes I or a close friend have built in an earlier part of a project is something I love,
remembering the thought put into how it works and seeing it interact seemlessly and efficiently with other parts designed separately. I imagine its how it feels to build the house you live within, each part
has a story and feels special to you on a personal level.
</h3>
<div class = "textBox" id = "galleryHeader">
@ -38,22 +41,18 @@
</div>
<div id = "programGallery">
<p class = "galleryDescriptor">Development projects</p>
<a href = "\gallery\Cat_tower_defense\cat-tower-defense.html" class = "GalleryImage" id = "programGalleryLink"><img src = "gallery\Cat_tower_defense\projectHeaderImage.png" class = "galleryImage" id = "programGalleryImage"></a>
<p class = "galleryTitle" id = "programGalleryTitle">Image Title</p>
<p class = "galleryCaption" id = "programGalleryCaption">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<a href = "\gallery\Cat_tower_defense\cat-tower-defense.html" class = "galleryImage galleryLink">
<img src = "gallery\Cat_tower_defense\projectHeaderImage.png" class = "galleryImage">
</a>
<p class = "galleryTitle">Image Title</p>
<p class = "galleryCaption">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<button class = "galleryLeftArrow" onClick = "window.parent.lastSlide();">◄</button>
<button class = "galleryRightArrow" onClick = "window.parent.nextSlide();">►</button>
</div>
<div id = "personalGallery">
<p class = "galleryDescriptor">Unrealated projects</p>
<img src = "gallery\Cat_tower_defense\projectHeaderImage.png" class = "GalleryImage">
<p class = "galleryTitle">Image Title Unrelated</p>
<p class = "galleryCaption">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<p class = "galleryLeftArrow">◄</p>
<p class = "galleryRightArrow">►</p>
</div>
<h4>
I hope you like my work! I've you ever want to contact me, my twitter, email and github can be found below:
</h4>
<div id = "socialBar">
<a href = "https://twitter.com/Wi__Ro" target="_blank" style = "color:#ffd256;">Twitter</a>
@ -62,10 +61,6 @@
&NonBreakingSpace;
<a href="https://github.com/WillowRo" target="_blank" style = "color:#ffd256;">Github</a>
</div>
<h4>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</h4>
</body>
</HTML>

60
pages/mainpage.css
View file

@ -17,7 +17,7 @@ body{
h1, h2, h3, h4{
font-size: clamp(12px, 1vw, 50px);
font-size: clamp(18px, 1.4vw, 70px);
padding: 1.3vh;
}
@ -71,18 +71,6 @@ button{
font-size: 1.3vw;
}
.galleryDescriptor{
font-size: 1vw;
vertical-align: text-bottom;
grid-column:2/13;
grid-row: 1;
padding-left: 7px;
font-size: clamp(13px, 1vw, 40px);
}
#galleryHeader{
margin-left: 35vw;
margin-right: 35vw;
@ -93,7 +81,7 @@ button{
#programGallery{
display: grid;
grid-template-columns: repeat(12, 1fr);
grid-template-rows: repeat(11, 1fr);
grid-template-rows: repeat(10, 1fr);
height: 70vh;
width: 70vw;
@ -106,26 +94,10 @@ button{
margin-top: 10vh;
}
#personalGallery{
display: grid;
grid-template-columns: repeat(12, 1fr);
grid-template-rows: repeat(11, 1fr);
height: 70vh;
width: 70vw;
min-width: 800px;
min-height: 500px;
margin-left: auto;
margin-right: auto;
margin-bottom: 10vh;
margin-top: 10vh;
}
.galleryImage{ /*all images should be 700x700*/
grid-column: 2/8;
grid-row: 3/12;
grid-row: 2/12;
object-fit: cover;
@ -143,7 +115,7 @@ img.galleryImage{
.galleryTitle{
grid-column: 2/12;
grid-row: 2;
grid-row: 1;
padding: 5px;
@ -160,7 +132,7 @@ img.galleryImage{
.galleryCaption{
grid-column: 8/12;
grid-row: 3/12;
grid-row: 2/12;
border-radius: 0;
border-bottom-right-radius: 5px;
@ -174,13 +146,13 @@ img.galleryImage{
.galleryLeftArrow{
grid-column: 1;
grid-row: 6/7;
grid-row: 5/6;
font-size: 7vw;
}
.galleryRightArrow{
grid-column: 12;
grid-row: 6/7;
grid-row: 5/6;
font-size: 7vw;
}
@ -222,9 +194,11 @@ button:focus {
}
h2, h3{
h2, h3, h4{
margin-top: 10vh;
margin-bottom: 10vh;
margin-left: auto;
margin-right: auto;
min-width: inherit;
max-width: inherit;
@ -250,14 +224,6 @@ button:focus {
margin-right: 0;
}
#personalGallery{
height: 70vh;
width: 100%;
margin-left: 0;
margin-right: 0;
}
.galleryDescriptor{
grid-column: 1/13;
}
@ -315,6 +281,12 @@ button:focus {
grid-row: 13;
font-size: 7vw;
}
#socialBar{
position: static;
font-size: 3vw;
}
}