Skip to content

Commit 2fd43e6

Browse files
GastoncorvataGastoncorvata
committed
videos en productos
1 parent 4b920a8 commit 2fd43e6

11 files changed

+197
-10
lines changed

‎css/styles.css

+2-2
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎img/video1.png

191 KB
Loading

‎img/video2.png

190 KB
Loading

‎img/video3.png

173 KB
Loading

‎img/video4.png

214 KB
Loading

‎img/video5.png

210 KB
Loading

‎img/video6.png

264 KB
Loading

‎index.html

+1
Original file line numberDiff line numberDiff line change
@@ -63,6 +63,7 @@ <h2 class="animate__animated animate__bounceIn animate__delay-2s"><span>Mecaniza
6363
<h3>Metal Stretch</h3>
6464
<address>
6565
<ul>
66+
<li><li><i class="fas fa-drafting-compass"></i></li></li>
6667
<li><a href="https://goo.gl/maps/tVqaZk6xgYSntmHb6" target="_blank">Dora Catalinas Fleitas 790, Luis Guillon</a></li>
6768
<li><a href="tel:+5401143679078" target="_blank">TELEFONO +54 (011) 4367-9078</a></li>
6869
<li><a href="https://wa.me/54901168500414" target="_blank">WhatsApp +54 (011) 6850-0414</a></li>

‎productos.html

