細かいレイアウト調整

components/ActionSheetComponents/EachTrainInfoCore/HeaderText.tsx

@@ -19,7 +19,7 @@ type Props = {
 };
 
 const textConfig: TextStyle = {
-  fontSize: 20,
+  fontSize: 18,
   fontWeight: "bold",
   color: "white",
 };
@@ -34,7 +34,7 @@ export const HeaderText: FC<Props> = ({
   navigate,
   from,
 }) => {
-  const trainName = useMemo(() => {
+  const [typeName, trainName] = useMemo(() => {
     if (!data.limited) return "";
     const limitedArray = data.limited.split(":");
     const type = getType(limitedArray[0]);
@@ -42,24 +42,27 @@ export const HeaderText: FC<Props> = ({
     switch (true) {
       case !!limitedArray[1]:
         // 特急の場合は、列車名を取得
-        return type + migrateTrainName(limitedArray[1]);
+        return [type, migrateTrainName(limitedArray[1])];
       case trainData.length == 0:
         // 特急以外の場合は、列車番号を取得
-        return type;
+        return [type, ""];
       default:
         // 行先がある場合は、行先を取得
-        return (
-          type +
+        return [
+          type,
           migrateTrainName(
             trainData[trainData.length - 1].split(",")[0] + "行き"
-          )
-        );
+          ),
+        ];
     }
   }, [data.limited, trainData]);
   return (
     <View style={{ padding: 10, flexDirection: "row", alignItems: "center" }}>
-      <TrainIconStatus {...{ data, navigate, from}}/>
-      <Text style={textConfig}>{trainName}</Text>
+      <TrainIconStatus {...{ data, navigate, from }} />
+      <Text style={textConfig}>
+        {typeName}{" "}
+        {trainName}
+      </Text>
       <View style={{ flex: 1 }} />
       <Text style={textConfig}>
         {showHeadStation.map((d) => `${headStation[d].id} + `)}