Merge branch 'develop' of https://github.com/tainacan/tainacan into develop

src/admin/scss/_tainacan-form.scss

@@ -70,7 +70,7 @@
             border: 1px solid $gray2;
             background-color: $gray1 !important;
             color: $secondary !important;
-            padding: 0.75rem !important;
+            padding: 0 0.6rem !important;
             border-radius: 0 !important;
 
             .mdi::before {

src/admin/scss/tainacan-admin.scss

@@ -31,12 +31,12 @@
 @import "../scss/_iframe_read_mode_overrides.scss";
 
 // Clears wordpress content
-body.tainacan-admin-page #adminmenumain, body.tainacan-admin-page #wpfooter, body.tainacan-admin-page #wp-auth-check-wrap {
-    display: none;
-}
 html {
     overflow-y: hidden;
 }
+body.tainacan-admin-page #adminmenumain, body.tainacan-admin-page #wpfooter, body.tainacan-admin-page #wp-auth-check-wrap {
+    display: none;
+}
 #tainacan-admin-app {
     background: #ffffff;
     position: fixed;
@@ -51,6 +51,21 @@ html {
     font-family: $family-sans-serif;
 }
 
+// Scrollbars
+#tainacan-admin-app * {
+    // For Firefox
+    scrollbar-color: $gray3 transparent;
+    scrollbar-width: thin;
+
+    // For Chromium and related
+    &::-webkit-scrollbar {
+        width: 0.4rem;
+    }
+    &::-webkit-scrollbar-thumb {
+        background-color: $gray3;
+    }
+}
+
 // Tainacan Loading
 .tainacan-icon {
     opacity: 0; // Will make it 1 once window.load is done; 

src/classes/filter-types/custom-interval/CustomInterval.vue

@@ -9,6 +9,9 @@
                     size="is-small"
                     @focus="isTouched = true"
                     @input="validate_values()"
+                    editable
+                    :date-formatter="(date) => dateFormatter(date)"
+                    :date-parser="(date) => dateParser(date)"
                     icon="calendar-today"
                     :day-names="[
                         $i18n.get('datepicker_short_sunday'),
@@ -27,6 +30,9 @@
                     size="is-small"
                     @input="validate_values()"
                     @focus="isTouched = true"
+                    editable
+                    :date-formatter="(date) => dateFormatter(date)"
+                    :date-parser="(date) => dateParser(date)"
                     icon="calendar-today"
                     :day-names="[
                         $i18n.get('datepicker_short_sunday'),
@@ -62,6 +68,7 @@
 <script>
     import { tainacan as axios } from '../../../js/axios/axios';
     import { wpAjax, dateInter } from "../../../admin/js/mixins";
+    import moment from 'moment';
 
     export default {
         mixins: [ wpAjax, dateInter ],
@@ -166,6 +173,12 @@
                     type: 'is-danger'
                 })
             },
+            dateFormatter(dateObject) { 
+                return moment(dateObject, moment.ISO_8601).format(this.dateFormat);
+            },
+            dateParser(dateString) { 
+                return moment(dateString, this.dateFormat).toDate(); 
+            },
             selectedValues(){
                 if ( !this.query || !this.query.metaquery || !Array.isArray( this.query.metaquery ) )
                     return false;

src/classes/filter-types/date/Date.vue

@@ -65,6 +65,9 @@
                 :placeholder="$i18n.get('instruction_select_a_date')"
                 v-model="value"
                 @input="emit()"
+                editable
+                :date-formatter="(date) => dateFormatter(date)"
+                :date-parser="(date) => dateParser(date)"
                 size="is-small"
                 icon="calendar-today"
                 :day-names="[
@@ -82,6 +85,7 @@
 <script>
     import { tainacan as axios } from '../../../js/axios/axios';
     import { wpAjax, dateInter } from "../../../admin/js/mixins";
+    import moment from 'moment';
 
     export default {
         mixins: [ wpAjax, dateInter ],
@@ -192,6 +196,12 @@
 
                 this.value = null;
             },
+            dateFormatter(dateObject) { 
+                return moment(dateObject, moment.ISO_8601).format(this.dateFormat);
+            },
+            dateParser(dateString) { 
+                return moment(dateString, this.dateFormat).toDate(); 
+            },
             // emit the operation for listeners
             emit() {