Planificacion y flashcard
This commit is contained in:
Tatiana Villa
parent
af0ba46af0
commit
29f818bf56
|
|
@ -77,7 +77,7 @@ public class SecurityConfig {
|
|||
// Panel de administración
|
||||
.requestMatchers("/admin/**").hasRole("ADMIN")
|
||||
// Contenido de pago
|
||||
.requestMatchers("/curso", "/curso/**", "/planning", "/flashcards/**", "/api/**").hasAnyRole("PAGADO", "ADMIN")
|
||||
.requestMatchers("/curso", "/curso/**", "/planning", "/flashcards.html", "/flashcards/**", "/api/**").hasAnyRole("PAGADO", "ADMIN")
|
||||
// Cualquier otra ruta requiere autenticación
|
||||
.anyRequest().authenticated()
|
||||
)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,66 @@
|
|||
/* ── Paleta (misma que style.css) ── */
|
||||
:root {
|
||||
--bg: #1e1e1e;
|
||||
--bg-alt: #252526;
|
||||
--bg-hover: #2a2d2e;
|
||||
--border: #3c3c3c;
|
||||
--text: #d4d4d4;
|
||||
--text-muted:#858585;
|
||||
--accent: #007acc;
|
||||
--accent-2: #4ec9b0;
|
||||
--warning: #d7ba7d;
|
||||
--error: #f44747;
|
||||
}
|
||||
|
||||
/* ── General ── */
|
||||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif; font-size: 11pt; color: var(--text); background: var(--bg); padding: 1.5rem; }
|
||||
h1 { font-size: 18pt; text-align: center; margin-bottom: 0.2em; color: var(--accent-2); }
|
||||
h2 { font-size: 13pt; margin: 1.2em 0 0.4em; border-bottom: 2px solid var(--border); padding-bottom: 0.2em; color: var(--accent-2); }
|
||||
h3 { font-size: 11pt; margin: 0.9em 0 0.3em; color: var(--text-muted); }
|
||||
p, li { margin: 0.3em 0; line-height: 1.5; }
|
||||
ul { padding-left: 1.4em; }
|
||||
a { color: var(--accent); }
|
||||
blockquote { border-left: 3px solid var(--border); padding-left: 0.8em; color: var(--text-muted); margin: 0.5em 0; font-style: italic; }
|
||||
|
||||
/* ── Tablas ── */
|
||||
table { width: 100%; border-collapse: collapse; margin: 0.5em 0; font-size: 10pt; }
|
||||
th { background: #2c3e50; color: var(--accent-2); padding: 5px 8px; text-align: left; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
td { padding: 4px 8px; vertical-align: top; border-bottom: 1px solid var(--border); }
|
||||
tr:nth-child(even) td { background: var(--bg-alt); }
|
||||
|
||||
/* ── Secciones / tarjetas ── */
|
||||
.card { border: 1px solid var(--border); border-radius: 6px; background: var(--bg-alt); padding: 0.8em 1em; margin-bottom: 1.2em; }
|
||||
.card-title { font-size: 14pt; font-weight: bold; margin-bottom: 0.5em; color: var(--text); }
|
||||
.tag { display: inline-block; font-size: 8pt; background: var(--accent); color: #fff; border-radius: 3px; padding: 1px 6px; margin-bottom: 0.6em; vertical-align: middle; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.warn { background: #2a2005; border-left: 4px solid var(--warning); padding: 0.4em 0.8em; margin: 0.6em 0; font-size: 10pt; color: var(--warning); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.p-alta td { background: #2a1010 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.p-alta td:first-child { font-weight: bold; color: var(--error); }
|
||||
.p-media td { background: #2a2005 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.p-media td:first-child { font-weight: bold; color: var(--warning); }
|
||||
.mnemonic { background: #0d2137; border-left: 4px solid var(--accent); padding: 0.4em 0.8em; margin: 0.6em 0; font-size: 10pt; color: var(--text); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
hr.divider { border: none; border-top: 1px dashed var(--border); margin: 0.8em 0; }
|
||||
|
||||
/* ── Cabecera del documento ── */
|
||||
.doc-header { text-align: center; margin-bottom: 1.5em; padding-bottom: 0.8em; border-bottom: 3px double var(--border); }
|
||||
.doc-header p { font-size: 10pt; color: var(--text-muted); margin-top: 0.3em; }
|
||||
|
||||
/* ── Print ── */
|
||||
@media print {
|
||||
body { background: #fff; color: #111; padding: 0.8cm 1cm; font-size: 10pt; }
|
||||
h1, h2 { color: #111; }
|
||||
h3 { color: #444; }
|
||||
.card { background: #fff; border-color: #ccc; break-inside: avoid; page-break-inside: avoid; }
|
||||
.page-break { page-break-before: always; }
|
||||
a { color: inherit; text-decoration: none; }
|
||||
th { background: #5d6d7e; color: #fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.tag { background: #5d6d7e; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
td { border-bottom-color: #ddd; }
|
||||
tr:nth-child(even) td { background: #f5f5f5; }
|
||||
.p-alta td { background: #fde8e8 !important; }
|
||||
.p-alta td:first-child { color: #a00; }
|
||||
.p-media td { background: #fef6e4 !important; }
|
||||
.p-media td:first-child { color: #8a6000; }
|
||||
.warn { background: #fff3cd; border-color: #f0ad4e; color: #6a4800; }
|
||||
.mnemonic { background: #e8f4fd; border-color: #3498db; color: #111; }
|
||||
}
|
||||
|
|
@ -1,38 +1,87 @@
|
|||
/* ── Variables (misma paleta que style.css) ── */
|
||||
:root {
|
||||
--bg: #1e1e1e;
|
||||
--bg-alt: #252526;
|
||||
--bg-hover: #2a2d2e;
|
||||
--border: #3c3c3c;
|
||||
--text: #d4d4d4;
|
||||
--text-muted:#858585;
|
||||
--accent: #007acc;
|
||||
--accent-2: #4ec9b0;
|
||||
--warning: #d7ba7d;
|
||||
--error: #f44747;
|
||||
--topbar-h: 52px;
|
||||
}
|
||||
|
||||
* { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { font-family: Arial, Helvetica, sans-serif; font-size: 11pt; color: #111; background: #fff; padding: 1cm 1.5cm; }
|
||||
h1 { font-size: 18pt; text-align: center; margin-bottom: 0.2em; }
|
||||
.subtitle { text-align: center; font-size: 10pt; color: #666; margin-bottom: 1em; }
|
||||
.semana { margin-bottom: 1.5em; page-break-after: always; break-after: page; }
|
||||
.semana:last-of-type { page-break-after: auto; break-after: auto; }
|
||||
body {
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
font-size: 11pt;
|
||||
color: var(--text);
|
||||
background: var(--bg);
|
||||
padding: calc(var(--topbar-h) + 1.5rem) 1.5rem 2rem;
|
||||
}
|
||||
h1 { font-size: 18pt; text-align: center; margin-bottom: 0.2em; color: var(--accent-2); }
|
||||
.subtitle { text-align: center; font-size: 10pt; color: var(--text-muted); margin-bottom: 1.5em; }
|
||||
|
||||
.semana { margin-bottom: 1.5em; }
|
||||
.cabecera-dias { display: flex; gap: 4px; margin-bottom: 4px; }
|
||||
.cabecera-dias span {
|
||||
flex: 1; text-align: center; font-size: 9pt; font-weight: bold;
|
||||
color: #fff; background: #5d6d7e; padding: 4px 2px; border-radius: 3px;
|
||||
color: var(--text); background: var(--bg-alt);
|
||||
padding: 4px 2px; border-radius: 3px;
|
||||
border: 1px solid var(--border);
|
||||
-webkit-print-color-adjust: exact; print-color-adjust: exact;
|
||||
}
|
||||
.dias { display: flex; gap: 4px; }
|
||||
.dia {
|
||||
flex: 1; border: 1px solid #ccc; border-radius: 4px;
|
||||
padding: 6px 7px; min-height: 160px;
|
||||
flex: 1;
|
||||
border: 1px solid var(--border);
|
||||
border-radius: 4px;
|
||||
background: var(--bg-alt);
|
||||
padding: 6px 7px;
|
||||
min-height: 160px;
|
||||
page-break-inside: avoid; break-inside: avoid;
|
||||
}
|
||||
.dia .num { font-size: 15pt; font-weight: bold; color: #333; display: block; margin-bottom: 5px; line-height: 1; }
|
||||
.dia .contenido { font-size: 8pt; color: #444; line-height: 1.45; }
|
||||
.dia .num {
|
||||
font-size: 15pt; font-weight: bold;
|
||||
color: var(--text-muted);
|
||||
display: block; margin-bottom: 5px; line-height: 1;
|
||||
}
|
||||
.dia .contenido { font-size: 8pt; color: var(--text); line-height: 1.45; }
|
||||
|
||||
.tema-btn {
|
||||
display: block; width: 100%; text-align: left;
|
||||
padding: 2px 0; font-size: 7.5pt; color: #1a5276;
|
||||
padding: 2px 0; font-size: 7.5pt;
|
||||
color: var(--accent);
|
||||
line-height: 1.35; font-family: inherit;
|
||||
text-decoration: underline dotted #1a5276;
|
||||
text-decoration: none;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.tema-btn:hover { color: #c0392b; background: #f0f8ff; border-radius: 2px; }
|
||||
@media print { .tema-btn { color: #111; text-decoration: none; } }
|
||||
.vacio { background: #f9f9f9; border-color: #eee; }
|
||||
.fin-semana { background: #fafafa; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.simulacro { background: #fff8e1; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.simulacro .num { color: #8a6000; }
|
||||
.examen { background: #fde8e8; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.examen .num { font-size: 20pt; color: #a00; }
|
||||
.examen .contenido { font-weight: bold; color: #a00; font-size: 11pt; }
|
||||
.leyenda { margin-top: 1.2em; font-size: 9pt; display: flex; gap: 1.2em; flex-wrap: wrap; }
|
||||
.tema-btn:hover { color: var(--accent-2); background: var(--bg-hover); }
|
||||
|
||||
.vacio { background: var(--bg) !important; border-color: var(--border); opacity: .5; }
|
||||
.fin-semana { background: #1a2a35 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.fin-semana .num { color: var(--accent); }
|
||||
|
||||
.simulacro { background: #2a2510 !important; border-color: var(--warning) !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.simulacro .num { color: var(--warning); }
|
||||
|
||||
.examen { background: #2a1010 !important; border-color: var(--error) !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.examen .num { font-size: 20pt; color: var(--error); }
|
||||
.examen .contenido { font-weight: bold; color: var(--error); font-size: 11pt; }
|
||||
|
||||
.leyenda { margin-top: 1.5em; font-size: 9pt; display: flex; gap: 1.2em; flex-wrap: wrap; color: var(--text-muted); }
|
||||
.leyenda-item { display: flex; align-items: center; gap: 5px; }
|
||||
.leyenda-color { width: 14px; height: 14px; border: 1px solid #bbb; flex-shrink: 0; }
|
||||
.leyenda-color { width: 14px; height: 14px; border: 1px solid var(--border); flex-shrink: 0; }
|
||||
|
||||
@media print {
|
||||
body { background: #fff; color: #111; padding: 0.8cm 1cm; }
|
||||
.dia { background: #fff !important; border-color: #ccc !important; }
|
||||
.fin-semana { background: #f5f5f5 !important; }
|
||||
.simulacro { background: #fff8e1 !important; }
|
||||
.examen { background: #fde8e8 !important; }
|
||||
.tema-btn { color: #111; }
|
||||
.semana { page-break-after: always; break-after: page; }
|
||||
.semana:last-of-type { page-break-after: auto; }
|
||||
}
|
||||
|
|
|
|||
|
|
@ -4,50 +4,7 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Flashcards TAI — Repaso</title>
|
||||
<style>
|
||||
/* ── General ── */
|
||||
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||||
body { font-family: Arial, Helvetica, sans-serif; font-size: 11pt; color: #111; background: #fff; padding: 1.5cm; }
|
||||
h1 { font-size: 18pt; text-align: center; margin-bottom: 0.2em; }
|
||||
h2 { font-size: 13pt; margin: 1.2em 0 0.4em; border-bottom: 2px solid #333; padding-bottom: 0.2em; }
|
||||
h3 { font-size: 11pt; margin: 0.9em 0 0.3em; color: #444; }
|
||||
p, li { margin: 0.3em 0; line-height: 1.5; }
|
||||
ul { padding-left: 1.4em; }
|
||||
blockquote { border-left: 3px solid #999; padding-left: 0.8em; color: #555; margin: 0.5em 0; font-style: italic; }
|
||||
|
||||
/* ── Tablas ── */
|
||||
table { width: 100%; border-collapse: collapse; margin: 0.5em 0; font-size: 10pt; }
|
||||
th { background: #5d6d7e; color: #fff; padding: 5px 8px; text-align: left; }
|
||||
td { padding: 4px 8px; vertical-align: top; border-bottom: 1px solid #ddd; }
|
||||
tr:nth-child(even) td { background: #f5f5f5; }
|
||||
|
||||
/* ── Secciones / tarjetas ── */
|
||||
.card { border: 1px solid #ccc; border-radius: 6px; padding: 0.8em 1em; margin-bottom: 1.2em; }
|
||||
.card-title { font-size: 14pt; font-weight: bold; margin-bottom: 0.5em; }
|
||||
.tag { display: inline-block; font-size: 8pt; background: #5d6d7e; color: #fff; border-radius: 3px; padding: 1px 6px; margin-bottom: 0.6em; vertical-align: middle; }
|
||||
.warn { background: #fff3cd; border-left: 4px solid #f0ad4e; padding: 0.4em 0.8em; margin: 0.6em 0; font-size: 10pt; }
|
||||
.p-alta td { background: #fde8e8 !important; }
|
||||
.p-alta td:first-child { font-weight: bold; color: #a00; }
|
||||
.p-media td { background: #fef6e4 !important; }
|
||||
.p-media td:first-child { font-weight: bold; color: #8a6000; }
|
||||
.mnemonic { background: #e8f4fd; border-left: 4px solid #3498db; padding: 0.4em 0.8em; margin: 0.6em 0; font-size: 10pt; }
|
||||
hr.divider { border: none; border-top: 1px dashed #bbb; margin: 0.8em 0; }
|
||||
|
||||
/* ── Cabecera del documento ── */
|
||||
.doc-header { text-align: center; margin-bottom: 1.5em; padding-bottom: 0.8em; border-bottom: 3px double #333; }
|
||||
.doc-header p { font-size: 10pt; color: #666; margin-top: 0.3em; }
|
||||
|
||||
/* ── Print ── */
|
||||
@media print {
|
||||
body { padding: 0.8cm 1cm; font-size: 10pt; }
|
||||
.card { break-inside: avoid; page-break-inside: avoid; }
|
||||
.page-break { page-break-before: always; }
|
||||
a { color: inherit; text-decoration: none; }
|
||||
th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.tag { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
.p-alta td, .p-media td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
|
||||
}
|
||||
</style>
|
||||
<link rel="stylesheet" href="css/flashcards.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
|
|
@ -25,7 +25,7 @@
|
|||
<a th:href="@{/leyes}">Leyes</a>
|
||||
<a th:href="@{/noticias}"><i class="fas fa-bell"></i> Noticias</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/planning}">Planning</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/flashcards/imprimir.html}">Flashcards</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/flashcards.html}">Flashcards</a>
|
||||
</nav>
|
||||
<span class="topbar-progress" id="topbar-progress">1 / 33</span>
|
||||
<!-- Usuario / sesión -->
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
<a th:href="@{/leyes}">Leyes</a>
|
||||
<a th:href="@{/noticias}">Noticias</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/planning}">Planning</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/flashcards/imprimir.html}">Flashcards</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/flashcards.html}">Flashcards</a>
|
||||
</nav>
|
||||
<!-- Usuario / sesión -->
|
||||
<div class="topbar-user">
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
<a href="leyes.html" class="active">Leyes</a>
|
||||
<a href="noticias.html">Noticias</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/planning}">Planning</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/flashcards/imprimir.html}">Flashcards</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/flashcards.html}">Flashcards</a>
|
||||
</nav>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
<a href="leyes.html">Leyes</a>
|
||||
<a href="noticias.html" class="active">Noticias</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/planning}">Planning</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/flashcards/imprimir.html}">Flashcards</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/flashcards.html}">Flashcards</a>
|
||||
</nav>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,12 +1,37 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<html xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.thymeleaf.org/extras/spring-security" lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Planning TAI — Mayo 2026</title>
|
||||
<link rel="stylesheet" href="css/planning.css">
|
||||
<link rel="stylesheet" th:href="@{/css/style.css}">
|
||||
<link rel="stylesheet" th:href="@{/css/planning.css}">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- ── Topbar ─────────────────────────────────────────── -->
|
||||
<nav class="topbar">
|
||||
<a th:href="@{/}" class="topbar-brand" style="text-decoration:none">
|
||||
<i class="fas fa-graduation-cap"></i> TAI – AGE
|
||||
</a>
|
||||
<nav class="topbar-nav">
|
||||
<a th:href="@{/}">Inicio</a>
|
||||
<a th:href="@{/curso}">Temario</a>
|
||||
<a href="/cuestionarios">Cuestionarios</a>
|
||||
<a th:href="@{/leyes}">Leyes</a>
|
||||
<a th:href="@{/noticias}">Noticias</a>
|
||||
<a th:href="@{/planning}" class="active">Planning</a>
|
||||
<a sec:authorize="hasAnyRole('PAGADO','ADMIN')" th:href="@{/flashcards.html}">Flashcards</a>
|
||||
</nav>
|
||||
<div class="topbar-user">
|
||||
<span sec:authorize="isAuthenticated()" class="user-email" sec:authentication="principal.username"></span>
|
||||
<form sec:authorize="isAuthenticated()" th:action="@{/logout}" method="post" style="margin:0">
|
||||
<button type="submit" class="btn-logout">Salir</button>
|
||||
</form>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<h1>Planning de repaso TAI</h1>
|
||||
<p class="subtitle">Mayo 2026 · Examen: <strong>sábado 23 de mayo</strong></p>
|
||||
|
||||
|
|
@ -149,9 +174,9 @@
|
|||
</section>
|
||||
|
||||
<div class="leyenda">
|
||||
<div class="leyenda-item"><div class="leyenda-color" style="background:#fff8e1;-webkit-print-color-adjust:exact;print-color-adjust:exact;"></div> Simulacro</div>
|
||||
<div class="leyenda-item"><div class="leyenda-color" style="background:#fde8e8;-webkit-print-color-adjust:exact;print-color-adjust:exact;"></div> Examen</div>
|
||||
<div class="leyenda-item"><div class="leyenda-color" style="background:#fafafa;-webkit-print-color-adjust:exact;print-color-adjust:exact;"></div> Fin de semana</div>
|
||||
<div class="leyenda-item"><div class="leyenda-color" style="background:#2a2510;border-color:#d7ba7d;-webkit-print-color-adjust:exact;print-color-adjust:exact;"></div> Simulacro</div>
|
||||
<div class="leyenda-item"><div class="leyenda-color" style="background:#2a1010;border-color:#f44747;-webkit-print-color-adjust:exact;print-color-adjust:exact;"></div> Examen</div>
|
||||
<div class="leyenda-item"><div class="leyenda-color" style="background:#1a2a35;-webkit-print-color-adjust:exact;print-color-adjust:exact;"></div> Fin de semana</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
|
|
|
|||
Loading…
Reference in New Issue