updates

assets/css/src/main.css

@@ -2540,6 +2540,22 @@ header h1 {
   margin: 0;
 }
 
+footer {
+  background-color: #ddd;
+  padding: 1.5em 0;
+  text-align: center;
+  color: rgba(0, 0, 0, 0.5);
+}
+
+footer a {
+  text-decoration: none;
+  color: inherit;
+}
+
+footer p {
+  margin: 0;
+}
+
 .content {
   margin: 1.5em auto;
   width: 80%;
@@ -2678,6 +2694,10 @@ form legend {
   font-size: 1.5em;
 }
 
+input[type="file"] {
+  display: none;
+}
+
 button,
 input[type="submit"] {
   border: 0;
@@ -2736,6 +2756,48 @@ h3:hover > button.add {
   opacity: 1;
 }
 
+/* BROWSE */
+.left {
+  text-align: left;
+}
+
+.right {
+  text-align: right;
+}
+
+.browse a {
+  color: inherit;
+  text-decoration: none;
+}
+
+.browse table {
+  width: 100%;
+}
+
+.browse .actions {
+  background-color: #455a64;
+  color: #fff;
+  padding: 1.5em 0;
+}
+
+.actions .content {
+  margin: 0 auto;
+  display: flex;
+}
+
+.actions .fa {
+  vertical-align: middle;
+}
+
+.actions .go-right {
+  margin-left: auto;
+}
+
+.browse tr {
+  line-height: 2em;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.03);
+}
+
 /* perfect-scrollbar v0.6.5 */
 .ps-container {
   -ms-touch-action: none;

assets/css/src/sass/main.scss

@@ -82,6 +82,22 @@ header h1 {
   margin: 0;
 }
 
+footer {
+  background-color: #ddd;
+  padding         : 1.5em 0;
+  text-align      : center;
+  color           : rgba(0,0,0,0.5);
+}
+
+footer a {
+  text-decoration: none;
+  color          : inherit;
+}
+
+footer p {
+  margin: 0;
+}
+
 .content {
   margin   : 1.5em auto;
   width    : 80%;
@@ -220,6 +236,10 @@ form legend {
   font-size: 1.5em;
 }
 
+input[type="file"] {
+  display: none;
+}
+
 button,
 input[type="submit"] {
   border          : 0;
@@ -277,5 +297,47 @@ button.add {
 h3:hover > button.add {
   opacity: 1;
 }
+
+/* BROWSE */
+.left {
+  text-align: left;
+}
+
+.right {
+  text-align: right;
+}
+
+.browse a {
+  color          : inherit;
+  text-decoration: none;
+}
+
+.browse table {
+  width: 100%;
+}
+
+.browse .actions {
+  background-color: #455a64;
+  color           : #fff;
+  padding         : 1.5em 0;
+}
+
+.actions .content {
+  margin : 0 auto;
+  display: flex;
+}
+
+.actions .fa {
+  vertical-align: middle;
+}
+
+.actions .go-right {
+  margin-left: auto;
+}
+
+.browse tr {
+  line-height  : 2em;
+  border-bottom: 1px solid rgba(0,0,0,0.03);
+}
 @import "scrollbar";
 @import "notifications";

assets/js/src/app.js

@@ -3,10 +3,12 @@ $(document).ready(function() {
 });
 
 $(document).on('ready pjax:success', function() {
+  // Starts the perfect scroolbar plugin
   $('.scroll').perfectScrollbar();
 
-  $("#preview").click(function(e) {
-    e.preventDefault();
+  // Toggles between preview and editing mode
+  $("#preview").click(function(event) {
+    event.preventDefault();
 
     var preview = $("#preview-area"),
       editor = $('.editor textarea');
@@ -40,6 +42,7 @@ $(document).on('ready pjax:success', function() {
     return false;
   });
 
+  // Submites any form in the page in JSON format
   $('form').submit(function(event) {
     event.preventDefault();
 
@@ -51,8 +54,8 @@ $(document).on('ready pjax:success', function() {
       type: 'POST',
       url: url,
       data: data,
-      beforeSend: function(xhr) {
-        xhr.setRequestHeader('X-Regenerate', button.data("regenerate"));
+      headers: {
+        'X-Regenerate': button.data("regenerate")
       },
       dataType: 'json',
       encode: true,
@@ -71,24 +74,27 @@ $(document).on('ready pjax:success', function() {
     });
   });
 
+  // Log out the user sending bad credentials to the server
   $("#logout").click(function(e) {
     e.preventDefault();
-    jQuery.ajax({
-        type: "GET",
-        url: "/admin",
-        async: false,
-        username: "logmeout",
-        password: "123456",
-        headers: {
-          "Authorization": "Basic xxx"
-        }
-      })
-      .fail(function() {
-        window.location = "/";
-      });
+    $.ajax({
+      type: "GET",
+      url: "/admin",
+      async: false,
+      username: "username",
+      password: "password",
+      headers: {
+        "Authorization": "Basic xxx"
+      }
+    }).fail(function() {
+      window.location = "/";
+    });
+
     return false;
   });
 
+  // Adds one more field to the current group
+  // TODO: improve this function. add group/field/array/obj
   $(".add").click(function(e) {
     e.preventDefault();
     fieldset = $(this).closest("fieldset");