Untitled

 avatar
unknown
plain_text
21 days ago
4.4 kB
4
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