design and responsive page doctor and account

This commit is contained in:
Ehsan
2024-08-30 11:59:53 +03:30
parent 707206450c
commit 451ae76cb1
15 changed files with 251 additions and 42 deletions
+7 -6
View File
@@ -9,7 +9,7 @@ import DisLikeComment from "@/components/icons/DisLikeComment";
import ArrowUpComment from "@/components/icons/ArrowUpComment";
import LikeComment from "@/components/icons/LikeComment";
function ItemUser({ update, setUpdate, list, setList, data, loading }) {
function ItemUser({ update, setUpdate, isReply, list, setList, data, loading }) {
const handleLike = (lengthLike, data, nameLike, nameIsLike) => {
if (nameIsLike === 'is_like' && data.is_dislike) {
@@ -48,14 +48,14 @@ function ItemUser({ update, setUpdate, list, setList, data, loading }) {
)}
</div>
</div>
<div className="mr-12 mt-2">
<div className="mt-2">
{loading ? (
<>
<Skeleton variant="text" className="!w-full !mt-8" />
<Skeleton variant="text" className="!w-1/3" />
</>
) : (
<p className="text-[#495057] text-[14px] font-normal leading-[20px] sm:leading-[24px] md:leading-[28px] lg:leading-[30px]">{data.comment}</p>
<p className="text-[#495057] text-[12px] md:text-[14px] font-normal leading-[20px] sm:leading-[24px] md:leading-[28px] lg:leading-[30px]">{data.comment}</p>
)}
<div className="flex items-center justify-start mt-2 gap-[28px]">
<div className="flex items-center justify-start gap-1">
@@ -139,14 +139,15 @@ function ItemUser({ update, setUpdate, list, setList, data, loading }) {
</div>
)}
<ul
className={`flex flex-col justify-center transition-all duration-500 overflow-hidden items-start gap-12
${loading && 'w-full'}
${data.is_open_reply ? 'max-h-fit mt-12' : 'max-h-0'}`}
className={`flex mr-12 flex-col justify-center transition-all duration-500 overflow-hidden items-start gap-12
${loading && 'w-full'}
${data.is_open_reply ? 'max-h-screen mt-12' : 'max-h-0'}`}
>
{data.replays.map((item, idx) => (
<ItemUser
key={idx}
data={item}
isReply={true}
update={update}
loading={loading}
setUpdate={setUpdate}