Actualizar Interfaz/estilos/ventaboletos.css

2025-03-10 08:00:26 +00:00 · 2025-03-10 08:00:26 +00:00 · e3a4a499dc
parent 3d5cf8b469
commit e3a4a499dc
1 changed files with 107 additions and 79 deletions
--- a/Interfaz/estilos/ventaboletos.css
+++ b/Interfaz/estilos/ventaboletos.css
@ -1,79 +1,107 @@
-body {
-  font-family: Arial, sans-serif;
-  background-color: #f8f7f3; 
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  height: 100vh; 
-  margin: 0; 
-}
-
-.dias {
-  display: flex;
-  gap: 10px;
-  margin-bottom: 20px;
-}
-.dias button {
-  padding: 12px;
-  border: 1px solid #ccc;
-  background: white;
-  cursor: pointer;
-  color:rgb(61, 61, 61);
-}
-.dias button.selected {
-  background: rgb(51, 108, 212);
-  color: white;
-}
-.grid {
-  display: grid;
-  grid-template-columns: repeat(12, 30px);
-  gap: 5px;
-  margin-bottom: 30px;
-}
-.asiento {
-  width: 30px;
-  height: 30px;
-  border-radius: 50%;
-  text-align: center;
-  cursor: pointer;
-  background-color: rgb(249, 207, 129);
-  color: rgb(61, 61, 61);
-  font-size: 12px;
-}
-.asiento.vendido {
-  background-color: red;
-  cursor: not-allowed;
-}
-.boton-vender {
-  padding: 10px 20px;
-  background: rgb(119, 182, 119);
-  color: white;
-  border: none;
-  cursor: pointer;
-  border-radius:  18%;
-}
-
-.asiento, .asiento:focus, .asiento:active {
-  outline: none;
-  border: none;
-  box-shadow: none;
-}
-
-.inicio-container {
-  position: absolute;
-  top: 10px; 
-  left: 100px; 
-}
-
-.inicio-btn {
-  font-size: 16px;
-  padding: 8px 12px;
-}
-
-.conjunto{
-  justify-content: center;
-  align-items: center;
-}
-
-
+body {
+    font-family: Arial, sans-serif;
+    background-color: #d9d9d9 !important; 
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 100vh;
+    margin: 0;
+}
+
+.contenedor {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 100%;
+    max-width: 600px;
+    text-align: center;
+    position: relative; 
+}
+
+.flecha-regresar {
+    font-size: 28px;
+    cursor: pointer;
+    position: absolute;
+    left: -100px; 
+    top: 10%;
+    transform: translateY(-50%); 
+    transition: 0.3s ease-in-out;
+    padding: 10px;
+    border-radius: 40%;
+}
+
+.flecha-regresar:hover {
+    background-color: rgba(239, 226, 226, 0.1);
+}
+
+.contenido {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    text-align: center;
+}
+
+#titulo{
+  color: rgb(72, 73, 73);
+  padding: 10px;
+}
+
+.dias {
+    display: flex;
+    justify-content: center;
+    gap: 10px;
+    margin-bottom: 20px;
+}
+
+.dias button {
+    padding: 12px;
+    border: 1px solid #ccc;
+    background: white;
+    cursor: pointer;
+    color: rgb(61, 61, 61);
+    font-size: 18px;
+}
+
+.dias button.selected {
+    background: rgb(51, 108, 212);
+    color: white;
+}
+
+.grid {
+    display: grid;
+    grid-template-columns: repeat(12, 30px);
+    gap: 5px;
+    margin-bottom: 30px;
+    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%;
+}