Updated to materializecss v0.100.1

server/public/assets/css/style.css

@@ -121,6 +121,10 @@
   height:calc(100vh - 48px - 64px) !important;
 }
 
+#chatForm {
+  padding-left: 14px;
+}
+
 .close-settings{
   color:#2d2d2d
 }
@@ -548,7 +552,7 @@ input[type=text]:focus:not([readonly]) + label, input[type=password]:focus:not([
 
 #password{
   width: 84%;
-  margin-left: 10px;
+  margin-left: 30px;
   margin-bottom: 0;
 }
 
@@ -896,7 +900,7 @@ hide mdi-action-visibility mdi-action-visibility-off
 .mega input{
   /*color: rgb(0, 0, 0);*/
   /*font-family: 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif;*/
-  font-size: 17px;
+  font-size: 17px !important;
   height: 42px;
   line-height: 24px;
   min-width: 307px;
@@ -907,7 +911,7 @@ hide mdi-action-visibility mdi-action-visibility-off
   color: rgb(255, 255, 255);
   text-shadow: rgba(18, 18, 18, 0.76) 0px 1px 4px;
   border-bottom: 1px solid white !important;
-  padding-left: 91px;
+  padding-left: 69px !important;
 }
 
 .mega ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
@@ -1108,9 +1112,14 @@ hide mdi-action-visibility mdi-action-visibility-off
   border-bottom:1px solid black;
 }
 
+#thumbnail_form, #description_form {
+  width: 100%;
+  padding: 0 10px;
+}
+
 #chan_thumbnail, #chan_description{
   color: black;
-  width: 80%;
+  width: 100%;
 }
 
 #thumbnail_image_channel{
@@ -1137,7 +1146,7 @@ hide mdi-action-visibility mdi-action-visibility-off
 }
 
 .room-namer.autocomplete{
-  margin-left:5px !important;
+  margin-left: 3px !important;
 }
 
 .channel-finder .input-field{
@@ -1149,7 +1158,7 @@ hide mdi-action-visibility mdi-action-visibility-off
 .channel-finder .input-field .prefix{
   color:white;
   font-size:17px;
-  left: 30px;
+  left: 5px;
   top: -8px;
 }
 
@@ -1315,7 +1324,7 @@ hide mdi-action-visibility mdi-action-visibility-off
 
 #channelchat, #all_chat{
   height: calc(100vh - 241px);
-  margin: 0px 5px;
+  margin: 0px 0px;
 }
 
 #chatchannel, #chatall {
@@ -2801,10 +2810,27 @@ nav ul li:hover, nav ul li.active {
   display: none;
 }
 
+
+input:not([type]):focus:not([readonly]), input[type=text]:not(.browser-default):focus:not([readonly]), input[type=password]:not(.browser-default):focus:not([readonly]), input[type=email]:not(.browser-default):focus:not([readonly]), input[type=url]:not(.browser-default):focus:not([readonly]), input[type=time]:not(.browser-default):focus:not([readonly]), input[type=date]:not(.browser-default):focus:not([readonly]), input[type=datetime]:not(.browser-default):focus:not([readonly]), input[type=datetime-local]:not(.browser-default):focus:not([readonly]), input[type=tel]:not(.browser-default):focus:not([readonly]), input[type=number]:not(.browser-default):focus:not([readonly]), input[type=search]:not(.browser-default):focus:not([readonly]), textarea.materialize-textarea:focus:not([readonly]) {
+  border-bottom: 1px solid orange;
+  -webkit-box-shadow: 0 1px 0 0 orange;
+  box-shadow: 0 1px 0 0 orange;
+}
+
+input:not([type]):focus:not([readonly])+label, input[type=text]:not(.browser-default):focus:not([readonly])+label, input[type=password]:not(.browser-default):focus:not([readonly])+label, input[type=email]:not(.browser-default):focus:not([readonly])+label, input[type=url]:not(.browser-default):focus:not([readonly])+label, input[type=time]:not(.browser-default):focus:not([readonly])+label, input[type=date]:not(.browser-default):focus:not([readonly])+label, input[type=datetime]:not(.browser-default):focus:not([readonly])+label, input[type=datetime-local]:not(.browser-default):focus:not([readonly])+label, input[type=tel]:not(.browser-default):focus:not([readonly])+label, input[type=number]:not(.browser-default):focus:not([readonly])+label, input[type=search]:not(.browser-default):focus:not([readonly])+label, textarea.materialize-textarea:focus:not([readonly])+label {
+    color: orange;
+}
+
 .search_input{
   height:50% !important;
 }
 
+.search_input:focus {
+  border-bottom: 1px solid #9e9e9e !important;
+  -webkit-box-shadow: 0 1px 0 0 #9e9e9e !important;
+  box-shadow: 0 1px 0 0 #9e9e9e !important;
+}
+
 #search::-webkit-input-placeholder, #searchFrontpage::-webkit-input-placeholder { /* WebKit browsers */
     color:    #FFF;
 }

server/public/layouts/main.handlebars

@@ -182,11 +182,9 @@
                               <img alt="Get it on Google Play" src="https://play.google.com/intl/en_us/badges/images/generic/en_badge_web_generic.png"/></a>
                           </li>
                           <li>
-                            <p class="hide-on-small-only">
+                              <div id="qr-code-link" class="hide-on-small-only">
-                                <div id="qr-code-link">
+                                  <img id="qr-code-image-link" class="card rounded" src="//chart.googleapis.com/chart?chs=150x150&amp;cht=qr&amp;chl=https://zoff.me/{{list_name}}&amp;choe=UTF-8&amp;chld=L%7C1" alt="QRCode for link" title="QR code for this page, for easy sharing!" />
-                                    <img id="qr-code-image-link" class="card rounded" src="//chart.googleapis.com/chart?chs=150x150&amp;cht=qr&amp;chl=https://zoff.me/{{list_name}}&amp;choe=UTF-8&amp;chld=L%7C1" alt="QRCode for link" title="QR code for this page, for easy sharing!" />
+                              </div>
-                                </div>
-                            </p>
                         </li>
                     </ul>
                 </div>