From a34878fcb989a66252e273886880ed57705d947c Mon Sep 17 00:00:00 2001
From: Kyle <41976328+ImKyle4815@users.noreply.github.com>
Date: Tue, 12 Jan 2021 20:42:23 -0800
Subject: [PATCH] clearing things up

---
 creator/index.php | 28 ++++++++++++++++++++--------
 css/style-5.css   |  8 ++++----
 js/creator-1.js   |  2 +-
 3 files changed, 25 insertions(+), 13 deletions(-)

diff --git a/creator/index.php b/creator/index.php
index e63e572e..81f46c73 100644
--- a/creator/index.php
+++ b/creator/index.php
@@ -321,19 +321,31 @@
 							</div>
 						</div>
 						<div class='readable-background margin-bottom padding'>
-							<button class='input margin-bottom' onclick='saveCard();'>Save your card</button>
+							<h5 class='padding margin-bottom input-description'>Save your current card</h5>
+							<button class='input margin-bottom' onclick='saveCard();'>Save Card</button>
 							<h5 class='padding margin-bottom input-description'>Load a saved card</h5>
 							<select id='load-card-options' class='input margin-bottom' type='text' onchange='loadCard(this.value);'></select>
-							<button class='input' onclick='deleteCard();'>Delete selected card</button>
+							<h5 class='padding margin-bottom input-description'>Delete selected card</h5>
+							<button class='input' onclick='deleteCard();'>Delete Card</button>
 						</div>
 						<div class='readable-background padding margin-bottom'>
-							<h5 class='padding margin-bottom input-description'>Download/upload lists of saved cards</h5>
-							<button class='input margin-bottom' onclick='downloadSavedCards();'>Download all saved cards</button>
-							<input type='file' accept='.cardconjurer,.txt' class='input' oninput='uploadSavedCards(event);'>
+							<h5 class='padding margin-bottom input-description'>Download all saved cards</h5>
+							<button class='input margin-bottom' onclick='downloadSavedCards();'>Download All</button>
+							<h5 class='padding margin-bottom input-description'>Upload previously downloaded cards</h5>
+							<input type='file' accept='.cardconjurer,.txt' class='input margin-bottom' oninput='uploadSavedCards(event);'>
+							<h5 class='padding margin-bottom input-description'>Delete ALL saved cards</h5>
+							<button class='input margin-bottom' onclick='deleteSavedCards();'>Delete All</button>
 						</div>
-						<div class='readable-background padding'>
-							<h5 class='padding margin-bottom input-description'>Deletes ALL saved cards</h5>
-							<button class='input margin-bottom' onclick='deleteSavedCards();'>Delete all saved cards</button>
+						<div class='readable-background padding margin-bottom'>
+							<h5 class='collapsible collapsed padding input-description' onclick='toggleCollapse(event);'>
+								How are my cards saved?
+							</h5>
+							<div class='padding'>
+								<h5 class='margin-top'>Cards are saved on your computer under your browser's localstorage, which usually has a limit of 5MB and cannot be changed.</h5>
+								<h5 class='margin-top'>Unfortunately, this means that if you save a lot of cards, you could run out of space.</h5>
+								<h5 class='margin-top'>Your localstorage runs out of space especially fast when you upload images directly from your computer, because the image itself has to be saved. However, if possible, uploading images via URL will save massive amounts of space, allowing you to save many more cards.</h5>
+								<h5 class='margin-top'>And if you do run out of space, don't worry. You can download all saved cards, then delete all saved cards,  freeing up all 5MB of space, and you can then reupload the downloaded cards via the file upload, under "Upload previously downloaded cards".</h5>
+							</div>
 						</div>
 					</div>
 					<div id='creator-menu-tutorial' class='hidden'>
diff --git a/css/style-5.css b/css/style-5.css
index abdc5a90..022ed100 100644
--- a/css/style-5.css
+++ b/css/style-5.css
@@ -146,22 +146,22 @@ h1 {
 }
 h2 {
 	font-size: 2.5rem;
-	font-family: Montserrat-SemiBold, Helvetica, Tahoma, Verdana, Geneva, sans-serif;
+	font-family: Montserrat-Medium, Helvetica, Tahoma, Verdana, Geneva, sans-serif;
 	overflow-wrap: break-word;
 }
 h3 {
 	font-size: 2rem;
-	font-family: Montserrat-SemiBold, Helvetica, Tahoma, Verdana, Geneva, sans-serif;
+	font-family: Montserrat-Medium, Helvetica, Tahoma, Verdana, Geneva, sans-serif;
 	overflow-wrap: break-word;
 }
 h4 {
 	font-size: 1.5rem;
-	font-family: Montserrat-SemiBold, Helvetica, Tahoma, Verdana, Geneva, sans-serif;
+	font-family: Montserrat-Medium, Helvetica, Tahoma, Verdana, Geneva, sans-serif;
 	overflow-wrap: break-word;
 }
 h5 {
 	font-size: 1.25rem;
-	font-family: Montserrat-SemiBold, Helvetica, Tahoma, Verdana, Geneva, sans-serif;
+	font-family: Montserrat-Medium, Helvetica, Tahoma, Verdana, Geneva, sans-serif;
 	overflow-wrap: break-word;
 }
 p {
diff --git a/js/creator-1.js b/js/creator-1.js
index 9e61f287..f221114a 100644
--- a/js/creator-1.js
+++ b/js/creator-1.js
@@ -1284,7 +1284,7 @@ function deleteCard() {
 	}
 }
 function deleteSavedCards() {
-	if (confirm('WARNING:\n\nALL of your saved cards will be deleted! If you would like to save these cards, please make sure you have downloaded them first. There is no way to undo this.')) {
+	if (confirm('WARNING:\n\nALL of your saved cards will be deleted! If you would like to save these cards, please make sure you have downloaded them first. There is no way to undo this.\n\n(Press "OK" to delete your cards)')) {
 		var cardKeys = JSON.parse(localStorage.getItem('cardKeys'));
 		cardKeys.forEach(key => localStorage.removeItem(key));
 		localStorage.setItem('cardKeys', JSON.stringify([]));