You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

93 lines
3.0 KiB

3 years ago
import React from "react";
3 years ago
import BreadCrumb from "../BreadCrumb";
import SearchBox from "../SearchBox";
import TitleSubtitle from "../TitleSubtitle";
3 years ago
import CardHolder from "../CardHolder";
import ButtonNewDesign from "../ButtonNewDesign";
import Playlist from "../Playlist";
import Folderlists from "../Folderlist";
3 years ago
3 years ago
import graySearchIcon from "./images/gray-search-icon.svg";
import arrowLeft from "./images/arrow-left.svg";
import plus from "./images/plus.svg";
3 years ago
const FileManager = () => {
return (
3 years ago
<div style={{ backgroundColor: "#FBFBFB" }} className="flex flex-row">
3 years ago
{/* ? right Section */}
<div className="flex-1 ">
3 years ago
<div className="px-7 py-5">
{/* ? breadCrumb */}
<div className="mb-5">
<BreadCrumb />
</div>
{/* ? pageTitle & searchbox */}
<div className="flex flex-row justify-between">
{/* ? pageTitle */}
<TitleSubtitle />
{/* ? searchbox */}
<div className="self-end">
<SearchBox
borderClr={"#EEEEEE"}
backgroundColor={"#fff"}
inputWidth={"100%"}
placeHolderColor={"placeholder-gray-300"}
searchIcon={graySearchIcon}
/>
</div>
</div>
{/* cardHolder */}
<Playlist />
3 years ago
</div>
3 years ago
<div className="bg-white">
<div className="flex flex-col px-7 py-5">
{/* pageTitleSubTitle & Buttons */}
<div className="flex flex-row item-center justify-between">
{/* ? pageTitle */}
<div className="flex-1">
<TitleSubtitle />
</div>
{/* buttons */}
<div className="flex flex-row item-center justify-between self-center gap-2">
<ButtonNewDesign
bgColor={"bg-blue-500"}
bgHoverColor={"hover:bg-blue-600"}
iconBgColor={null}
textColor={"text-white"}
border={"border"}
borderColor={"border-blue-500"}
borderRadius={"rounded"}
fontSize={"text-xs"}
padding={"p-3"}
icon={true}
buttonIcon={arrowLeft}
/>
<ButtonNewDesign
bgColor={"bg-blue-100"}
bgHoverColor={"hover:bg-blue-600"}
iconBgColor={null}
textColor={"text-blue-900"}
border={"border"}
borderColor={"border-blue-500"}
borderRadius={"rounded"}
fontSize={"text-xs"}
padding={"p-3"}
icon={true}
buttonIcon={arrowLeft}
/>
</div>
</div>
<Folderlists />
</div>
3 years ago
</div>
</div>
3 years ago
{/* left Section */}
<CardHolder />
3 years ago
</div>
);
3 years ago
};
3 years ago
export default FileManager;