Untitled
unknown
plain_text
10 months ago
4.4 kB
9
Indexable
/* Stile generale */
body {
font-family: 'Poppins', sans-serif;
background-color: #e3f2fd;
height: 100vh;
margin: 0;
align-items: center; /* Centra verticalmente */
}
/* Contenitore principale */
.container {
max-width: 90%; /* Occupa il 90% della larghezza della pagina */
background: white;
padding: 25px;
border-radius: 12px;
box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
text-align: center;
overflow-x: auto; /* Permette lo scrolling orizzontale se serve */
margin: auto;
}
/* Struttura tabellare */
.table-container {
width: 100%;
border-collapse: collapse;
margin-top: 10px;
}
.table-container td {
padding: 12px;
vertical-align: middle;
}
/* Stile per la GridView */
.grid-style {
width: 100%;
table-layout: fixed; /* Evita l'espansione disordinata delle colonne */
border-collapse: collapse;
border: 1px solid #90caf9;
border-radius: 10px;
overflow: hidden;
margin-top: 15px;
}
/* Definizione delle colonne */
.grid-style th, .grid-style td {
padding: 12px;
border-bottom: 1px solid #90caf9;
transition: background 0.3s;
text-align: center;
white-space: nowrap; /* Impedisce il testo di andare a capo */
overflow: hidden;
text-overflow: ellipsis; /* Aggiunge "..." se il testo è troppo lungo */
}
/* Regole specifiche per le colonne */
.grid-style th:nth-child(1), .grid-style td:nth-child(1) {
width: 12%;
}
/* Cognome */
.grid-style th:nth-child(2), .grid-style td:nth-child(2) {
width: 12%;
}
/* Nome */
.grid-style th:nth-child(3), .grid-style td:nth-child(3) {
width: 15%;
}
/* Codice Fiscale */
.grid-style th:nth-child(4), .grid-style td:nth-child(4) {
width: 10%;
}
/* Partita IVA */
.grid-style th:nth-child(5), .grid-style td:nth-child(5) {
width: 18%;
}
/* Indirizzo */
.grid-style th:nth-child(6), .grid-style td:nth-child(6) {
width: 10%;
}
/* Città */
.grid-style th:nth-child(7), .grid-style td:nth-child(7) {
width: 7%;
}
/* CAP */
.grid-style th:nth-child(8), .grid-style td:nth-child(8) {
width: 7%;
}
/* Provincia */
.grid-style th:nth-child(9), .grid-style td:nth-child(9) {
width: 10%;
}
/* Codice Patente */
.grid-style th:nth-child(10), .grid-style td:nth-child(10) {
width: 10%;
}
/* Data di Nascita */
/* Miglioramenti visivi */
.grid-style th {
background: linear-gradient(135deg, #42a5f5, #1e88e5);
color: white;
font-weight: bold;
padding: 14px;
text-transform: uppercase;
}
.grid-style tr:nth-child(even) {
background-color: #bbdefb;
}
.grid-style tr:nth-child(odd) {
background-color: #e3f2fd;
}
.grid-style tr:hover {
background-color: #64b5f6;
color: white;
}
/* Stile per l'etichetta */
label {
font-weight: bold;
font-size: 15px;
color: #1565c0;
margin-top: 12px;
}
/* Stile per il campo input */
input[type="text"] {
padding: 12px;
border: 2px solid #90caf9;
border-radius: 10px;
background: white;
font-size: small;
width: 100%;
box-sizing: border-box;
}
/* Stile per i pulsanti */
.button-style {
display: inline-block;
padding: 16px 70px; /* Dimensioni più grandi */
font-size: 22px; /* Testo più grande */
font-weight: bold;
text-transform: uppercase; /* Testo in maiuscolo */
color: white;
background: linear-gradient(135deg, #1e88e5, #1565c0);
border: none;
border-radius: 12px; /* Angoli arrotondati */
cursor: pointer;
transition: all 0.3s ease;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}
.button-style:hover {
background: linear-gradient(135deg, #1565c0, #0d47a1);
transform: scale(1.07);
}
.button-style:active {
transform: scale(1.03);
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}
Editor is loading...
Leave a Comment