Skip to content

Commit

Permalink
cambiado a grid
Browse files Browse the repository at this point in the history
  • Loading branch information
@marianodevel
marianodevel committed Dec 25, 2024
1 parent a1b980e commit 8935bf0
Show file tree
Hide file tree
Showing 4 changed files with 635 additions and 265 deletions.
212 changes: 212 additions & 0 deletions __index.html
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,212 @@
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Briamonte y Bustos</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preload"
as="style"
href="https://fonts.googleapis.com/css2?family=Afacad:ital,wght@0,400..700;1,400..700&display=swap">
<link rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Afacad:ital,wght@0,400..700;1,400..700&display=swap"
media="print"
onload="this.media='all'">
<link rel="preload" href="static/css/styles.css" as="style">
<link rel="stylesheet" href="static/css/styles.css">
</head>
<body>
<section id="inicio">
<nav>
<a href="#inicio">Inicio</a>
<a href="#estudio">Nuestro Estudio</a>
<a href="#servicios_legales">Servicios Legales</a>
<a href="#contacto">Contacto</a>
</nav>
<div class="content">
<div class="text-content">
<h1>Briamonte y Bustos</h1>
<br>
<h2>Abogados</h2>
</div>
</div>
<footer>
<div class="CTA">
<button>ASESORAMIENTO</button>
</div>
</footer>
</section>
<section id="estudio">
<nav>
<a href="#inicio">Inicio</a>
<a href="#estudio">Nuestro Estudio</a>
<a href="#servicios_legales">Servicios Legales</a>
<a href="#contacto">Contacto</a>
</nav>
<div class="content">
<div class="container" id="nuestro_estudio">
<div class="text-content">
<h2>Nuestro Estudio</h2>
<p>Nos distinguen 15 años de experiencia en el ejercicio de la abogacía y una sólida y permanente formación profesional.</p>
<br>
<p>Creemos que la resolución rápida y eficiente de los conflictos legales es fundamental para el desarrollo de los proyectos de nuestros clientes.</p>
<br>
<p>Nos mantenemos en contacto permanente con nuestros representados brindándoles asesoramiento adecuado y oportuno en los momentos de mayor necesidad.</p>
<br>
<p>Nuestro compromiso es su tranquilidad</p>
</div>
</div>
</div>
<footer>
<div class="barra">
<img src="static/images/barra.png">
</div>
<div class="CTA">
<button>ASESORAMIENTO</button>
</div>
<div class="barra">
<img src="static/images/barra.png">
</div>
</footer>
</section>
<section id="servicios_legales">
<nav>
<a href="#inicio">Inicio</a>
<a href="#estudio">Nuestro Estudio</a>
<a href="#servicios_legales">Servicios Legales</a>
<a href="#contacto">Contacto</a>
</nav>
<div class="content">
<div class="text-content">
<h2>Servicios Legales</h2>
</div>
<div class="card" id="familia">
<div class="card_image">
<img src="static/images/familia.jpg" alt="familia">
</div>
<h3>Derecho de Familia</h3>
<ul>
<li>divorcios</li>
<li>alimentos</li>
<li>cuidado personal</li>
<li>regimen de comunicacion</li>
<li>autorizaciones de viaje</li>
</ul>
</div>
<div class="card" id="civil">
<div class="card_image">
<img src="static/images/accidente_transito.jpeg" alt="accidente de transito">
</div>
<h3>Derecho Civil</h3>
<ul>
<li>sucesiones</li>
<li>contratos</li>
<li>desalojos</li>
<li>cobro de pesos</li>
<li>accidentes de transito</li>
</ul>
</div>
<div class="card" id="administrativo">
<div class="card_image">
<img src="static/images/casa_gobierno_santa_cruz.jpg" alt="casa de gobierno de Santa Cruz">
</div>
<h3>Derecho Administrativo</h3>
<ul>
<li>amparos</li>
<li>reclamos administrativos</li>
<li>regimen disciplinario Policia, Fuerzas Armadas y de Seguridad</li>
<li>servicios publicos</li>
<li>jubilaciones</li>
</ul>
</div>
<div class="card" id="penal">
<div class="card_image">
<img src="static/images/esposas.jpg" alt="esposas">
</div>
<h3>Derecho Penal</h3>
<ul>
<li>defensas</li>
<li>excarcelaciones</li>
<li>querellas</li>
<li>denuncias</li>
<li>violencia domestica</li>
</ul>
</div>
</div>
<footer>
<div class="barra">
<img src="static/images/barra.png">
</div>
<div class="CTA">
<button>ASESORAMIENTO</button>
</div>
<div class="barra">
<img src="static/images/barra.png" alt="barra decorativa">
</div>
</footer>
</section>
<section id="contacto">
<nav>
<a href="#inicio">Inicio</a>
<a href="#estudio">Nuestro Estudio</a>
<a href="#servicios_legales">Servicios Legales</a>
<a href="#contacto">Contacto</a>
</nav>
<div class="content">
<div class="container">
<h2>Contacto</h2>
<div class="text-container">
<p>Contáctese con nosotros a los siguientes telefonos:</p>
<span><img><p></p></span>
<span><img><p></p></span>
<p>(solo WhatsApp)</p>
<p>O envienos un mensaje a nuestras redes:</p>
<span><img></span>
<span><img></span>
<p>Por urgencias, comunicarse telefonicamente al</p>
<span><i></span>
</div>
<div class="image-container">
<div class="img">
</div>
<div class="text">
</div>
</div>
</div>
</div>
<footer>
<div class="barra">
<img src="static/images/barra.png" alt="barra decorativa">
</div>
<div class="CTA">
<button>ASESORAMIENTO</button>
</div>
<div class="barra">
<img src="static/images/barra.png" alt="barra decorativa">
</div>
</footer>
</section>
<script>
const updateActiveLinks = () => {
const sections = document.querySelectorAll('section');
sections.forEach((section, index) => {
const rect = section.getBoundingClientRect();
if (rect.top >= -100 && rect.top <= 100) {
// Actualizar todos los navbars
document.querySelectorAll('.navbar a').forEach(link => {
if (link.getAttribute('href') === '#' + section.id) {
link.classList.add('active');
} else {
link.classList.remove('active');
}
});
}
});
};

window.addEventListener('scroll', updateActiveLinks);
updateActiveLinks(); // Inicializar estado activo
</script>
</body>
</html>
Loading

0 comments on commit 8935bf0

Please sign in to comment.