diff --git a/app/public/css/style.css b/app/public/css/style.css index 1ac01a7..4759739 100644 --- a/app/public/css/style.css +++ b/app/public/css/style.css @@ -364,3 +364,57 @@ tr.revoked-cert:hover { width: 100%; } } + +/* Styles for certificate entries */ +.certificate-entry { + display: flex; + justify-content: space-between; /* Aligne les enfants (infos du cert et actions) aux extrémités */ + align-items: center; /* Centre les enfants verticalement */ + margin-bottom: 10px; /* Ajoute un peu d'espace entre les entrées de certificat */ + padding: 10px; /* Ajoute un peu de rembourrage à l'intérieur de chaque entrée */ + border: 1px solid #eee; /* Optionnel : ajoute une bordure pour mieux visualiser les boîtes */ + flex-wrap: wrap; /* Permet aux éléments de passer à la ligne sur les petits écrans si nécessaire */ +} + +.certificate-info { + flex-grow: 1; /* Permet à cette section de prendre l'espace disponible */ + margin-right: 10px; /* Espace entre les infos et les boutons d'action */ +} + +.certificate-actions { + display: flex; /* Rend les boutons d'action eux-mêmes flexibles pour un alignement interne si nécessaire */ + flex-shrink: 0; /* Empêche les actions de rétrécir si l'espace est limité */ + gap: 5px; /* Ajoute un petit espace entre les boutons de téléchargement */ +} + +.certificate-info h4 { + margin-top: 0; + margin-bottom: 0; + /* Vous pouvez également envisager de définir display: inline ou display: inline-block si nécessaire, + mais les marges sont le problème le plus courant pour l'alignement vertical dans les conteneurs flex. + Pour l'instant, concentrons-nous sur les marges. */ +} + +/* Ajustements pour les certificats finaux dans les listes */ +.certificates-overview ul .certificate-entry { + /* Peut-être des ajustements spécifiques si nécessaire, mais les styles .certificate-entry ci-dessus devraient déjà bien fonctionner */ + /* Par exemple, si la bordure n'est pas souhaitée ici : */ + /* border: none; */ + /* padding: 5px 0; */ /* Ajuster le rembourrage pour un look plus compact dans la liste */ +} + +/* Assurer que les paragraphes à l'intérieur des actions n'ajoutent pas de marges indésirables */ +.certificate-actions p { + margin: 0; +} + +/* Styles pour les boutons de téléchargement pour qu'ils soient plus compacts si nécessaire */ +.download-button-small { + padding: 5px 10px; /* Réduire le rembourrage pour les rendre plus petits */ + font-size: 0.9em; /* Réduire la taille de la police */ +} + +/* Pour s'assurer que les liens dans .certificate-actions ne sont pas soulignés par défaut s'ils héritent d'un style global */ +.certificate-actions a { + text-decoration: none; +} diff --git a/app/src/Views/dashboard/index.php b/app/src/Views/dashboard/index.php index d61e5a4..d4cbc36 100644 --- a/app/src/Views/dashboard/index.php +++ b/app/src/Views/dashboard/index.php @@ -34,16 +34,16 @@ require_once APP_ROOT_DIR . '/src/Views/shared/header.php';
= htmlspecialchars($translations['name'] ?? 'Name:') ?> = htmlspecialchars($structuredCertificates['root']['name']) ?>
-+
= htmlspecialchars($translations['root_certificate_not_configured'] ?? 'Root certificate is not configured.') ?>
@@ -54,32 +54,38 @@ require_once APP_ROOT_DIR . '/src/Views/shared/header.php';
-
- = htmlspecialchars($translations['download_certificate_pem'] ?? 'Download Certificate (.pem)') ?>
-
-
-
-
- = htmlspecialchars($translations['download_private_key'] ?? 'Télécharger Clé Privée (.key)') ?>
+
+ = htmlspecialchars($intermediate['name']) ?> (= htmlspecialchars($translations['perimeter'] ?? 'Perimeter:') ?> = htmlspecialchars($intermediate['perimeter_name']) ?>)
+ = htmlspecialchars($translations['associated_final_certificates_title'] ?? 'Associated Final Certificates') ?>
-