View d'un poi qui fonctionne pour les infos principales

This commit is contained in:
leosw
2026-01-18 18:37:39 +01:00
parent 9f3bb76276
commit d2b4f38f0b
2 changed files with 167 additions and 14 deletions

View File

@@ -392,4 +392,141 @@ form.form input[type="checkbox"]:checked + span:before {
filter: drop-shadow(0 0 0.5px #000); /* bordure subtile sur la flèche */
}
/* Fiche d'identité POI */
.poi-idcard {
width: 100%;
padding: 20px 15px;
background: rgba(200, 220, 255, 0.25);
border-bottom: 1px solid #bbb;
margin: 0;
box-sizing: border-box;
display: flex;
flex-direction: column;
gap: 8px;
}
/* Ligne principale : coordonnées + type */
.poi-id-main {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 19px; /* demandé */
font-weight: 600;
}
/* Coordonnées */
.poi-id-coords {
display: flex;
align-items: center;
gap: 8px;
}
.poi-id-coords a {
color: #0055aa;
text-decoration: none;
}
.poi-id-coords a:hover {
text-decoration: underline;
}
.poi-id-elev {
color: #333;
}
/* Type */
.poi-id-type {
display: flex;
align-items: center;
gap: 6px;
}
/* Label discret */
.poi-id-label {
font-weight: 500;
color: #444;
}
/* Dates en petit */
.poi-id-dates {
font-size: 15px; /* demandé */
color: #555;
display: flex;
gap: 20px;
}
/* Mobile */
@media (max-width: 700px) {
.poi-id-main {
flex-direction: column;
align-items: flex-start;
gap: 4px;
}
.poi-id-dates {
flex-direction: column;
gap: 2px;
}
}
/* Ligne principale : coordonnées + type */
.poi-id-main {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 19px; /* demandé */
font-weight: 600;
}
/* Coordonnées */
.poi-id-coords {
display: flex;
align-items: center;
gap: 8px;
}
.poi-id-coords a {
color: #0055aa;
text-decoration: none;
}
.poi-id-coords a:hover {
text-decoration: underline;
}
.poi-id-elev {
color: #333;
}
/* Type */
.poi-id-type {
display: flex;
align-items: center;
gap: 6px;
}
/* Label discret */
.poi-id-label {
font-weight: 500;
color: #444;
}
/* Dates en petit */
.poi-id-dates {
font-size: 15px; /* demandé */
color: #555;
display: flex;
gap: 20px;
}
/* Mobile */
@media (max-width: 700px) {
.poi-id-main {
flex-direction: column;
align-items: flex-start;
gap: 4px;
}
.poi-id-dates {
flex-direction: column;
gap: 2px;
}
}

View File

@@ -21,6 +21,35 @@
</span>
<span><?=$poi->name?></span>
</h1>
<div class="poi-idcard">
<div class="poi-id-main">
<div class="poi-id-coords">
<span class="poi-id-label">📍 Coordonnées</span>
<a href="geo:<?=$poi->lat?>,<?=$poi->lon?>" class="poi-id-value">
<?=$poi->lat?>, <?=$poi->lon?>
</a>
<?php if ($poi->ele !== null && $poi->ele !== '') { ?>
<span class="poi-id-elev">⛰️ <?=$poi->ele?> m</span>
<?php } ?>
</div>
<div class="poi-id-type">
<span class="poi-id-label">🏷️ Type</span>
<span class="poi-id-value">
<?=$poi_types[$poi->poi_type][1] ?? $poi->poi_type?>
</span>
</div>
</div>
<div class="poi-id-dates">
<span>Créé : <?=$poi->creation_date?></span>
<span>Mis à jour : <?=$poi->update_date?></span>
</div>
</div>
<? if($user->rankIsHigher('premium')) { ?>
<span class="subtitle">
<? if(isset($PoiHistory)) { ?>
@@ -46,20 +75,7 @@
</span>
<? } ?>
<div class="flex_line">
<div>
<strong>Latitude :</strong> <?=$poi->lat?><br>
<strong>Longitude :</strong> <?=$poi->lon?><br>
<? if ($poi->ele !== null && $poi->ele !== '') { ?>
<strong>Altitude :</strong> <?=$poi->ele?> m<br>
<? } ?>
</div>
<div>
<strong>Langue :</strong> <?=$poi->locale?><br>
<strong>Auteur :</strong> <?=$poi->author_name?><br>
<strong>Dernière mise à jour :</strong> <?=$poi->update_date?><br>
</div>
</div>
<br>
<h2>Description</h2>
<div class="poi-description">