Skip to content

Commit

Permalink
actualizaciones a elementos del index
Browse files Browse the repository at this point in the history 
se ve mas bonito
  • Loading branch information
@ValorKand
ValorKand committed Feb 24, 2024
1 parent bf0dea3 commit 5685d8f
Show file tree
Hide file tree
Showing 4 changed files with 87 additions and 29 deletions.
Binary file added home/data/img/fondochc.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
81 changes: 55 additions & 26 deletions home/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -196,7 +196,7 @@ <h2>Tu colegio de confianza</h2>
</div>
</div>
<div class="eight wide column">
<h3 class="ui header">🧐 ¿Porqué estudiar con nosotros?</h3>
<h3 class="ui header">🧐 <span class="aquamarina">¿Porqué estudiar con nosotros?</span></h3>
<p class="justificado">
Somos un Centro Educativo Católico, formamos parte de la
<a href="https://www.escuelassjs.org/">Congregación de Siervas de Jesús Sacramentado.</a>
Expand Down Expand Up @@ -233,41 +233,39 @@ <h1 class="ui header">
</div>
<div class="center aligned row">
<div class="column">
<div class="ui blue segment">
<div id="ofertaPrimaria" class="ui inverted segment">
<div class="ui container">
<div class="pa-carousel-widget" style="width:100%; height:240px; display:none;"
data-link="https://photos.app.goo.gl/4NULmqoandcMQSeu5"
data-title="Primaria"
data-description="2 new items added to shared album"
data-background-color="#ffffff">
data-background-color="#004D40">
<object data="https://lh3.googleusercontent.com/pw/ABLVV85hT53g88uP3bMLH4ng6kZu5YU8s1qffNradF0N9CJhdKUFRDnLxOmqsV4e3hOIX6op8X9YjNK_IoUhocP8scSG9ZEKYah457-lnCOUInCFvTYR2Q=w640-h480"></object>
<object data="https://lh3.googleusercontent.com/pw/ABLVV87rcK9nhtP9-1y2iaME7WRjOZb0J7wQh2OAQG4A6lxEIjJELsE6ykQR6xtmhTyO8QUd8NGSSWFiveLSgtEiKRjQ6TwGSt_sfqdf983pIpjPVV8pjw=w640-h480"></object>
</div>
</div>
<a href="./paginas/secciones/primaria.html" target="_blank">
<a class="primariaLink" href="./paginas/secciones/primaria.html" target="_blank">
<h3>Primaria</h3>
<p>Educación primordial para los niños.</p>
</a>

</div>
</div>
<div class="column">
<div class="ui red segment">
<div id="ofertaSecundaria" class="ui inverted segment">
<div class="ui container">
<div class="pa-carousel-widget" style="width:100%; height:240px; display:none;"
data-link="https://photos.app.goo.gl/y9FY8WvhXMBpNphc7"
data-title="Secundaria"
data-description="2 new items added to shared album"
data-background-color="#ffffff">
data-background-color="#004D40">
<object data="https://lh3.googleusercontent.com/pw/ABLVV87X5f9v5JukDU0wM9fhgDanN4Pc3iVhg7ERiTixDnbJ0JOJSYEumEXUELX4cAyf5GS2elyKfNaO-K43-8WUK5IXl_mdWA8wj9u5KLFNobYD18bVSg=w640-h480"></object>
<object data="https://lh3.googleusercontent.com/pw/ABLVV86EA3Md9d-4RO0qaq70ZWx7AM3xFL867eAmJPIm8geFgyELyqZs3PdNCd4DRF90rq53zg1SR3CM51LCn4Zq9-aI8yL917f1c4RQ3pvqBICf4fxNaw=w640-h480"></object>
</div>
</div>
<a href="./paginas/secciones/secundaria.html" target="_blank">
<a id="secundariaLink" href="./paginas/secciones/secundaria.html" target="_blank">
<h3>Secundaria</h3>
<p>Lo mejor para el desarrollo de los adolescentes.</p>
</a>

