feat: conformite enonce - explorer, favoris, stats perso, tests, slots
Some checks failed
Deploy XIP / deploy (push) Failing after 37s
Some checks failed
Deploy XIP / deploy (push) Failing after 37s
Fonctionnel
- Backend messages : GET /api/messages/:id (detail) + recherche (q),
pagination par curseur (before/limit) avec enveloppe { items, nextCursor,
hasMore } ; le flux temps reel garde l'ancien format quand aucun parametre.
- Explorer (/explorer) : catalogue distant, recherche debouncee + annulable
(AbortController), filtre, defilement infini, etat garde (keep-alive).
- Details par id : /message/:id et /shop/p/:id (consomment route.params).
- Favoris (/favoris) : liste perso persistee en localStorage, notation
(note/rating/statut) via modale, refletee partout (bouton favori).
- Mes stats (/mes-stats) : agregats derives des favoris (note moyenne, top
pays/auteurs, statuts), auto-mis a jour, route gardee si liste vide.
- Routeur : pages secondaires en lazy-load + repli, garde beforeEnter.
Technique
- Slots : PrefSection (slot defaut + slot nomme) enveloppe les 5 sections
"Mes Persos" ; Modal (Teleport + slots).
- v-model custom : SearchBox (defineModel + debounce).
- Directive custom : v-click-outside.
- Tests Vitest : 25 tests (etat, fonctions, composants), ~86% du code metier.
- Retrait d'Ionic (inutilise). Script typecheck backend ; tsconfig @types/bun.
- Correctif type : garde stockLimit nullable dans l'achat (catalog.ts).
- README complet (URL, stack, run, tests, secrets, deploiement, mention IA).
This commit is contained in:
@@ -1,197 +1,197 @@
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<style>
|
||||
.sans { font-family: Arial, Helvetica, sans-serif; }
|
||||
.mono { font-family: 'Courier New', Courier, monospace; }
|
||||
</style>
|
||||
<filter id="glow-pub"><feGaussianBlur stdDeviation="4"/></filter>
|
||||
<filter id="glow-red"><feGaussianBlur stdDeviation="3"/></filter>
|
||||
</defs>
|
||||
|
||||
<!-- FOND -->
|
||||
<rect width="1280" height="720" fill="#090910"/>
|
||||
|
||||
<!-- ════════════════════ HEADER ════════════════════ -->
|
||||
<rect x="0" y="0" width="1280" height="58" fill="#0e0e18" stroke="#1a1a28" stroke-width="1"/>
|
||||
<text x="20" y="28" fill="#0077aa" class="sans" font-size="20" font-weight="bold" filter="url(#glow-pub)" opacity="0.4">XIP</text>
|
||||
<text x="20" y="28" fill="#00aaee" class="sans" font-size="20" font-weight="bold">XIP</text>
|
||||
<line x1="52" y1="10" x2="52" y2="48" stroke="#1e1e2a" stroke-width="1"/>
|
||||
<text x="64" y="24" fill="#c0c0d8" class="sans" font-size="16" font-weight="bold">Shop</text>
|
||||
<text x="64" y="43" fill="#383858" class="sans" font-size="10">Personnalisation · Acces · Publicite</text>
|
||||
<!-- Breadcrumb -->
|
||||
<text x="280" y="30" fill="#2a2a44" class="sans" font-size="11">Catalogue</text>
|
||||
<text x="340" y="30" fill="#1a1a33" class="sans" font-size="11">/</text>
|
||||
<text x="354" y="30" fill="#5566aa" class="sans" font-size="11" font-weight="bold">Cadre de Pub</text>
|
||||
<text x="1148" y="22" fill="#383858" class="sans" font-size="10" text-anchor="end">Connecte :</text>
|
||||
<text x="1148" y="40" fill="#5555aa" class="mono" font-size="11" text-anchor="end">192.168.1.45</text>
|
||||
<text x="1260" y="22" fill="#3a5a2a" class="sans" font-size="10" text-anchor="end">Solde :</text>
|
||||
<text x="1260" y="40" fill="#44aa44" class="sans" font-size="11" text-anchor="end" font-weight="bold">24.50 €</text>
|
||||
<line x1="0" y1="58" x2="1280" y2="58" stroke="#1a1a28" stroke-width="1"/>
|
||||
|
||||
<!-- ════════════════════ LEFT NAV ════════════════════ -->
|
||||
<rect x="0" y="58" width="185" height="662" fill="#0c0c12" stroke="#181822" stroke-width="1"/>
|
||||
<line x1="184" y1="58" x2="184" y2="720" stroke="#161620" stroke-width="2"/>
|
||||
<text x="16" y="84" fill="#2a2a44" class="sans" font-size="9" letter-spacing="2">CATEGORIES</text>
|
||||
<text x="20" y="116" fill="#4a4a6a" class="sans" font-size="13">Tout voir</text>
|
||||
<!-- Active: Publicité -->
|
||||
<rect x="3" y="126" width="179" height="36" fill="#181828" stroke="#242438" rx="3"/>
|
||||
<rect x="3" y="126" width="3" height="36" fill="#cc4400" rx="2"/>
|
||||
<text x="20" y="149" fill="#cc8844" class="sans" font-size="13" font-weight="bold">Publicite</text>
|
||||
<text x="20" y="185" fill="#4a4a6a" class="sans" font-size="13">Abonnements</text>
|
||||
<text x="20" y="220" fill="#4a4a6a" class="sans" font-size="13">Cosmetiques</text>
|
||||
<text x="20" y="255" fill="#cc3322" class="sans" font-size="13">Promotions</text>
|
||||
<line x1="10" y1="268" x2="175" y2="268" stroke="#181822" stroke-width="1"/>
|
||||
<text x="16" y="290" fill="#2a2a44" class="sans" font-size="9" letter-spacing="2">MON COMPTE</text>
|
||||
<text x="20" y="314" fill="#4a4a6a" class="sans" font-size="13">Mes achats</text>
|
||||
<text x="20" y="346" fill="#4a4a6a" class="sans" font-size="13">Paiement</text>
|
||||
<!-- Statut pub actuelle -->
|
||||
<rect x="8" y="560" width="169" height="80" fill="#111116" stroke="#1e1e26" rx="4"/>
|
||||
<text x="93" y="578" fill="#2a2a44" text-anchor="middle" class="sans" font-size="9">MES PUBS ACTIVES</text>
|
||||
<line x1="16" y1="584" x2="170" y2="584" stroke="#1a1a22" stroke-width="1"/>
|
||||
<text x="93" y="603" fill="#666688" text-anchor="middle" class="sans" font-size="11">0 / 1 slot</text>
|
||||
<text x="93" y="620" fill="#2a4a2a" text-anchor="middle" class="sans" font-size="10">Slot disponible</text>
|
||||
<rect x="28" y="628" width="130" height="6" fill="#111116" stroke="#1e1e22" rx="3"/>
|
||||
<rect x="28" y="628" width="0" height="6" fill="#33aa44" rx="3"/>
|
||||
|
||||
<!-- ════════════════════ CONTENU ════════════════════ -->
|
||||
|
||||
<!-- ── PROMO FLASH TOP ── -->
|
||||
<rect x="193" y="66" width="1079" height="46" fill="#1e0800" stroke="#cc3300" stroke-width="1" rx="4"/>
|
||||
<text x="270" y="84" fill="#ff5500" class="sans" font-size="12" font-weight="bold">FLASH PROMO -33%</text>
|
||||
<text x="270" y="102" fill="#884422" class="sans" font-size="10">Prix normal : 15.00 € → Prix promo : 9.99 €</text>
|
||||
<text x="880" y="88" fill="#ff8800" class="sans" font-size="11" font-weight="bold">Expire dans :</text>
|
||||
<text x="990" y="88" fill="#ffaa00" class="mono" font-size="14" font-weight="bold">02:47:33</text>
|
||||
|
||||
<!-- ── TITRE PRODUIT ── -->
|
||||
<text x="200" y="142" fill="#7788aa" class="sans" font-size="10">Publicite /</text>
|
||||
<text x="248" y="142" fill="#aabbdd" class="sans" font-size="12" font-weight="bold">Cadre de Pub</text>
|
||||
<rect x="340" y="130" width="100" height="18" fill="#bb2200" rx="9"/>
|
||||
<text x="390" y="143" fill="#ffffff" text-anchor="middle" class="sans" font-size="9" font-weight="bold">-33% PROMO</text>
|
||||
|
||||
<!-- ════════════════════ CORPS : PREVIEW gauche + DETAIL droit ════════════════════ -->
|
||||
|
||||
<!-- ── PREVIEW PRODUIT (x=193, y=154, w=480, h=490) ── -->
|
||||
<rect x="193" y="154" width="480" height="490" fill="#0e0e14" stroke="#1c1c28" rx="6"/>
|
||||
<!-- Titre zone preview -->
|
||||
<rect x="193" y="154" width="480" height="36" fill="#131320" rx="6"/>
|
||||
<text x="433" y="177" fill="#555577" text-anchor="middle" class="sans" font-size="11">Apercu dans le chat XIP</text>
|
||||
|
||||
<!-- Mini interface XIP (1:2 scale de 1280x720) -->
|
||||
<!-- Canvas simulé: 460×340 centré -->
|
||||
<rect x="203" y="198" width="460" height="340" fill="#090910" stroke="#141420" rx="4"/>
|
||||
|
||||
<!-- Header mini XIP -->
|
||||
<rect x="203" y="198" width="460" height="26" fill="#0e0e18" stroke="#1a1a28" stroke-width="0.5"/>
|
||||
<text x="218" y="215" fill="#009acc" class="sans" font-size="9" font-weight="bold">XIP Chat</text>
|
||||
<text x="300" y="215" fill="#3a3a5a" class="sans" font-size="8">312 connectes</text>
|
||||
|
||||
<!-- Bande pub gauche — highlightée en or -->
|
||||
<rect x="203" y="224" width="54" height="302" fill="#0c0c08" stroke="#ffcc00" stroke-width="2" rx="2"/>
|
||||
<rect x="204" y="225" width="52" height="300" fill="none" stroke="#ffaa00" stroke-width="0.5" rx="1" opacity="0.6"/>
|
||||
<!-- Contenu pub dans la bande -->
|
||||
<rect x="207" y="230" width="46" height="70" fill="#1a1600" stroke="#aa8800" rx="1"/>
|
||||
<text x="230" y="254" fill="#cc8800" text-anchor="middle" class="sans" font-size="7" font-weight="bold">VOTRE</text>
|
||||
<text x="230" y="264" fill="#cc8800" text-anchor="middle" class="sans" font-size="7" font-weight="bold">PUB</text>
|
||||
<text x="230" y="278" fill="#886600" text-anchor="middle" class="sans" font-size="6">130x180px</text>
|
||||
<rect x="207" y="308" width="46" height="70" fill="#181818" stroke="#333" rx="1"/>
|
||||
<text x="230" y="345" fill="#2a2a2a" text-anchor="middle" class="sans" font-size="8">ad 2</text>
|
||||
<rect x="207" y="386" width="46" height="70" fill="#181818" stroke="#333" rx="1"/>
|
||||
<text x="230" y="423" fill="#2a2a2a" text-anchor="middle" class="sans" font-size="8">ad 3</text>
|
||||
<!-- Chat messages -->
|
||||
<text x="270" y="240" fill="#505070" class="mono" font-size="7" font-weight="bold">192.168.1.45</text>
|
||||
<text x="270" y="252" fill="#909090" class="sans" font-size="7">Salut tout le monde !</text>
|
||||
<text x="270" y="270" fill="#505070" class="mono" font-size="7" font-weight="bold">10.0.0.187</text>
|
||||
<text x="270" y="282" fill="#909090" class="sans" font-size="7">Y a quoi de neuf ce soir ?</text>
|
||||
<text x="270" y="300" fill="#505070" class="mono" font-size="7" font-weight="bold">172.16.254.1</text>
|
||||
<text x="270" y="312" fill="#909090" class="sans" font-size="7">Le drop de demain va etre chaud</text>
|
||||
<text x="270" y="330" fill="#505070" class="mono" font-size="7" font-weight="bold">203.0.113.42</text>
|
||||
<text x="270" y="342" fill="#909090" class="sans" font-size="7">lol toujours pareil</text>
|
||||
<!-- Input mini -->
|
||||
<rect x="258" y="488" width="398" height="22" fill="#131320" stroke="#1e1e2a" rx="11"/>
|
||||
<text x="268" y="503" fill="#2a2a44" class="sans" font-size="7">Entrez un message...</text>
|
||||
|
||||
<!-- Legende heatmap de la pub -->
|
||||
<rect x="203" y="548" width="460" height="88" fill="#0c0c10" stroke="#181820" rx="4"/>
|
||||
<text x="215" y="566" fill="#555577" class="sans" font-size="10" font-weight="bold">Zone surlignee = votre espace publicitaire</text>
|
||||
<line x1="215" y1="572" x2="643" y2="572" stroke="#1a1a28" stroke-width="0.5"/>
|
||||
<!-- Stats pub -->
|
||||
<text x="225" y="592" fill="#446644" class="sans" font-size="11" font-weight="bold">1 000</text>
|
||||
<text x="278" y="592" fill="#404055" class="sans" font-size="10">impressions garanties</text>
|
||||
<text x="225" y="612" fill="#446644" class="sans" font-size="11" font-weight="bold">7</text>
|
||||
<text x="240" y="612" fill="#404055" class="sans" font-size="10">jours de diffusion continue</text>
|
||||
<text x="450" y="592" fill="#446644" class="sans" font-size="11" font-weight="bold">24/7</text>
|
||||
<text x="480" y="592" fill="#404055" class="sans" font-size="10">disponibilite</text>
|
||||
<text x="450" y="612" fill="#446644" class="sans" font-size="11" font-weight="bold">130px</text>
|
||||
<text x="498" y="612" fill="#404055" class="sans" font-size="10">largeur x 180px hauteur</text>
|
||||
<text x="215" y="632" fill="#883322" class="sans" font-size="9">Votre image ou animation sera visible par tous les utilisateurs connectes au chat public.</text>
|
||||
|
||||
<!-- ── DETAIL PRODUIT droite (x=685, y=154, w=580, h=490) ── -->
|
||||
<rect x="685" y="154" width="580" height="490" fill="#0e0e14" stroke="#1c1c28" rx="6"/>
|
||||
|
||||
<!-- Titre + note -->
|
||||
<text x="705" y="192" fill="#c8c8e0" class="sans" font-size="20" font-weight="bold">Cadre de Pub</text>
|
||||
<text x="912" y="192" fill="#cc8800" class="sans" font-size="11">★★★★☆</text>
|
||||
<text x="962" y="192" fill="#444455" class="sans" font-size="10">(142 avis)</text>
|
||||
|
||||
<!-- Prix - barré / promo / normal -->
|
||||
<rect x="705" y="202" width="550" height="72" fill="#111118" stroke="#1e1e26" rx="4"/>
|
||||
<text x="720" y="224" fill="#444455" class="sans" font-size="14" text-decoration="line-through">22.50 €</text>
|
||||
<text x="777" y="224" fill="#ee3333" class="sans" font-size="12" font-weight="bold">-33%</text>
|
||||
<text x="720" y="256" fill="#ffdd00" class="sans" font-size="28" font-weight="bold" filter="url(#glow-pub)" opacity="0.4">9.99 €</text>
|
||||
<text x="720" y="256" fill="#ffdd00" class="sans" font-size="28" font-weight="bold">9.99 €</text>
|
||||
<text x="850" y="240" fill="#444455" class="sans" font-size="11">Prix normal : 15.00 €</text>
|
||||
<text x="850" y="258" fill="#883322" class="sans" font-size="10">Promo flash → expire dans 02:47</text>
|
||||
|
||||
<!-- Options / configurateur -->
|
||||
<text x="705" y="300" fill="#7788aa" class="sans" font-size="12" font-weight="bold">Configuration</text>
|
||||
<line x1="705" y1="308" x2="1255" y2="308" stroke="#1a1a28" stroke-width="1"/>
|
||||
<!-- Duree -->
|
||||
<text x="705" y="330" fill="#555577" class="sans" font-size="10">Duree de diffusion</text>
|
||||
<rect x="705" y="336" width="122" height="30" fill="#181828" stroke="#2244aa" rx="4"/>
|
||||
<text x="766" y="356" fill="#aabbdd" text-anchor="middle" class="sans" font-size="11" font-weight="bold">7 jours</text>
|
||||
<rect x="835" y="336" width="122" height="30" fill="#111118" stroke="#222230" rx="4"/>
|
||||
<text x="896" y="356" fill="#4a4a6a" text-anchor="middle" class="sans" font-size="11">14 jours (+8€)</text>
|
||||
<rect x="965" y="336" width="122" height="30" fill="#111118" stroke="#222230" rx="4"/>
|
||||
<text x="1026" y="356" fill="#4a4a6a" text-anchor="middle" class="sans" font-size="11">30 jours (+20€)</text>
|
||||
<!-- Format -->
|
||||
<text x="705" y="390" fill="#555577" class="sans" font-size="10">Format</text>
|
||||
<rect x="705" y="396" width="170" height="30" fill="#181828" stroke="#2244aa" rx="4"/>
|
||||
<text x="790" y="416" fill="#aabbdd" text-anchor="middle" class="sans" font-size="11" font-weight="bold">Image statique</text>
|
||||
<rect x="883" y="396" width="170" height="30" fill="#111118" stroke="#222230" rx="4"/>
|
||||
<text x="968" y="416" fill="#4a4a6a" text-anchor="middle" class="sans" font-size="11">GIF anime (+3€)</text>
|
||||
<!-- URL de la pub -->
|
||||
<text x="705" y="450" fill="#555577" class="sans" font-size="10">URL de destination (optionnel)</text>
|
||||
<rect x="705" y="456" width="540" height="30" fill="#131320" stroke="#222232" rx="4"/>
|
||||
<text x="720" y="476" fill="#2a2a44" class="sans" font-size="11">https://</text>
|
||||
|
||||
<!-- LIMITES D'ACHAT -->
|
||||
<rect x="705" y="502" width="540" height="104" fill="#110a00" stroke="#442200" rx="4"/>
|
||||
<text x="720" y="522" fill="#cc6633" class="sans" font-size="11" font-weight="bold">Limites d'achat</text>
|
||||
<line x1="715" y1="528" x2="1235" y2="528" stroke="#331800" stroke-width="1"/>
|
||||
<text x="720" y="546" fill="#884422" class="sans" font-size="10">/ 1 seul cadre de pub actif par compte a la fois</text>
|
||||
<text x="720" y="562" fill="#884422" class="sans" font-size="10">/ Maximum 3 achats par mois (quota mensuel)</text>
|
||||
<text x="720" y="578" fill="#884422" class="sans" font-size="10">/ L'image doit respecter les CGU (pas de contenu adulte)</text>
|
||||
<text x="720" y="594" fill="#884422" class="sans" font-size="10">/ La pub expire automatiquement apres la duree choisie</text>
|
||||
|
||||
<!-- Bouton acheter principal -->
|
||||
<rect x="705" y="618" width="338" height="46" fill="#cc3300" rx="23"/>
|
||||
<rect x="706" y="619" width="336" height="44" fill="none" stroke="#ff6600" stroke-width="0.5" rx="22"/>
|
||||
<text x="874" y="646" fill="#ffffff" text-anchor="middle" class="sans" font-size="14" font-weight="bold">Acheter — 9.99 €</text>
|
||||
|
||||
<!-- Bouton pack -->
|
||||
<rect x="1051" y="618" width="224" height="46" fill="#111128" stroke="#2a2a5a" rx="23"/>
|
||||
<text x="1163" y="641" fill="#7788bb" text-anchor="middle" class="sans" font-size="11">Voir aussi le Pack</text>
|
||||
<text x="1163" y="657" fill="#7788bb" text-anchor="middle" class="sans" font-size="10">Pub + Abonnement</text>
|
||||
|
||||
<!-- ── AVIS CLIENTS (bas) ── -->
|
||||
<rect x="193" y="656" width="1072" height="52" fill="#0c0c12" stroke="#181822" rx="4"/>
|
||||
<text x="210" y="674" fill="#555577" class="sans" font-size="10" font-weight="bold">Avis des acheteurs</text>
|
||||
<line x1="210" y1="680" x2="1255" y2="680" stroke="#1a1a22" stroke-width="0.5"/>
|
||||
<text x="210" y="697" fill="#334433" class="sans" font-size="9">★★★★★ 192.168.x.x — "Bien visible, bonne visibilite dans le chat, je recommande !"</text>
|
||||
<text x="680" y="697" fill="#334433" class="sans" font-size="9">★★★★☆ 10.x.x.x — "Prix correct, effet garanti sur mes clics."</text>
|
||||
|
||||
<!-- FOOTER -->
|
||||
<rect x="0" y="696" width="1280" height="24" fill="#080810" stroke="#141420" stroke-width="1"/>
|
||||
<text x="640" y="712" fill="#222233" text-anchor="middle" class="sans" font-size="9">XIP Shop · Voir les CGV · Support : shop@xip.local</text>
|
||||
</svg>
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720">
|
||||
<defs>
|
||||
<style>
|
||||
.sans { font-family: Arial, Helvetica, sans-serif; }
|
||||
.mono { font-family: 'Courier New', Courier, monospace; }
|
||||
</style>
|
||||
<filter id="glow-pub"><feGaussianBlur stdDeviation="4"/></filter>
|
||||
<filter id="glow-red"><feGaussianBlur stdDeviation="3"/></filter>
|
||||
</defs>
|
||||
|
||||
<!-- FOND -->
|
||||
<rect width="1280" height="720" fill="#090910"/>
|
||||
|
||||
<!-- ════════════════════ HEADER ════════════════════ -->
|
||||
<rect x="0" y="0" width="1280" height="58" fill="#0e0e18" stroke="#1a1a28" stroke-width="1"/>
|
||||
<text x="20" y="28" fill="#0077aa" class="sans" font-size="20" font-weight="bold" filter="url(#glow-pub)" opacity="0.4">XIP</text>
|
||||
<text x="20" y="28" fill="#00aaee" class="sans" font-size="20" font-weight="bold">XIP</text>
|
||||
<line x1="52" y1="10" x2="52" y2="48" stroke="#1e1e2a" stroke-width="1"/>
|
||||
<text x="64" y="24" fill="#c0c0d8" class="sans" font-size="16" font-weight="bold">Shop</text>
|
||||
<text x="64" y="43" fill="#383858" class="sans" font-size="10">Personnalisation · Acces · Publicite</text>
|
||||
<!-- Breadcrumb -->
|
||||
<text x="280" y="30" fill="#2a2a44" class="sans" font-size="11">Catalogue</text>
|
||||
<text x="340" y="30" fill="#1a1a33" class="sans" font-size="11">/</text>
|
||||
<text x="354" y="30" fill="#5566aa" class="sans" font-size="11" font-weight="bold">Cadre de Pub</text>
|
||||
<text x="1148" y="22" fill="#383858" class="sans" font-size="10" text-anchor="end">Connecte :</text>
|
||||
<text x="1148" y="40" fill="#5555aa" class="mono" font-size="11" text-anchor="end">192.168.1.45</text>
|
||||
<text x="1260" y="22" fill="#3a5a2a" class="sans" font-size="10" text-anchor="end">Solde :</text>
|
||||
<text x="1260" y="40" fill="#44aa44" class="sans" font-size="11" text-anchor="end" font-weight="bold">24.50 €</text>
|
||||
<line x1="0" y1="58" x2="1280" y2="58" stroke="#1a1a28" stroke-width="1"/>
|
||||
|
||||
<!-- ════════════════════ LEFT NAV ════════════════════ -->
|
||||
<rect x="0" y="58" width="185" height="662" fill="#0c0c12" stroke="#181822" stroke-width="1"/>
|
||||
<line x1="184" y1="58" x2="184" y2="720" stroke="#161620" stroke-width="2"/>
|
||||
<text x="16" y="84" fill="#2a2a44" class="sans" font-size="9" letter-spacing="2">CATEGORIES</text>
|
||||
<text x="20" y="116" fill="#4a4a6a" class="sans" font-size="13">Tout voir</text>
|
||||
<!-- Active: Publicité -->
|
||||
<rect x="3" y="126" width="179" height="36" fill="#181828" stroke="#242438" rx="3"/>
|
||||
<rect x="3" y="126" width="3" height="36" fill="#cc4400" rx="2"/>
|
||||
<text x="20" y="149" fill="#cc8844" class="sans" font-size="13" font-weight="bold">Publicite</text>
|
||||
<text x="20" y="185" fill="#4a4a6a" class="sans" font-size="13">Abonnements</text>
|
||||
<text x="20" y="220" fill="#4a4a6a" class="sans" font-size="13">Cosmetiques</text>
|
||||
<text x="20" y="255" fill="#cc3322" class="sans" font-size="13">Promotions</text>
|
||||
<line x1="10" y1="268" x2="175" y2="268" stroke="#181822" stroke-width="1"/>
|
||||
<text x="16" y="290" fill="#2a2a44" class="sans" font-size="9" letter-spacing="2">MON COMPTE</text>
|
||||
<text x="20" y="314" fill="#4a4a6a" class="sans" font-size="13">Mes achats</text>
|
||||
<text x="20" y="346" fill="#4a4a6a" class="sans" font-size="13">Paiement</text>
|
||||
<!-- Statut pub actuelle -->
|
||||
<rect x="8" y="560" width="169" height="80" fill="#111116" stroke="#1e1e26" rx="4"/>
|
||||
<text x="93" y="578" fill="#2a2a44" text-anchor="middle" class="sans" font-size="9">MES PUBS ACTIVES</text>
|
||||
<line x1="16" y1="584" x2="170" y2="584" stroke="#1a1a22" stroke-width="1"/>
|
||||
<text x="93" y="603" fill="#666688" text-anchor="middle" class="sans" font-size="11">0 / 1 slot</text>
|
||||
<text x="93" y="620" fill="#2a4a2a" text-anchor="middle" class="sans" font-size="10">Slot disponible</text>
|
||||
<rect x="28" y="628" width="130" height="6" fill="#111116" stroke="#1e1e22" rx="3"/>
|
||||
<rect x="28" y="628" width="0" height="6" fill="#33aa44" rx="3"/>
|
||||
|
||||
<!-- ════════════════════ CONTENU ════════════════════ -->
|
||||
|
||||
<!-- ── PROMO FLASH TOP ── -->
|
||||
<rect x="193" y="66" width="1079" height="46" fill="#1e0800" stroke="#cc3300" stroke-width="1" rx="4"/>
|
||||
<text x="270" y="84" fill="#ff5500" class="sans" font-size="12" font-weight="bold">FLASH PROMO -33%</text>
|
||||
<text x="270" y="102" fill="#884422" class="sans" font-size="10">Prix normal : 15.00 € → Prix promo : 9.99 €</text>
|
||||
<text x="880" y="88" fill="#ff8800" class="sans" font-size="11" font-weight="bold">Expire dans :</text>
|
||||
<text x="990" y="88" fill="#ffaa00" class="mono" font-size="14" font-weight="bold">02:47:33</text>
|
||||
|
||||
<!-- ── TITRE PRODUIT ── -->
|
||||
<text x="200" y="142" fill="#7788aa" class="sans" font-size="10">Publicite /</text>
|
||||
<text x="248" y="142" fill="#aabbdd" class="sans" font-size="12" font-weight="bold">Cadre de Pub</text>
|
||||
<rect x="340" y="130" width="100" height="18" fill="#bb2200" rx="9"/>
|
||||
<text x="390" y="143" fill="#ffffff" text-anchor="middle" class="sans" font-size="9" font-weight="bold">-33% PROMO</text>
|
||||
|
||||
<!-- ════════════════════ CORPS : PREVIEW gauche + DETAIL droit ════════════════════ -->
|
||||
|
||||
<!-- ── PREVIEW PRODUIT (x=193, y=154, w=480, h=490) ── -->
|
||||
<rect x="193" y="154" width="480" height="490" fill="#0e0e14" stroke="#1c1c28" rx="6"/>
|
||||
<!-- Titre zone preview -->
|
||||
<rect x="193" y="154" width="480" height="36" fill="#131320" rx="6"/>
|
||||
<text x="433" y="177" fill="#555577" text-anchor="middle" class="sans" font-size="11">Apercu dans le chat XIP</text>
|
||||
|
||||
<!-- Mini interface XIP (1:2 scale de 1280x720) -->
|
||||
<!-- Canvas simulé: 460×340 centré -->
|
||||
<rect x="203" y="198" width="460" height="340" fill="#090910" stroke="#141420" rx="4"/>
|
||||
|
||||
<!-- Header mini XIP -->
|
||||
<rect x="203" y="198" width="460" height="26" fill="#0e0e18" stroke="#1a1a28" stroke-width="0.5"/>
|
||||
<text x="218" y="215" fill="#009acc" class="sans" font-size="9" font-weight="bold">XIP Chat</text>
|
||||
<text x="300" y="215" fill="#3a3a5a" class="sans" font-size="8">312 connectes</text>
|
||||
|
||||
<!-- Bande pub gauche — highlightée en or -->
|
||||
<rect x="203" y="224" width="54" height="302" fill="#0c0c08" stroke="#ffcc00" stroke-width="2" rx="2"/>
|
||||
<rect x="204" y="225" width="52" height="300" fill="none" stroke="#ffaa00" stroke-width="0.5" rx="1" opacity="0.6"/>
|
||||
<!-- Contenu pub dans la bande -->
|
||||
<rect x="207" y="230" width="46" height="70" fill="#1a1600" stroke="#aa8800" rx="1"/>
|
||||
<text x="230" y="254" fill="#cc8800" text-anchor="middle" class="sans" font-size="7" font-weight="bold">VOTRE</text>
|
||||
<text x="230" y="264" fill="#cc8800" text-anchor="middle" class="sans" font-size="7" font-weight="bold">PUB</text>
|
||||
<text x="230" y="278" fill="#886600" text-anchor="middle" class="sans" font-size="6">130x180px</text>
|
||||
<rect x="207" y="308" width="46" height="70" fill="#181818" stroke="#333" rx="1"/>
|
||||
<text x="230" y="345" fill="#2a2a2a" text-anchor="middle" class="sans" font-size="8">ad 2</text>
|
||||
<rect x="207" y="386" width="46" height="70" fill="#181818" stroke="#333" rx="1"/>
|
||||
<text x="230" y="423" fill="#2a2a2a" text-anchor="middle" class="sans" font-size="8">ad 3</text>
|
||||
<!-- Chat messages -->
|
||||
<text x="270" y="240" fill="#505070" class="mono" font-size="7" font-weight="bold">192.168.1.45</text>
|
||||
<text x="270" y="252" fill="#909090" class="sans" font-size="7">Salut tout le monde !</text>
|
||||
<text x="270" y="270" fill="#505070" class="mono" font-size="7" font-weight="bold">10.0.0.187</text>
|
||||
<text x="270" y="282" fill="#909090" class="sans" font-size="7">Y a quoi de neuf ce soir ?</text>
|
||||
<text x="270" y="300" fill="#505070" class="mono" font-size="7" font-weight="bold">172.16.254.1</text>
|
||||
<text x="270" y="312" fill="#909090" class="sans" font-size="7">Le drop de demain va etre chaud</text>
|
||||
<text x="270" y="330" fill="#505070" class="mono" font-size="7" font-weight="bold">203.0.113.42</text>
|
||||
<text x="270" y="342" fill="#909090" class="sans" font-size="7">lol toujours pareil</text>
|
||||
<!-- Input mini -->
|
||||
<rect x="258" y="488" width="398" height="22" fill="#131320" stroke="#1e1e2a" rx="11"/>
|
||||
<text x="268" y="503" fill="#2a2a44" class="sans" font-size="7">Entrez un message...</text>
|
||||
|
||||
<!-- Legende heatmap de la pub -->
|
||||
<rect x="203" y="548" width="460" height="88" fill="#0c0c10" stroke="#181820" rx="4"/>
|
||||
<text x="215" y="566" fill="#555577" class="sans" font-size="10" font-weight="bold">Zone surlignee = votre espace publicitaire</text>
|
||||
<line x1="215" y1="572" x2="643" y2="572" stroke="#1a1a28" stroke-width="0.5"/>
|
||||
<!-- Stats pub -->
|
||||
<text x="225" y="592" fill="#446644" class="sans" font-size="11" font-weight="bold">1 000</text>
|
||||
<text x="278" y="592" fill="#404055" class="sans" font-size="10">impressions garanties</text>
|
||||
<text x="225" y="612" fill="#446644" class="sans" font-size="11" font-weight="bold">7</text>
|
||||
<text x="240" y="612" fill="#404055" class="sans" font-size="10">jours de diffusion continue</text>
|
||||
<text x="450" y="592" fill="#446644" class="sans" font-size="11" font-weight="bold">24/7</text>
|
||||
<text x="480" y="592" fill="#404055" class="sans" font-size="10">disponibilite</text>
|
||||
<text x="450" y="612" fill="#446644" class="sans" font-size="11" font-weight="bold">130px</text>
|
||||
<text x="498" y="612" fill="#404055" class="sans" font-size="10">largeur x 180px hauteur</text>
|
||||
<text x="215" y="632" fill="#883322" class="sans" font-size="9">Votre image ou animation sera visible par tous les utilisateurs connectes au chat public.</text>
|
||||
|
||||
<!-- ── DETAIL PRODUIT droite (x=685, y=154, w=580, h=490) ── -->
|
||||
<rect x="685" y="154" width="580" height="490" fill="#0e0e14" stroke="#1c1c28" rx="6"/>
|
||||
|
||||
<!-- Titre + note -->
|
||||
<text x="705" y="192" fill="#c8c8e0" class="sans" font-size="20" font-weight="bold">Cadre de Pub</text>
|
||||
<text x="912" y="192" fill="#cc8800" class="sans" font-size="11">★★★★☆</text>
|
||||
<text x="962" y="192" fill="#444455" class="sans" font-size="10">(142 avis)</text>
|
||||
|
||||
<!-- Prix - barré / promo / normal -->
|
||||
<rect x="705" y="202" width="550" height="72" fill="#111118" stroke="#1e1e26" rx="4"/>
|
||||
<text x="720" y="224" fill="#444455" class="sans" font-size="14" text-decoration="line-through">22.50 €</text>
|
||||
<text x="777" y="224" fill="#ee3333" class="sans" font-size="12" font-weight="bold">-33%</text>
|
||||
<text x="720" y="256" fill="#ffdd00" class="sans" font-size="28" font-weight="bold" filter="url(#glow-pub)" opacity="0.4">9.99 €</text>
|
||||
<text x="720" y="256" fill="#ffdd00" class="sans" font-size="28" font-weight="bold">9.99 €</text>
|
||||
<text x="850" y="240" fill="#444455" class="sans" font-size="11">Prix normal : 15.00 €</text>
|
||||
<text x="850" y="258" fill="#883322" class="sans" font-size="10">Promo flash → expire dans 02:47</text>
|
||||
|
||||
<!-- Options / configurateur -->
|
||||
<text x="705" y="300" fill="#7788aa" class="sans" font-size="12" font-weight="bold">Configuration</text>
|
||||
<line x1="705" y1="308" x2="1255" y2="308" stroke="#1a1a28" stroke-width="1"/>
|
||||
<!-- Duree -->
|
||||
<text x="705" y="330" fill="#555577" class="sans" font-size="10">Duree de diffusion</text>
|
||||
<rect x="705" y="336" width="122" height="30" fill="#181828" stroke="#2244aa" rx="4"/>
|
||||
<text x="766" y="356" fill="#aabbdd" text-anchor="middle" class="sans" font-size="11" font-weight="bold">7 jours</text>
|
||||
<rect x="835" y="336" width="122" height="30" fill="#111118" stroke="#222230" rx="4"/>
|
||||
<text x="896" y="356" fill="#4a4a6a" text-anchor="middle" class="sans" font-size="11">14 jours (+8€)</text>
|
||||
<rect x="965" y="336" width="122" height="30" fill="#111118" stroke="#222230" rx="4"/>
|
||||
<text x="1026" y="356" fill="#4a4a6a" text-anchor="middle" class="sans" font-size="11">30 jours (+20€)</text>
|
||||
<!-- Format -->
|
||||
<text x="705" y="390" fill="#555577" class="sans" font-size="10">Format</text>
|
||||
<rect x="705" y="396" width="170" height="30" fill="#181828" stroke="#2244aa" rx="4"/>
|
||||
<text x="790" y="416" fill="#aabbdd" text-anchor="middle" class="sans" font-size="11" font-weight="bold">Image statique</text>
|
||||
<rect x="883" y="396" width="170" height="30" fill="#111118" stroke="#222230" rx="4"/>
|
||||
<text x="968" y="416" fill="#4a4a6a" text-anchor="middle" class="sans" font-size="11">GIF anime (+3€)</text>
|
||||
<!-- URL de la pub -->
|
||||
<text x="705" y="450" fill="#555577" class="sans" font-size="10">URL de destination (optionnel)</text>
|
||||
<rect x="705" y="456" width="540" height="30" fill="#131320" stroke="#222232" rx="4"/>
|
||||
<text x="720" y="476" fill="#2a2a44" class="sans" font-size="11">https://</text>
|
||||
|
||||
<!-- LIMITES D'ACHAT -->
|
||||
<rect x="705" y="502" width="540" height="104" fill="#110a00" stroke="#442200" rx="4"/>
|
||||
<text x="720" y="522" fill="#cc6633" class="sans" font-size="11" font-weight="bold">Limites d'achat</text>
|
||||
<line x1="715" y1="528" x2="1235" y2="528" stroke="#331800" stroke-width="1"/>
|
||||
<text x="720" y="546" fill="#884422" class="sans" font-size="10">/ 1 seul cadre de pub actif par compte a la fois</text>
|
||||
<text x="720" y="562" fill="#884422" class="sans" font-size="10">/ Maximum 3 achats par mois (quota mensuel)</text>
|
||||
<text x="720" y="578" fill="#884422" class="sans" font-size="10">/ L'image doit respecter les CGU (pas de contenu adulte)</text>
|
||||
<text x="720" y="594" fill="#884422" class="sans" font-size="10">/ La pub expire automatiquement apres la duree choisie</text>
|
||||
|
||||
<!-- Bouton acheter principal -->
|
||||
<rect x="705" y="618" width="338" height="46" fill="#cc3300" rx="23"/>
|
||||
<rect x="706" y="619" width="336" height="44" fill="none" stroke="#ff6600" stroke-width="0.5" rx="22"/>
|
||||
<text x="874" y="646" fill="#ffffff" text-anchor="middle" class="sans" font-size="14" font-weight="bold">Acheter — 9.99 €</text>
|
||||
|
||||
<!-- Bouton pack -->
|
||||
<rect x="1051" y="618" width="224" height="46" fill="#111128" stroke="#2a2a5a" rx="23"/>
|
||||
<text x="1163" y="641" fill="#7788bb" text-anchor="middle" class="sans" font-size="11">Voir aussi le Pack</text>
|
||||
<text x="1163" y="657" fill="#7788bb" text-anchor="middle" class="sans" font-size="10">Pub + Abonnement</text>
|
||||
|
||||
<!-- ── AVIS CLIENTS (bas) ── -->
|
||||
<rect x="193" y="656" width="1072" height="52" fill="#0c0c12" stroke="#181822" rx="4"/>
|
||||
<text x="210" y="674" fill="#555577" class="sans" font-size="10" font-weight="bold">Avis des acheteurs</text>
|
||||
<line x1="210" y1="680" x2="1255" y2="680" stroke="#1a1a22" stroke-width="0.5"/>
|
||||
<text x="210" y="697" fill="#334433" class="sans" font-size="9">★★★★★ 192.168.x.x — "Bien visible, bonne visibilite dans le chat, je recommande !"</text>
|
||||
<text x="680" y="697" fill="#334433" class="sans" font-size="9">★★★★☆ 10.x.x.x — "Prix correct, effet garanti sur mes clics."</text>
|
||||
|
||||
<!-- FOOTER -->
|
||||
<rect x="0" y="696" width="1280" height="24" fill="#080810" stroke="#141420" stroke-width="1"/>
|
||||
<text x="640" y="712" fill="#222233" text-anchor="middle" class="sans" font-size="9">XIP Shop · Voir les CGV · Support : shop@xip.local</text>
|
||||
</svg>
|
||||
|
||||
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 15 KiB |
Reference in New Issue
Block a user