various fixes

css/style.css

@@ -69,7 +69,7 @@
 html {
 	font-size: 12pt;
 	overflow-x: hidden;
-	background: none;
+	background: #222;
 	color: white;
 }
 body {
@@ -117,6 +117,7 @@ img {
 ::-webkit-scrollbar-thumb {
   background: #888;
   border-radius: 0.25rem;
+  margin: 1px;
 }
 /*Fonts*/
 .title {
@@ -200,9 +201,17 @@ a:hover {
 .center {
 	text-align: center;
 }
+.layer {
+	padding: 2rem;
+}
+.vertical-center {
+	margin: auto;
+}
+@media only screen and (min-width: 750px) {
 	.layer {
 		padding: 4rem;
 	}
+}
 /*Hamburger*/
 .hamburger {
 	position: fixed;
@@ -384,6 +393,25 @@ textarea.input {
 
 
 
+/*Home Page only*/
+.sample-grid {
+	display: grid;
+	grid-gap: 1rem;
+	grid-template-columns: 1fr;
+}
+.sample-grid > img {
+	max-width: 375px;
+	width: 100%;
+	height: auto;
+}
+@media only screen and (min-width: 750px) {
+	.sample-grid {
+		grid-template-columns: 375px auto;
+	}
+	.sample-grid.right {
+		grid-template-columns: auto 375px;
+	}
+}
 
 
 
@@ -587,8 +615,10 @@ textarea.input {
 	background: #333;
 }
 .text-codes {
+	max-width: calc(100vw - 3rem);
 	display: grid;
-	grid-template-columns: 11rem auto;
+	grid-template-columns: auto auto;
+	overflow-x: scroll;
 }
 .text-codes > * {
 	border: 1px solid black;

globalHTML/footer.php

@@ -3,6 +3,7 @@
 			<h4>Card Conjurer</h4>
 			<h5><a href='https://twitter.com/ImKyle4815' target='_blank'>Twitter</a></h5>
 			<h5><a href='https://www.patreon.com/KyleBurton' target='_blank'>Patreon</a></h5>
+			<h5><a href='mailto:cardconjurermtg@gmail.com' target='_blank'>Email</a></h5>
 		</div>
 		<div>
 			<h4>Navigation</h4>

index.php

@@ -1,9 +1,40 @@
 <?php include('globalHTML/header.php'); ?>
 	<title>Card Conjurer</title>
+	<div class='layer center'></div>
 	<div class='layer center'>
-		<h2>Welcome to Card Conjurer</h2>
+		<h1>Welcome to Card Conjurer</h1>
+		<h4>The custom Magic: The Gathering card creator</h4>
+	</div>
+	<div class='layer center'></div>
+	<div class='layer readable-background center'>
+		<div class='sample-grid'>
+			<img src='/img/samples/sample1.png'>
+			<div class='vertical-center'>
+				<h2 class='padding margin-bottom'>Choose from a Variety of Card Frames</h2>
+				<h4 class='padding margin-bottom'>Card Conjurer offers Expeditions, Inventions, Showcase Frames, and so much more. <a href='/creator/'>Take a look</a>!</h4>
+			</div>
+		</div>
 	</div>
 	<div class='layer center'>
-		<h2>The home page is currently under construction...</h2>
+		<div class='sample-grid right'>
+			<div class='vertical-center'>
+				<h2 class='padding margin-bottom'>Customize to Your Heart's Content</h2>
+				<h4 class='padding margin-bottom'>With Card Conjurer's level of customization, you'll have endless options when designing your dream cards. <a href='/creator/'>Try it out</a>!</h4>
+			</div>
+			<img src='/img/samples/sample2.png'>
+		</div>
+	</div>
+	<div class='layer readable-background center'>
+		<div class='sample-grid'>
+			<img src='/img/samples/sample3.png'>
+			<div class='vertical-center'>
+				<h2 class='padding margin-bottom'>Bling Out Existing Favorites</h2>
+				<h4 class='padding margin-bottom'>Easily import vital information from existing cards, then redesign them. <a href='/creator/'>Go on, do it</a>!</h4>
+			</div>
+		</div>
+	</div>
+	<div class='layer center'>
+		<h2 class='margin-bottom'>Ready?</h2>
+		<a href='/creator/'><h1>Get Started</h1></a>
 	</div>
 <?php include('globalHTML/footer.php'); ?>

js/creator.js

@@ -3,7 +3,7 @@ var params = new URLSearchParams(window.location.search);
 //To save the server from being overloaded? Maybe?
 function fixUri(input) {
 	var prefix = 'https://card-conjurer.storage.googleapis.com';//'https://raw.githubusercontent.com/ImKyle4815/cardconjurer/remake';
-	if (input.includes(prefix) || input.includes('http') || input.includes('data:image') || params.get('testing')) {
+	if (input.includes(prefix) || input.includes('http') || input.includes('data:image') || params.get('testing') == '') {
 		return input;
 	} else {
 		return prefix + input; //input.replace('/img/frames', prefix + '/img/frames');