diff --git a/style.css b/style.css index 9397e70..f4b8f72 100644 --- a/style.css +++ b/style.css @@ -485,6 +485,8 @@ footer hr { font-size: 0.85em; margin-right: 5px; transition: all 0.3s; + text-decoration: none; + display: inline-block; } .btn-danger { @@ -505,6 +507,24 @@ footer hr { background-color: #d68910; } +/* =========================== + SKELETON LOADING +=========================== */ +@keyframes skeleton-pulse { + 0% { opacity: 1; } + 50% { opacity: 0.4; } + 100% { opacity: 1; } +} + +.skeleton { + background-color: #3d5166; + border-radius: 5px; + height: 14px; + margin: 8px auto; + width: 70%; + animation: skeleton-pulse 1.5s ease-in-out infinite; +} + /* =========================== MODE CLAIR =========================== */ @@ -637,4 +657,91 @@ body.light-mode .admin-table td { body.light-mode .admin-table tr:hover td { background-color: #e8f4fd; +} + +body.light-mode .skeleton { + background-color: #ccc; +} + +/* =========================== + RESPONSIVE MOBILE +=========================== */ + +/* Tablette (max 900px) */ +@media (max-width: 900px) { + .dashboard { + grid-template-columns: repeat(2, 1fr); + } + + .graphiques { + grid-column: span 2; + } + + .alertes { + grid-column: span 2; + } + + .cards-home { + grid-template-columns: repeat(2, 1fr); + } +} + +/* Mobile (max 600px) */ +@media (max-width: 600px) { + nav { + padding: 10px 15px; + height: auto; + flex-direction: column; + gap: 10px; + } + + nav ul { + flex-wrap: wrap; + justify-content: center; + gap: 10px; + } + + .dashboard { + grid-template-columns: 1fr; + padding: 10px 15px; + } + + .graphiques { + grid-column: span 1; + } + + .alertes { + grid-column: span 1; + } + + .cards-home { + grid-template-columns: 1fr; + } + + .form-box { + width: 90%; + margin: 30px auto; + } + + .hero { + padding: 40px 15px 30px; + } + + .hero h2 { + font-size: 1.5em; + } + + .logs-container { + margin: 10px 15px; + padding: 15px; + } + + .admin-table { + font-size: 0.8em; + } + + .btn-action { + display: block; + margin-bottom: 5px; + } } \ No newline at end of file