refactor(icons): replace FontAwesome with Tabler Icons

Drop the three @fortawesome/* packages (v5, with a stagnant Vue 2
binding) in favor of @tabler/icons-webfont. The old <awe-icon>
wrapper is replaced by <vaquant-icon>, named after the project so
future icon-library swaps don't require another rename.
This commit is contained in:
Julien Calixte
2026-06-01 18:33:58 +02:00
parent 5fe9905df7
commit 639429e18b
20 changed files with 63 additions and 152 deletions

View File

@@ -13,7 +13,7 @@
>
<span v-if="account.isPublic">
&nbsp;
<awe-icon icon="users" />
<vaquant-icon icon="users" />
</span>
<div class="numeric">
{{ totalCost | moneypad(account.mainCurrency, false) }}

View File

@@ -8,7 +8,7 @@
/>
</div>
<div v-else-if="fetched">
<awe-icon icon="inbox" />&nbsp;Les comptes créés s'afficheront ici.
<vaquant-icon icon="inbox" />&nbsp;Les comptes créés s'afficheront ici.
</div>
<fab-button :to="{ name: 'account-new' }" :margin="true">
<span slot="fulltext">créer un compte</span>

View File

@@ -29,7 +29,7 @@
@click="saveUsers"
class="button is-primary is-fullwidth is-large"
>
<awe-icon icon="check" />
<vaquant-icon icon="check" />
</button>
</div>
</div>

View File

@@ -6,7 +6,7 @@
>
<div class="control" v-if="filteredBy">
<button type="submit" class="button" @click="filteredBy = ''">
<awe-icon icon="times" />
<vaquant-icon icon="x" />
</button>
</div>
<div class="control">
@@ -29,13 +29,13 @@
<thead v-if="head">
<tr>
<th scope="col">
<awe-icon icon="minus" />
<vaquant-icon icon="minus" />
</th>
<th scope="col" class="align">
<awe-icon icon="user" />
<vaquant-icon icon="user" />
</th>
<th scope="col" class="align">
<awe-icon icon="money-bill-wave" />
<vaquant-icon icon="cash" />
</th>
</tr>
</thead>

View File

@@ -17,7 +17,7 @@
</div>
<div class="column is-one-third">
<div class="main-icon">
<awe-icon icon="users"></awe-icon>
<vaquant-icon icon="users"></vaquant-icon>
</div>
<p>Choisissez de rendre le compte privé ou public :</p>
<ul>
@@ -32,7 +32,7 @@
</div>
<!-- <div class="column is-one-third">
<div class="main-icon">
<awe-icon icon="user-lock"/>
<vaquant-icon icon="user-shield"/>
</div>
<p>
Les informations sensibles de vos comptes et transactions sont chiffrées de bout en bout.
@@ -41,9 +41,9 @@
</div>-->
<div class="column is-one-third">
<div class="main-icon">
<awe-icon icon="euro-sign" />&nbsp;
<awe-icon icon="exchange-alt" />&nbsp;
<awe-icon icon="dollar-sign" />
<vaquant-icon icon="currency-euro" />&nbsp;
<vaquant-icon icon="arrows-exchange" />&nbsp;
<vaquant-icon icon="currency-dollar" />
</div>
<p>
Vaquant vous permet d'enregistrer les dépenses dans la monnaie locale
@@ -53,7 +53,7 @@
</div>
<div class="column is-one-third">
<div class="main-icon">
<awe-icon icon="sync-alt" />
<vaquant-icon icon="refresh" />
</div>
<p>
Vaquant se met à jour en direct. Vous recevez automatiquement les
@@ -62,7 +62,7 @@
</div>
<div class="column is-one-third">
<div class="main-icon">
<awe-icon icon="mobile" />
<vaquant-icon icon="device-mobile" />
</div>
<p>
Vaquant est simple, sécurisée, rapide et accessible depuis un simple
@@ -71,7 +71,7 @@
</div>
<div class="column is-one-third">
<div class="main-icon">
<awe-icon icon="hand-holding-usd" />
<vaquant-icon icon="pig-money" />
</div>
<p>
Vaquant propose une offre gratuite sans publicité. Si vous souhaitez

View File

@@ -9,7 +9,7 @@
:class="{ white: color.label }"
:style="colorBackground(color)"
>
<awe-icon
<vaquant-icon
:style="colorStyle"
v-if="color.value === localColor"
icon="check"

View File

@@ -10,7 +10,7 @@
>
<span class="icon is-medium">
<slot>
<awe-icon icon="plus" />
<vaquant-icon icon="plus" />
</slot>
</span>
<span class="fulltext" v-if="$slots.fulltext">
@@ -27,7 +27,7 @@
>
<span class="icon is-medium">
<slot>
<awe-icon icon="plus" />
<vaquant-icon icon="plus" />
</slot>
</span>
<span class="fulltext" v-if="$slots.fulltext">

View File

@@ -34,10 +34,10 @@
>/mois
</div>
<div class="plan-items">
<div class="plan-item"><awe-icon icon="infinity" /> comptes</div>
<div class="plan-item"><awe-icon icon="infinity" /> amis/compte</div>
<div class="plan-item"><vaquant-icon icon="infinity" /> comptes</div>
<div class="plan-item"><vaquant-icon icon="infinity" /> amis/compte</div>
<div class="plan-item">
<awe-icon icon="infinity" /> dépenses/compte
<vaquant-icon icon="infinity" /> dépenses/compte
</div>
<div class="plan-item">pièces jointes disponibles</div>
</div>

View File

@@ -13,7 +13,7 @@
class="legend-item"
>
<td>
<awe-icon :icon="categories[slice.key || ''].tag.icon" />
<vaquant-icon :icon="categories[slice.key || ''].tag.icon" />
</td>
<td class="legend-label">{{ slice.label }}</td>
<td class="percent-label numeric">
@@ -27,7 +27,7 @@
<div class="field has-addons has-addons-centered is-narrow">
<div class="control" v-if="filterCategory">
<button type="submit" class="button" @click="filterCategory = ''">
<awe-icon icon="times" />
<vaquant-icon icon="x" />
</button>
</div>
<div class="control">
@@ -50,7 +50,7 @@
<div class="columns clear-margin category-list">
<div class="column is-2 tag-element account-color">
<div class="icon-container">
<awe-icon :icon="category.tag.icon" />
<vaquant-icon :icon="category.tag.icon" />
</div>
</div>
<div

View File

@@ -220,7 +220,7 @@
:margin="true"
:button-style="backgroundColor"
>
<awe-icon icon="check" />
<vaquant-icon icon="check" />
</fab-button>
</div>
</template>

View File

@@ -17,12 +17,12 @@
<div class="field has-addons">
<div class="control">
<a @click="plus" class="button is-primary">
<awe-icon icon="plus" />
<vaquant-icon icon="plus" />
</a>
</div>
<div class="control">
<a @click="minus" class="button is-warning">
<awe-icon icon="minus" />
<vaquant-icon icon="minus" />
</a>
</div>
</div>

View File

@@ -17,7 +17,7 @@
</select>
</span>
<span class="icon is-small is-left" v-if="transactionTagLabel[tag]">
<awe-icon :icon="transactionTagLabel[tag].icon" />
<vaquant-icon :icon="transactionTagLabel[tag].icon" />
</span>
</p>
</div>

View File

@@ -41,7 +41,7 @@
</div>
<div class="column is-1" v-if="!isMainUser">
<button class="button is-danger" @click="$emit('remove')">
<awe-icon icon="trash" />
<vaquant-icon icon="trash" />
</button>
</div>
</div>