From 210e2f82fc4083aade8e3bee458e568e5bb84a00 Mon Sep 17 00:00:00 2001
From: Nye Evans <nyeevans@outlook.com>
Date: Thu, 14 Jan 2021 15:44:08 +0000
Subject: [PATCH] finishing touches

changed icon to fit new style
minor layout changes
cleaned some stuff up
---
 images/Favicon.ico                  | Bin 101025 -> 0 bytes
 images/Icon.ico                     | Bin 0 -> 16958 bytes
 index.html                          |   8 ++---
 pages/gallery-index.js              |   6 +++-
 pages/gallery.js                    |   1 +
 pages/gallery/blog-post-default.css |  39 ++++++++++++++++++++
 pages/mainpage.css                  |  53 ++++++++++++----------------
 7 files changed, 72 insertions(+), 35 deletions(-)
 delete mode 100644 images/Favicon.ico
 create mode 100644 images/Icon.ico

diff --git a/images/Favicon.ico b/images/Favicon.ico
deleted file mode 100644
index 2b9fa7cb77168c24bfa298bf00e4b871b6e46cd1..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 101025
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
brj-MQfLE_qqO1XET^-;fYz6%1Of~I)i%S)s

diff --git a/images/Icon.ico b/images/Icon.ico
new file mode 100644
index 0000000000000000000000000000000000000000..4086a97fad9f6a2a8497747efdf4d3671da314f6
GIT binary patch
literal 16958
zcmeI3!EM7Z3`H5_kV6kW6exV`F<aE=5S=HZd4^7q5i&pl*Q%h}a70PQcVNo>31r!n
zDDhF>JOr)CVfePK4A(a~e~7$_$a!dkNiIWk_TNt{^77=HH<VwSrs->H<z(@hHL;e&
z8mGLsmaJ9toO|NYQZv_**hk{=Zi)XM=8ok4ZVA)pSKnJ~OBkm7C4LrpQ!$k=g&gGO
zruMNsmg6enx6D@(TPg=R{*v`;n4{&u@oQr#F3o3a`<gLpYi-S#+kdUNW9#Jhwla>!
zj`~~31Hyp#T3~lEAPk5v`EC48fSe)X%k$^?ThIWaVZ_%0yNdx~Kzzy1_uqmB5Dg=~
z7TEdzv;H9(MtrG%)_)5cKs1c_T3~1WXZ=SsjQCRjtp64?fM^);wZP8$&-#yO81be4
zS^q6)0MRhwYk{5hpY<QnFyc%7v;JGq0HR^U*8)51KkGlLVbp)i_h60KV{16umRu!!
zuNAkpj^!Mz9dl~En#MHU<o^EK`PIZ3i&bNH_7eV@bC6<R!e3(!a_m$7)c*m*)`{uN
zf-M%SW((R6y*6*J_P{;u_sTlwnljJt=X3Y=Jm=M(|10-i@}Y6e?S1Dg$Nt+7yx)BP
oeD(dQ^ZhaO7yo?FdOytTgEOG!zw;aao!8YrpTfC@a}MYJ1G&e9;s5{u

literal 0
HcmV?d00001

diff --git a/index.html b/index.html
index c7ad9da..ce0e13a 100644
--- a/index.html
+++ b/index.html
@@ -2,7 +2,7 @@
 
 <header>
     <link rel = "stylesheet" href = "pages\mainpage.css">
-    <link rel = "icon" href = "..\images\Favicon.ico">
+    <link rel = "icon" href = "images\Icon.ico">
 
     <meta charset="UTF-8">
 
@@ -41,10 +41,10 @@
     </div>
 
     <div id = "programGallery">
-        <a href = "pages/gallery/Cat_tower_defense/cat-tower-defense.html"  class = "galleryLink">
-            <img src = ""  class = "galleryImage">
-        </a>
         <p class = "galleryTitle"></p>
+        <a href = "pages/gallery/Cat_tower_defense/cat-tower-defense.html"  class = "galleryLink">
+            <img src = ""  class = "galleryImage" style = "">
+        </a>
         <p class = "galleryCaption"></p>
         <button class = "galleryLeftArrow" onClick = "window.parent.lastSlide();">◄</button>
         <button class = "galleryRightArrow" onClick = "window.parent.nextSlide();">►</button>
diff --git a/pages/gallery-index.js b/pages/gallery-index.js
index 26dac2b..cc5d5a1 100644
--- a/pages/gallery-index.js
+++ b/pages/gallery-index.js
@@ -1,8 +1,9 @@
 export class slide{
-    constructor(title, caption, image, link){
+    constructor(title, caption, image, imagePos, link){
         this.title = title;
         this.caption = caption;
         this.image = image;
+        this.imagePos = imagePos;
         this.link = link;
     }
 }
@@ -14,6 +15,7 @@ export var slides = [
         environment.<br><br>This system was my introduction to Unreal Engine and mainly used its \"Blueprint\" visual language, however I later used C++ to try and add my own physics \
         to it.", 
         "./pages/gallery/epq-project/projectHeaderImage.png", 
+        "object-position: center;",
         "./pages/gallery/epq-project/epq-project.html"
         ),
     new slide(
@@ -21,6 +23,7 @@ export var slides = [
         "A project I created with a friend to help us gain a better understanding of pygame. <br><br> This was a basic tower defence game but featured a fully scalable and customisable \
         level system allowing users to add their own levels and towers. One of my earliest projects, this is something I have revisited and improved upon quite a few times.", 
         "./pages/gallery/cat-tower-defence/projectHeaderImage.png", 
+        "object-position: top;",
         "./pages/gallery/cat-tower-defence/cat-tower-defence.html"
         ),
     new slide(
@@ -29,6 +32,7 @@ export var slides = [
         a graphical interface that allowed the user to draw, move and label rooms as well as set the painting and carpeting price which could later be used to calculate \
         full decoration costs.", 
         "./pages/gallery/room-builder/projectHeaderImage.png", 
+        "object-position: top;",
         "./pages/gallery/room-builder/room-builder.html"
         )
 ];  
\ No newline at end of file
diff --git a/pages/gallery.js b/pages/gallery.js
index e70b63a..2be8a64 100644
--- a/pages/gallery.js
+++ b/pages/gallery.js
@@ -24,6 +24,7 @@ function updateSlide(){
     document.querySelector(".galleryCaption").innerHTML = slides[currentSlide].caption;
     document.querySelector(".galleryLink").href = slides[currentSlide].link;
     document.querySelector(".galleryImage").src = slides[currentSlide].image;
+    document.querySelector(".galleryImage").style = slides[currentSlide].imagePos;
 
 }
 
diff --git a/pages/gallery/blog-post-default.css b/pages/gallery/blog-post-default.css
index 9d4e693..295e7a7 100644
--- a/pages/gallery/blog-post-default.css
+++ b/pages/gallery/blog-post-default.css
@@ -57,6 +57,19 @@ iframe{
 
 
 @media (orientation:portrait){
+    body{
+        /*
+        touch-action: none;
+        touch-action: pan-y;
+        as well as disabling double tap, disables zoom which some people with bad eyes need, use something else
+        */
+        touch-action: manipulation; /*stops double tap zoom*/
+
+        -webkit-text-size-adjust: none; /*stops browsers messing with text size*/
+        -moz-text-size-adjust: none;
+        -ms-text-size-adjust: none;
+        text-size-adjust: none;
+    }
 
     h1{
         font-size: 10vw;
@@ -74,6 +87,32 @@ iframe{
 
     }
 
+    h2{
+        font-size: clamp(25px, 3.6vw, 50px);
+        padding: 0;
+    }
+
+    .textBox{
+        font-size: clamp(25px, 2vw, 50px);
+        padding: 15px;
+        margin-bottom: 5vh;
+    }
+
+    .backButton{
+        font-size: clamp(25px, 2.5vw, 50px);
+    }
+
+    .videoContainer{
+        text-align: center;
+    }
+    
+    iframe{
+        border: 2px solid #ffd256;
+        
+        width: 90vw;
+        height: 50vw;
+    }
+
 }
 
 
diff --git a/pages/mainpage.css b/pages/mainpage.css
index ff340f4..bd611a3 100644
--- a/pages/mainpage.css
+++ b/pages/mainpage.css
@@ -26,6 +26,11 @@ button:focus {
     outline: none;
 }
 
+a:link, a:visited{
+    color: #ffd256;
+    text-decoration: none;
+}
+
 h1{ 
     font-size: clamp(1.2rem, 4vw, 4rem);
 
@@ -163,7 +168,6 @@ h1{
 }
 
 #socialBar{
-    position: fixed;
     display: flex;
     margin-left: 1vh;
     margin-bottom: 1vh;   
@@ -183,9 +187,9 @@ h1{
         touch-action: pan-y;
         as well as disabling double tap, disables zoom which some people with bad eyes need, use something else
         */
-        touch-action: manipulation;
+        touch-action: manipulation; /*stops double tap zoom*/
 
-        -webkit-text-size-adjust: none;
+        -webkit-text-size-adjust: none; /*stops browsers messing with text size*/
         -moz-text-size-adjust: none;
         -ms-text-size-adjust: none;
         text-size-adjust: none;
@@ -211,62 +215,51 @@ h1{
         padding: 0;
         margin-top: 3vh;
         margin-bottom: 3vh;
-        margin-left: 5px;
-        margin-right: 5px;
+        margin-left: 15px;
+        margin-right: 15px;
 
         min-width: inherit;
         max-width: inherit;
 
-        border-radius: 0;
+        border: 0;
 
         text-align: left;
         font-size: clamp(25px, 3.6vw, 50px);
     }
 
     .profileImage{
-        margin: 0;
-        width: 100%; 
+        width: 90%; 
+    }
 
-        border: none;
-        border-radius: 0;
-        border-top:  5px solid #ffd256;
-        border-bottom:  5px solid #ffd256;
-
-        padding-left: 0;
-        padding-right: 0;
+    .orangeBorder{
+        border: 5px solid #ffd256;
+        border-radius: 10px;
     }
 
     #galleryHeader{
-        margin-left: 0; 
-        margin-right: 0;
-        border-radius: 0;
+        margin-left: 15px; 
+        margin-right: 15px;
         font-size: clamp(2rem, 4vw, 5rem);
     }
 
     #programGallery{
-        width: 100%;
+        width: 92vw;
+     
+        margin-left: 4vw;
+        margin-right: 4vw;
 
-        
-        margin-left: 0;
-        margin-right: 0;
-
-        border-bottom: 5px solid #ffd256;
-        border-top: 5px solid #ffd256;
+        border: 5px solid #ffd256;
+        border-radius: 10px;
     }
 
     .galleryImage{ /*all images should be 700x700*/
         grid-column: 1/13;
         grid-row: 2/7;
 
-        padding-left: 0;
-        padding-right: 0;
         border-radius: 0;
-
         border: 5px solid #ffd256;
         border-left: 0;
         border-right: 0;
-
-        object-position: center;
     
         object-fit: cover;