Replaces collection edit icons, collection items label and events icon on primary menu and subheader. This is still in discussion.

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

@@ -123,7 +123,7 @@
                                         @click.prevent.stop="goToCollectionEditPage(collection.id)">
                                     <b-icon 
                                             type="is-secondary" 
-                                            icon="pencil"/>
+                                            icon="settings"/>
                                 </a>
                                 <a 
                                         id="button-delete" 

src/admin/components/navigation/primary-menu.vue

@@ -55,7 +55,7 @@
                         :class="activeRoute == 'EventsPage' ? 'is-active':''">
                     <b-icon 
                             size="is-small" 
-                            icon="calendar-range"/> <span class="menu-text">{{ $i18n.get('events') }}</span>
+                            icon="flash"/> <span class="menu-text">{{ $i18n.get('events') }}</span>
                 </router-link></li>
             </ul>
         </aside>

src/admin/components/navigation/tainacan-subheader.vue

@@ -33,9 +33,9 @@
                         :aria-label="$i18n.get('label_collection_items')">
                     <b-icon 
                             size="is-small" 
-                            icon="folder-outline"/>
+                            icon="file-multiple"/>
                     <br>
-                    <span class="menu-text">{{ $i18n.getFrom('collections', 'singular_name') }}</span>
+                    <span class="menu-text">{{ $i18n.get('items') }}</span>
                 </router-link>
             </li>
             <li class="level-item">
@@ -43,12 +43,12 @@
                         tag="a" 
                         :to="{ path: $routerHelper.getCollectionEditPath(id) }" 
                         :class="activeRoute == 'CollectionEditionForm' ? 'is-active':''" 
-                        :aria-label="$i18n.getFrom('collections','edit_item')">
+                        :aria-label="$i18n.get('label_settings')">
                     <b-icon 
                             size="is-small" 
-                            icon="pencil"/>
+                            icon="settings"/>
                     <br>
-                    <span class="menu-text">{{ $i18n.get('edit') }}</span>
+                    <span class="menu-text">{{ $i18n.get('label_settings') }}</span>
                 </router-link>
             </li>
             <li class="level-item">
@@ -85,7 +85,7 @@
                         :aria-label="$i18n.get('label_collection_events')">
                     <b-icon 
                             size="is-small" 
-                            icon="calendar-range"/>
+                            icon="flash"/>
                     <br>
                     <span class="menu-text">{{ $i18n.get('events') }}</span>
                 </router-link>

src/admin/js/router.js

@@ -46,7 +46,7 @@ const routes = [
         { path: 'edit', component: CollectionEditionForm,  name: 'CollectionEditionForm', meta: {title: i18nGet('title_edit_collection'), icon: 'folder-multiple'} },
         { path: 'fields', component: FieldsList, name: 'FieldsList', meta: {title: i18nGet('title_collection_fields_edition'), icon: 'folder-multiple'} }, 
         { path: 'filters', component: FiltersList, name: 'FiltersList', meta: {title: i18nGet('title_collection_filters_edition'), icon: 'folder-multiple'} },
-        { path: 'events', component: EventsPage, name: 'CollectionEventsPage', meta: {title: i18nGet('title_collection_events'), icon: 'calendar'} }
+        { path: 'events', component: EventsPage, name: 'CollectionEventsPage', meta: {title: i18nGet('title_collection_events'), icon: 'flash'} }
       ]
     },
 
@@ -62,8 +62,8 @@ const routes = [
     { path: '/taxonomies/:categoryId/edit', name: 'CategoryEditionForm', component: CategoryEditionForm, meta: {title: i18nGet('title_category_edition_page'), icon: 'shape'} },
     { path: '/taxonomies/:categoryId', name: 'CategoryPage', component: CategoryPage, meta: {title: i18nGet('title_category_page'), icon: 'shape'} },
 
-    { path: '/events',  name: 'EventsPage', component: EventsPage, meta: {title: i18nGet('title_repository_events_page'), icon: 'calendar'} },
+    { path: '/events',  name: 'EventsPage', component: EventsPage, meta: {title: i18nGet('title_repository_events_page'), icon: 'flash'} },
-    { path: '/events/:eventId', name: 'EventPage', component: EventPage, meta: {title: i18nGet('title_event_page'), icon: 'calendar'} },
+    { path: '/events/:eventId', name: 'EventPage', component: EventPage, meta: {title: i18nGet('title_event_page'), icon: 'flash'} },
 
     { path: '*', redirect: '/'}
 ];

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

@@ -5,6 +5,7 @@
         <!-- SEARCH AND FILTERS --------------------- -->
         <button 
                 id="filter-menu-compress-button"
+                :style="{ top: isHeaderShrinked ? '125px' : '152px'}"
                 @click="isFiltersMenuCompressed = !isFiltersMenuCompressed">
             <b-icon :icon="isFiltersMenuCompressed ? 'menu-right' : 'menu-left'" />
         </button>
@@ -183,7 +184,8 @@
                 isFiltersMenuCompressed: false,
                 collapseAll: false,
                 isOnTheme: false,
-                futureSearchQuery: ''
+                futureSearchQuery: '',
+                isHeaderShrinked: false
             }
         },
         props: {
@@ -348,7 +350,8 @@
 
             if (!this.isRepositoryLevel && !this.isOnTheme) {
                 document.getElementById('items-list-area').addEventListener('scroll', ($event) => {
-                    this.$emit('onShrinkHeader', ($event.originalTarget.scrollTop > 53)); 
+                    this.isHeaderShrinked = ($event.originalTarget.scrollTop > 53);
+                    this.$emit('onShrinkHeader', this.isHeaderShrinked); 
                 });
             }
         }
@@ -468,6 +471,7 @@
         border-top-right-radius: 2px;
         border-bottom-right-radius: 2px;
         cursor: pointer;
+        transition: top 0.3s;
 
         .icon {
             margin-top: -1px;

src/admin/tainacan-admin-i18n.php

@@ -69,7 +69,7 @@ return [
 	'title_create_category_page'               => __( 'Taxonomy Creation', 'tainacan' ),
 	'title_create_item_collection'             => __( 'Create Item on Collection', 'tainacan' ),
 	'title_create_filter'                      => __( 'Filter Creation', 'tainacan' ),
-	'title_edit_collection'                    => __( 'Edit Collection', 'tainacan' ),
+	'title_edit_collection'                    => __( 'Settings of Collection', 'tainacan' ),
 	'title_edit_item'     	                   => __( 'Edit Item', 'tainacan' ),
 	'title_category_edition_page'              => __( 'Taxonomy Edition', 'tainacan' ),
 	'title_filter_edition'                     => __( 'Filter Edition', 'tainacan' ),
@@ -86,6 +86,7 @@ return [
 	'label_main_menu'                          => __( 'Main Menu', 'tainacan' ),
 	'label_collection_menu'                    => __( 'Collection Menu', 'tainacan' ),
 	'label_title'                              => __( 'Title', 'tainacan' ),
+	'label_settings'                           => __( 'Settings', 'tainacan' ),
 	'label_actions'                            => __( 'Actions', 'tainacan' ),
 	'label_name'                               => __( 'Name', 'tainacan' ),
 	'label_description'                        => __( 'Description', 'tainacan' ),