import Head from "./Head";
import Date from "./Date";
import Activities from "./Activities";

function UserDetail({ data, loading }) {
  return (
    <div className="hidden xl:flex min-w-[332px] h-full opacity-page">
      <div
        className="min-w-[337px] p-[24px] border-0 border-r border-r-[#EFEFEF] h-full items-start fixed top-0 left-0
        g-[#FFF] py-[40px] px-[16px] bg-[#FFF] dark:bg-[#222433] dark:border-transparent"
      >
        <Head data={data} loading={loading} />
        <span className="block w-full h-px bg-[#EFEFEF] px-[22px] mt-[13px] mb-[16px] dark:bg-[#343645]"></span>
        <Date />
        <Activities data={data} loading={loading} />
      </div>
    </div>
  );
}

export default UserDetail;