+147-1
Original file line numberDiff line numberDiff line change
@@ -91,7 +91,153 @@ <h2>Catalogo completo</h2>
9191
</a>
9292
</div>
9393
</div>
94-
</div>
94+
</div>
95+
<div class="container my-4">
96+
<hr>
97+
<div class="row">
98+
<div class="col-lg-4 col-md-12 mb-4">
99+
<div class="modal fade" id="modal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
100+
<div class="modal-dialog modal-lg" role="document">
101+
<div class="modal-content">
102+
<div class="modal-body mb-0 p-0">
103+
<div class="embed-responsive embed-responsive-16by9 z-depth-1-half">
104+
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/yiUUZxp7bLQ?start=20" allowfullscreen></iframe>
105+
</div>
106+
</div>
107+
<div class="modal-footer justify-content-center icono-video">
108+
<span class="mr-4">Contactanos por cualquier duda</span>
109+
<a href="https://twitter.com/hashtag/mecanizados" target="_blank" class="icono-footer"><i class="fab fa-twitter-square"></i></i></a>
110+
<a href="https://www.facebook.com/ingmecanizado/about/?ref=page_internal" target="_blank" class="icono-footer"><i class="fab fa-facebook-square"></i></a>
111+
<a href="https://www.instagram.com/explore/tags/mecanizado/?hl=es" target="_blank" class="icono-footer"><i class="fab fa-instagram-square"></i></a>
112+
<a href="skype:live:corvata_4?call" target="_blank" class="icono-footer"><i class="fab fa-skype"></i></>
113+
<a href="https://www.linkedin.com/company/mecanizados-s-a-/about/" target="_blank" class="icono-footer"><i class="fab fa-linkedin"></i></a>
114+
<button type="button" class="btn btn-outline-warning btn-rounded btn-md ml-4" data-dismiss="modal">Cerrar</button>
115+
</div>
116+
</div>
117+
</div>
118+
</div>
119+
<a><img class="img-fluid z-depth-1 foto-video" src="img/video1.png" alt="video" data-toggle="modal" data-target="#modal1"></a>
120+
</div>
121+
<div class="col-lg-4 col-md-6 mb-4">
122+
<div class="modal fade" id="modal6" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
123+
<div class="modal-dialog modal-lg" role="document">
124+
<div class="modal-content">
125+
<div class="modal-body mb-0 p-0">
126+
<div class="embed-responsive embed-responsive-16by9 z-depth-1-half">
127+
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/NZc-gqSIL4w?start=509" allowfullscreen></iframe>
128+
</div>
129+
</div>
130+
<div class="modal-footer justify-content-center icono-video">
131+
<span class="mr-4">Contactanos por cualquier duda</span>
132+
<a href="https://twitter.com/hashtag/mecanizados" target="_blank" class="icono-footer"><i class="fab fa-twitter-square"></i></i></a>
133+
<a href="https://www.facebook.com/ingmecanizado/about/?ref=page_internal" target="_blank" class="icono-footer"><i class="fab fa-facebook-square"></i></a>
134+
<a href="https://www.instagram.com/explore/tags/mecanizado/?hl=es" target="_blank" class="icono-footer"><i class="fab fa-instagram-square"></i></a>
135+
<a href="skype:live:corvata_4?call" target="_blank" class="icono-footer"><i class="fab fa-skype"></i></>
136+
<a href="https://www.linkedin.com/company/mecanizados-s-a-/about/" target="_blank" class="icono-footer"><i class="fab fa-linkedin"></i></a>
137+
<button type="button" class="btn btn-outline-warning btn-rounded btn-md ml-4" data-dismiss="modal">Close</button>
138+
</div>
139+
</div>
140+
</div>
141+
</div>
142+
<a><img class="img-fluid z-depth-1 foto-video" src="./img/video2.png" alt="video"data-toggle="modal" data-target="#modal6"></a>
143+
</div>
144+
<div class="col-lg-4 col-md-6 mb-4">
145+
<div class="modal fade" id="modal4" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
146+
<div class="modal-dialog modal-lg" role="document">
147+
<div class="modal-content">
148+
<div class="modal-body mb-0 p-0">
149+
<div class="embed-responsive embed-responsive-16by9 z-depth-1-half">
150+
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/DqoX3TkRmKY?start=5" allowfullscreen></iframe>
151+
</div>
152+
</div>
153+
<div class="modal-footer justify-content-center icono-video">
154+
<span class="mr-4">Contactanos por cualquier duda</span>
155+
<a href="https://twitter.com/hashtag/mecanizados" target="_blank" class="icono-footer"><i class="fab fa-twitter-square"></i></i></a>
156+
<a href="https://www.facebook.com/ingmecanizado/about/?ref=page_internal" target="_blank" class="icono-footer"><i class="fab fa-facebook-square"></i></a>
157+
<a href="https://www.instagram.com/explore/tags/mecanizado/?hl=es" target="_blank" class="icono-footer"><i class="fab fa-instagram-square"></i></a>
158+
<a href="skype:live:corvata_4?call" target="_blank" class="icono-footer"><i class="fab fa-skype"></i></>
159+
<a href="https://www.linkedin.com/company/mecanizados-s-a-/about/" target="_blank" class="icono-footer"><i class="fab fa-linkedin"></i></a>
160+
<button type="button" class="btn btn-outline-warning btn-rounded btn-md ml-4" data-dismiss="modal">Close</button>
161+
</div>
162+
</div>
163+
164+
</div>
165+
</div>
166+
<a><img class="img-fluid z-depth-1 foto-video" src="./img/video3.png" alt="video"data-toggle="modal" data-target="#modal4"></a>
167+
</div>
168+
</div>
169+
<div class="row">
170+
<div class="col-lg-4 col-md-12 mb-4">
171+
<div class="modal fade" id="modal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
172+
<div class="modal-dialog modal-lg" role="document">
173+
<div class="modal-content">
174+
<div class="modal-body mb-0 p-0">
175+
<div class="embed-responsive embed-responsive-16by9 z-depth-1-half">
176+
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/DKkcBoSeUOg?start=85" allowfullscreen></iframe>
177+
</div>
178+
</div>
179+
<div class="modal-footer justify-content-center icono-video">
180+
<span class="mr-4">Contactanos por cualquier duda</span>
181+
<a href="https://twitter.com/hashtag/mecanizados" target="_blank" class="icono-footer"><i class="fab fa-twitter-square"></i></i></a>
182+
<a href="https://www.facebook.com/ingmecanizado/about/?ref=page_internal" target="_blank" class="icono-footer"><i class="fab fa-facebook-square"></i></a>
183+
<a href="https://www.instagram.com/explore/tags/mecanizado/?hl=es" target="_blank" class="icono-footer"><i class="fab fa-instagram-square"></i></a>
184+
<a href="skype:live:corvata_4?call" target="_blank" class="icono-footer"><i class="fab fa-skype"></i></>
185+
<a href="https://www.linkedin.com/company/mecanizados-s-a-/about/" target="_blank" class="icono-footer"><i class="fab fa-linkedin"></i></a>
186+
<button type="button" class="btn btn-outline-warning btn-rounded btn-md ml-4" data-dismiss="modal">Close</button>
187+
</div>
188+
</div>
189+
</div>
190+
</div>
191+
<a><img class="img-fluid z-depth-1 foto-video" src="./img/video4.png" alt="video" data-toggle="modal" data-target="#modal2"></a>
192+
</div>
193+
<div class="col-lg-4 col-md-6 mb-4">
194+
<div class="modal fade" id="modal5" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
195+
<div class="modal-dialog modal-lg" role="document">
196+
<div class="modal-content">
197+
<div class="modal-body mb-0 p-0">
198+
<div class="embed-responsive embed-responsive-16by9 z-depth-1-half">
199+
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/WcOkOWO2wb0?start=133" allowfullscreen></iframe>
200+
</div>
201+
</div>
202+
<div class="modal-footer justify-content-center icono-video">
203+
<span class="mr-4">Contactanos por cualquier duda</span>
204+
<a href="https://twitter.com/hashtag/mecanizados" target="_blank" class="icono-footer"><i class="fab fa-twitter-square"></i></i></a>
205+
<a href="https://www.facebook.com/ingmecanizado/about/?ref=page_internal" target="_blank" class="icono-footer"><i class="fab fa-facebook-square"></i></a>
206+
<a href="https://www.instagram.com/explore/tags/mecanizado/?hl=es" target="_blank" class="icono-footer"><i class="fab fa-instagram-square"></i></a>
207+
<a href="skype:live:corvata_4?call" target="_blank" class="icono-footer"><i class="fab fa-skype"></i></>
208+
<a href="https://www.linkedin.com/company/mecanizados-s-a-/about/" target="_blank" class="icono-footer"><i class="fab fa-linkedin"></i></a>
209+
<button type="button" class="btn btn-outline-warning btn-rounded btn-md ml-4" data-dismiss="modal">Close</button>
210+
</div>
211+
</div>
212+
</div>
213+
</div>
214+
<a><img class="img-fluid z-depth-1 foto-video" src="./img/video5.png" alt="video" data-toggle="modal" data-target="#modal5"></a>
215+
</div>
216+
<div class="col-lg-4 col-md-6 mb-4">
217+
<div class="modal fade" id="modal3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
218+
<div class="modal-dialog modal-lg" role="document">
219+
<div class="modal-content">
220+
<div class="modal-body mb-0 p-0">
221+
<div class="embed-responsive embed-responsive-16by9 z-depth-1-half">
222+
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/p--n6CrFync?start=46" allowfullscreen></iframe>
223+
</div>
224+
</div>
225+
<div class="modal-footer d-block d-md-flex justify-content-center icono-video">
226+
<span class="mr-4">Contactanos por cualquier duda</span>
227+
<a href="https://twitter.com/hashtag/mecanizados" target="_blank" class="icono-footer"><i class="fab fa-twitter-square"></i></i></a>
228+
<a href="https://www.facebook.com/ingmecanizado/about/?ref=page_internal" target="_blank" class="icono-footer"><i class="fab fa-facebook-square"></i></a>
229+
<a href="https://www.instagram.com/explore/tags/mecanizado/?hl=es" target="_blank" class="icono-footer"><i class="fab fa-instagram-square"></i></a>
230+
<a href="skype:live:corvata_4?call" target="_blank" class="icono-footer"><i class="fab fa-skype"></i></>
231+
<a href="https://www.linkedin.com/company/mecanizados-s-a-/about/" target="_blank" class="icono-footer"><i class="fab fa-linkedin"></i></a>
232+
<button type="button" class="btn btn-outline-warning btn-rounded btn-md ml-4" data-dismiss="modal">Close</button>
233+
</div>
234+
</div>
235+
</div>
236+
</div>
237+
<a><img class="img-fluid z-depth-1 foto-video" src="./img/video6.png" alt="video" data-toggle="modal" data-target="#modal3"></a>
238+
</div>
239+
</div>
240+
</div>
95241
<footer id="footer">
96242
<div class="footer-top">
97243
<div class="container">