</div>
</div>
</div>
Expand Down Expand Up @@ -309,7 +307,7 @@ <h1 class="header centrado">Visión</h1>
<h1 class="ui center aligned header">
<img src="./data/img/escuela.png"></img>
<div class="content">
En nuestras instalaciones contamos con
<p class="sangre">En nuestras instalaciones contamos con</p>
</div>
</h1>
<div class="ui hidden divider"></div>
Expand Down Expand Up @@ -355,9 +353,47 @@ <h1>Plataforma educativa</h1>
</div>
</div>
</div>
<div class="ui center aligned stackable container" id="mapa">
<h1 class="header">🗺️ Ubícanos</h1>
<iframe width="425" height="350" src="https://www.openstreetmap.org/export/embed.html?bbox=-99.16728883981708%2C19.287995519675135%2C-99.16503578424455%2C19.289838555672993&amp;layer=mapnik&amp;marker=19.288917040267616%2C-99.16616231203079" style="border: 1px solid black"></iframe><br/><small><a href="https://www.openstreetmap.org/?mlat=19.28892&amp;mlon=-99.16616#map=19/19.28892/-99.16616&amp;layers=N">Ver el mapa más grande</a></small>
<div class="ui center aligned teal inverted stackable segment">
<div class="ui grid container">
<div class="two column row">
<div class="column">
<h1 class="header">🗺️ Ubícanos</h1>
<h2 class="subtitle">Hidalgo No. 2, Alcaldía Tlalpan</h2>
<h2 class="subtitle">CDMX, C.P. 14000</h2>
<iframe width="425" height="350" src="https://www.openstreetmap.org/export/embed.html?bbox=-99.16728883981708%2C19.287995519675135%2C-99.16503578424455%2C19.289838555672993&amp;layer=mapnik&amp;marker=19.288917040267616%2C-99.16616231203079" style="border: 1px solid black"></iframe><br/><small><a href="https://www.openstreetmap.org/?mlat=19.28892&amp;mlon=-99.16616#map=19/19.28892/-99.16616&amp;layers=N">Ver el mapa más grande</a></small>
</div>
<div class="column">
<h1 class="header">📲 Y tambien en…</h1>
<div class="ui hidden divider"></div>
<div class="ui hidden divider"></div>
<div class="ui container">
<div class="ui grid">
<div class="two column row">
<div class="column">
<a class="ui massive circular facebook button" href="#"><i class="ui facebook icon"></i>Facebook</a>
</div>
<div class="column">
<a class="ui massive circular pink button" href="#"><i class="ui instagram icon"></i>Instagram</a>
</div>
</div>
<div class="row">
<div class="column">
<a class="ui massive circular red button" href="#"><i class="ui youtube icon"></i>YouTube</a>
</div>
</div>
<div class="row">
<div class="column">
<h1 class="arcoiris header">
¡Síguenos en todas nuestras redes sociales y
entérate de todo!
</h1>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Píe de página -->
<div id="pie" class="ui inverted vertical footer segment">
Expand All @@ -372,20 +408,12 @@ <h4 class="ui inverted header">Acerca de</h4>
</div>
</div>
<div class="three wide column">
<h4 class="ui inverted header">Encuentra a tu colegio favorito también en</h4>
<h4 class="ui inverted header">Más información acerca de su desarrollo <a href="#">aquí</a></h4>
<div class="ui inverted link list">
<a class="ui facebook button"><i href="#" class="facebook icon"></i>Facebook</a>
<a class="ui pink button"><i href="#" class="instagram icon"></i>Instagram</a>
<a class="ui button"><i href="#" class="envelope icon"></i>Email</a>
</div>
</div>
<div class="three wide column">
<h4 class="ui inverted header">Group 3</h4>
<div class="ui inverted link list">
<a href="#" class="item">Link One</a>
<a href="#" class="item">Link Two</a>
<a href="#" class="item">Link Three</a>
<a href="#" class="item">Link Four</a>
<!-- <a href="#" class="item">Link One</a> -->
<!-- <a href="#" class="item">Link Two</a> -->
<!-- <a href="#" class="item">Link Three</a> -->
<!-- <a href="#" class="item">Link Four</a> -->
</div>
</div>
<div class="seven wide column">
Expand All @@ -412,3 +440,4 @@ <h4 class="ui inverted header">Colegio Hernán Cortés – Sitio Web</h4>
<script src="./src/js/mapa.js"></script>
</body>
</html>

13 changes: 13 additions & 0 deletions home/src/css/body.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,19 @@
padding: 5em 0em;
}

#ofertaEducativa {
background-image: url("../.././data/img/fondochc.jpg");
background-size: cover;
}

#ofertaPrimaria, #ofertaSecundaria {
background-color: #004D40;
}

#primariaLink, #secundariaLink {
color: #ffffff;
}

#encabezado {
background-color: rgba(19,79,92,1);
}
Expand Down
22 changes: 19 additions & 3 deletions home/src/css/componentes.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,17 +23,33 @@
}

.dorado{
font-size:128px;
color:transparent;
background: linear-gradient(270deg,#f7ef8a,#d2ac47,#edc967,#dfbd69,#926f34,#f9f295);
background: linear-gradient(270deg,#f7ef8a,#d2ac47,#edc967,#dfbd69,#4c0805,#f9f295);
animation:gradiente 64s linear infinite;
background-size: 60% 100%;
-webkit-background-clip:text;
text-align: center;
}

.aquamarina{
color:transparent;
background: linear-gradient(270deg,#061829,#10374a,#165668,#104046,#034948,#005d5c);
animation:gradiente 64s linear infinite;
background-size: 60% 100%;
-webkit-background-clip:text;
text-align: center;
}

.sangre{
color:transparent;
background: linear-gradient(270deg,#d91a1a,#b41c1c,#6b1f20,#402022,#212224,#990f02);
animation:gradiente 64s linear infinite;
background-size: 60% 100%;
-webkit-background-clip:text;
text-align: center;
}

.arcoiris{
font-size:128px;
color:transparent;
background: linear-gradient(270deg,#1e5799,#2ce0bf,#76dd2c,#dba62b,#ff1493,#1e5799);
animation:gradiente 64s linear infinite;
Expand Down

0 comments on commit 5685d8f

Please sign in to comment.