Adds collapse on filters sidebar

src/admin/components/lists/collections-list.vue

@@ -6,7 +6,10 @@
             <button 
                     v-if="selectedCollections.length > 0" 
                     class="button field is-danger" 
-                    @click="deleteSelectedCollections()"><span>{{ $i18n.get('instruction_delete_selected_collections') }} </span><b-icon icon="delete"/></button>
+                    @click="deleteSelectedCollections()">
+                <span>{{ $i18n.get('instruction_delete_selected_collections') }} </span>
+                <b-icon icon="delete"/>
+            </button>
         </b-field>
         <b-table
                 v-if="totalCollections > 0"

src/admin/pages/lists/items-page.vue

@@ -26,7 +26,9 @@
                     </b-dropdown-item>
                     <b-dropdown-item>{{ $i18n.get('add_items_bulk') }}
                     </b-dropdown-item>
-                    <b-dropdown-item>{{ $i18n.get('add_items_external_source') }}<br><small class="is-small">{{ $i18n.get() }}</small></b-dropdown-item>
+                    <b-dropdown-item>{{ $i18n.get('add_items_external_source') }}<br>
+                        <small class="is-small">{{ $i18n.get() }}</small>
+                    </b-dropdown-item>
                 </b-dropdown>
 
             </div>
@@ -42,10 +44,26 @@
                 <b-loading
                         :is-full-page="false"
                         :active.sync="isLoadingFilters"/>
-                <h3>{{ $i18n.get('filters') }}</h3>
+
+                <h3 class="has-text-weight-semibold">
+                    {{ $i18n.get('filters') }}
+                </h3>
+                <b-collapse :open="false">
+                    <p
+                            slot="trigger"
+                            class="is-small is-size-7 has-text-primary">
+                        {{ $i18n.get('expand_all') }}
+                        <b-icon
+                                icon="menu-down"
+                                size="is-small" />
+                    </p>
+
+                    <br>
+
                     <filters-items-list
                             v-if="!isLoadingFilters && filters.length > 0"
                             :filters="filters"/>
+
                     <section
                             v-else
                             class="is-grouped-centered section">
@@ -65,6 +83,7 @@
                             </router-link>
                         </div>
                     </section>
+                </b-collapse>
             </aside>
             <div class="column">
                 <div class="table-container above-subheader">

src/admin/tainacan-admin-i18n.php

@@ -38,6 +38,7 @@ return [
 	'add_one_item'                             => __( 'Add one item', 'tainacan' ),
 	'add_items_bulk'                           => __( 'Add items in bulk', 'tainacan' ),
 	'add_items_external_source'                => __( 'Add items from an external source', 'tainacan' ),
+	'expand_all'                               => __( 'Expand all', 'tainacan' ),
 
 	// Wordpress Status
 	'publish'                                  => __( 'Publish', 'tainacan' ),

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

@@ -5,6 +5,7 @@
                     size="is-small"
                     v-model="date_init"
                     @input="validate_values()"
+                    :readonly="false"
                     icon="calendar-today"/>
             <br>
             <b-datepicker
@@ -12,6 +13,7 @@
                     v-model="date_end"
                     @input="validate_values()"
                     @focus="isTouched = true"
+                    :readonly="false"
                     icon="calendar-today"/>
             <br>
         </div>

src/classes/filter-types/tainacan-filter-item.vue

@@ -1,8 +1,15 @@
 <template>
     <b-field
-            :label="filter.name"
             :message="getErrorMessage"
             :type="filterTypeMessage">
+        <b-collapse :open="false">
+            <label slot="trigger">
+                <b-icon
+                        icon="menu-down"
+                        size="is-small" />
+                {{ filter.name }}
+            </label>
+
             <div>
                 <component
                         :id="filter.filter_type_object.component + '-' + filter.slug"
@@ -11,6 +18,7 @@
                         :query="query"
                         @input="listen( $event )"/>
             </div>
+        </b-collapse>
     </b-field>
 </template>