tanami-admin-panel/src/Pages/IO_Management/ViewIO/ViewIOdataHeader.jsx

import { Box, Image, Text } from "@chakra-ui/react";
import header from "../../../assets/IOheader.png";

const ViewIOdataHeader = () => {
  return (
    <Box
      display={"flex"}
      alignItems={"center"}
      justifyContent={"space-between"}
      bg={"#caf5d8"}
      paddingRight={"25px"}
      borderRadius={"10px"}
    >
      <Box>
        <Image src={header} />
      </Box>
      <Box fontSize={"sm"} fontWeight={"500"}>
        <Text>KKR Private Equity Fund (K-Prime)</Text>
        <Text>sponsor name: KKR</Text>
      </Box>
      <Box fontSize={"sm"}>
        <Text>IO Status</Text>
        <Text fontWeight={"500"}>Open</Text>
      </Box>
      <Box fontSize={"sm"}>
        <Text>IO MV NAV</Text>
        <Text fontWeight={"500"}>$1,092,500</Text>
      </Box>
      <Box fontSize={"sm"}>
        <Text>IO cash</Text>
        <Text fontWeight={"500"}>$48,000</Text>
      </Box>
      <Box fontSize={"sm"}>
        <Text>IO NAV</Text>
        <Text fontWeight={"500"}>$1,140,500</Text>
      </Box>
    </Box>
  );
};

export default ViewIOdataHeader;