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

This commit is contained in:
Mateus Machado Luna 2018-05-22 13:13:43 -03:00
parent f9189a1203
commit 868b50db3e
6 changed files with 19 additions and 14 deletions

View File

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

View File

@ -55,7 +55,7 @@
:class="activeRoute == 'EventsPage' ? 'is-active':''"> :class="activeRoute == 'EventsPage' ? 'is-active':''">
<b-icon <b-icon
size="is-small" 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> </router-link></li>
</ul> </ul>
</aside> </aside>

View File

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

View File

@ -46,7 +46,7 @@ const routes = [
{ path: 'edit', component: CollectionEditionForm, name: 'CollectionEditionForm', meta: {title: i18nGet('title_edit_collection'), icon: 'folder-multiple'} }, { 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: '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: '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/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: '/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: '/'} { path: '*', redirect: '/'}
]; ];

View File

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

View File

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