From a69bd66d73d9e2dbf49156d4385caf975db63b4e Mon Sep 17 00:00:00 2001 From: Nye Evans Date: Tue, 14 Sep 2021 11:07:56 +0100 Subject: [PATCH] adds interactivity to css borders now only appear on hover transition time added --- index.html | 6 ++-- pages/AllProjects.html | 35 +++++++++++++++++++ pages/CVPage.html | 1 + pages/NoTwitter.html | 1 + .../gallery/aardvark-work/aardvark-work.html | 1 + .../cat-tower-defence/cat-tower-defence.html | 1 + pages/gallery/epq-project/epq-project.html | 2 ++ pages/gallery/room-builder/room-builder.html | 1 + pages/mainpage.css | 16 +++++++-- scripts/gallery.js | 13 +++++-- 10 files changed, 69 insertions(+), 8 deletions(-) create mode 100644 pages/AllProjects.html diff --git a/index.html b/index.html index f3b1943..9f556a0 100644 --- a/index.html +++ b/index.html @@ -1,3 +1,4 @@ +
@@ -25,9 +26,10 @@ Most of my work is software based, with Python and C++ along with some web-development experience in HTML, CSS, JavaScript and TypeScript. -
- me +
+ me +
diff --git a/pages/AllProjects.html b/pages/AllProjects.html new file mode 100644 index 0000000..7968d48 --- /dev/null +++ b/pages/AllProjects.html @@ -0,0 +1,35 @@ + + + +
+ + + + + + Nye Evans Portfolio +
+ + + + + + + + + +
+ Twitter +   + Email +   + Github +   + Dev.to + +   + CV +
+ + + \ No newline at end of file diff --git a/pages/CVPage.html b/pages/CVPage.html index a2781f1..63f892b 100644 --- a/pages/CVPage.html +++ b/pages/CVPage.html @@ -1,3 +1,4 @@ +
diff --git a/pages/NoTwitter.html b/pages/NoTwitter.html index 9c44fc1..761561a 100644 --- a/pages/NoTwitter.html +++ b/pages/NoTwitter.html @@ -1,3 +1,4 @@ + no twitter here :)

I'll pop something here eventually, before i start using the site properly diff --git a/pages/gallery/aardvark-work/aardvark-work.html b/pages/gallery/aardvark-work/aardvark-work.html index 29cb91e..371e5b4 100644 --- a/pages/gallery/aardvark-work/aardvark-work.html +++ b/pages/gallery/aardvark-work/aardvark-work.html @@ -1,3 +1,4 @@ +
diff --git a/pages/gallery/cat-tower-defence/cat-tower-defence.html b/pages/gallery/cat-tower-defence/cat-tower-defence.html index c83cc54..f3f2b12 100644 --- a/pages/gallery/cat-tower-defence/cat-tower-defence.html +++ b/pages/gallery/cat-tower-defence/cat-tower-defence.html @@ -1,3 +1,4 @@ +
diff --git a/pages/gallery/epq-project/epq-project.html b/pages/gallery/epq-project/epq-project.html index b3845f7..694d873 100644 --- a/pages/gallery/epq-project/epq-project.html +++ b/pages/gallery/epq-project/epq-project.html @@ -1,3 +1,5 @@ + +
diff --git a/pages/gallery/room-builder/room-builder.html b/pages/gallery/room-builder/room-builder.html index 89c110a..91c8f3f 100644 --- a/pages/gallery/room-builder/room-builder.html +++ b/pages/gallery/room-builder/room-builder.html @@ -1,3 +1,4 @@ +
diff --git a/pages/mainpage.css b/pages/mainpage.css index 98b8938..30be467 100644 --- a/pages/mainpage.css +++ b/pages/mainpage.css @@ -30,6 +30,8 @@ button:focus { a:link, a:visited{ color: #ffd256; + border-radius: 2px; + transition: background-color 0.5s, color 0.5s; } h1{ @@ -54,10 +56,17 @@ h1{ } .orangeBorder{ - border: 2px solid #ffd256; + border: 2px solid transparent; border-radius: 5px; padding: 5px; + + transition: border 0.5s; +} + +.orangeBorder:hover{ + border: 2px solid #ffd256; + padding: 5px; } .textBox{ @@ -72,7 +81,8 @@ h1{ .profileImage{ width: 30vw; - height: auto; + height: 30vw; + text-align: center; } #galleryHeader{ @@ -114,7 +124,7 @@ h1{ border-bottom-left-radius: 5px; box-sizing: border-box; - padding: 5; + padding: 5px; } .galleryLink{ diff --git a/scripts/gallery.js b/scripts/gallery.js index 67846f2..49af54a 100644 --- a/scripts/gallery.js +++ b/scripts/gallery.js @@ -1,8 +1,8 @@ var currentSlide = 0; var allSlides = document.querySelectorAll(".programGallery"); - -window.nextSlide = function nextSlide(){ +// code for gallery to function during use +window.nextSlide = function nextSlide(){ currentSlide++; updateSlide(); } @@ -30,5 +30,12 @@ function hideAll(){ } } +// code to set up gallery when site is being loaded + + hideAll() -updateSlide(); \ No newline at end of file +updateSlide(); + +// todo +/*use webp image format + */ \ No newline at end of file