maria.ruiz
/
TicketMerc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Actualizar Interfaz/estilos/ventaboletos.css

This commit is contained in:
maria.ruiz 2025-03-10 08:00:26 +00:00
parent 3d5cf8b469
commit e3a4a499dc
1 changed files with 107 additions and 79 deletions
Interfaz/estilos
ventaboletos.css

186
Interfaz/estilos/ventaboletos.css
View File

@ -1,79 +1,107 @@
body { body {
font-family: Arial, sans-serif; font-family: Arial, sans-serif;
background-color: #f8f7f3; background-color: #d9d9d9 !important;
display: flex; display: flex;
flex-direction: column; justify-content: center;
justify-content: center; align-items: center;
align-items: center; height: 100vh;
height: 100vh; margin: 0;
margin: 0; }
}
.contenedor {
.dias { display: flex;
display: flex; flex-direction: column;
gap: 10px; align-items: center;
margin-bottom: 20px; width: 100%;
} max-width: 600px;
.dias button { text-align: center;
padding: 12px; position: relative;
border: 1px solid #ccc; }
background: white;
cursor: pointer; .flecha-regresar {
color:rgb(61, 61, 61); font-size: 28px;
} cursor: pointer;
.dias button.selected { position: absolute;
background: rgb(51, 108, 212); left: -100px;
color: white; top: 10%;
} transform: translateY(-50%);
.grid { transition: 0.3s ease-in-out;
display: grid; padding: 10px;
grid-template-columns: repeat(12, 30px); border-radius: 40%;
gap: 5px; }
margin-bottom: 30px;
} .flecha-regresar:hover {
.asiento { background-color: rgba(239, 226, 226, 0.1);
width: 30px; }
height: 30px;
border-radius: 50%; .contenido {
text-align: center; display: flex;
cursor: pointer; flex-direction: column;
background-color: rgb(249, 207, 129); align-items: center;
color: rgb(61, 61, 61); justify-content: center;
font-size: 12px; text-align: center;
} }
.asiento.vendido {
background-color: red; #titulo{
cursor: not-allowed; color: rgb(72, 73, 73);
} padding: 10px;
.boton-vender { }
padding: 10px 20px;
background: rgb(119, 182, 119); .dias {
color: white; display: flex;
border: none; justify-content: center;
cursor: pointer; gap: 10px;
border-radius: 18%; margin-bottom: 20px;
} }
.asiento, .asiento:focus, .asiento:active { .dias button {
outline: none; padding: 12px;
border: none; border: 1px solid #ccc;
box-shadow: none; background: white;
} cursor: pointer;
color: rgb(61, 61, 61);
.inicio-container { font-size: 18px;
position: absolute; }
top: 10px;
left: 100px; .dias button.selected {
} background: rgb(51, 108, 212);
color: white;
.inicio-btn { }
font-size: 16px;
padding: 8px 12px; .grid {
} display: grid;
grid-template-columns: repeat(12, 30px);
.conjunto{ gap: 5px;
justify-content: center; margin-bottom: 30px;
align-items: center; justify-content: center;
} }
.asiento {
width: 30px;
height: 30px;
border-radius: 50%;
text-align: center;
cursor: pointer;
background-color: rgb(177, 207, 250);
color: rgb(61, 61, 61);
font-size: 14px;
display: flex;
align-items: center;
justify-content: center;
font-weight: normal;
border: none;
}
.asiento.vendido {
background-color: red;
cursor: not-allowed;
}
.boton-vender {
padding: 10px 20px;
background: rgb(68, 102, 68);
color: white;
border: none;
cursor: pointer;
border-radius: 18%;
}