diff --git a/src/components/TrainTypeBox.tsx b/src/components/TrainTypeBox.tsx index a1e0cba8f..52c0b11c2 100644 --- a/src/components/TrainTypeBox.tsx +++ b/src/components/TrainTypeBox.tsx @@ -73,13 +73,16 @@ const styles = StyleSheet.create({ width: isTablet ? 175 : 96.25, height: isTablet ? 55 : 30.25, }, + nextTrainTypeWrapper: { + position: 'absolute', + top: isTablet ? 55 : 30.25, + alignItems: 'flex-start', + overflow: 'visible', + marginTop: 4, + }, nextTrainType: { fontWeight: 'bold', fontSize: isTablet ? 18 : 12, - marginTop: 4, - position: 'absolute', - top: isTablet ? 55 : 30.25, - width: '100%', }, }); @@ -329,23 +332,25 @@ const TrainTypeBox: React.FC = ({ {showNextTrainType && nextTrainType?.nameRoman ? ( - - {headerState.split('_')[1] === 'EN' - ? `${nextLine?.company?.nameEnglishShort} Line ${truncateTrainType( - nextTrainType?.nameRoman?.replace(parenthesisRegexp, ''), - true - )}` - : `${ - nextLine?.company?.nameShort - }線内 ${nextTrainType?.name?.replace(parenthesisRegexp, '')}`} - + + + {headerState.split('_')[1] === 'EN' + ? `${nextLine?.company?.nameEnglishShort} Line ${truncateTrainType( + nextTrainType?.nameRoman?.replace(parenthesisRegexp, ''), + true + )}` + : `${ + nextLine?.company?.nameShort + }線内 ${nextTrainType?.name?.replace(parenthesisRegexp, '')}`} + + ) : null} );