‎scss/_body.scss

+45-6
Original file line numberDiff line numberDiff line change
@@ -253,6 +253,7 @@
253253
}
254254
}
255255
}
256+
/*404*/
256257
.sinbg{
257258
background-image: linear-gradient(to right, $grey-text, $gris-clarito, $primario);
258259
.error404{
@@ -261,8 +262,8 @@
261262
background-position: center;
262263
background-repeat: no-repeat;
263264
background-size: cover;
264-
height: 100vh;
265-
width: auto;
265+
height: auto;
266+
width: 100%;
266267
padding-top: 150px;
267268
padding-left: 200px;
268269
h1{
@@ -275,14 +276,52 @@
275276
background-color: rgba(104, 102, 102, 0.7);
276277
}
277278
a{
278-
color: $primario;
279+
color: $secundario;
279280
opacity: .5;
280281
font-size: 40px;
281282
font-family: 'Black Ops One' ;
282283
align-items: stretch;
283284
background-color: rgba(104, 102, 102, 0.7);
284-
margin-right: 50vh;
285-
margin-top: 50vh;
285+
margin-right: 50%;
286+
margin-top: 50%;
287+
}
288+
}
289+
}
290+
@media (max-width:576px){
291+
.error404{
292+
width: 400px;
293+
padding: 0px;
294+
h1{
295+
padding: 0;
296+
text-align: start;
297+
font-size: 20px;
298+
}
299+
a{
300+
padding: 0;
301+
text-align: start;
302+
font-size: 20px;
303+
margin: 0px;
286304
}
287305
}
288-
}
306+
}
307+
.icono-video{
308+
background-color: $primario;
309+
a{
310+
i{
311+
color: $gris-clarito;
312+
font-size: 25px;
313+
}
314+
i:hover{
315+
color:$secundario;
316+
}
317+
}
318+
}
319+
.foto-video:hover{
320+
border: 1px solid $secundario;
321+
box-shadow: 0 0px 25px $primario;
322+
cursor:zoom-in;
323+
}
324+
.foto-video{
325+
border-radius: 10px;
326+
}
327+

‎scss/_footer.scss

+2-1
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
}
77
#footer {
88
@include footer-option(rgba(0, 0, 0, .7), #ffffff, bold);
9+
text-align: center;
910
a:hover {
1011
color: $secundario;
1112
}
@@ -20,8 +21,8 @@
2021
}
2122

2223
.social-links {
23-
width: max-content;
2424
i {
25+
text-align: center;
2526
margin: 10px;
2627
}
2728
}

0 commit comments

Comments
 (0)