1 Commits

Author SHA1 Message Date
Jules Neny
272fb5c181 feat(v12-r): col-centre default 1/3 Carte O + 2/3 iframe AEP (vs 50/50) 2026-05-11 18:34:01 +02:00
2 changed files with 15 additions and 15 deletions

View File

@@ -5,7 +5,7 @@ import CarteOWrapper from '../vue/CarteOWrapper.vue';
import ChatbotV2 from '../vue/ChatbotV2.vue'; import ChatbotV2 from '../vue/ChatbotV2.vue';
import EmbedDynamique from '../vue/EmbedDynamique.vue'; import EmbedDynamique from '../vue/EmbedDynamique.vue';
--- ---
<div id="col-centre-grid" class="h-full grid grid-rows-2 gap-2 p-2"> <div id="col-centre-grid" class="h-full grid gap-2 p-2" style="grid-template-rows: 1fr 2fr;">
<!-- HAUT 50% : tabs Carte O / Chatbot --> <!-- HAUT 50% : tabs Carte O / Chatbot -->
<section id="col-centre-haut" class="border border-neutral-200 rounded flex flex-col overflow-hidden bg-white" style="min-height: 0;"> <section id="col-centre-haut" class="border border-neutral-200 rounded flex flex-col overflow-hidden bg-white" style="min-height: 0;">
<nav role="tablist" aria-label="Vues centrales" class="flex border-b border-neutral-200 px-1 pt-1"> <nav role="tablist" aria-label="Vues centrales" class="flex border-b border-neutral-200 px-1 pt-1">
@@ -97,8 +97,8 @@ import EmbedDynamique from '../vue/EmbedDynamique.vue';
haut.style.minHeight = '0'; haut.style.minHeight = '0';
poignee?.setAttribute('aria-label', 'Deployer la Carte O'); poignee?.setAttribute('aria-label', 'Deployer la Carte O');
} else { } else {
grid.classList.add('grid-rows-2'); grid.classList.remove('grid-rows-2');
grid.style.gridTemplateRows = ''; grid.style.gridTemplateRows = '1fr 2fr';
haut.style.overflow = ''; haut.style.overflow = '';
haut.style.minHeight = ''; haut.style.minHeight = '';
poignee?.setAttribute('aria-label', 'Replier la Carte O'); poignee?.setAttribute('aria-label', 'Replier la Carte O');
@@ -141,7 +141,7 @@ import EmbedDynamique from '../vue/EmbedDynamique.vue';
const parts = rows.split(' '); const parts = rows.split(' ');
return parseFloat(parts[0]) || 50; return parseFloat(parts[0]) || 50;
} }
return 50; return 33.33;
}; };
dragHandle.addEventListener('mousedown', (e: MouseEvent) => { dragHandle.addEventListener('mousedown', (e: MouseEvent) => {
@@ -182,10 +182,10 @@ import EmbedDynamique from '../vue/EmbedDynamique.vue';
gridEl.classList.remove('grid-rows-2'); gridEl.classList.remove('grid-rows-2');
} }
// Double-click sur drag handle = reset 50/50 // Double-click sur drag handle = reset default 1/3 + 2/3
dragHandle.addEventListener('dblclick', () => { dragHandle.addEventListener('dblclick', () => {
gridEl.style.gridTemplateRows = ''; gridEl.style.gridTemplateRows = '1fr 2fr';
gridEl.classList.add('grid-rows-2'); gridEl.classList.remove('grid-rows-2');
sessionStorage.removeItem('tf-centre-rows'); sessionStorage.removeItem('tf-centre-rows');
}); });
} }

View File

@@ -5,19 +5,19 @@ const categories = [
{ {
id: 'politique', id: 'politique',
label: 'Politique', label: 'Politique',
color: '#B5443A', color: '#1d4ed8',
hashtags: ['#politique', '#aep-politique'], hashtags: ['#politique', '#aep-politique'],
plateformes: [ plateformes: [
{ id: 'instagram', label: 'Court', url: 'https://www.instagram.com/aep.politique/' }, { id: 'instagram', label: '@aep.politique', url: 'https://www.instagram.com/aep.politique/' },
{ id: 'castopod', label: 'Podcast', url: 'https://podcast.trans-former.fr' }, { id: 'castopod', label: 'Podcast', url: 'https://podcast.trans-former.fr' },
{ id: 'substack', label: 'Article', url: 'https://julesneny.substack.com' }, { id: 'substack', label: 'Substack', url: 'https://julesneny.substack.com' },
], ],
hasSelector: true, hasSelector: true,
}, },
{ {
id: 'art', id: 'art',
label: 'Art', label: 'Art',
color: '#5B6B3A', color: '#dc2626',
hashtags: ['#peinture', '#art'], hashtags: ['#peinture', '#art'],
plateformes: [ plateformes: [
{ id: 'instagram', label: '@julesneny', url: 'https://www.instagram.com/julesneny/' }, { id: 'instagram', label: '@julesneny', url: 'https://www.instagram.com/julesneny/' },
@@ -27,7 +27,7 @@ const categories = [
{ {
id: 'outils', id: 'outils',
label: 'Outils', label: 'Outils',
color: '#475569', color: '#16a34a',
hashtags: ['#stack', '#building-public'], hashtags: ['#stack', '#building-public'],
plateformes: [ plateformes: [
{ id: 'gitea', label: 'Gitea', url: 'https://git.trans-former.fr/jules' }, { id: 'gitea', label: 'Gitea', url: 'https://git.trans-former.fr/jules' },
@@ -68,7 +68,7 @@ const categories = [
type="button" type="button"
data-platform-id={p.id} data-platform-id={p.id}
class="platform-pill" class="platform-pill"
style="font-family:'Courier New',Courier,monospace;font-size:12px;padding:2px 8px;border-radius:12px;cursor:pointer;border:1px solid #B5443A;background:transparent;color:#B5443A;" style="font-family:'Courier New',Courier,monospace;font-size:12px;padding:2px 8px;border-radius:12px;cursor:pointer;border:1px solid #1d4ed8;background:transparent;color:#1d4ed8;"
> >
{p.label} {p.label}
</button> </button>
@@ -219,11 +219,11 @@ const categories = [
pills.forEach((pill) => { pills.forEach((pill) => {
const pid = pill.dataset.platformId; const pid = pill.dataset.platformId;
if (!active || pid === active) { if (!active || pid === active) {
pill.style.background = '#B5443A'; pill.style.background = '#1d4ed8';
pill.style.color = '#fff'; pill.style.color = '#fff';
} else { } else {
pill.style.background = 'transparent'; pill.style.background = 'transparent';
pill.style.color = '#B5443A'; pill.style.color = '#1d4ed8';
} }
}); });
}; };