Rafael Lopez / ppto

Go to a project
Toggle navigation Toggle navigation pinning
Rafael Lopez
0794d1fb 1 parent 4a3b055c

mejora landing

Inline Side-by-side
Showing 1 changed file with 42 additions and 13 deletions
......@@ -103,13 +103,14 @@
// Clasificadores unificados (transversales)
const CLASIFICADORES = [
{ id: 'entidad', label: 'Entidades', icon: '🏛️' },
{ id: 'objeto', label: 'Objetos de gasto', icon: '📦' },
{ id: 'finfun', label: 'Finalidad y función', icon: '🎯' },
{ id: 'geografico', label: 'Geográfico', icon: '📍', disabled: true },
{ id: 'rubro', label: 'Rubro', icon: '💰', disabled: true },
{ id: 'organismo', label: 'Organismo', icon: '🏦', disabled: true },
{ id: 'fuente', label: 'Fuente', icon: '💵', disabled: true },
{ id: 'entidad', label: '¿Quién gasta?', icon: '🏛️' },
{ id: 'objeto', label: '¿En qué se gasta?', icon: '📦' },
{ id: 'finfun', label: '¿Para qué se gasta?', icon: '🎯' },
{ id: 'geografico', label: '¿Dónde se gasta?', icon: '📍' },
{ id: 'sectores', label: '¿En qué sectores se gasta?', icon: '🏢' },
{ id: 'rubro', label: '¿Con qué recursos?', icon: '💰' },
{ id: 'organismo', label: '¿Quién financia?', icon: '🏦' },
{ id: 'fuente', label: 'Origen del ingreso', icon: '💵' },
];
function toggleClassifier(id) {
......@@ -528,6 +529,24 @@
$: stats = allHits.length > 0 ? getStats(allHits, results?.found || allHits.length) : null;
// Texto contextual para resultados
$: searchContextText = (() => {
if (searchMode === 'programas') {
return 'Buscando en programas y proyectos';
} else {
if (selectedClassifiers.length === 0) return '';
const labels = selectedClassifiers.map(id => {
const clf = CLASIFICADORES.find(c => c.id === id);
return clf ? clf.label.replace('¿', '').replace('?', '').toLowerCase() : id;
});
if (labels.length === 1) {
return `Buscando por ${labels[0]}`;
} else {
return `Buscando por ${labels.slice(0, -1).join(', ')} y ${labels[labels.length - 1]}`;
}
}
})();
$: {
const _mode = searchMode;
const _classifiers = selectedClassifiers;
......@@ -664,7 +683,7 @@
<span class="mode-card-title">Programas y Proyectos</span>
</div>
<p class="mode-card-desc">
<strong>735k+</strong> proyectos y programas (2016-2025). Para encontrar iniciativas específicas.
Explora los gastos de <strong>735k+</strong> proyectos y programas (2016-2025). Esta opción es útil para encontrar iniciativas específicas: una obra, un programa social. Por ejemplo:
</p>
<div class="mode-card-pills">
<span class="pills-hint"><span class="hint-desktop">Ej:</span><span class="hint-mobile">Ej:</span></span>
......@@ -705,7 +724,7 @@
<span class="mode-card-title">Clasificadores</span>
</div>
<p class="mode-card-desc">
<strong>2500+</strong> categorías de gasto e ingreso (2006-2025). Para comparar y analizar tendencias.
Busca en más de <strong>2500</strong> categorías estandarizadas de gasto e ingreso público (2016-2025). Útiles para comparar gestiones, entidades y analizar tendencias históricas.
</p>
<div class="mode-card-classifiers">
{#each CLASIFICADORES as clf}
......@@ -787,6 +806,11 @@
</div>
{/if}
<!-- Título contextual de búsqueda -->
{#if allHits.length > 0 && searchContextText}
<div class="search-context-title">{searchContextText}</div>
{/if}
<!-- Contenedor de resultados (siempre montado para evitar flicker) -->
<div
class="results-content results-content-filled"
......@@ -1536,14 +1560,16 @@
.mode-card-active .mode-card-icon{color:#F0C14D}
.mode-card-title{font-family:var(--sans);font-size:16px;font-weight:600;color:#F5F0E8;letter-spacing:-0.01em}
.mode-card-desc{font-family:var(--sans);font-size:13px;color:#9B9890;line-height:1.5;margin:0}
.mode-card-desc{font-family:var(--sans);font-size:13px;color:#A8A49C;line-height:1.5;margin:0}
.mode-card-desc strong{color:#D0CCC4;font-weight:600}
.mode-card-active .mode-card-desc{color:#C8C4BC}
.mode-card-active .mode-card-desc strong{color:#F0C14D}
.mode-card-classifiers{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.clf-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:8px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);cursor:pointer;transition:all 0.2s;font-family:var(--sans);font-size:12px;color:#8B8880}
.clf-chip:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.15)}
.clf-chip-active{background:rgba(90,175,138,0.15);border-color:rgba(90,175,138,0.4);color:#5AAF8A}
.clf-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:8px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);cursor:pointer;transition:all 0.2s;font-family:var(--sans);font-size:12px;color:#A8A49C}
.clf-chip:hover{background:rgba(255,255,255,0.08);border-color:rgba(255,255,255,0.15);color:#D0CCC4}
.clf-chip-active{background:rgba(90,175,138,0.15);border-color:rgba(90,175,138,0.4);color:#6BC99E}
.clf-chip-disabled{opacity:0.35;cursor:not-allowed}
.clf-chip-disabled:hover{background:rgba(255,255,255,0.04);border-color:rgba(255,255,255,0.08)}
.clf-check{width:14px;height:14px;border-radius:4px;border:1.5px solid rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;transition:all 0.2s;flex-shrink:0}
......@@ -1584,6 +1610,9 @@
.results-error{font-family:var(--sans);font-size:14px;color:#C44B3F}
.results-empty{font-family:var(--sans);font-size:14px;color:#8B8880}
/* Search Context Title */
.search-context-title{font-family:var(--sans);font-size:12px;font-weight:500;color:#9B9890;text-transform:uppercase;letter-spacing:0.05em;margin-bottom:8px;padding-left:4px;text-align:left}
/* Results Content */
.results-content{max-height:0;overflow:hidden;opacity:0;transition:all 0.4s cubic-bezier(0.16,1,0.3,1)}
.results-content-visible{max-height:60vh;overflow-y:auto;opacity:1;background:#1C1C1A;border-radius:16px;border:none;padding:14px 10px;text-align:left;position:relative;z-index:10}
......