import React from "react";
import { View, Text } from "react-native";

export const ScrollStickyContent = ({ currentTrainData }) => {
  return (
    <View
      style={{
        alignItems: "center",
        backgroundColor: "white",
        flexDirection: "row",
      }}
    >
      <View
        style={{
          padding: 8,
          flexDirection: "row",
          borderBottomWidth: 1,
          borderBottomColor: "#f0f0f0",
          flex: 1,
        }}
      >
        <Text style={{ fontSize: 20 }}>停車駅</Text>
        <View style={{ flex: 1 }} />
        <View style={{ flexDirection: "row" }}>
          {!isNaN(currentTrainData?.delay) && currentTrainData?.delay != 0 && (
            <Text
              style={{
                fontSize: 15,
                color: "black",
                position: "absolute",
                right: 110,
                textAlign: "right",
                textDecorationLine: "line-through",
              }}
            >
              (定刻)
            </Text>
          )}
          <Text
            style={{
              fontSize: 20,
              color: isNaN(currentTrainData?.delay)
                ? "black"
                : currentTrainData?.delay == 0
                ? "black"
                : "red",
              width: 60,
            }}
          >
            見込
          </Text>
          <Text style={{ fontSize: 20, width: 50 }}></Text>
        </View>
      </View>
    </View>
  );
};