tatiana
/
recursos-catolicos
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

poniendo el index mas mono

This commit is contained in:
Tatiana Villa Ema 2026-01-19 19:06:19 +01:00
parent 47f8c43158
commit 3623467779
10 changed files with 77 additions and 229 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

70
css/estilos.css
View File

@ -149,17 +149,75 @@ body {
max-width: 600px; /* Para que no se estire demasiado en PC */ max-width: 600px; /* Para que no se estire demasiado en PC */
border-radius: 15px; border-radius: 15px;
box-shadow: 0 4px 15px var(--sombra); box-shadow: 0 4px 15px var(--sombra);
border: none; /* Quitamos el borde oscuro para que sea más elegante */ border: 2px solid var(--color-acento); /* Quitamos el borde oscuro para que sea más elegante */
text-align: center; text-align: center;
} }
.bloque h3 { /* --- AJUSTES PARA BLOQUES CON IMAGEN 4:5 --- */
font-family: 'EB Garamond', serif;
color: var(--color-primario); .bloque-fondo {
font-size: 1.8rem; /* Quitamos el padding del contenedor para que la capa oscura llegue a los bordes */
margin-top: 0; padding: 0 !important;
background-size: cover;
background-position: center top;
background-repeat: no-repeat;
position: relative;
color: var(--blanco-puro);
border-radius: 15px;
overflow: hidden;
/* Proporción 4:5 - Ajustamos altura mínima para lucir la imagen */
min-height: 450px;
display: flex;
flex-direction: column;
justify-content: flex-end; /* Texto abajo para no tapar caras/arte arriba */
max-width: 600px;
margin: 2rem auto;
border: 2px solid var(--color-acento);
} }
.capa-oscura {
/* Graduado: de negro muy sólido abajo a transparente arriba */
background: linear-gradient(to top,
rgba(0,0,0,0.9) 0%,
rgba(0,0,0,0.4) 50%,
transparent 100%);
padding: 2.5rem 1.5rem 1.5rem 1.5rem;
width: 100%;
box-sizing: border-box;
}
.bloque-fondo h3 {
font-family: 'EB Garamond', serif;
/* Reducido de 5rem a 2.5rem para que sea elegante y no tape la imagen */
font-size: 2.5rem !important;
font-weight: 600;
margin: 0 0 0.5rem 0;
color: var(--blanco-puro);
text-shadow: 2px 2px 8px rgba(0,0,0,0.8);
}
.bloque-fondo p {
font-family: 'Nunito', sans-serif;
font-size: 1.1rem;
margin-bottom: 1.5rem;
text-shadow: 1px 1px 4px rgba(0,0,0,0.8);
}
/* Ajuste del botón sobre fondo de imagen */
.bloque-fondo .boton {
background-color: var(--color-acento); /* Dorado para que resalte más */
color: var(--color-primario);
border: none;
}
.bloque-fondo .boton:hover {
background-color: var(--blanco-puro);
color: var(--color-primario);
}
/* --- SALMO DEL DÍA --- */
.salmo { .salmo {
font-family: 'EB Garamond', serif; font-family: 'EB Garamond', serif;
font-size: 1.6rem; font-size: 1.6rem;

6
img/ic_flecha_abajo.xml
View File

@ -1,6 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="24dp" android:tint="#000000"
android:viewportHeight="24" android:viewportWidth="24"
android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="@android:color/white" android:pathData="M7.41,8.59L12,13.17l4.59,-4.58L18,10l-6,6 -6,-6 1.41,-1.41z"/>
</vector>

6
img/ic_flecha_arriba.xml
View File

@ -1,6 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<vector android:height="24dp" android:tint="#000000"
android:viewportHeight="24" android:viewportWidth="24"
android:width="24dp" xmlns:android="http://schemas.android.com/apk/res/android">
<path android:fillColor="@android:color/white" android:pathData="M7.41,15.41L12,10.83l4.59,4.58L18,14l-6,-6 -6,6z"/>
</vector>

170
img/ic_launcher_background.xml
View File

@ -1,170 +0,0 @@
<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
android:width="108dp"
android:height="108dp"
android:viewportWidth="108"
android:viewportHeight="108">
<path
android:fillColor="#3DDC84"
android:pathData="M0,0h108v108h-108z" />
<path
android:fillColor="#00000000"
android:pathData="M9,0L9,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,0L19,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M29,0L29,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M39,0L39,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M49,0L49,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M59,0L59,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M69,0L69,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M79,0L79,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M89,0L89,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M99,0L99,108"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,9L108,9"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,19L108,19"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,29L108,29"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,39L108,39"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,49L108,49"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,59L108,59"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,69L108,69"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,79L108,79"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,89L108,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M0,99L108,99"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,29L89,29"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,39L89,39"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,49L89,49"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,59L89,59"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,69L89,69"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M19,79L89,79"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M29,19L29,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M39,19L39,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M49,19L49,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M59,19L59,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M69,19L69,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
<path
android:fillColor="#00000000"
android:pathData="M79,19L79,89"
android:strokeWidth="0.8"
android:strokeColor="#33FFFFFF" />
</vector>

30
img/ic_launcher_foreground.xml
View File

@ -1,30 +0,0 @@
<vector xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:aapt="http://schemas.android.com/aapt"
android:width="108dp"
android:height="108dp"
android:viewportWidth="108"
android:viewportHeight="108">
<path android:pathData="M31,63.928c0,0 6.4,-11 12.1,-13.1c7.2,-2.6 26,-1.4 26,-1.4l38.1,38.1L107,108.928l-32,-1L31,63.928z">
<aapt:attr name="android:fillColor">
<gradient
android:endX="85.84757"
android:endY="92.4963"
android:startX="42.9492"
android:startY="49.59793"
android:type="linear">
<item
android:color="#44000000"
android:offset="0.0" />
<item
android:color="#00000000"
android:offset="1.0" />
</gradient>
</aapt:attr>
</path>
<path
android:fillColor="#FFFFFF"
android:fillType="nonZero"
android:pathData="M65.3,45.828l3.8,-6.6c0.2,-0.4 0.1,-0.9 -0.3,-1.1c-0.4,-0.2 -0.9,-0.1 -1.1,0.3l-3.9,6.7c-6.3,-2.8 -13.4,-2.8 -19.7,0l-3.9,-6.7c-0.2,-0.4 -0.7,-0.5 -1.1,-0.3C38.8,38.328 38.7,38.828 38.9,39.228l3.8,6.6C36.2,49.428 31.7,56.028 31,63.928h46C76.3,56.028 71.8,49.428 65.3,45.828zM43.4,57.328c-0.8,0 -1.5,-0.5 -1.8,-1.2c-0.3,-0.7 -0.1,-1.5 0.4,-2.1c0.5,-0.5 1.4,-0.7 2.1,-0.4c0.7,0.3 1.2,1 1.2,1.8C45.3,56.528 44.5,57.328 43.4,57.328L43.4,57.328zM64.6,57.328c-0.8,0 -1.5,-0.5 -1.8,-1.2s-0.1,-1.5 0.4,-2.1c0.5,-0.5 1.4,-0.7 2.1,-0.4c0.7,0.3 1.2,1 1.2,1.8C66.5,56.528 65.6,57.328 64.6,57.328L64.6,57.328z"
android:strokeWidth="1"
android:strokeColor="#00000000" />
</vector>

BIN
img/oraciones.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 78 KiB

BIN
img/rosario.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 279 KiB

BIN
img/rosario_general.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 4.6 MiB

18
index.html
View File

@ -75,18 +75,20 @@
<a href="diario-oracion.html" class="boton">Escribir en mi diario</a> <a href="diario-oracion.html" class="boton">Escribir en mi diario</a>
</section>--> </section>-->
<!-- ROSARIO --> <section class="bloque bloque-fondo" style="background-image: url('img/rosario.jpg');">
<section class="bloque"> <div class="capa-oscura">
<h3>Rosario</h3> <h3>Rosario</h3>
<p id="nombre_misterio">Hoy rezamos los Misterios X</p> <p id="nombre_misterio">Misterios Gozosos</p>
<a href="rosario.html" class="boton">Rezar el Rosario</a> <a href="rosario.html" class="boton">Rezar ahora</a>
</div>
</section> </section>
<!-- ORACIONES BÁSICAS --> <section class="bloque bloque-fondo" style="background-image: url('img/oraciones.jpg');">
<section class="bloque"> <div class="capa-oscura">
<h3>Oraciones Básicas</h3> <h3>Oraciones</h3>
<p>Padre Nuestro, Ave María, Gloria</p> <p>Padre Nuestro, Ave María, Gloria</p>
<a href="oraciones-basicas.html" class="boton">Rezar las Oraciones Básicas</a> <a href="oraciones-basicas.html" class="boton">Ver Oraciones</a>
</div>
</section> </section>

2
js/codigo.js
View File

@ -224,7 +224,7 @@ function visualizarRosario() {
const misterioHoy = MISTERIOS_DATA[diaSemana]; const misterioHoy = MISTERIOS_DATA[diaSemana];
const nombreMistElem = document.getElementById('nombre_misterio'); const nombreMistElem = document.getElementById('nombre_misterio');
if (nombreMistElem) { if (nombreMistElem) {
nombreMistElem.textContent = `Hoy rezamos los misterios ${misterioHoy.nombre.toUpperCase()}`; nombreMistElem.textContent = `MISTERIOS ${misterioHoy.nombre.toUpperCase()}`;
} }
} }