| <!DOCTYPE html> |
| <html lang="es"> |
| <head> |
| <meta charset="UTF-8"> |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>PropiedadesVIP - Plataforma Inmobiliaria</title> |
| <script src="https://cdn.tailwindcss.com"></script> |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> |
| <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap" rel="stylesheet"> |
| <script> |
| tailwind.config = { |
| theme: { |
| extend: { |
| colors: { |
| primary: '#5c6ac4', |
| secondary: '#8c68cd', |
| accent: '#ff6b6b', |
| dark: '#1a202c', |
| light: '#f8f9fa' |
| } |
| } |
| } |
| } |
| </script> |
| <style> |
| * { |
| margin: 0; |
| padding: 0; |
| box-sizing: border-box; |
| font-family: 'Poppins', sans-serif; |
| } |
| |
| .search-shadow { |
| box-shadow: 0 10px 25px rgba(92, 106, 196, 0.3); |
| } |
| |
| .property-card { |
| transition: all 0.3s ease; |
| } |
| |
| .property-card:hover { |
| transform: translateY(-5px); |
| box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1); |
| } |
| |
| .feature-icon { |
| background: rgba(92, 106, 196, 0.1); |
| } |
| |
| .btn-hover { |
| transition: all 0.3s ease; |
| } |
| |
| .btn-hover:hover { |
| transform: translateY(-3px); |
| box-shadow: 0 5px 15px rgba(92, 106, 196, 0.3); |
| } |
| |
| .how-it-works-step { |
| position: relative; |
| } |
| |
| .how-it-works-step:not(:last-child):after { |
| content: ''; |
| position: absolute; |
| bottom: -30px; |
| left: 50%; |
| transform: translateX(-50%); |
| height: 30px; |
| width: 3px; |
| background: #5c6ac4; |
| } |
| |
| @media (max-width: 768px) { |
| .how-it-works-step:not(:last-child):after { |
| display: none; |
| } |
| } |
| |
| .chat-bubble { |
| position: relative; |
| border-radius: 18px; |
| max-width: 80%; |
| } |
| |
| .whatsapp-bg { |
| background-color: #25D366; |
| } |
| |
| .property-tag { |
| padding: 2px 8px; |
| border-radius: 12px; |
| } |
| |
| .property-image { |
| height: 200px; |
| background-size: cover; |
| background-position: center; |
| } |
| </style> |
| </head> |
| <body class="bg-gray-50"> |
| |
| <header class="bg-white shadow-md"> |
| <div class="container mx-auto px-4"> |
| <div class="flex justify-between items-center py-4"> |
| <div class="flex items-center"> |
| <div class="bg-primary w-10 h-10 rounded-lg flex items-center justify-center mr-3"> |
| <i class="text-white text-xl fas fa-home"></i> |
| </div> |
| <h1 class="text-2xl font-bold text-dark">Propiedades<span class="text-primary">VIP</span></h1> |
| </div> |
| |
| <div class="hidden md:flex gap-6 text-gray-700"> |
| <a href="#" class="font-medium hover:text-primary transition">Inicio</a> |
| <a href="#" class="font-medium hover:text-primary transition">Propiedades</a> |
| <a href="#" class="font-medium hover:text-primary transition">Servicios</a> |
| <a href="#" class="font-medium hover:text-primary transition">FAQ</a> |
| <a href="#" class="font-medium hover:text-primary transition">Contacto</a> |
| </div> |
| |
| <div class="flex items-center gap-3"> |
| <button class="px-4 py-2 rounded-lg font-medium text-gray-700 hover:bg-gray-100 transition">Ingresar</button> |
| <button class="bg-primary px-4 py-2 rounded-lg font-medium text-white hover:bg-indigo-600 transition btn-hover">Publicar Propiedad</button> |
| <button class="md:hidden text-gray-700"> |
| <i class="fas fa-bars text-xl"></i> |
| </button> |
| </div> |
| </div> |
| </div> |
| </header> |
|
|
| |
| <section class="relative py-16 md:py-24 bg-gradient-to-r from-primary to-secondary text-white"> |
| <div class="absolute inset-0 bg-cover" style="background-image: url('https://images.unsplash.com/photo-1564013799919-ab600027ffc6?ixlib=rb-4.0.3')"></div> |
| <div class="absolute inset-0 bg-black opacity-50"></div> |
| |
| <div class="container mx-auto relative px-4"> |
| <div class="max-w-3xl mx-auto text-center"> |
| <h1 class="text-3xl md:text-4xl lg:text-5xl font-bold mb-6">Encuentra tu propiedad ideal sin complicaciones</h1> |
| <p class="text-xl mb-10">Busca con lenguaje natural: describe lo que deseas y nuestra IA te mostrará las mejores opciones</p> |
| |
| <div class="relative bg-white rounded-xl p-1 search-shadow"> |
| <div class="flex"> |
| <input |
| type="text" |
| class="w-full px-6 py-4 rounded-xl text-dark focus:outline-none" |
| placeholder="Ej: 'Busco casa en Santiago centro con 3 habitaciones con jardín'" |
| > |
| <button class="ml-2 bg-accent text-white font-medium px-6 rounded-lg"> |
| <i class="fas fa-search mr-2"></i> Buscar |
| </button> |
| </div> |
| </div> |
| |
| <div class="mt-6 flex flex-wrap justify-center gap-2"> |
| <span class="bg-white bg-opacity-20 py-1 px-3 rounded-full text-sm">Casas</span> |
| <span class="bg-white bg-opacity-20 py-1 px-3 rounded-full text-sm">Departamentos</span> |
| <span class="bg-white bg-opacity-20 py-1 px-3 rounded-full text-sm">Arriendo</span> |
| <span class="bg-white bg-opacity-20 py-1 px-3 rounded-full text-sm">Venta</span> |
| <span class="bg-white bg-opacity-20 py-1 px-3 rounded-full text-sm">Oficinas</span> |
| <span class="bg-white bg-opacity-20 py-1 px-3 rounded-full text-sm">Terrenos</span> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-light px-4"> |
| <div class="container mx-auto"> |
| <div class="text-center mb-16"> |
| <h2 class="text-3xl font-bold text-dark mb-4">¿Por qué elegir PropiedadesVIP?</h2> |
| <p class="text-gray-600 max-w-2xl mx-auto">Plataforma integral para vender, arrendar o solicitar propiedades de manera rápida y sencilla</p> |
| </div> |
| |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"> |
| <div class="bg-white rounded-xl p-6 shadow-lg flex flex-col items-center text-center"> |
| <div class="w-16 h-16 rounded-full bg-indigo-50 flex items-center justify-center mb-4"> |
| <i class="fas fa-chart-line text-primary text-2xl"></i> |
| </div> |
| <h3 class="text-xl font-semibold mb-2">Inteligencia Artificial</h3> |
| <p class="text-gray-600">Busca propiedades usando lenguaje natural sin filtros complicados</p> |
| </div> |
| |
| <div class="bg-white rounded-xl p-6 shadow-lg flex flex-col items-center text-center"> |
| <div class="w-16 h-16 rounded-full bg-indigo-50 flex items-center justify-center mb-4"> |
| <i class="fab fa-whatsapp text-primary text-2xl"></i> |
| </div> |
| <h3 class="text-xl font-semibold mb-2">WhatsApp Integration</h3> |
| <p class="text-gray-600">Interactúa con la plataforma directamente desde tu WhatsApp</p> |
| </div> |
| |
| <div class="bg-white rounded-xl p-6 shadow-lg flex flex-col items-center text-center"> |
| <div class="w-16 h-16 rounded-full bg-indigo-50 flex items-center justify-center mb-4"> |
| <i class="fas fa-user-friends text-primary text-2xl"></i> |
| </div> |
| <h3 class="text-xl font-semibold mb-2">Para Propietarios</h3> |
| <p class="text-gray-600">Publica fácilmente sin necesidad de ser corredor inmobiliario</p> |
| </div> |
| |
| <div class="bg-white rounded-xl p-6 shadow-lg flex flex-col items-center text-center"> |
| <div class="w-16 h-16 rounded-full bg-indigo-50 flex items-center justify-center mb-4"> |
| <i class="fas fa-database text-primary text-2xl"></i> |
| </div> |
| <h3 class="text-xl font-semibold mb-2">Base de Datos Potente</h3> |
| <p class="text-gray-600">Almacenamos todos los datos utilizando MySQL para máxima eficiencia</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 px-4"> |
| <div class="container mx-auto"> |
| <div class="flex justify-between items-center mb-10"> |
| <div> |
| <h2 class="text-3xl font-bold">Propiedades Destacadas</h2> |
| <p class="text-gray-600">Descubre los mejores inmuebles en nuestro sitio</p> |
| </div> |
| <a href="#" class="text-primary font-medium flex items-center"> |
| Ver todas |
| <i class="fas fa-arrow-right ml-2"></i> |
| </a> |
| </div> |
| |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8"> |
| |
| <div class="property-card bg-white rounded-xl overflow-hidden shadow-lg"> |
| <div class="property-image" style="background-image: url('https://images.unsplash.com/photo-1512917774080-9991f1c4c750?ixlib=rb-4.0.3&auto=format&fit=crop&w=700&q=80')"></div> |
| <div class="p-6"> |
| <div class="flex justify-between items-start"> |
| <div> |
| <h3 class="font-semibold text-xl">Casa Moderna en La Reina</h3> |
| <p class="text-gray-600">La Reina, Santiago</p> |
| </div> |
| <p class="text-primary font-semibold text-xl">$320.000.000</p> |
| </div> |
| |
| <div class="flex text-sm gap-4 mt-4 mb-5"> |
| <span><i class="fas fa-bed text-gray-500 mr-2"></i> 3 Habitaciones</span> |
| <span><i class="fas fa-bath text-gray-500 mr-2"></i> 2 Baños</span> |
| <span><i class="fas fa-expand text-gray-500 mr-2"></i> 180 m²</span> |
| </div> |
| |
| <div class="flex flex-wrap gap-2"> |
| <span class="property-tag bg-green-100 text-green-800">Venta</span> |
| <span class="property-tag bg-blue-100 text-blue-800">Certificada</span> |
| <span class="property-tag bg-purple-100 text-purple-800">Jardín</span> |
| </div> |
| </div> |
| </div> |
| |
| |
| <div class="property-card bg-white rounded-xl overflow-hidden shadow-lg"> |
| <div class="property-image" style="background-image: url('https://images.unsplash.com/photo-1502672260266-1c1ef2d93588?ixlib=rb-4.0.3')"></div> |
| <div class="p-6"> |
| <div class="flex justify-between items-start"> |
| <div> |
| <h3 class="font-semibold text-xl">Departamento Premium Providencia</h3> |
| <p class="text-gray-600">Providencia, Santiago</p> |
| </div> |
| <p class="text-secondary font-semibold text-xl">$350.000/mes</p> |
| </div> |
| |
| <div class="flex text-sm gap-4 mt-4 mb-5"> |
| <span><i class="fas fa-bed text-gray-500 mr-2"></i> 2 Habitaciones</span> |
| <span><i class="fas fa-bath text-gray-500 mr-2"></i> 2 Baños</span> |
| <span><i class="fas fa-expand text-gray-500 mr-2"></i> 85 m²</span> |
| </div> |
| |
| <div class="flex flex-wrap gap-2"> |
| <span class="property-tag bg-red-100 text-red-800">Arriendo</span> |
| <span class="property-tag bg-blue-100 text-blue-800">Piscina</span> |
| <span class="property-tag bg-purple-100 text-purple-800">Gimnasio</span> |
| </div> |
| </div> |
| </div> |
| |
| |
| <div class="property-card bg-white rounded-xl overflow-hidden shadow-lg"> |
| <div class="property-image" style="background-image: url('https://images.unsplash.com/photo-1504308801563-a8c1fee57abb?ixlib=rb-4.0.3')"></div> |
| <div class="p-6"> |
| <div class="flex justify-between items-start"> |
| <div> |
| <h3 class="font-semibold text-xl">Casa Familiar La Florida</h3> |
| <p class="text-gray-600">La Florida, Santiago</p> |
| </div> |
| <p class="text-primary font-semibold text-xl">$440.000.000</p> |
| </div> |
| |
| <div class="flex text-sm gap-4 mt-4 mb-5"> |
| <span><i class="fas fa-bed text-gray-500 mr-2"></i> 4 Habitaciones</span> |
| <span><i class="fas fa-bath text-gray-500 mr-2"></i> 3 Baños</span> |
| <span><i class="fas fa-expand text-gray-500 mr-2"></i> 220 m²</span> |
| </div> |
| |
| <div class="flex flex-wrap gap-2"> |
| <span class="property-tag bg-green-100 text-green-800">Venta</span> |
| <span class="property-tag bg-purple-100 text-purple-800">Jardín</span> |
| <span class="property-tag bg-yellow-100 text-yellow-800">Estacionamiento</span> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-gray-100 px-4"> |
| <div class="container mx-auto"> |
| <div class="text-center mb-14"> |
| <h2 class="text-3xl font-bold text-dark mb-4">Cómo usar nuestra integración con WhatsApp</h2> |
| <p class="text-gray-600 max-w-2xl mx-auto">Interactúa con PropiedadesVIP desde tu teléfono en simples pasos</p> |
| </div> |
| |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-10"> |
| |
| <div class="how-it-works-step bg-white rounded-xl p-8 shadow-md flex flex-col items-center text-center"> |
| <div class="bg-secondary text-white w-16 h-16 rounded-full flex items-center justify-center text-2xl mb-5">1</div> |
| <h3 class="text-xl font-semibold mb-4">Agrega nuestro número</h3> |
| <p class="text-gray-600">Guarda +56 9 1234 5678 en tu libreta de contactos como PropiedadesVIP</p> |
| </div> |
| |
| |
| <div class="how-it-works-step bg-white rounded-xl p-8 shadow-md flex flex-col items-center text-center"> |
| <div class="bg-primary text-white w-16 h-16 rounded-full flex items-center justify-center text-2xl mb-5">2</div> |
| <h3 class="text-xl font-semibold mb-4">Envía tu solicitud</h3> |
| <p class="text-gray-600">Escribe un mensaje empezando con "Publicar" o "Buscar" seguido de tus detalles</p> |
| </div> |
| |
| |
| <div class="how-it-works-step bg-white rounded-xl p-8 shadow-md flex flex-col items-center text-center"> |
| <div class="bg-accent text-white w-16 h-16 rounded-full flex items-center justify-center text-2xl mb-5">3</div> |
| <h3 class="text-xl font-semibold mb-4">Recibe respuesta</h3> |
| <p class="text-gray-600">Nuestro sistema procesará tu solicitud y te responderá con los resultados</p> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 px-4 bg-white"> |
| <div class="container mx-auto"> |
| <div class="text-center mb-14"> |
| <h2 class="text-3xl font-bold text-dark mb-4">Demo de WhatsApp</h2> |
| <p class="text-gray-600 max-w-2xl mx-auto">Así te comunicas con nuestra plataforma</p> |
| </div> |
| |
| <div class="max-w-md mx-auto bg-gray-50 rounded-2xl overflow-hidden shadow-lg"> |
| |
| <div class="whatsapp-bg p-4 flex items-center"> |
| <div class="w-12 h-12 rounded-full bg-white flex items-center justify-center mr-3"> |
| <i class="fab fa-whatsapp text-3xl text-gray-800"></i> |
| </div> |
| <div class="text-white"> |
| <h3 class="font-semibold">PropiedadesVIP</h3> |
| <p class="text-sm opacity-90">En línea</p> |
| </div> |
| </div> |
| |
| |
| <div class="p-4 bg-gray-100 h-96 overflow-y-auto"> |
| <div class="mb-4"> |
| <div class="chat-bubble bg-white inline-block p-4"> |
| <p>Envía "Buscar" seguido de lo que necesitas. Ej: "Buscar casa 3 habitaciones en Vitacura"</p> |
| <span class="block text-xs text-gray-500 mt-2">PropiedadesVIP • 18:03</span> |
| </div> |
| </div> |
| |
| <div class="mb-4 flex justify-end"> |
| <div class="chat-bubble whatsapp-bg text-white inline-block p-4"> |
| <p>Buscar departamento arriendo 2 ambientes cerca del metro en Providencia</p> |
| <span class="block text-xs opacity-90 text-right mt-2">Yo • 18:05</span> |
| </div> |
| </div> |
| |
| <div class="mb-4"> |
| <div class="chat-bubble bg-white inline-block p-4"> |
| <p>Hemos encontrado 8 propiedades que coinciden con tu búsqueda:</p> |
| <ol class="list-decimal pl-5 mt-2 text-sm"> |
| <li>Departamento nuevo 2D/1B $420.000</li> |
| <li>Departamento centro $380.000</li> |
| <li>Departamento parke $450.000</li> |
| </ol> |
| <p class="mt-2">Ver todos en: www.propiedadesvip.cl/buscar?ref=wa12345</p> |
| <span class="block text-xs text-gray-500 mt-2">PropiedadesVIP • 18:06</span> |
| </div> |
| </div> |
| |
| <div class="mb-4 flex justify-end"> |
| <div class="chat-bubble whatsapp-bg text-white inline-block p-4"> |
| <p>Publicar arriendo casa 3 habitaciones Las Condes $950.000</p> |
| <span class="block text-xs opacity-90 text-right mt-2">Yo • 18:07</span> |
| </div> |
| </div> |
| |
| <div class="mb-4"> |
| <div class="chat-bubble bg-white inline-block p-4"> |
| <p>Para publicar necesitamos: Fotos y datos adicionales. Completa el proceso en: www.propiedadesvip.cl/publicar?ref=wa12345</p> |
| <p>También puedes enviar las fotos por aquí. ¿Deseas adjuntar fotografías ahora?</p> |
| <span class="block text-xs text-gray-500 mt-2">PropiedadesVIP • 18:08</span> |
| </div> |
| </div> |
| </div> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <section class="py-16 bg-gradient-to-r from-primary to-secondary text-white"> |
| <div class="container mx-auto px-4 text-center"> |
| <h2 class="text-3xl md:text-4xl font-bold mb-6">Transforma tu experiencia inmobiliaria</h2> |
| <p class="text-xl max-w-2xl mx-auto mb-10">Únete a miles de usuarios que ya buscan, venden y arriendan sus propiedades con inteligencia artificial</p> |
| <div class="flex flex-col sm:flex-row justify-center gap-4"> |
| <button class="bg-white text-primary py-3 px-8 rounded-full font-semibold btn-hover">Registrarme Ahora</button> |
| <button class="bg-white bg-opacity-20 text-white py-3 px-8 rounded-full font-semibold btn-hover"> |
| <i class="fab fa-whatsapp mr-2"></i> WhatsApp Integration |
| </button> |
| </div> |
| </div> |
| </section> |
|
|
| |
| <footer class="bg-dark text-gray-300 py-12 px-4"> |
| <div class="container mx-auto"> |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-10"> |
| <div> |
| <div class="flex items-center mb-4"> |
| <div class="bg-primary w-10 h-10 rounded-lg flex items-center justify-center mr-3"> |
| <i class="text-white text-xl fas fa-home"></i> |
| </div> |
| <h1 class="text-2xl font-bold text-white">Propiedades<span class="text-primary">VIP</span></h1> |
| </div> |
| <p class="mb-4">Plataforma líder en soluciones inmobiliarias inteligentes.</p> |
| <div class="flex gap-4"> |
| <a href="#" class="bg-primary w-10 h-10 rounded-full flex items-center justify-center"> |
| <i class="fab fa-facebook-f text-white"></i> |
| </a> |
| <a href="#" class="bg-secondary w-10 h-10 rounded-full flex items-center justify-center"> |
| <i class="fab fa-instagram text-white"></i> |
| </a> |
| <a href="#" class="bg-accent w-10 h-10 rounded-full flex items-center justify-center"> |
| <i class="fab fa-whatsapp text-white"></i> |
| </a> |
| </div> |
| </div> |
| |
| <div> |
| <h3 class="text-lg font-semibold text-white mb-4">Enlaces Rápidos</h3> |
| <ul> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">Inicio</a></li> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">Propiedades</a></li> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">Buscar por IA</a></li> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">Publicar Propiedad</a></li> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">Solicitudes</a></li> |
| </ul> |
| </div> |
| |
| <div> |
| <h3 class="text-lg font-semibold text-white mb-4">Servicios</h3> |
| <ul> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">Venta de Propiedades</a></li> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">Arriendo</a></li> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">WhatsApp Assistant</a></li> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">Solicitudes Personalizadas</a></li> |
| <li class="mb-2"><a href="#" class="hover:text-primary transition">Integraciones API</a></li> |
| </ul> |
| </div> |
| |
| <div> |
| <h3 class="text-lg font-semibold text-white mb-4">Contáctanos</h3> |
| <ul> |
| <li class="flex mb-3"> |
| <i class="fas fa-map-marker-alt mt-1 mr-3 text-primary"></i> |
| <span>Av. Providencia 1234, Santiago, Chile</span> |
| </li> |
| <li class="flex mb-3"> |
| <i class="fas fa-phone-alt mt-1 mr-3 text-primary"></i> |
| <span>+56 2 2345 6789</span> |
| </li> |
| <li class="flex mb-3"> |
| <i class="fab fa-whatsapp mt-1 mr-3 text-primary"></i> |
| <span>+56 9 1234 5678</span> |
| </li> |
| <li class="flex"> |
| <i class="fas fa-envelope mt-1 mr-3 text-primary"></i> |
| <span>info@propiedadesvip.cl</span> |
| </li> |
| </ul> |
| </div> |
| </div> |
| |
| <div class="border-t border-gray-700 mt-12 pt-8 text-center"> |
| <p>© 2023 PropiedadesVIP. Todos los derechos reservados.</p> |
| <div class="mt-2"> |
| <a href="#" class="text-gray-400 hover:text-primary mx-2">Términos y Condiciones</a> |
| <a href="#" class="text-gray-400 hover:text-primary mx-2">Política de Privacidad</a> |
| <a href="#" class="text-gray-400 hover:text-primary mx-2">Cookies</a> |
| </div> |
| </div> |
| </div> |
| </footer> |
|
|
| |
| <div class="fixed bottom-6 right-6 z-50"> |
| <a href="#" class="bg-whatsapp-bg text-white w-16 h-16 rounded-full flex items-center justify-center shadow-lg btn-hover"> |
| <i class="fab fa-whatsapp text-2xl"></i> |
| </a> |
| </div> |
|
|
| <script> |
| document.addEventListener('DOMContentLoaded', function() { |
| |
| const navLinks = document.querySelectorAll('header a'); |
| if (navLinks.length) { |
| navLinks.forEach(link => { |
| link.addEventListener('click', function() { |
| navLinks.forEach(l => l.classList.remove('text-primary', 'font-bold')); |
| this.classList.add('text-primary', 'font-bold'); |
| }); |
| }); |
| } |
| |
| |
| const searchInput = document.querySelector('.search-shadow input'); |
| if (searchInput) { |
| |
| const searchBar = document.querySelector('.search-shadow'); |
| |
| function setSearchBarPadding() { |
| if (window.innerWidth < 768) { |
| searchBar.classList.remove('p-1'); |
| searchBar.classList.add('p-0.5'); |
| searchInput.classList.replace('py-4', 'py-3'); |
| } else { |
| searchBar.classList.remove('p-0.5'); |
| searchBar.classList.add('p-1'); |
| searchInput.classList.replace('py-3', 'py-4'); |
| } |
| } |
| |
| setSearchBarPadding(); |
| window.addEventListener('resize', setSearchBarPadding); |
| } |
| |
| |
| const propertyCards = document.querySelectorAll('.property-card'); |
| if (propertyCards) { |
| propertyCards.forEach(card => { |
| card.addEventListener('mouseenter', function() { |
| this.classList.add('transform', 'scale-105'); |
| }); |
| |
| card.addEventListener('mouseleave', function() { |
| this.classList.remove('transform', 'scale-105'); |
| }); |
| }); |
| } |
| }); |
| </script> |
| <p style="border-radius: 8px; text-align: center; font-size: 12px; color: #fff; margin-top: 16px;position: fixed; left: 8px; bottom: 8px; z-index: 10; background: rgba(0, 0, 0, 0.8); padding: 4px 8px;">Made with <img src="https://enzostvs-deepsite.hf.space/logo.svg" alt="DeepSite Logo" style="width: 16px; height: 16px; vertical-align: middle;display:inline-block;margin-right:3px;filter:brightness(0) invert(1);"><a href="https://enzostvs-deepsite.hf.space" style="color: #fff;text-decoration: underline;" target="_blank" >DeepSite</a> - 🧬 <a href="https://enzostvs-deepsite.hf.space?remix=FvNks/konecte" style="color: #fff;text-decoration: underline;" target="_blank" >Remix</a></p></body> |
| </html> |
