updated spacing on publish components

public/assets/css/general.css

@@ -263,8 +263,10 @@ align-content-left {
 }
 
 .info-message-placeholder {
-	display: block;
+	display: flex;
 	height: 3rem;
+	flex-direction: column;
+	justify-content: flex-end;
 }
 
 /* INPUT FIELDS */

public/assets/css/mediaQueries.css

@@ -17,7 +17,7 @@
 
 @media (max-width: 750px ) {
 
-	body, button, input, textarea, label, select, option, p {
+	body, button, input, textarea, label, select, option, p, h3 {
 		font-size: medium;
 	}
 
@@ -64,9 +64,7 @@
 		margin: 0px;
 	}
 
-	#publish-active-area > .row, #publish-details > .row, #channel-login-form > .row, #publish-channel-form > .row {
+
-		padding: 1em 0px 1em 0px;
-	}
 }
 
 @media (max-width: 500px) {
@@ -81,7 +79,7 @@
 		padding: 1rem 0.5rem 1rem 0.5rem;
 	}
 
-	body, button, input, textarea, label, select, option, p, .fine-print {
+	body, button, input, textarea, label, select, option, p, h3, .fine-print {
 		font-size: small;
 	}
 
@@ -96,6 +94,15 @@
 		margin: 0px;
 	}
 
+	.info-message-placeholder {
+		height: 2em;
+	}
+
+	.info-message {
+		font-size: small;
+	}
+
+
 }
 
 @media (max-width: 360px) {
@@ -104,7 +111,7 @@
 		font-size: x-small;
 	}
 
-	body, button, input, textarea, label, select, option, p, .fine-print, .instructions-text--large {
+	body, button, input, textarea, label, select, option, p, h3, .fine-print, .instructions-text--large {
 		font-size: x-small;
 	}
 

public/assets/js/generalFunctions.js

@@ -9,7 +9,7 @@ function getRequest (url) {
                 if ( xhttp.status == 200) {
                     resolve(xhttp.response);
                 } else if (xhttp.status == 401) {
-                    reject('wrong username or password');
+                    reject('Wrong username or password');
                 } else {
                     reject('request failed with status:' + xhttp.status);
                 };
@@ -31,7 +31,7 @@ function postRequest (url, params) {
                 if ( xhttp.status == 200) {
                     resolve(xhttp.response);
                 } else if (xhttp.status == 401) {
-                    reject( new AuthenticationError('wrong username or password'));
+                    reject( new AuthenticationError('Wrong username or password'));
                 } else {
                     reject('request failed with status:' + xhttp.status);
                 };

views/index.handlebars

@@ -22,7 +22,7 @@
         </div>
         <div class="column column--5 column--med-10" >
             <!-- preview -->
-            <div class="row row--padded">
+            <div class="row row--padded row--no-bottom">
                 <div id="asset-preview-holder" class="dropzone" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)" onmouseenter="showInstructions()" onmouseleave="hideInstructions()" onclick="triggerFileChooser('siofu_input', event)">
                     <div id="asset-preview-target"></div>
                     <div id="preview-dropzone-instructions" class="hidden">

views/partials/channelCreationForm.handlebars

@@ -1,4 +1,8 @@
 <form id="publish-channel-form">
+    <div class="info-message-placeholder">
+        <div id="input-error-channel-name" class="info-message info-message--failure"></div>
+    </div>
+
     <div class="row row--wide row--short">
         <div class="column column--3 column--sml-10">
             <label class="label" for="new-channel-name">Name:</label>
@@ -19,9 +23,7 @@
             </div>
         </div>
     </div>
-    <div class="info-message-placeholder">
+
-        <div id="input-error-channel-name" class="info-message info-message--failure"></div>
-    </div>
     <div class="row row--wide">
         <button class="button--primary" onclick="publishNewChannel(event)">Create Channel</button>
     </div>

views/partials/channelLoginForm.handlebars

@@ -1,4 +1,8 @@
 <form id="channel-login-form">
+    <div class="info-message-placeholder">
+        <div id="login-error-display-element" class="info-message info-message--failure"></div>
+    </div>
+
     <div class="row row--wide row--short">
         <div class="column column--3 column--sml-10">
             <label class="label" for="channel-login-name-input">Name:</label>
@@ -18,9 +22,7 @@
             </div>
         </div>
     </div>
-    <div class="info-message-placeholder">
+
-        <div id="login-error-display-element" class="info-message info-message--failure"></div>
-    </div>
     <div class="row row--wide">
         <button class="button--primary" onclick="loginToChannel(event)">Authenticate</button>
     </div>

views/partials/publishForm-Channel.handlebars

@@ -1,5 +1,5 @@
 <!-- select whether to publish anonymously or in a channel -->
-<div class="row row--padded">
+<div class="row row--padded row--no-bottom">
     <div class="column column--10">
         <form>
             <div class="column column--3 column--sml-10">
@@ -14,14 +14,15 @@
 </div>
 
 <div id="channel-select-options" {{#unless user}}hidden="true"{{/unless}}>
-    <!-- select whether to create new or log in to existing channel -->
+    <div class="row row--padded row--no-top row--no-bottom">
-    <div class="row row--padded row--no-top">
+        <!--error display-->
-        <div class="column column--3 column--sml-10">
-            <label class="label" for="channel-name-select">Channel:</label>
-        </div><div class="column column--7 column--sml-10">
         <div class="info-message-placeholder">
             <div id="input-error-channel-select" class="info-message info-message--failure"></div>
         </div>
+        <!--channel login/create select-->
+        <div class="column column--3">
+            <label class="label" for="channel-name-select">Channel:</label>
+        </div><div class="column column--7">
             <select type="text" id="channel-name-select" class="select select--primary select--arrow" onchange="toggleSelectedChannel(event.target.selectedOptions[0].value)">
             {{#if user}}
                 <option value="{{user.channelName}}" id="publish-channel-select-channel-option">{{user.channelName}}</option>

views/partials/publishForm-Details.handlebars

@@ -1,4 +1,4 @@
-<div class="row row--padded row--no-top">
+<div class="row row--padded row--no-top row--no-bottom">
     <div class="column column--10">
         <a class="label" id="publish-details-toggle" href="#" onclick="toggleSection(event)" data-open="false" data-openlabel="[less]" data-closedlabel="[more]" data-slaveelementid="publish-details">[more]</a>
     </div>

views/partials/publishForm-Url.handlebars

@@ -1,10 +1,12 @@
 <div class="row row--padded row--no-top">
-    <div class="column column--3 column--sml-10">
+    <!--error display-->
-        <label class="label">URL:</label>
-    </div><div class="column column--7 column--sml-10">
     <div class="info-message-placeholder">
         <div id="input-error-claim-name" class="info-message info-message--failure"  hidden="true"></div>
     </div>
+    <!--url selection-->
+    <div class="column column--3 column--sml-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 id="url-channel" class="url-text url-text--secondary" {{#if user}}{{else}}hidden="true"{{/if}}>{{user.channelName}}:{{user.shortChannelId}}</span>