diff --git a/frontend/src/views/MapView.vue b/frontend/src/views/MapView.vue index 9ffa1c1..bfa1cde 100644 --- a/frontend/src/views/MapView.vue +++ b/frontend/src/views/MapView.vue @@ -117,17 +117,6 @@ function closePromoModal() { -async function claimPromo() { - if (!selectedPromo.value) return - try { - await couponStore.claimCoupon(selectedPromo.value.id) - alert('¡Promoción reclamada con éxito! Revisa "Mis Cupones" en tu perfil.') - closePromoModal() - } catch (e: any) { - alert(e.message || 'Error al reclamar la promoción') - } -} - function handleImageError(event: Event) { const target = event.target as HTMLImageElement; if (target) { @@ -736,7 +725,6 @@ async function highlightOptimalStopForRoute() {
- stars Ofertas
- - +
@@ -956,7 +943,7 @@ async function highlightOptimalStopForRoute() { border: 1px solid rgba(255, 255, 255, 0.3); border-radius: 24px; z-index: 3000; /* Aumentado para estar sobre todo */ - padding: 8px 0 12px; /* Reducimos el padding lateral a 0 */ + padding: 12px 0 0; /* Padding superior para el título, 0 abajo para que la imagen pegue */ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15); color: #000; overflow: hidden; @@ -975,8 +962,8 @@ async function highlightOptimalStopForRoute() { display: flex; align-items: center; justify-content: space-between; - padding: 0 16px 8px; /* Padding para el header */ - margin-bottom: 4px; + padding: 0 16px 12px; /* Padding para el header */ + margin-bottom: 0px; } .sheet-header-left { @@ -1067,12 +1054,11 @@ async function highlightOptimalStopForRoute() { width: 100%; height: 200px; margin: 0; - border-radius: 20px; + border-radius: 0; background-size: cover; background-position: center; position: relative; overflow: hidden; - box-shadow: 0 10px 25px rgba(0,0,0,0.2); display: flex; } @@ -1116,15 +1102,16 @@ async function highlightOptimalStopForRoute() { } .sheet-cta { - padding: 0.5rem 1rem; - background: #fee715; + background: var(--active-color); color: #101820; border: none; - border-radius: 12px; - font-size: 0.8rem; + padding: 8px 20px; + border-radius: 100px; + font-size: 0.8125rem; font-weight: 800; cursor: pointer; - transition: transform 0.2s; + box-shadow: 0 4px 15px rgba(254, 231, 21, 0.3); + transition: all 0.2s; } .sheet-cta:active { transform: scale(0.95); } @@ -1735,13 +1722,13 @@ html.light-theme .uber-search-trigger-compact { } .promo-header-modal { position: relative; height: 200px; } .promo-img-modal { width: 100%; height: 100%; object-fit: cover; } -.promo-badge-modal { position: absolute; bottom: 0; left: 0; background: #FF4081; color: white; padding: 5px 15px; font-weight: 800; } +.promo-badge-modal { position: absolute; bottom: 0; left: 0; background: #EAB308; color: #000; padding: 5px 15px; font-weight: 800; border-top-right-radius: 12px; } .promo-body-modal { padding: 25px; } .promo-title-modal { font-size: 1.5rem; font-weight: 800; margin-bottom: 10px; } .promo-biz { color: var(--active-color); font-weight: 700; margin-bottom: 15px; } .promo-actions-modal { padding: 0 25px 25px; display: flex; gap: 10px; } -.promo-claim-btn { flex: 1; background: #FF4081; color: white; border: none; padding: 15px; border-radius: 10px; font-weight: 700; cursor: pointer; } -.business-detail-btn-modal { flex: 1; background: var(--bg-secondary); color: var(--text-primary); border: 1px solid var(--border-color); padding: 15px; border-radius: 10px; font-weight: 700; cursor: pointer; } +.business-detail-btn-modal { flex: 1; background: var(--active-color); color: #000; border: none; padding: 15px; border-radius: 10px; font-weight: 800; cursor: pointer; transition: all 0.2s; } +.business-detail-btn-modal:hover { transform: scale(1.02); box-shadow: 0 4px 12px rgba(234, 179, 8, 0.3); } .close-modal-btn { position: absolute; top: 15px;