quirohelpWebapp / templates /ajustes.html
LeireTedCas's picture
Update templates/ajustes.html
593f7d1
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Quirohelp</title>
<style>
body {
background-color: #333;
color: #fff;
font-family: Georgia, 'Times New Roman', Times, serif;
margin: 0;
padding: 0;
text-align: center;
}
.quiro {
background-color: blueviolet;
font-size: 3.5rem;
padding: 20px 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
.container {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
justify-content: center; /* Centrar horizontalmente */
}
.element {
text-align: center;
max-height: 100%;
}
img {
max-width: 40%; /* Reducir el tamaño de la imagen */
height: auto;
cursor: pointer;
}
.text {
font-size: 36px;
align-items: center;
text-align: center;
margin-top: 10px;
}
.text2 {
font-size: 24px;
}
/* Estilos para pantallas pequeñas (por ejemplo, hasta 768px) */
@media screen and (max-width: 768px) {
.quiro {
font-size: 2.5rem;
}
input[type="button"] {
width: 100%;
}
}
/* Estilos para pantallas medianas y grandes (más de 768px) */
@media screen and (min-width: 769px) {
.quiro {
font-size: 3.5rem;
}
}
</style>
</head>
<body>
<div class="login22">
<h2 style="justify-content: center; text-align: center; font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; font-size: 3rem; background-color: purple; max-width: 100%; overflow: hidden; display: flex; align-items: center;">
<div class="container">
<div class="element">
<p class="text">INICIO</p>
</div>
</div>
</h2>
<form action="{{url_for('buscador_trauma')}}" method="post">
<div class="input-container">
<div class="text">
<img src="{{ user_image7 }}" alt="" onclick="location.href='/especialidad'">
<p class="text2">Cambiar especialidad</p>
</div>
</div>
</form>
</div>
</body>
</html>