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