:3

css/footer.css

@@ -34,7 +34,7 @@ footer .top div {
 
 	color: var(--fg-dark);
 }
-footer .uwu {
+footer .op {
 	margin: 0.5em auto;
 	padding: 0;
 
@@ -43,23 +43,23 @@ footer .uwu {
 	display: flex;
 	justify-content: space-around;
 }
-footer .uwu hr {
+footer .op hr {
   margin: 0;
   padding: 0;
 }
 @media (max-width:470px) {
-	footer .uwu {
+	footer .op {
 		flex-direction: column;
 		justify-content: center;
 		align-items: center;
 	}
-  footer .uwu hr {
+  footer .op hr {
     display: none;
   }
 }
 
-footer .uwu p,
+footer .op p,
-footer .uwu a {
+footer .op a {
 	font-family: 'Lexend Deca', sans-serif;
 
 	margin: 0;

css/team.css

@@ -118,6 +118,8 @@
 	background: #151515dd;
 
 	border-radius: 0;
+
+	backdrop-filter: blur(1px);
 }
 #team .fullScreenImage span {
 	margin: 0;
@@ -134,6 +136,8 @@
 	font-weight: bolder;
 	color: #FFFFFF;
 	cursor: pointer;
+
+	user-select: none;
 }
 #team .fullScreenImage img {
 	margin: 0;
@@ -141,6 +145,8 @@
 
 	max-width: 90%;
 	max-height: 90%;
+	width: auto;
+	height: auto;
 	min-width: none;
 	min-height: none;
 
@@ -152,5 +158,8 @@
 	left: 50%;
 	transform: translate(-50%, -50%);
 
-	border-radius: 0;
+	background-color: #151515;
+	outline: #FFFFFF88 1px solid;
+	border: #00000088 1px solid;
+	border-radius: 5px;
 }

fullscreenViewer.js

@@ -0,0 +1,14 @@
+document.querySelectorAll(".gallery div img").forEach(image =>{
+  image.onclick = () =>{
+    document.querySelector(".fullScreenImage").style.display= "block";
+    document.querySelector(".fullScreenImage img").src = image.getAttribute("src");
+
+    document.querySelector("html").style.overflow= "hidden";
+  }
+});
+
+document.querySelector(".fullScreenImage span").onclick = () =>{
+  document.querySelector(".fullScreenImage").style.display= "none";
+
+  document.querySelector("html").style.overflow= "auto";
+}

index.html

@@ -31,6 +31,9 @@
 
 		<!-- Root of all the text sections -->
 		<main>
+			<img src="images/merror.jpg" alt="" class="manualError">
+			<!-- Script -->
+			<script src="script.js"></script>
 			<header>
 				<img src="images/wiggleBefore.png" alt="3 colourful wiggly lines">
 				<h1>Welcome to DV8's Game Event!</h1>
@@ -50,17 +53,17 @@
 
 				    <p>Team:</p>
 				    <p>- Farley Barker
-							<span class="gray">3D Environment Art, Game Design, Programming</span></p>
+							<span class="gray">3D&nbsp;Environment&nbsp;Art, Game&nbsp;Design, Programming</span></p>
 				    <p>- Ben Easton
-							<span class="gray">3D Art, Story Development</span></p>
+							<span class="gray">3D&nbsp;Art, Story&nbsp;Development</span></p>
 				    <p>- Hannah Burfoot
-							<span class="gray">Character Art, UI Design</span></p>
+							<span class="gray">Character&nbsp;Art, UI&nbsp;Design</span></p>
 				    <p>- Sasha Guerrier Gregory
-							<span class="gray">Level Design, Game Design</span></p>
+							<span class="gray">Level&nbsp;Design, Game&nbsp;Design</span></p>
 				    <p>- Toby Pettman
 							<span class="gray">Programming</span></p>
 				    <p>- Russell Charlwood
-							<span class="gray">3D Environment Art, Level Design, Programming</span></p>
+							<span class="gray">3D&nbsp;Environment&nbsp;Art, Level&nbsp;Design, Programming</span></p>
 
 				    <p>About: Foragers Haven is a peaceful, cute, stylized adventure walking simulator. Explore a humble little forest, follow the quest line, craft potions and harvest plants, flowers and items around you.<p>
 				  </div>
@@ -183,11 +186,11 @@
 				<!-- Screen overlay -->
 				<div class="fullScreenImage">
 				  <span>&times;</span>
-				  <img src="images/noImage.jpg" alt="">
+				  <img src="images/noImage.png" alt="Error, could not load image">
 				</div>
 
 				<!-- Script -->
-				<script src="script.js"></script>
+				<script src="fullscreenViewer.js"></script>
 			</section>
 
 			<section id="about">
@@ -273,7 +276,7 @@
 					<p></p>
 				</div>
 			</div>
-			<div class="uwu">
+			<div class="op">
 				<p>Made by Michal</p>
 				<hr>
 				<a href="https://github.com/Fluffy-Bean/GameExpo">GitHub</a>
@@ -291,7 +294,7 @@
 	<!--.. /0 0 \ . . . . . ..-->
 	<!--(III% . \________, . .-->
 	<!--.. .\_, .%###%/ \'\,..-->
-  <!--. . . .||#####| |'\ \.-->
+	<!--. . . .||#####| |'\ \.-->
 	<!--.. . . ||. . .|/. .\V.-->
 	<!--. . . .|| . . || . . .-->
 	<!--.. . . ||. . .||. . ..-->

script.js

@@ -1,14 +1,7 @@
-document.querySelectorAll(".gallery div img").forEach(image =>{
+document.querySelector(".manualError").onclick = () =>{
-  image.onclick = () =>{
+  document.querySelector(".manualError").style.top= "5em";
-    document.querySelector(".fullScreenImage").style.display= "block";
+  document.querySelector(".manualError").style.width= "160px";
-    document.querySelector(".fullScreenImage img").src = image.getAttribute("src");
+  document.querySelector(".manualError").style.height= "90px";
-
-    document.querySelector("html").style.overflow= "hidden";
-  }
-});
-
-document.querySelector(".fullScreenImage span").onclick = () =>{
-  document.querySelector(".fullScreenImage").style.display= "none";
-
-  document.querySelector("html").style.overflow= "auto";
 }
+
+console.log("UwU")

stylesheet.css

@@ -133,7 +133,7 @@ h3 {
 	margin: 0.5em 0;
 }
 .gray {
-	margin: 0;
+	margin: 0 !important;
 	padding: 0;
 
 	color: #696969;
@@ -173,3 +173,16 @@ h3 {
 		padding: 3em 0 0 0;
 	}
 }
+
+/*
+	No cheating!
+*/
+.manualError {
+	width: 40px;
+	height: 40px;
+
+	top: 0.6em;
+	left: 2em;
+
+	position: absolute;
+}