Historique de la page

Avant tout chose...

Pour personnaliser le thème de l'application, vous devez dupliquer le dossier app-theme-dist dans le répertoire /dev/user-frontend-ionic/src/theme et le renommer en app-theme (le nom du nouveau dossier doit être respecté, car certains éléments comme les modules importent les feuilles de style via un chemin absolu déjà établi). Si ce n'est pas déjà fait, il faudra également renommer le fichier theme.scss.dist en theme.scss. 

...

Le logo et le splashscreen se trouvent par défaut dans /dev/user-frontend-ionic/src/theme/defaultapp-theme-dist/resources

Placer vos ressources à l'identique dans /dev/user-frontend-ionic/src/theme/<themeapp-name>theme/resources

Respecter les conventions de nommage et le mode simple (recommandé dans la documentation https://github.com/ionic-team/capacitor-assets)

/dev/user-frontend-ionic/src/theme/<themeapp-name>theme/resources
|--logo.png

Lancer la commande

cd /dev/user-frontend-ionic/
npx capacitor-assets generate --assetPath /src/theme/<themeapp-name>theme/resources

Il faudra au minimum une image nommée logo afin de générer toutes les assets nécessaires.

...

Les feuilles de style des modules sont dans le répertoire /src/theme/app-theme-dist, pour lancer l'application, il faudra faire une copie du dossier /app-theme-dist en /app-theme (le nom du nouveau dossier est important car les chemins sont déjà définis dans les modules)/styles.

Pour personnaliser le style des modules, vous pouvez modifier directement les fichiers présents dans /app-themele répertoire, ilsne seront pas pris en compte dans les commits.

...

Tous les fichiers ressources (icones, police, logos) appelés depuis les fichiers scss doivent se trouver dans un répertoire /assets du thème.

Traductions

Tous les fichiers de traduction i18n doivent se trouver dans un répertoire /assets/i18n du thème.

Tour guidé

Dans le fichier /dev/user-frontend-ionic/src/environments/environment.ts paramétrer :

• guidedTourEnabled : Activer ou non le tour guidé true/false

...

Ajouter des icônes personnalisées

Un mécanisme a été mis en place pour permettre l'ajout d'icônes et les utiliser comme des icônes natives Ionic. Par exemple : <ion-icon name="[nom-icône]">, où [nom-icône] représente simplement le nom du fichier SVG.

Pour ajouter une nouvelle icône, collez simplement celle-ci au format SVG dans un des dossiers d'icônes features/, flag/, navigation/, social-network/, static-pages/ présents dans src/theme/app-theme/assets/icons/

Vous avez également la possibilité d'ajouter une nouvelle collection d'icônes au format SVG à votre client.
Pour cela, placez votre dossier dans src/theme/app-theme/assets/icons/ et déclarez le dossier dans le fichier angular.json au niveau la propriété projects.app.architect.build.options.assets

{
	"glob": "**/*.svg",
	"input": "src/theme/app-theme/assets/icons/nouveau_dossier",
	"output": "./svg"
},

Votre nouveau set d'icônes sera automatiquement intégré par ionic.

Traductions

Tous les fichiers de traduction i18n doivent se trouver dans un répertoire /assets/i18n du thème.

Tour guidé

Tous les fichiers images appelés depuis tour guidé doivent se trouver dans un répertoire répertoire /assets/guided-tour du thème.Les

Le tour guidé repose sur un module Angular, guided-tour, placé à la racine du répertoire du thème. Les fichiers chargés de déclarer la navigation du tour guidé se trouvent dans dev/user-frontend-ionic/projects/shared/src/lib/guided-tour/configdoivent se trouver dans ce module.

Les tours guidés à exporter sont :

• anonymousSteps : tour guidé lorsque l'utilisateur n'est pas connecté
• loggedSteps : tour guidé lorsque l'utilisateur est connecté

Pour désactiver le tour guidé, référez-vous à Paramétrages des clients.