Optimized gifs

TylerMommsen · Mar 6, 2024 · 83bee35 · 83bee35
1 parent e09da19
commit 83bee35
Show file tree

Hide file tree

Showing 10 changed files with 15 additions and 4 deletions.
diff --git a/public/tutorial/mazegengif.gif b/public/tutorial/mazegengif.gif
diff --git a/public/tutorial/movestartendgif.gif b/public/tutorial/movestartendgif.gif
diff --git a/public/tutorial/othercustomizationsgif.gif b/public/tutorial/othercustomizationsgif.gif
diff --git a/public/tutorial/pathfindingdemogif.gif b/public/tutorial/pathfindingdemogif.gif
diff --git a/public/tutorial/placewallsgif.gif b/public/tutorial/placewallsgif.gif
diff --git a/public/tutorial/resetgridgif.gif b/public/tutorial/resetgridgif.gif
diff --git a/public/tutorial/selectalgorithmgif.gif b/public/tutorial/selectalgorithmgif.gif
diff --git a/public/tutorial/viewalgorithmgif.gif b/public/tutorial/viewalgorithmgif.gif
diff --git a/public/tutorial/viewotherpathsgif.gif b/public/tutorial/viewotherpathsgif.gif
diff --git a/src/styles/modals/_help.scss b/src/styles/modals/_help.scss
@@ -20,22 +20,27 @@
 		border-radius: 1rem;
 		padding: 2rem;
 		background-color: $primary;
-		min-height: 70%;
-		min-width: 40%;
+		min-height: 80%;
+		min-width: 50%;
 		word-wrap: break-word;
 		overflow-wrap: break-word;
 		white-space: normal;
 
 		h2 {
-			font-size: 1.6rem;
+			font-size: 2rem;
 		}
 
 		p {
-			max-width: 60ch;
+			max-width: 70ch;
 			text-align: center;
 			font-size: 1.2rem;
 		}
 
+		.tutorial-gif {
+			width: 100%;
+			height: auto;
+		}
+
 		.page-counter {
 			position: absolute;
 			padding-bottom: 2rem;
@@ -59,6 +64,10 @@
 			a {
 				font-size: 0.8rem;
 			}
+
+			.tutorial-gif {
+				// width: 70%;
+			}
 		}
 
 		#help-modal-close-btn {
@@ -85,10 +94,12 @@
 				color: $primary;
 				padding: 0.5rem 1rem 0.5rem 1rem;
 				border-radius: 0.5rem;
+				font-size: 1.2rem;
 				cursor: pointer;
 
 				@media only screen and (max-width: 1400px) {
 					font-size: 0.8rem;
+					padding: 0.4rem 0.8rem 0.4rem 0.8rem;
 				}
 
 				&:hover {