enlarged text and removed excess classes

public/assets/css/general.css

@@ -39,15 +39,15 @@ body, .flex-container--column {
 	justify-content: space-between;
 }
 
-.flex-container--align-center {
-	align-items: center;
-}
-
 .flex-container--wrap {
 	-webkit-flex-wrap: wrap;
 	flex-wrap: wrap;
 }
 
+.flex-container--align-center {
+	align-items: center;
+}
+
 .flex-container--justify-center {
 	justify-content: center;
 }
@@ -64,60 +64,14 @@ body, .flex-container--column {
 
 body, button, input, textarea, label, select, option {
 	font-family: 'Lekton', monospace;
-	font-size: medium;
+	font-size: large;
-	word-wrap: break-word;
 }
 
-h1 {
+h3, p {
-	font-size: 2rem;
-}
-
-h2 {
-	font-size: 1.5rem;
-}
-
-.h2--secondary {
-	color: lightgrey;
-}
-
-.h2--top {
-	margin-top: 0px;
-}
-
-p, h3 {
 
 	font-size: x-large;
 }
 
-.h3--no-bottom {
-	margin-bottom: 0px;
-}
-
-.p--no-top {
-	margin-top: 0px;
-}
-
-.input-text--large, .textarea--large, .title-show, .description-show {
-	font-size: 1.5rem;
-}
-
-.url-text {
-	margin:0px;
-	padding:0px;
-}
-
-.url-text--primary {
-	color: black;
-}
-
-.url-text--secondary {
-	color: #9b9b9b;
-}
-
-.instructions-text--large {
-	font-size: 2rem;
-}
-
 .pull-quote {
 	font-size: 3rem;
 	margin-top: 1rem;
@@ -131,6 +85,11 @@ p, h3 {
 	color: #4156C5;
 }
 
+.blue--underlined {
+	color: #4156C5;
+	text-decoration: underline;
+}
+
 /* TOOL TIPS */
 /* Tooltip container */
 .tooltip {
@@ -304,6 +263,7 @@ align-content-left {
 /* ERROR MESSAGES */
 
 .info-message {
+
 	font-size: medium;
 	margin: 0px;
 	padding: 0.3em;
@@ -328,7 +288,7 @@ input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px white inset;
 }
 
-.label, .input-text, .select, .textarea, .title-show {
+.label, .input-text, .select, .textarea, .text--large {
 	margin: 0px;
 	padding: 0.3em;
 	outline: none;
@@ -368,11 +328,23 @@ option {
 	cursor: pointer;
 }
 
-.blue-underlined-pointer {
+.text--large {
-	color: #4156C5;
+	font-size: 2rem;
-	text-decoration: underline;
-	cursor: pointer;
 }
+
+.url-text--primary, .url-text--secondary {
+	margin:0px;
+	padding:0px;
+}
+
+.url-text--primary {
+	color: black;
+}
+
+.url-text--secondary {
+	color: #9b9b9b;
+}
+
 /* modifiers */
 .select--arrow {
 	-moz-appearance:none;

public/assets/css/mediaQueries.css

@@ -16,7 +16,7 @@
 		font-size: medium;
 	}
 
-	.instructions-text--large, .pull-quote {
+	.pull-quote {
 		font-size: 1.5rem;
 	}
 
@@ -24,16 +24,11 @@
 		width: 100%;
 	}
 
-	.h2--top {
-		margin-top: 1em;
-	}
-
 	.nav-bar-logo {
 		height: 1rem;
 	}
 
 	.link--nav, .link--nav-active {
-		font-size: small;
 		padding: 1rem 0.5rem 1rem 0.5rem;
 	}
 
@@ -70,7 +65,7 @@
 		font-size: small;
 	}
 
-	.instructions-text--large, .pull-quote, .input-text--large, .button--large {
+	.pull-quote, .text--large, .button--large {
 		font-size: medium;
 	}
 
@@ -90,15 +85,11 @@
 
 @media (max-width: 360px) {
 
-	.link--nav, .link--nav-active {
+	body, button, input, textarea, label, select, option, p, h3, .fine-print {
 		font-size: x-small;
 	}
 
-	body, button, input, textarea, label, select, option, p, h3, .fine-print, .instructions-text--large {
+	.pull-quote, .text--large, .button--large {
-		font-size: x-small;
-	}
-
-	.pull-quote, .input-text--large, .button--large {
 		font-size: small;
 	}
 

public/assets/js/publishFileFunctions.js

@@ -28,7 +28,7 @@ function previewAndStageFile(selectedFile){
     console.log('file type:', selectedFile.type)
     if (selectedFile.type !== 'video/mp4') {
 		if (selectedFile.type === 'image/gif') {
-            assetPreview.innerHTML = `<h2>loading preview...</h2>`
+            assetPreview.innerHTML = `<p>loading preview...</p>`
 		}
 		previewReader.readAsDataURL(selectedFile);
 		previewReader.onloadend = function () {

views/index.handlebars

@@ -7,7 +7,7 @@
             <p class="info-message-placeholder info-message info-message--failure" id="input-error-file-selection" hidden="true"></p>
             <p>Drag & drop image or video here to publish</p>
             <p class="fine-print">OR</p>
-            <p class="blue-underlined-pointer">CHOOSE FILE</p>
+            <p class="blue--underlined">CHOOSE FILE</p>
         </div>
         <div id="dropbzone-dragover" class="hidden">
             <p class="blue">Drop it.</p>
@@ -17,7 +17,7 @@
         <div class="row row--padded row--no-bottom">
             <div class="column column--10">
                 <!-- title input -->
-                <input type="text" id="publish-title" class="input-text input-text--large input-text--full-width" placeholder="Give your post a title...">
+                <input type="text" id="publish-title" class="input-text text--large input-text--full-width" placeholder="Give your post a title...">
             </div>
             <div class="column column--5 column--sml-10" >
                 <!-- preview -->
@@ -26,7 +26,7 @@
                         <div id="asset-preview-dropzone-instructions" class="hidden">
                             <p>Drag & drop image or video here</p>
                             <p class="fine-print">OR</p>
-                            <p class="blue-underlined-pointer">CHOOSE FILE</p>
+                            <p class="blue--underlined">CHOOSE FILE</p>
                         </div>
                         <div id="asset-preview-target"></div>
                     </div>

views/partials/publishForm-Url.handlebars

@@ -6,10 +6,10 @@
         <label class="label">URL:</label>
     </div><div class="column column--7 column--sml-10">
         <div class="input-text--primary">
-            <span class="url-text url-text--secondary">spee.ch /</span>
+            <span class="url-text--secondary">spee.ch /</span>
-            <span id="url-channel" class="url-text url-text--secondary" {{#if user}}{{else}}hidden="true"{{/if}}>{{user.channelName}}:{{user.shortChannelId}}</span>
+            <span id="url-channel" class="url-text--secondary" {{#if user}}{{else}}hidden="true"{{/if}}>{{user.channelName}}:{{user.shortChannelId}}</span>
-            <span id="url-no-channel-placeholder" class="url-text url-text--secondary tooltip" {{#if user}}hidden="true"{{else}}{{/if}}>xyz<span class="tooltip-text">This will be a random id</span></span>
+            <span id="url-no-channel-placeholder" class="url-text--secondary tooltip" {{#if user}}hidden="true"{{else}}{{/if}}>xyz<span class="tooltip-text">This will be a random id</span></span>
-            <span id="url-channel-placeholder" class="url-text url-text--secondary tooltip" hidden="true">@channel<span class="tooltip-text">Select a channel above</span></span>
+            <span id="url-channel-placeholder" class="url-text--secondary tooltip" hidden="true">@channel<span class="tooltip-text">Select a channel above</span></span>
             /
             <input type="text" id="claim-name-input" class="input-text" placeholder="your-url-here" oninput="checkClaimName(event.target.value)">
             <span id="input-success-claim-name" class="info-message info-message--success"></span>

views/show.handlebars

@@ -1,7 +1,7 @@
 <div class="row row--tall row--padded">
     <div class="column column--10">
         <!-- title -->
-        <span class="title-show">{{fileInfo.title}}</span>
+        <span class="text--large">{{fileInfo.title}}</span>
     </div>
     <div class="column column--5 column--sml-10 align-content-top">
         <!-- asset -->