Skip to content

Commit

Permalink
Cambios
Browse files Browse the repository at this point in the history
  • Loading branch information
@pabloWIB
pabloWIB committed Aug 14, 2024
1 parent bdae2df commit 92c6d18
Show file tree
Hide file tree
Showing 9 changed files with 183 additions and 31 deletions.
39 changes: 38 additions & 1 deletion CSS/styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -482,6 +482,44 @@ body > :nth-child(2) > :nth-child(1) > :nth-child(2) > :nth-child(4) > :nth-chil
background-color: #2e2e2e;
}

.slider3 {
position: relative;
max-width: 500px;
margin: auto;
overflow: hidden;
border-radius: 20px;
}
.slider3 .slides3 {
display: flex;
transition: transform 0.5s ease-in-out;
border-radius: 20px;
}
.slider3 .slides3 .slide3 {
min-width: 100%;
width: 100%;
box-sizing: border-box;
}
.slider3 .slides3 .slide3 img {
border-radius: 20px;
width: 100%;
}
.slider3 .dots3 {
text-align: center;
padding: 10px 0;
}
.slider3 .dots3 .dot3 {
display: inline-block;
width: 10px;
height: 10px;
margin: 5px;
background-color: #bbb;
border-radius: 50%;
cursor: pointer;
}
.slider3 .dot3.active {
background-color: #2e2e2e;
}

