import React from "react";

import BreadCrumb from "../BreadCrumb";
import SearchBox from "../SearchBox";
import TitleSubtitle from "../TitleSubtitle";
import CardHolder from "../CardHolder";

import graySearchIcon from "./images/gray-search-icon.svg";

const FileManager = () => {
  return (
    <div style={{ backgroundColor: "#FBFBFB" }}>
      <div className="flex flex-row justify-between w-8/12">
        <div className="">
          <BreadCrumb />
          <TitleSubtitle />
        </div>
        <div className="self-end">
          <SearchBox
            borderClr={"#EEEEEE"}
            backgroundColor={"#fff"}
            inputWidth={"100%"}
            placeHolderColor={"placeholder-gray-300"}
            searchIcon={graySearchIcon}
          />
        </div>
      </div>
      <div className="bg-yellow-600">
        {" "}
        <CardHolder />
      </div>
    </div>
  );
};

export default FileManager;