made marker with fit text width

This commit is contained in:
PxlLoewe
2025-04-20 18:38:43 -07:00
parent 9b1d6fed45
commit 2df69321e9
3 changed files with 4 additions and 4 deletions

View File

@@ -265,7 +265,7 @@ const AircraftMarker = ({ aircraft }: { aircraft: Aircraft }) => {
return `<div
id="marker-${aircraft.id}"
class="${cn(
"relative w-[140px] transform flex items-center gap-2 px-2 z-100",
"relative w-auto transform inline-flex items-center gap-2 px-2 z-100",
anchor.includes("right") && "-translate-x-full",
anchor.includes("bottom") && "-translate-y-full",
)}"
@@ -291,7 +291,7 @@ const AircraftMarker = ({ aircraft }: { aircraft: Aircraft }) => {
>
${aircraft.fmsStatus}
</span>
<span class="text-white text-[15px]">
<span class="text-white text-[15px] text-nowrap">
${aircraft.bosName}
</span>
<div

View File

@@ -175,7 +175,7 @@ const MissionMarker = ({ mission }: { mission: Mission }) => {
return `<div
id="marker-${mission.id}"
class="${cn(
"relative w-[100px] transform flex items-center gap-2 px-2 z-100",
"relative w-auto transform inline-flex items-center gap-2 px-2 z-100",
anchor.includes("right") && "-translate-x-full",
anchor.includes("bottom") && "-translate-y-full",
)}"
@@ -195,7 +195,7 @@ const MissionMarker = ({ mission }: { mission: Mission }) => {
${anchor.includes("top") ? `border-top: 3px solid ${MISSION_STATUS_TEXT_COLORS[mission.state]};` : `border-bottom: 3px solid ${MISSION_STATUS_TEXT_COLORS[mission.state]};`}
"
></div>
<span class="text-white text-[15px]">
<span class="text-white text-[15px] text-nowrap">
${mission.missionSummary}
</span>
<div