Ajustando la letra para moviles

This commit is contained in:
Tatiana Villa 2026-04-06 18:11:42 +02:00
parent c49d2fb7ff
commit d5bb7f40f9
3 changed files with 30 additions and 5 deletions

View File

@ -223,8 +223,26 @@ a:focus-visible {
/* Responsive */
@media (max-width: 600px) {
header h1 {
font-size: 1.8rem; /* El título suele ser muy grande para móviles */
}
body {
padding: 0.5rem;
font-size: 2.5rem !important;
font-size: 1.2rem; /* Tamaño base cómodo para leer apuntes */
line-height: 1.5;
}
.container {
width: 95%; /* Aprovecha más el ancho de la pantalla del móvil */
padding: 1rem 0;
}
ol {
margin-left: 1rem; /* Menos margen para no desperdiciar espacio */
padding-left: 0.5rem;
}
ol li {
margin-bottom: 1rem; /* Más separación entre temas para poder pulsar bien */
}
}

View File

@ -174,7 +174,13 @@ button#aleatoria {
.opcion {
font-size: 1.15rem;
padding: 14px;
padding: 18px;
margin: 12px 0;
}
.opcion input[type="radio"] {
transform: scale(1.5);
margin-right: 15px;
}
.marcador-container {

View File

@ -2,14 +2,15 @@
<html lang="es">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="tatianalogo.png" type="image/x-icon">
<link rel="stylesheet" href="css/estilos.css">
<title>Temario TAI AGE</title>
</head>
<body>
<header>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;700&display=swap" rel="stylesheet">
<link rel="icon" href="tatianalogo.png" type="image/x-icon">
<link rel="stylesheet" href="css/estilos.css">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
<nav class="navbar navbar-expand-sm navbar-dark bg-dark shadow-sm border-bottom border-secondary">