PxlLoewe/var-monorepo
1
0
Fork 0
Code Issues 22 Pull Requests Actions Packages Projects Releases 2 Wiki Activity

min height for popup content

Browse Source
This commit is contained in:
Nicolas
2025-04-30 09:12:30 +02:00
parent 504ef3cdb8
commit f9ce9a9e7a
4 changed files with 52 additions and 45 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
apps/dispatch/app/dispatch/_components/map/AircraftMarker.tsx
View File

@@ -218,7 +218,9 @@ const AircraftPopupContent = ({ aircraft }: { aircraft: Aircraft }) => {
</div> </div>
</div> </div>
</div> </div>
<div>{renderTabContent}</div> <div className="h-full min-h-[140px]">
<div className="flex-grow">{renderTabContent}</div>
</div>
</> </>
); );
}; };

2
apps/dispatch/app/dispatch/_components/map/MissionMarkers.tsx
View File

@@ -211,7 +211,7 @@ const MissionPopupContent = ({ mission }: { mission: Mission }) => {
</div> </div>
</div> </div>
</div> </div>
<div>{renderTabContent}</div> <div className="h-full min-h-[200px]">{renderTabContent}</div>
</> </>
); );
}; };

4
apps/dispatch/app/dispatch/_components/map/_components/AircraftMarkerTabs.tsx
View File

@@ -37,13 +37,13 @@ const FMSStatusSelector = ({ aircraft }: { aircraft: Aircraft }) => {
const [hoveredStatus, setHoveredStatus] = useState<string | null>(null); const [hoveredStatus, setHoveredStatus] = useState<string | null>(null);
return ( return (
<div className="flex gap-2 p-4 justify-center"> <div className="flex gap-2 p-4 justify-center items-center min-h-[136px] h-full">
{Array.from({ length: 9 }, (_, i) => (i + 1).toString()) {Array.from({ length: 9 }, (_, i) => (i + 1).toString())
.filter((status) => status !== "5") // Exclude status 5 .filter((status) => status !== "5") // Exclude status 5
.map((status) => ( .map((status) => (
<div <div
key={status} key={status}
className="flex justify-center items-center min-w-11 min-h-11 cursor-pointer text-3xl font-bold" className="flex justify-center items-center min-w-13 min-h-13 cursor-pointer text-4xl font-bold"
style={{ style={{
backgroundColor: backgroundColor:
hoveredStatus === status hoveredStatus === status

87
apps/dispatch/app/dispatch/_components/map/_components/MissionMarkerTabs.tsx
View File

@@ -245,48 +245,53 @@ const FMSStatusHistory = ({ mission }: { mission: Mission }) => {
</div> </div>
<div className="divider m-0" /> <div className="divider m-0" />
<ul className="space-y-2 max-h-[300px] overflow-y-auto overflow-x-auto"> <ul className="space-y-2 max-h-[300px] overflow-y-auto overflow-x-auto">
{(mission.missionLog as unknown as MissionLog[]).map((entry, index) => { {(mission.missionLog as unknown as MissionLog[])
if (entry.type === "station-log") .slice()
return ( .reverse()
<li key={index} className="flex items-center gap-2"> .map((entry, index) => {
<span className="text-base-content">{entry.timeStamp}</span> if (entry.type === "station-log")
<span return (
className="font-bold text-base" <li key={index} className="flex items-center gap-2">
style={{ <span className="text-base-content">{entry.timeStamp}</span>
color: FMS_STATUS_TEXT_COLORS[entry.data.newFMSstatus], <span
}} className="font-bold text-base"
> style={{
{entry.data.newFMSstatus} color: FMS_STATUS_TEXT_COLORS[entry.data.newFMSstatus],
</span> }}
<span className="text-base-content"> >
{entry.data.station.bosCallsign} {entry.data.newFMSstatus}
</span> </span>
</li> <span className="text-base-content">
); {entry.data.station.bosCallsign}
if (entry.type === "message-log") </span>
return ( </li>
<li key={index} className="flex items-center gap-2"> );
<span className="text-base-content"> if (entry.type === "message-log")
{new Date(entry.timeStamp).toLocaleTimeString([], { return (
hour: "2-digit", <li key={index} className="flex items-center gap-2">
minute: "2-digit", <span className="text-base-content">
})} {new Date(entry.timeStamp).toLocaleTimeString([], {
</span> hour: "2-digit",
<span minute: "2-digit",
className="font-bold text-base" })}
style={{ </span>
color: FMS_STATUS_TEXT_COLORS[6], <span
}} className="font-bold text-base"
> style={{
{entry.data.user.firstname?.[0]?.toUpperCase() ?? "?"} color: FMS_STATUS_TEXT_COLORS[6],
{entry.data.user.lastname?.[0]?.toUpperCase() ?? "?"} }}
</span> >
<span className="text-base-content">{entry.data.message}</span> {entry.data.user.firstname?.[0]?.toUpperCase() ?? "?"}
</li> {entry.data.user.lastname?.[0]?.toUpperCase() ?? "?"}
); </span>
<span className="text-base-content">
{entry.data.message}
</span>
</li>
);
return null; return null;
})} })}
</ul> </ul>
</div> </div>
); );