body main {
padding: 3.5rem 0rem 0rem 0rem;
box-shadow: 0px 10px 15px rgba(0, 0, 0, 0.3);
Expand Down Expand Up @@ -954,7 +992,6 @@ body section > :nth-child(1) > :nth-child(5) {
box-shadow: 0px 5px 10px 1px rgba(0, 0, 0, 0.4);
border-radius: 15px;
padding: 2.25rem 0rem;
margin-top: -2rem;
}
body section > :nth-child(1) > :nth-child(5) h3, body section > :nth-child(1) > :nth-child(5) p {
all: unset;
Expand Down
2 changes: 1 addition & 1 deletion CSS/styles.css.map
View file

Large diffs are not rendered by default.

48 changes: 45 additions & 3 deletions CSS/styles.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -557,6 +557,48 @@ body {

// SLIDER 2 ---

// SLIDER 2

.slider3 {
position: relative;
max-width: 500px;
margin: auto;
overflow: hidden;
border-radius: 20px;
.slides3 {
display: flex;
transition: transform 0.5s ease-in-out;
border-radius: 20px;
.slide3 {
min-width: 100%;
width: 100%;
box-sizing: border-box;
img {
border-radius: 20px;
width: 100%;
}
}
}
.dots3 {
text-align: center;
padding: 10px 0;
.dot3 {
display: inline-block;
width: 10px;
height: 10px;
margin: 5px;
background-color: #bbb;
border-radius: 50%;
cursor: pointer;
}
}
.dot3.active {
background-color: #2e2e2e;
}
}

// SLIDER 2 ---

body {
main {
padding: 3.5rem 0rem 0rem 0rem;
Expand Down Expand Up @@ -780,7 +822,6 @@ body {
align-items: center;
justify-content: space-between;
width: 100%;

div {
display: flex;
flex-flow: row wrap;
Expand Down Expand Up @@ -1134,6 +1175,7 @@ body {
>:nth-child(1) {
>:nth-child(5) {
display: flex;

margin: 0 auto;
flex-flow: column wrap;
align-items: center;
Expand All @@ -1144,7 +1186,6 @@ body {
box-shadow: 0px 5px 10px 1px rgba(0, 0, 0, 0.4);
border-radius: 15px;
padding: 2.25rem 0rem;
margin-top: -2rem;
h3,p {
all: unset;
}
Expand Down Expand Up @@ -1574,4 +1615,5 @@ body {
}
}

// WhatsApp screen ---
// WhatsApp screen ---

16 changes: 16 additions & 0 deletions HTML/index2.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,12 +74,28 @@ <h3>#LO MEJOR PARA MI FAMILIA</h3>
<div class="slide2">
<img src="../IMG/img1.png" alt="Image 4" />
</div>
<div class="slide2">
<img src="../IMG/img5.jpeg" alt="Image 4" />
</div>
<div class="slide2">
<img src="../IMG/img6.jpeg" alt="Image 4" />
</div>
<div class="slide2">
<img src="../IMG/img7.jpeg" alt="Image 4" />
</div>
<div class="slide2">
<img src="../IMG/img8.jpeg" alt="Image 4" />
</div>
</div>
<div class="dots2">
<span class="dot2" data-slide="0"></span>
<span class="dot2" data-slide="1"></span>
<span class="dot2" data-slide="2"></span>
<span class="dot2" data-slide="3"></span>
<span class="dot2" data-slide="4"></span>
<span class="dot2" data-slide="5"></span>
<span class="dot2" data-slide="6"></span>
<span class="dot2" data-slide="7"></span>
</div>
</div>
<a target="_blank" href="https://api.whatsapp.com/send/?phone=5214495433976&text&type=phone_number&app_absent=0">
Expand Down
Binary file added IMG/Mayoreo y Menudeo-2.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added IMG/Mayoreo y Menudeo.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
40 changes: 39 additions & 1 deletion JS/script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -255,4 +255,42 @@ function actualizarExperiencia() {
actualizarExperiencia();

var clienteSatisfechos = document.getElementById('clienteSatisfechos').textContent = '+' + 75;
var presenciaEnPaises = document.getElementById('presenciaEnPaises').textContent = '+' + 2;
var presenciaEnPaises = document.getElementById('presenciaEnPaises').textContent = '+' + 2;


$(document).ready(function () {
function setupCarousel(carouselId) {
let currentIndex = 0;
const $carousel = $('#' + carouselId);
const $slides = $carousel.find('.slide3');
const $dots = $carousel.find('.dot3');
const slideCount = $slides.length;

function showSlide(index) {
$slides.each(function (i) {
$(this).css('transform', 'translateX(' + (-100 * index) + '%)');
});
$dots.removeClass('active');
$dots.eq(index).addClass('active');
}

function nextSlide() {
currentIndex = (currentIndex + 1) % slideCount;
showSlide(currentIndex);
}

$dots.each(function (index) {
$(this).click(function () {
currentIndex = index;
showSlide(currentIndex);
});
});

setInterval(nextSlide, 3500); // Adjust interval as needed

showSlide(currentIndex);
}

// Initialize the new carousel
setupCarousel('mainID3');
});
5 changes: 4 additions & 1 deletion JS/script2.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,4 +39,7 @@ $(document).ready(function () {
var fecha = new Date();
var fechaAño = fecha.getFullYear();

var dateCopyright2 = document.getElementById('dateCopyright2').textContent = fechaAño;
var dateCopyright2 = document.getElementById('dateCopyright2').textContent = fechaAño;



64 changes: 40 additions & 24 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -74,30 +74,30 @@ <h3>#LO MEJOR PARA MI FAMILIA</h3>
<div class="slides">
<div class="slide">
<img src="IMG/img1.png" alt="Image 1" />
</div>
<div class="slide">
<img src="IMG/img2.jpg" alt="Image 2" />
</div>
<div class="slide">
<img src="IMG/img3.jpg" alt="Image 3" />
</div>
<div class="slide">
<img src="IMG/img4.jpg" alt="Image 4" />
</div>
<div class="slide">
<img src="IMG/img5.jpeg" alt="Image 2" />
</div>
<div class="slide">
<img src="IMG/img6.jpeg" alt="Image 3" />
</div>
<div class="slide">
<img src="IMG/img7.jpeg" alt="Image 4" />
</div>
<div class="slide">
</div>
<div class="slide">
<img src="IMG/img2.jpg" alt="Image 2" />
</div>
<div class="slide">
<img src="IMG/img3.jpg" alt="Image 3" />
</div>
<div class="slide">
<img src="IMG/img4.jpg" alt="Image 4" />
</div>
<div class="slide">
<img src="IMG/img5.jpeg" alt="Image 2" />
</div>
<div class="slide">
<img src="IMG/img6.jpeg" alt="Image 3" />
</div>
<div class="slide">
<img src="IMG/img7.jpeg" alt="Image 4" />
</div>
<div class="slide">
<img src="IMG/img8.jpeg" alt="Image 4" />
</div>
</div>
<div class="dots">
</div>
<div class="dots">
<span class="dot" data-slide="0"></span>
<span class="dot" data-slide="1"></span>
<span class="dot" data-slide="2"></span>
Expand All @@ -106,8 +106,8 @@ <h3>#LO MEJOR PARA MI FAMILIA</h3>
<span class="dot" data-slide="5"></span>
<span class="dot" data-slide="6"></span>
<span class="dot" data-slide="7"></span>
</div>
</div>
</div>
<a target="_blank" href="https://api.whatsapp.com/send/?phone=5214495433976&text&type=phone_number&app_absent=0">
<div>
<h5>Contáctanos</h5>
Expand Down Expand Up @@ -163,6 +163,22 @@ <h4>Dejanos tu información, nosotros te contactamos</h4>
</div>
<button type="submit" value="ENVIAR">ENVIAR</button>
</form>
<div id="mainID3" class="slider3">

<div class="slides3">
<div class="slide3">
<img src="IMG/Mayoreo y Menudeo.png" alt="Image 1" />
</div>
<div class="slide3">
<img src="IMG/Mayoreo y Menudeo-2.png" alt="Image 4" />
</div>
</div>
</div>
<div class="dots3">
<span class="dot3" data-slide="9"></span>
<span class="dot3" data-slide="10"></span>
</div>
</div>
</div>
</aside>
<main>
Expand Down Expand Up @@ -583,7 +599,7 @@ <h4>Lucía V.</h4>
</div>
</div>
</div>
<div>
<div class="findCont">
<h3>Contáctanos</h3>
<div>
<p>
Expand Down

0 comments on commit 92c6d18

Please sign in to comment.