anto/XIP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

push

Browse Source
This commit is contained in:
arussac
2026-05-31 15:35:59 +02:00
parent 48a99514b2
commit d88b71b2c6
11 changed files with 227 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
frontend/src/components/shop/MesPersos.vue
View File

@@ -42,11 +42,44 @@
</div>
</section>
<!-- ── Couleur de l'IP ────────────────────────────────────────── -->
<section class="section" :class="{ locked: !myPerks.elementSkin }">
<!-- ── Skin du bouton d'envoi ───────────────────────────────────── -->
<section class="section" :class="{ locked: !hasSendSkins }">
<h2 class="section-title">
🖱️ Skin du bouton d'envoi
<span v-if="!hasSendSkins" class="lock-badge">Achetez un skin dans le shop</span>
</h2>
<template v-if="hasSendSkins">
<div class="style-grid">
<button
class="style-tile"
:class="{ 'style-tile--active': prefs.sendSkin === '' }"
@click="prefs.sendSkin = ''"
type="button"
>
<span class="style-swatch" style="font-size:14px">►</span>
<span class="style-label">Défaut</span>
</button>
<button
v-for="s in myPerks.sendSkins"
:key="s.id"
class="style-tile"
:class="{ 'style-tile--active': prefs.sendSkin === s.id }"
@click="prefs.sendSkin = s.id"
type="button"
>
<span class="style-swatch" style="font-size:20px">{{ s.char }}</span>
<span class="style-label">{{ s.label ?? s.id.replace('send-skin-', '') }}</span>
</button>
</div>
</template>
<p v-else class="section-sub">Aucun skin possédé pour l'instant.</p>
</section>
<!-- ── Couleur de l'IP ─────────────────────────────────────── -->
<section class="section" :class="{ locked: !myPerks.ipColors }">
<h2 class="section-title">
🎨 Couleur de mon IP
<span v-if="!myPerks.elementSkin" class="lock-badge">🔒 Skin d'éléments requis</span>
<span v-if="!myPerks.ipColors" class="lock-badge">🔒 Palette IP requise</span>
</h2>
<p v-if="myIp" class="section-sub">IP&nbsp;: <code class="code-ip" :style="ipPreviewStyle">{{ myIp }}</code></p>
<div class="style-grid">
@@ -55,7 +88,7 @@
:key="opt.value"
class="style-tile"
:class="{ 'style-tile--active': currentIpColor === opt.value }"
:disabled="!myPerks.elementSkin"
:disabled="!myPerks.ipColors"
@click="setIpColor(opt.value)"
type="button"
>
@@ -144,6 +177,7 @@ const ownedPets = computed(() => {
});
});
const hasPets = computed(() => ownedPets.value.length > 0);
const hasSendSkins = computed(() => (myPerks.value.sendSkins?.length ?? 0) > 0);
const activePet = computed(() =>
myIp.value && myIp.value in prefs.ipPets ? prefs.ipPets[myIp.value] : (ownedPets.value[0]?.char ?? '')
);