Update grav button moved to bottom

themes/grav/css-compiled/template.css

@@ -277,7 +277,7 @@ hr {
  * CSS TOGGLE SWITCHES
  * Unlicense
  *
- * Ionuț Colceriu - ghinda.net
+ * Ionuț Colceriu - ghinda.net
  * https://github.com/ghinda/css-toggle-switch
  *
  */
@@ -448,7 +448,7 @@ hr {
    */
   .switch-grav {
     background-color: #fff;
-    border: 1px solid #d5d5d5;
+    border: 1px solid #d4d4d4;
     border-radius: 4px;
     /* Selected ON switch-light
      */ }
@@ -579,7 +579,7 @@ form .selectize-control.multi .selectize-input {
     border-radius: 2px;
     line-height: 1.5; }
     form .selectize-control.multi .selectize-input > div.active {
-      background: #d5d5d5; }
+      background: #d4d4d4; }
 form .selectize-control.single .selectize-input:after {
   right: 27px; }
 form .selectize-control.single .selectize-input.dropdown-active:after {
@@ -598,7 +598,7 @@ form .large {
     height: 10rem; }
 form select {
   width: 100%;
-  border: 1px solid #d5d5d5;
+  border: 1px solid #d4d4d4;
   background: #fff;
   -webkit-appearance: none;
   -moz-appearance: none;
@@ -608,17 +608,17 @@ form select {
   margin: 0; }
 form input[type=text], form input[type=password], form input[type=email] {
   width: 100%;
-  border: 1px solid #d5d5d5;
+  border: 1px solid #d4d4d4;
   background: #fff; }
 form input[readonly=readonly] {
   background: #f2f2f2;
   font-weight: bold; }
 form textarea {
   width: 100%;
-  border: 1px solid #d5d5d5;
+  border: 1px solid #d4d4d4;
   background: #fff; }
 form .form-frontmatter-wrapper {
-  border: 1px solid #d5d5d5;
+  border: 1px solid #d4d4d4;
   border-radius: 4px; }
 form .switch-toggle label {
   cursor: pointer; }
@@ -664,7 +664,7 @@ form .checkboxes {
     margin-right: 10px;
     position: absolute;
     background: #fff;
-    border: 1px solid #d5d5d5;
+    border: 1px solid #d4d4d4;
     border-radius: 4px; }
   form .checkboxes input[type=checkbox] {
     display: none; }
@@ -681,7 +681,7 @@ form .checkboxes {
   margin-bottom: 3rem; }
   .form-frontmatter-wrapper .dragbar {
     height: 4px;
-    background: #d5d5d5;
+    background: #d4d4d4;
     cursor: row-resize; }
 
 #frontmatter + .CodeMirror {
@@ -696,7 +696,7 @@ form .checkboxes {
   .form-order-wrapper ul#ordering li {
     padding: 0.2rem 1rem;
     border-radius: 4px;
-    border: 1px solid #d5d5d5;
+    border: 1px solid #d4d4d4;
     background: #f8f8f8;
     color: #8d959a;
     margin: 3px 0;
@@ -720,7 +720,7 @@ form .checkboxes {
     cursor: move;
     padding: 1rem;
     border-radius: 4px;
-    border: 1px solid #d5d5d5;
+    border: 1px solid #d4d4d4;
     background: #f8f8f8;
     color: #8d959a;
     margin: 3px 0;
@@ -852,21 +852,21 @@ tr {
     color: #fff; }
   .button.dropdown-toggle {
     background: #54c5b0;
-    border-left: 1px solid #3bab97; }
+    border-left: 1px solid #3aab97; }
   .button.dropdown-toggle {
-    border-left: 1px solid #3bab97; }
+    border-left: 1px solid #3aab97; }
   .button.secondary {
-    background: #2a7a6b;
+    background: #29796b;
     color: rgba(255, 255, 255, 0.85);
     border-radius: 4px; }
     .button.secondary:hover {
-      background: #318d7c;
+      background: #2f8c7c;
       color: #fff; }
     .button.secondary.dropdown-toggle {
-      background: #318d7c;
+      background: #2f8c7c;
-      border-left: 1px solid #23675a; }
+      border-left: 1px solid #23665a; }
     .button.secondary.dropdown-toggle {
-      border-left: 1px solid #318d7c; }
+      border-left: 1px solid #2f8c7c; }
 
 .button-group {
   position: relative;
@@ -908,7 +908,7 @@ tr {
     background-color: #41bea8;
     -webkit-background-clip: padding-box;
     background-clip: padding-box;
-    border: 1px solid #3bab97;
+    border: 1px solid #3aab97;
     border: 1px solid rgba(0, 0, 0, 0.15);
     border-radius: 4px;
     -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
@@ -975,7 +975,7 @@ tr {
   #admin-login .form-data {
     padding-right: 0; }
   #admin-login h1 {
-    background: #21333e url(../images/logo.png) 50% 50% no-repeat;
+    background: #20333e url(../images/logo.png) 50% 50% no-repeat;
     font-size: 0;
     color: transparent;
     height: 216px;
@@ -991,15 +991,15 @@ tr {
       text-align: center;
       font-weight: 300;
       -webkit-font-smoothing: auto;
-      border: 1px solid #1e2e39; }
+      border: 1px solid #1d2e38; }
       #admin-login form input::-webkit-input-placeholder {
-        color: #83949d; }
+        color: #83949c; }
       #admin-login form input::-moz-placeholder {
-        color: #83949d; }
+        color: #83949c; }
       #admin-login form input:-moz-placeholder {
-        color: #83949d; }
+        color: #83949c; }
       #admin-login form input:-ms-input-placeholder {
-        color: #83949d; }
+        color: #83949c; }
     #admin-login form .form-actions {
       text-align: center;
       margin: 0 -3rem -3rem -3rem;
@@ -1028,7 +1028,7 @@ tr {
       color: #fff; }
 
 #admin-logo {
-  background: #21333e;
+  background: #20333e;
   height: 4.2rem; }
   #admin-logo h3 {
     text-transform: uppercase;
@@ -1042,7 +1042,7 @@ tr {
 
 #admin-user-details {
   padding: 2rem;
-  border-bottom: 1px solid #21333e;
+  border-bottom: 1px solid #20333e;
   overflow: hidden; }
   #admin-user-details img {
     -webkit-transition: all 0.5s ease;
@@ -1077,7 +1077,7 @@ tr {
       #admin-menu li .badges .badge {
         display: inline-block;
         margin-right: -5px;
-        color: #e6e6e6; }
+        color: #e5e5e5; }
       #admin-menu li .badges .count {
         background-color: #365569; }
       #admin-menu li .badges .updates {
@@ -1106,7 +1106,7 @@ tr {
         color: #afc7d5;
         margin-right: 8px; }
       #admin-menu li a:hover {
-        background: #21333e;
+        background: #20333e;
         color: #fff; }
         #admin-menu li a:hover i {
           font-size: 1.2rem; }
@@ -1193,6 +1193,25 @@ tr {
       -webkit-transition: margin-top 0.15s ease-out;
       -moz-transition: margin-top 0.15s ease-out;
       transition: margin-top 0.15s ease-out; }
+      @media only all and (max-width: 47.938em) {
+        #admin-main .grav-update.grav {
+          position: absolute;
+          z-index: 9;
+          bottom: 0;
+          width: 100%; }
+          #admin-main .grav-update.grav p * {
+            display: none; }
+          #admin-main .grav-update.grav p {
+            font-size: 0; }
+            #admin-main .grav-update.grav p button {
+              width: 95%;
+              display: inherit;
+              position: absolute;
+              top: 0;
+              left: 0;
+              margin-left: 2.5%;
+              margin-right: 2.5%;
+              padding-left: 0; } }
   #admin-main .grav-update.grav + .content-padding {
     top: 7.2rem;
     -webkit-transition: top 0.15s ease-out;
@@ -1200,7 +1219,9 @@ tr {
     transition: top 0.15s ease-out; }
     @media only all and (max-width: 47.938em) {
       #admin-main .grav-update.grav + .content-padding {
-        top: 3.2rem; } }
+        top: 5.2rem;
+        padding-bottom: 8rem;
+        padding-top: 0rem; } }
   #admin-main .content-padding {
     position: absolute;
     top: 4.2rem;
@@ -1874,7 +1895,7 @@ body.remodal_active .remodal {
     border-radius: 0; }
 
 .grav-mdeditor-navbar {
-  border: 1px solid #d5d5d5;
+  border: 1px solid #d4d4d4;
   border-top-right-radius: 4px;
   border-top-left-radius: 4px;
   background: #fbfbfb; }
@@ -1893,8 +1914,8 @@ body.remodal_active .remodal {
     .grav-mdeditor-navbar ul .mdeditor-active a {
       background: white;
       cursor: auto;
-      border-left: 1px solid #d5d5d5;
+      border-left: 1px solid #d4d4d4;
-      border-right: 1px solid #d5d5d5; }
+      border-right: 1px solid #d4d4d4; }
       .grav-mdeditor-navbar ul .mdeditor-active a:hover {
         background: #fff; }
     .grav-mdeditor-navbar ul a {
@@ -1917,7 +1938,7 @@ body.remodal_active .remodal {
     border-top-right-radius: 4px; }
 
 .grav-mdeditor-content {
-  border: 1px solid #d5d5d5;
+  border: 1px solid #d4d4d4;
   border-top: 0;
   border-bottom-right-radius: 4px;
   border-bottom-left-radius: 4px; }
@@ -1961,7 +1982,7 @@ body.remodal_active .remodal {
 [data-mode=split] .grav-mdeditor-button-code, [data-mode=split] .grav-mdeditor-button-preview {
   display: none; }
 [data-mode=split] .grav-mdeditor-code {
-  border-right: 1px solid #d5d5d5; }
+  border-right: 1px solid #d4d4d4; }
   [data-mode=split] .grav-mdeditor-code, [data-mode=split] .grav-mdeditor-code .grav-mdeditor-preview {
     float: left;
     width: 50%; }
@@ -2057,7 +2078,7 @@ body.remodal_active .remodal {
 
 .dropzone {
   position: relative;
-  border: 1px #d5d5d5 solid;
+  border: 1px #d4d4d4 solid;
   border-radius: 4px;
   min-height: 4rem;
   background: #fff; }
@@ -2473,5 +2494,3 @@ button.toast-close-button {
 #phpinfo h2 {
   font-size: 1.7rem;
   margin: 3rem 3rem 0rem !important; }
-
-/*# sourceMappingURL=template.css.map */

themes/grav/js/mobile.js

@@ -15,22 +15,15 @@ $(document).ready(function(){
             //open sidebar
             var admin_sidebar = document.getElementById("admin-sidebar");
             $(admin_sidebar).toggle("slide");
+            var selected = admin_sidebar.getElementsByClassName("selected")[0].getElementsByTagName("a");
+            selected[0].href="javascript:void(0)";
 
             //enable sidebar closing;
             admin_sidebar.addEventListener("click", function(event){
-                if(event.target == admin_sidebar){
+                if(event.target == admin_sidebar || event.target == selected[0]){
                     $(admin_sidebar).toggle("slide");
                 }
             });
         });
-        //If updates available variable hide after x milliseconds
-        if($("#admin-main > .grav-update").length > 0){
-            var oldTop = $("#admin-main > .content-padding").css('top');
-            console.log(oldTop);
-            console.log($("#admin-main > .content-padding").css('top','11.2rem'));
-            $("#admin-main > .grav-update").delay(5000).fadeOut(500);
-            $("#admin-main > .content-padding").delay(5000).queue(function(){$(this).css('top', oldTop);});
-        }
-
     }
 });

themes/grav/scss/template/_admin.scss

@@ -271,6 +271,29 @@ $update-height: 3rem;
         &.grav {
             margin-top: 0;
             @include transition (margin-top 0.15s ease-out);
+
+            @include breakpoint(mobile-only){
+                position: absolute;
+                z-index: 9;
+                bottom: 0;
+                width: 100%;
+                p * {
+                    display: none;
+                }
+                p {
+                    font-size: 0;
+                    button {
+                            width: 95%;
+                            display: inherit;
+                            position: absolute;
+                            top: 0;
+                            left: 0;
+                            margin-left: 2.5%;
+                            margin-right: 2.5%;
+                            padding-left: 0;
+                    }
+                }
+            }
         }
     }
 
@@ -279,7 +302,9 @@ $update-height: 3rem;
         @include transition (top 0.15s ease-out);
 
         @include breakpoint(mobile-only){
-            top: 3.2rem;
+            top: 5.2rem;
+            padding-bottom: 8rem;
+            padding-top: 0rem;
         }
     }