Few layout updates and collection page naming fix.

src/components/lists/CollectionsList.vue

@@ -63,12 +63,11 @@ export default defineComponent({
         const thumbnailPlaceholder = computed (() => require('../../assets/placeholder_square_small.png'))
         const router = useRouter();
         const goToCollectionPage = (collection: any) => {
-            router .push({
+            router.push({
                 name: 'collection',
                 params: {
-                    id: collection.id,
-                    collection: JSON.stringify(collection)
-                }
+                    id: collection.id
+                },
             });
         }
         return {

src/locales/translation-strings.ts

@@ -7,6 +7,7 @@ export const translationStrings = {
         label_loading: 'Loading...',
         label_items_list: 'Items list',
         label_collections_list: 'Collections list',
+        label_collection_items_list: 'Collection items list',
         collection: 'Collection',
         label_site_url: 'Archive site URL',
         placeholder_site_url: 'https://my-tainacan-archive.com',
@@ -45,6 +46,7 @@ export const translationStrings = {
         label_loading: 'Carregando...',
         label_items_list: 'Lista de itens',
         label_collections_list: 'Lista de coleções',
+        label_collection_items_list: 'Lista de itens da coleção',
         collection: 'Coleção',
         label_site_url: 'URL do Site do Acervo',
         placeholder_site_url: 'https://meu-acervo-tainacan.com',

src/pages/CollectionPage.vue

@@ -1,6 +1,6 @@
 <template>
     <base-layout
-            :page-title="(collectionObject && collectionObject.name) ? collectionObject.name : $t('collection')" 
+            :page-title="$t('label_collection_items_list')" 
             page-default-back-link="/collections">
         <ion-refresher slot="fixed" @ionRefresh="doRefresh($event)">
             <ion-refresher-content></ion-refresher-content>
@@ -75,8 +75,7 @@ export default defineComponent({
         IonInfiniteScrollContent
     },
     props: {
-        id: String,
-        collection: String
+        id: String
     },
     setup(props) {
         const isLoading = ref(false);
@@ -186,7 +185,6 @@ export default defineComponent({
             const { role, data } = await actionSheet.onDidDismiss();
             console.log('onDidDismiss resolved with role and data', role, data);
         }
-        const collectionObject = props.collection ? JSON.parse(props.collection + '') : false;
 
         let tainacanStore = useTainacanStore();
         return {
@@ -201,7 +199,6 @@ export default defineComponent({
             add,
             actionSheetLabels,
             setActionSheetLabels,
-            collectionObject,
             infiniteScroll,
             handleSearch,
         }

src/pages/HomePage.vue

@@ -20,6 +20,10 @@
                 size="small"
                 routerLink="/collections">
             {{ $t('label_view_all_collections', [tainacanStore.totalHomeCollections]) }}
+            <ion-icon
+                slot="end"
+                :icon="arrowForwardOutline"
+            ></ion-icon>
         </ion-button>
         <ion-list>
             <ion-list-header>
@@ -32,6 +36,10 @@
                     size="small"
                     routerLink="/items">
                 {{ $t('label_view_all_items', [tainacanStore.totalHomeItems]) }}
+                <ion-icon
+                    slot="end"
+                    :icon="arrowForwardOutline"
+                ></ion-icon>
             </ion-button>
         </ion-list>
     </base-layout>
@@ -46,7 +54,9 @@ import { ref } from 'vue';
 import CollectionsList from '@/components/lists/CollectionsList.vue';
 import ItemsList from '@/components/lists/ItemsList.vue';
 import BaseLayout from '@/components/base/BaseLayout.vue';
+import { arrowForwardOutline } from "ionicons/icons";
 import {
+    IonIcon,
     IonButton,
     IonLoading,
     IonList,
@@ -57,6 +67,7 @@ import {
 
 export default {
     components: {
+        IonIcon,
         CollectionsList,
         ItemsList,
         BaseLayout,
@@ -83,6 +94,7 @@ export default {
         let tainacanStore = useTainacanStore();
 
         return {
+            arrowForwardOutline,
             tainacanStore,
             isLoading,
             setIsLoading,

src/theme/core.css

@@ -19,6 +19,7 @@ ion-card {
 .searchbar-input {
     border-radius: 30px !important;
     box-shadow: none !important;
+    --background: var(--ion-color-light-shade);
 }
 
 .header-md::after {