diff options
Diffstat (limited to 'src/frontend/app/components/StopSheet.tsx')
| -rw-r--r-- | src/frontend/app/components/StopSheet.tsx | 12 |
1 files changed, 7 insertions, 5 deletions
diff --git a/src/frontend/app/components/StopSheet.tsx b/src/frontend/app/components/StopSheet.tsx index 422558b..0c19cb6 100644 --- a/src/frontend/app/components/StopSheet.tsx +++ b/src/frontend/app/components/StopSheet.tsx @@ -129,8 +129,8 @@ export const StopSheet: React.FC<StopSheetProps> = ({ data?.sort((a, b) => a.minutes - b.minutes).slice(0, 4) || []; return ( - <Sheet isOpen={isOpen} onClose={onClose} detent={"content-height" as any}> - <Sheet.Container> + <Sheet isOpen={isOpen} onClose={onClose} detent={"content-height" as any} > + <Sheet.Container drag="y"> <Sheet.Header /> <Sheet.Content> <div className="stop-sheet-content"> @@ -139,7 +139,9 @@ export const StopSheet: React.FC<StopSheetProps> = ({ <span className="stop-sheet-id">({stop.stopId})</span> </div> - <div className="stop-sheet-lines-container"> + <div + className={`stop-sheet-lines-container ${stop.lines.length >= 6 ? "scrollable" : ""}`} + > {stop.lines.map((line) => ( <div key={line} className="stop-sheet-line-icon"> <LineIcon line={line} region={region} rounded /> @@ -191,7 +193,7 @@ export const StopSheet: React.FC<StopSheetProps> = ({ <Clock /> {formatTime(estimate.minutes)} </div> - {REGIONS[region].showMeters && ( + {REGIONS[region].showMeters && estimate.meters >= 0 && ( <div className="stop-sheet-estimate-distance"> {formatDistance(estimate.meters)} </div> @@ -245,7 +247,7 @@ export const StopSheet: React.FC<StopSheetProps> = ({ </div> </Sheet.Content> </Sheet.Container> - <Sheet.Backdrop /> + <Sheet.Backdrop onTap={onClose} /> </Sheet> ); }; |