Tutti gli altri (6-10)

2026-02-03 00:08:30 +01:00
parent 0043f1f83f
commit e6f6f17769
54 changed files with 3205 additions and 0 deletions
--- a/DOM+/01_card_profilo/style.css
+++ b/DOM+/01_card_profilo/style.css
@@ -0,0 +1,105 @@
+body {
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; /* Stesso font dashboard */
+    background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%); /* Stesso sfondo dashboard */
+    min-height: 100vh;
+    margin: 0;
+    padding: 20px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    color: #2c3e50;
+}
+
+.card-container {
+    background: white;
+    width: 320px;
+    border-radius: 20px;
+    overflow: hidden;
+    box-shadow: 0 15px 35px rgba(0,0,0,0.1);
+    text-align: center;
+}
+
+.card-header {
+    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+    color: white;
+    padding: 30px 20px;
+}
+
+#img-profilo {
+    width: 100px;
+    height: 100px;
+    border-radius: 50%; /* Cerchio perfetto */
+    border: 4px solid white;
+    object-fit: cover;
+    margin-bottom: 10px;
+}
+
+h2 {
+    margin: 10px 0 5px 0;
+    font-size: 24px;
+}
+
+.ruolo-badge {
+    background: rgba(255, 255, 255, 0.2);
+    display: inline-block;
+    padding: 5px 15px;
+    border-radius: 20px;
+    font-size: 14px;
+    margin: 0;
+}
+
+.card-body {
+    padding: 20px;
+    text-align: left;
+}
+
+.dettaglio {
+    margin-bottom: 15px;
+    border-bottom: 1px solid #eee;
+    padding-bottom: 5px;
+    color: #555;
+}
+
+strong {
+    color: #333;
+    display: block;
+    font-size: 12px;
+    text-transform: uppercase;
+    letter-spacing: 1px;
+}
+
+.verifica {
+    text-align: center;
+    color: #27ae60;
+    font-weight: bold;
+    margin-top: 20px;
+    padding: 10px;
+    background-color: #e8f8f5;
+    border-radius: 5px;
+}
+
+.nascosto {
+    display: none;
+}
+
+.card-footer {
+    padding: 15px;
+    background: #f9f9f9;
+}
+
+button {
+    background: linear-gradient(to right, #667eea, #764ba2); /* Riprende l'header */
+    color: white;
+    border: none;
+    padding: 12px 25px;
+    border-radius: 30px; /* Bottone a pillola moderno */
+    cursor: pointer;
+    font-weight: bold;
+    box-shadow: 0 4px 15px rgba(118, 75, 162, 0.4);
+    transition: 0.2s;
+}
+
+button:hover {
+    transform: scale(1.05);
+    box-shadow: 0 6px 20px rgba(118, 75, 162, 0.6);
+}