fixed dettaglio worksheet

2026-10-20 08:59:38 +02:00
parent 3209ac969f
commit 3f5c14836f
3 changed files with 584 additions and 220 deletions
@@ -134,6 +134,188 @@
        max-height: 100%;
        object-fit: contain;
    }
+
+    /* ================================================================
+       Dettaglio foglio in sola lettura (stesse sezioni e colori
+       di manage-worksheet.php)
+       ================================================================ */
+    .wsd-summary {
+        display: grid;
+        grid-template-columns: repeat(5, minmax(0, 1fr));
+        gap: 10px;
+    }
+
+    .wsd-sum-item {
+        background: #fff;
+        border: 1px solid #e5edf6;
+        border-radius: 14px;
+        padding: 10px 14px;
+        box-shadow: 0 4px 12px rgba(15, 23, 42, 0.04);
+        min-width: 0;
+    }
+
+    .wsd-sum-value {
+        font-size: 1.05rem;
+        font-weight: 800;
+        color: #111827;
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+    }
+
+    .wsd-section {
+        border: 1px solid #e7edf5;
+        border-radius: 16px;
+        background: #fff;
+        overflow: hidden;
+        height: 100%;
+        box-shadow: 0 4px 12px rgba(15, 23, 42, 0.03);
+    }
+
+    .wsd-head {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        gap: 10px;
+        padding: 10px 16px;
+        font-weight: 800;
+        font-size: 1rem;
+    }
+
+    .wsd-head-badge {
+        background: rgba(255, 255, 255, .7);
+        border-radius: 999px;
+        padding: 3px 10px;
+        font-size: .78rem;
+        font-weight: 700;
+    }
+
+    .wsd-body {
+        padding: 14px 16px;
+    }
+
+    .wsd-blue .wsd-head {
+        background: linear-gradient(135deg, #dbeafe, #bfdbfe);
+        color: #123b7a;
+    }
+
+    .wsd-green .wsd-head {
+        background: linear-gradient(135deg, #dcfce7, #bbf7d0);
+        color: #14532d;
+    }
+
+    .wsd-orange .wsd-head {
+        background: linear-gradient(135deg, #ffedd5, #fed7aa);
+        color: #9a3412;
+    }
+
+    .wsd-purple .wsd-head {
+        background: linear-gradient(135deg, #ede9fe, #ddd6fe);
+        color: #5b21b6;
+    }
+
+    .wsd-gray .wsd-head {
+        background: linear-gradient(135deg, #f3f4f6, #e5e7eb);
+        color: #374151;
+    }
+
+    .wsd-cyan .wsd-head {
+        background: linear-gradient(135deg, #cffafe, #a5f3fc);
+        color: #155e75;
+    }
+
+    .wsd-fields {
+        display: grid;
+        grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
+        gap: 12px 16px;
+    }
+
+    .wsd-label {
+        font-size: .75rem;
+        font-weight: 700;
+        text-transform: uppercase;
+        letter-spacing: .03em;
+        color: #6b7280;
+        margin-bottom: 2px;
+    }
+
+    .wsd-value {
+        font-size: 1.02rem;
+        font-weight: 700;
+        color: #111827;
+        word-break: break-word;
+    }
+
+    .wsd-empty {
+        color: #b6bec9 !important;
+        font-weight: 400 !important;
+        font-style: italic;
+    }
+
+    .wsd-text-block {
+        margin-top: 14px;
+    }
+
+    .wsd-text {
+        background: #f8fafc;
+        border: 1px solid #e9eef5;
+        border-radius: 10px;
+        padding: 10px 12px;
+        white-space: pre-wrap;
+        word-break: break-word;
+        color: #1f2937;
+    }
+
+    .wsd-meta {
+        margin-top: 14px;
+        padding-top: 10px;
+        border-top: 1px dashed #e5e7eb;
+        font-size: .82rem;
+        color: #6b7280;
+    }
+
+    .wsd-table thead th {
+        background: #eef4fb !important;
+        color: #163a63;
+        font-weight: 800;
+        font-size: .88rem;
+    }
+
+    .wsd-speed {
+        width: 100%;
+        border-collapse: separate;
+        border-spacing: 0 6px;
+    }
+
+    .wsd-speed thead th {
+        font-size: .75rem;
+        font-weight: 700;
+        text-transform: uppercase;
+        color: #6b7280;
+        text-align: center;
+    }
+
+    .wsd-speed tbody th {
+        width: 70px;
+        color: #5b21b6;
+        font-weight: 800;
+    }
+
+    .wsd-speed td {
+        text-align: center;
+        font-size: 1.15rem;
+        font-weight: 800;
+        color: #111827;
+        background: #f8f7ff;
+        border-radius: 10px;
+        padding: 8px;
+    }
+
+    @media (max-width: 992px) {
+        .wsd-summary {
+            grid-template-columns: repeat(2, minmax(0, 1fr));
+        }
+    }
 </style>

 <!-- MODALE LISTA FOGLI DI LAVORO -->
@@ -171,7 +353,7 @@
                    <h5 class="modal-title mb-0">
                        <i class="fa-solid fa-file-lines me-2"></i>Dettaglio foglio di lavoro
                    </h5>
-                    <small class="text-muted">Visualizzazione completa in sola lettura</small>
+                    <small class="text-muted">Sola lettura · per modificare usa "Apri foglio completo"</small>
                </div>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>