rubix/src/components/ResourcesPage/tabInsideContent/TabsVideo.jsx

import { Badge, Box, Image, Text } from "@chakra-ui/react";
import pic from "../../../assets/images/eventsPic.png";

const TabsVideo = () => {
  return (
    <Box backgroundColor={"#151515"} padding={"2rem"} borderRadius={"5px"}>
      <Text paddingBottom={"1rem"}>Newest Post</Text>
      <Box
        display={"flex"}
        alignItems={"center"}
        justifyContent={"start"}
        gap={"2rem"}
      >
        <Box>
          <Image src={pic} />
        </Box>
        <Box flex={"1"}>
          <Badge
            backgroundColor={"transparent"}
            color={"#fff"}
            fontWeight={"500"}
            fontFamily={"Poppins"}
            fontSize={"14px"}
            marginBottom={"1rem"}
          >
            News & Article
          </Badge>
          <Text
            as={"h2"}
            className="rubix-text-subheading"
            marginBottom={"1rem"}
          >
            The Proofchain Technical Whitepaper
          </Text>
          <Text className="rubix-text-small">
            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut et massa
            mi. Aliquam in hendrerit urna. Pellentesque sit amet sapien
            fringilla, mattis ligula consectetur, ultrices mauris. Maecenas
            vitae,Aliquam in hendrerit urna. Pellentesque sit amet sapien
            fringilla, mattis ligula consectetur, ultrices mauris. Maecenas
            vitae,Aliquam in hendrerit urna. Pellentesque sit amet sapien
            fringilla, mattis ligula consectetur, ultrices mauris. Maecenas
            vitae
          </Text>
        </Box>
      </Box>
    </Box>
  );
};

export default TabsVideo;