Cleanup and Fixup

mutant-remix · Nov 22, 2023 · a7256a6 · a7256a6
1 parent 9ea0cc4
commit a7256a6
Show file tree

Hide file tree

Showing 11 changed files with 59 additions and 712 deletions.
diff --git a/config/global/style/footer.css b/config/global/style/footer.css
@@ -4,10 +4,17 @@ footer {
 	left: 0;
     text-align: center;
 	margin: 50px 0;
-	padding: 10px 0;
+	padding: 10px 4rem;
 	background: var(--light_black);
 }
 
 footer a:link, footer a:visited, footer a:hover, footer a:active {
 	text-decoration: none;
 }
+
+@media (max-width: 700px) {
+footer {
+    padding: 10px;
+}
+
+}
diff --git a/config/pages/index/index.md b/config/pages/index/index.md
@@ -3,6 +3,12 @@
 		text-align: center;
 	}
 
+    #landing {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+    }
+
 	#hero {
 		min-height: 80dvh;
 		font-size: 1.5rem;
@@ -24,6 +30,11 @@
 		line-height: 4rem;
         margin-bottom: 1rem;
 	}
+
+    #information {
+        max-width: 100ch;
+    }
+
     h2 {
         margin-top: 1rem;
     }
@@ -32,10 +43,11 @@
         display: flex;
 		text-align: left;
         padding: 0 3rem;
+        gap: 1rem;
     }
 
     li {
-        list-style-position: initial;
+        list-style-position: inside;
     }
 
     #dos {
@@ -55,6 +67,7 @@
     @media (max-width: 1000px) {
     #lists {
         flex-direction: column;
+        padding: 0;
     }
 	#hero {
         flex-direction: column-reverse;
@@ -64,6 +77,9 @@
     #herotext {
         max-width: 100%
     }
+
+    #bubble {
+    padding: 20px;
 
     }
 </style>
@@ -85,6 +101,8 @@
 		</div>
 	</div>
 
+<div id="information">
+
 ## Express yourself in new ways.
 Mutant introduces an exciting array of fresh and distinctive emojis along with various variations, offering you the
 	freedom to express yourself through emojis the way you truly like.
@@ -114,7 +132,7 @@ Here are a few ground rules regarding how you can use the emoji pack:
 			<p>Share the love, share the mutants. Copy and redistribute Mutant Remix as you see fit, embracing the spirit of collaboration and creativity.</p>
 		</li>
 		<li>
-			<h3>Make your own! (add attribution!)</h3>
+			<h3>Make it your own! (add attribution!)</h3>
 			<p>You’re free to remix, transform or build upon the Mutant Remix or Mutant Standard emoji pack, as long as you follow the original Creative Commons license.</p>
 		</li>
 	</ul>
@@ -124,7 +142,7 @@ Here are a few ground rules regarding how you can use the emoji pack:
 			<p>You’re not allowed to sell the entirety or parts of the emoji pack or restrict anyone from using it behind a paywall.</p>
 		</li>
 		<li>
-			<h3>Redistribute with the same license.</h3>
+			<h3>Break the license terms.</h3>
 			<p>Mutant, and Mutant Remix by extension, are both licensed under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.</p>
 		</li>
 	</ul>
@@ -138,3 +156,4 @@ Help us to save these cute blobs! By using the Mutant Remix emoji pack, you’re
 
 </div>
 </div>
+</div>
diff --git a/docs/index.html b/docs/index.html
@@ -62,6 +62,12 @@
 		text-align: center;
 	}
 
+    #landing {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+    }
+
 	#hero {
 		min-height: 80dvh;
 		font-size: 1.5rem;
@@ -83,6 +89,11 @@
 		line-height: 4rem;
         margin-bottom: 1rem;
 	}
+
+    #information {
+        max-width: 100ch;
+    }
+
     h2 {
         margin-top: 1rem;
     }
@@ -91,10 +102,11 @@
         display: flex;
 		text-align: left;
         padding: 0 3rem;
+        gap: 1rem;
     }
 
     li {
-        list-style-position: initial;
+        list-style-position: inside;
     }
 
     #dos {
@@ -114,6 +126,7 @@
     @media (max-width: 1000px) {
     #lists {
         flex-direction: column;
+        padding: 0;
     }
 	#hero {
         flex-direction: column-reverse;
@@ -123,6 +136,9 @@
     #herotext {
         max-width: 100%
     }
+
+    #bubble {
+    padding: 20px;
 
     }
 </style>
@@ -142,6 +158,7 @@ <h1>An emoji pack so good, you'll never want to use another.</h1>
 			<img src="assets/Emoji_Hero.svg" alt="Emojis bursting from centre point">
 		</div>
 	</div>
+<div id="information">
 <h2>Express yourself in new ways.</h2>
 <p>Mutant introduces an exciting array of fresh and distinctive emojis along with various variations, offering you the
 freedom to express yourself through emojis the way you truly like.</p>
@@ -164,7 +181,7 @@ <h3>Share the emoji pack with your friends!</h3>
 			<p>Share the love, share the mutants. Copy and redistribute Mutant Remix as you see fit, embracing the spirit of collaboration and creativity.</p>
 		</li>
 		<li>
-			<h3>Make your own! (add attribution!)</h3>
+			<h3>Make it your own! (add attribution!)</h3>
 			<p>You’re free to remix, transform or build upon the Mutant Remix or Mutant Standard emoji pack, as long as you follow the original Creative Commons license.</p>
 		</li>
 	</ul>
@@ -174,7 +191,7 @@ <h3>Use it for any commercial purposes.</h3>
 			<p>You’re not allowed to sell the entirety or parts of the emoji pack or restrict anyone from using it behind a paywall.</p>
 		</li>
 		<li>
-			<h3>Redistribute with the same license.</h3>
+			<h3>Break the license terms.</h3>
 			<p>Mutant, and Mutant Remix by extension, are both licensed under the Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.</p>
 		</li>
 	</ul>
@@ -183,6 +200,7 @@ <h3>Redistribute with the same license.</h3>
 <h2>#SaveTheBlobs</h2>
 <p>Help us to save these cute blobs! By using the Mutant Remix emoji pack, you’re not only supporting open-sourceprojects like ours, but are also helping us keep our blobby friends alive. Thank you!</p>
 </div>
+</div>
 </div>
 
 

diff --git a/docs/style/footer.css b/docs/style/footer.css
@@ -4,10 +4,17 @@ footer {
 	left: 0;
     text-align: center;
 	margin: 50px 0;
-	padding: 10px 0;
+	padding: 10px 4rem;
 	background: var(--light_black);
 }
 
 footer a:link, footer a:visited, footer a:hover, footer a:active {
 	text-decoration: none;
 }
+
+@media (max-width: 700px) {
+footer {
+    padding: 10px;
+}
+
+}