From 9ea5115af2ea88d17b9de40753136a9e0d85778c Mon Sep 17 00:00:00 2001
From: bill bittner <bittner.w@gmail.com>
Date: Mon, 30 Oct 2017 09:23:23 -0700
Subject: [PATCH 1/3] fixed radio button and details overlap

---
 public/assets/css/mediaQueries.css            | 2 +-
 views/partials/publishForm-Details.handlebars | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/public/assets/css/mediaQueries.css b/public/assets/css/mediaQueries.css
index 890b1585..7adf37be 100644
--- a/public/assets/css/mediaQueries.css
+++ b/public/assets/css/mediaQueries.css
@@ -1,4 +1,4 @@
-@media (max-width: 1050px) {
+@media (max-width: 1120px) {
 
 	.nav-bar--center {
 		display: none;
diff --git a/views/partials/publishForm-Details.handlebars b/views/partials/publishForm-Details.handlebars
index 07b3a299..090813b8 100644
--- a/views/partials/publishForm-Details.handlebars
+++ b/views/partials/publishForm-Details.handlebars
@@ -8,7 +8,7 @@
 
     <!-- description input -->
     <div class="row row--no-top">
-        <div class="column column--3 column--sml-10 align-content-top">
+        <div class="column column--3 column--med-10 align-content-top">
             <label for="publish-license" class="label">Description:</label>
         </div><div class="column column--7 column--sml-10">
             <textarea rows="1" id="publish-description" class="textarea textarea--primary textarea--full-width" placeholder="Optional description"></textarea>
@@ -16,7 +16,7 @@
     </div>
 
     <div class="row row--no-top">
-        <div class="column column--3 column--sml-10">
+        <div class="column column--3 column--med-10">
             <label for="publish-license" class="label">License:</label>
         </div><div class="column column--7 column--sml-10">
             <select type="text" id="publish-license" class="select select--primary">
@@ -28,9 +28,9 @@
     </div>
 
     <div class="row row--no-top">
-        <div class="column column--3 column--sml-10">
+        <div class="column column--3">
             <label for="publish-nsfw" class="label">Mature:</label>
-        </div><div class="column column--7 column--sml-10">
+        </div><div class="column column--7">
             <input class="input-checkbox" type="checkbox" id="publish-nsfw">
         </div>
     </div>
-- 
2.45.3


From cec7e5ef57bd2a03e489a4094d8c9d5fd7189fca Mon Sep 17 00:00:00 2001
From: bill bittner <bittner.w@gmail.com>
Date: Mon, 30 Oct 2017 10:07:23 -0700
Subject: [PATCH 2/3] fixed flex box and @ line break

---
 public/assets/css/general.css                 | 20 ++++++++++---------
 public/assets/css/mediaQueries.css            |  2 +-
 public/assets/js/dropzoneFunctions.js         |  6 +++---
 public/assets/js/generalFunctions.js          |  2 +-
 views/index.handlebars                        |  6 +++---
 views/partials/assetInfo.handlebars           |  2 +-
 views/partials/channelCreationForm.handlebars |  2 +-
 views/partials/channelLoginForm.handlebars    |  2 +-
 views/partials/navBar.handlebars              |  2 +-
 views/partials/publishForm-Details.handlebars |  2 +-
 10 files changed, 24 insertions(+), 22 deletions(-)

diff --git a/public/assets/css/general.css b/public/assets/css/general.css
index 2074e0d6..80eedeaa 100644
--- a/public/assets/css/general.css
+++ b/public/assets/css/general.css
@@ -23,7 +23,7 @@ html, body {
 	height: 100%;
 }
 
-body, .flex-container {
+body, .flex-container--column, .flex-container--row {
 	display: -webkit-flex;
 	display: flex;
 }
@@ -36,7 +36,6 @@ body, .flex-container--column {
 .flex-container--row {
 	-webkit-flex-direction: row;
 	flex-direction: row;
-	justify-content: space-between;
 }
 
 .flex-container--wrap {
@@ -44,20 +43,23 @@ body, .flex-container--column {
 	flex-wrap: wrap;
 }
 
-.flex-container--align-center {
+.flex-container--left-bottom {
+	justify-content: flex-start;
+	align-items: baseline;
+}
+
+.flex-container--left-center {
+	justify-content: flex-start;
 	align-items: center;
 }
 
-.flex-container--justify-center {
+.flex-container--center-center {
 	justify-content: center;
+	align-items: center;
 }
 
-.flex-container--justify-space-between {
+.flex-container--space-between-bottom {
 	justify-content: space-between;
-}
-
-.flex-container--left-bottom {
-	justify-content: flex-start;
 	align-items: baseline;
 }
 
diff --git a/public/assets/css/mediaQueries.css b/public/assets/css/mediaQueries.css
index 7adf37be..2d7f4a1a 100644
--- a/public/assets/css/mediaQueries.css
+++ b/public/assets/css/mediaQueries.css
@@ -10,7 +10,7 @@
 
 }
 
-@media (max-width: 750px ) {
+@media (max-width: 800px ) {
 
 	body, button, input, textarea, label, select, option, p, h3 {
 		font-size: medium;
diff --git a/public/assets/js/dropzoneFunctions.js b/public/assets/js/dropzoneFunctions.js
index 567537e1..f1a8ddf6 100644
--- a/public/assets/js/dropzoneFunctions.js
+++ b/public/assets/js/dropzoneFunctions.js
@@ -31,7 +31,7 @@ function dragend_handler(event) {
 
 function dragenter_handler(event) {
     var thisDropzone = document.getElementById(event.target.id);
-    thisDropzone.setAttribute('class', 'dropzone dropzone--drag-over row row--margined row--padded row--tall flex-container flex-container--column flex-container--justify-center');
+    thisDropzone.setAttribute('class', 'dropzone dropzone--drag-over row row--margined row--padded row--tall flex-container--column flex-container--center-center');
     thisDropzone.firstElementChild.setAttribute('class', 'hidden');
     thisDropzone.lastElementChild.setAttribute('class', '');
 
@@ -39,13 +39,13 @@ function dragenter_handler(event) {
 
 function dragexit_handler(event) {
     var thisDropzone = document.getElementById(event.target.id);
-    thisDropzone.setAttribute('class', 'dropzone row row--tall row--margined row--padded flex-container flex-container--column flex-container--justify-center');
+    thisDropzone.setAttribute('class', 'dropzone row row--tall row--margined row--padded flex-container--column flex-container--center-center');
     thisDropzone.firstElementChild.setAttribute('class', '');
     thisDropzone.lastElementChild.setAttribute('class', 'hidden');
 }
 
 function preview_onmouseenter_handler () {
-    document.getElementById('asset-preview-dropzone-instructions').setAttribute('class', 'flex-container flex-container--column flex-container--justify-center position-absolute');
+    document.getElementById('asset-preview-dropzone-instructions').setAttribute('class', 'flex-container--column flex-container--center-center position-absolute');
     document.getElementById('asset-preview').style.opacity = 0.2;
 }
 
diff --git a/public/assets/js/generalFunctions.js b/public/assets/js/generalFunctions.js
index f6cd1714..89782d75 100644
--- a/public/assets/js/generalFunctions.js
+++ b/public/assets/js/generalFunctions.js
@@ -201,7 +201,7 @@ function showAssetDetails(event) {
     var thisAssetImage = thisAssetHolder.firstElementChild;
     var thisAssetDetails = thisAssetHolder.lastElementChild;
     thisAssetImage.style.opacity = 0.2;
-    thisAssetDetails.setAttribute('class', 'grid-item-details flex-container flex-container--column flex-container--justify-center');
+    thisAssetDetails.setAttribute('class', 'grid-item-details flex-container--column flex-container--center-center');
 }
 
 function hideAssetDetails(event) {
diff --git a/views/index.handlebars b/views/index.handlebars
index 432a33f4..ba66b4ef 100644
--- a/views/index.handlebars
+++ b/views/index.handlebars
@@ -1,8 +1,8 @@
-<div class="row row--tall flex-container flex-container--column">
+<div class="row row--tall flex-container--column">
     <form>
         <input class="input-file" type="file" id="siofu_input" name="siofu_input" accept="video/*,image/*" onchange="previewAndStageFile(event.target.files[0])" enctype="multipart/form-data"/>
     </form>
-    <div id="primary-dropzone" class="dropzone row row--margined row--padded row--tall flex-container flex-container--column flex-container--justify-center" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)" ondragenter="dragenter_handler(event)" ondragleave="dragexit_handler(event)" onclick="triggerFileChooser('siofu_input', event)">
+    <div id="primary-dropzone" class="dropzone row row--margined row--padded row--tall flex-container--column flex-container--center-center" ondrop="drop_handler(event);" ondragover="dragover_handler(event);" ondragend="dragend_handler(event)" ondragenter="dragenter_handler(event)" ondragleave="dragexit_handler(event)" onclick="triggerFileChooser('siofu_input', event)">
         <div id="primary-dropzone-instructions">
             <p class="info-message-placeholder info-message--failure" id="input-error-file-selection" hidden="true"></p>
             <p>Drag & drop image or video here to publish</p>
@@ -107,7 +107,7 @@
     }
     // publish status functions
     function showPublishStatus() {
-        publishStatus.setAttribute('class', 'row row--tall flex-container flex-container--column flex-container--justify-center');
+        publishStatus.setAttribute('class', 'row row--tall flex-container--column flex-container--center-center');
     }
     function updatePublishStatus(msg){
         publishUpdate.innerHTML = msg;
diff --git a/views/partials/assetInfo.handlebars b/views/partials/assetInfo.handlebars
index a79912ea..8677710d 100644
--- a/views/partials/assetInfo.handlebars
+++ b/views/partials/assetInfo.handlebars
@@ -54,7 +54,7 @@
         <div class="column column--2 column--med-10">
             <span class="text">Share:</span>
         </div><div class="column column--7 column--med-10">
-            <div class="row row--short row--wide flex-container flex-container--row flex-container--wrap">
+            <div class="row row--short row--wide flex-container--row flex-container--space-between-bottom flex-container--wrap">
                 <a class="link--primary" target="_blank" href="https://twitter.com/intent/tweet?text=https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}">twitter</a>
                 <a class="link--primary" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}">facebook</a>
                 <a class="link--primary" target="_blank" href="http://tumblr.com/widgets/share/tool?canonicalUrl=https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}">tumblr</a>
diff --git a/views/partials/channelCreationForm.handlebars b/views/partials/channelCreationForm.handlebars
index 67b62312..685edad9 100644
--- a/views/partials/channelCreationForm.handlebars
+++ b/views/partials/channelCreationForm.handlebars
@@ -4,7 +4,7 @@
         <div class="column column--3 column--sml-10">
             <label class="label" for="new-channel-name">Name:</label>
         </div><div class="column column--6 column--sml-10">
-            <div class="input-text--primary">
+            <div class="input-text--primary flex-container--row flex-container--left-bottom">
                 <span>@</span>
                 <input type="text" name="new-channel-name" id="new-channel-name" class="input-text" placeholder="exampleChannelName" value="" oninput="checkChannelName(event.target.value)">
                 <span id="input-success-channel-name" class="info-message--success"></span>
diff --git a/views/partials/channelLoginForm.handlebars b/views/partials/channelLoginForm.handlebars
index 6721547c..99e5c759 100644
--- a/views/partials/channelLoginForm.handlebars
+++ b/views/partials/channelLoginForm.handlebars
@@ -4,7 +4,7 @@
         <div class="column column--3 column--sml-10">
             <label class="label" for="channel-login-name-input">Name:</label>
         </div><div class="column column--6 column--sml-10">
-            <div class="input-text--primary">
+            <div class="input-text--primary flex-container--row flex-container--left-bottom">
                 <span>@</span>
                 <input type="text" id="channel-login-name-input" class="input-text" placeholder="" value="">
             </div>
diff --git a/views/partials/navBar.handlebars b/views/partials/navBar.handlebars
index cb403b2c..9ab1a71d 100644
--- a/views/partials/navBar.handlebars
+++ b/views/partials/navBar.handlebars
@@ -1,5 +1,5 @@
 <div class="row row--wide nav-bar">
-    <div class="row row--padded row--short flex-container flex-container--row flex-container--align-center">
+    <div class="row row--padded row--short flex-container--row flex-container--space-between-bottom">
         <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" height="24px" viewBox="0 0 80 31" enable-background="new 0 0 80 31" xml:space="preserve" class="nav-bar-logo">
             <a href="/">
             <title>Logo</title>
diff --git a/views/partials/publishForm-Details.handlebars b/views/partials/publishForm-Details.handlebars
index 090813b8..d5bca747 100644
--- a/views/partials/publishForm-Details.handlebars
+++ b/views/partials/publishForm-Details.handlebars
@@ -4,7 +4,7 @@
     </div>
 </div>
 
-<div id="publish-details" hidden="true" class="row">
+<div id="publish-details" hidden="true" class="row row--padded row--wide">
 
     <!-- description input -->
     <div class="row row--no-top">
-- 
2.45.3


From b2268ceee9578fc15752806bf5ebf4868c8d5f6b Mon Sep 17 00:00:00 2001
From: bill bittner <bittner.w@gmail.com>
Date: Mon, 30 Oct 2017 10:56:23 -0700
Subject: [PATCH 3/3] fixed pagination on channel page to show only as needed

---
 views/channel.handlebars | 19 +++++++++++++------
 1 file changed, 13 insertions(+), 6 deletions(-)

diff --git a/views/channel.handlebars b/views/channel.handlebars
index 0f81e08f..d512e675 100644
--- a/views/channel.handlebars
+++ b/views/channel.handlebars
@@ -1,11 +1,17 @@
 <div class="row row--padded">
     <div class="row">
-        <p>Below are the contents for {{this.channelName}}:{{this.longChannelId}}</p>
-        <div class="grid">
-            {{#each this.claims}}
-                {{> gridItem}}
-            {{/each}}
-        </div>
+        {{#ifConditional this.totalPages '===' 0}}
+            <p>There is no content in {{this.channelName}}:{{this.longChannelId}} yet.  Upload some!</p>
+        {{/ifConditional}}
+        {{#ifConditional this.totalPages '>=' 1}}
+            <p>Below are the contents for {{this.channelName}}:{{this.longChannelId}}</p>
+            <div class="grid">
+                {{#each this.claims}}
+                    {{> gridItem}}
+                {{/each}}
+            </div>
+        {{/ifConditional}}
+        {{#ifConditional this.totalPages '>' 1}}
         <div class="row">
             <div class="column column--3 align-content--left">
                 <a class="link--primary" href="/{{this.channelName}}:{{this.longChannelId}}?p=1">First [1]</a>
@@ -25,6 +31,7 @@
                 <a class="link--primary" href="/{{this.channelName}}:{{this.longChannelId}}?p={{this.totalPages}}">Last [{{this.totalPages}}]</a>
             </div>
         </div>
+        {{/ifConditional}}
     </div>
 </div>
 
-- 
2.45.3