-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
design:improve design and bug fixed ui/ux
- Loading branch information
1 parent
7d163d3
commit e379fdd
Showing
11 changed files
with
92 additions
and
140 deletions.
There are no files selected for viewing
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,10 +1,10 @@ | ||
| export default function LazyBookComponent() { | ||
| return ( | ||
| <div className="flex space-x-2 justify-center items-center bg-transparent mt-[10%] dark:invert"> | ||
| <div className="flex space-x-2 justify-center items-center bg-transparent mt-[50%] lg:mt-[15%] "> | ||
| <span className="sr-only">Loading...</span> | ||
| <div className="h-6 w-6 bg-[#16a34a] rounded-full animate-bounce [animation-delay:-0.3s]"></div> | ||
| <div className="h-6 w-6 bg-[#16a34a] rounded-full animate-bounce [animation-delay:-0.15s]"></div> | ||
| <div className="h-6 w-6 bg-[#16a34a] rounded-full animate-bounce"></div> | ||
| <div className="h-4 w-4 bg-[#16a34a] rounded-full animate-bounce [animation-delay:-0.3s]"></div> | ||
| <div className="h-4 w-4 bg-[#16a34a] rounded-full animate-bounce [animation-delay:-0.15s]"></div> | ||
| <div className="h-4 w-4 bg-[#16a34a] rounded-full animate-bounce"></div> | ||
| </div> | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,76 +1,91 @@ | ||
| import Link from 'next/link'; | ||
| import React from 'react' | ||
| import Image from "next/image"; | ||
| import Link from "next/link"; | ||
| import React from "react"; | ||
|
|
||
| export default function SingleReserved({ bookname, image, index, expire, returned ,createdAt ,bookId}) { | ||
| function setStatus(){ | ||
| export default function SingleReserved({ | ||
| bookname, | ||
| image, | ||
| index, | ||
| expire, | ||
| returned, | ||
| createdAt, | ||
| bookId, | ||
| }) { | ||
| function setStatus() { | ||
| switch (returned) { | ||
| case "PENDING": | ||
| return <span className=" text-orange-500 border border-orange-500 text-sm font-medium px-3 py-0.5 rounded ">انتظار تایید</span> | ||
| break; | ||
|
|
||
| case "ACTIVE": | ||
| return <span className=" text-green-600 border border-green-500 text-sm font-medium px-3 py-0.5 rounded ">امانت فعال </span> | ||
| break; | ||
|
|
||
|
|
||
| case "REJECT": | ||
| return <span className=" text-red-500 border border-red-500 text-sm font-medium px-3 py-0.5 rounded ">رد شده</span> | ||
| break; | ||
| case "ACTIVE": | ||
| return ( | ||
| <span className=" text-yellow-600 border border-yellow-500 text-sm font-medium px-3 py-0.5 rounded "> | ||
| امانت فعال | ||
| </span> | ||
| ); | ||
| break; | ||
|
|
||
| case "CLOSED": | ||
| return <span className=" text-sky-500 border border-sky-500 text-sm font-medium px-3 py-0.5 rounded ">تحویل داده شده</span> | ||
| break; | ||
| case "CLOSED": | ||
| return ( | ||
| <span className=" text-green-600 border border-green-500 text-sm font-medium px-3 py-0.5 rounded "> | ||
| تحویل داده شده | ||
| </span> | ||
| ); | ||
| break; | ||
| } | ||
| } | ||
| return ( | ||
|
|
||
| <li key={index} className=" py-10 sm:py-4"> | ||
| <div className="flex items-center "> | ||
| <div className="flex-shrink-0"> | ||
| <Link | ||
| href={{ pathname: "/book/[id]" }} | ||
| as={`/book/${bookId}`} | ||
| > | ||
| <a> | ||
| <img className="w-20 h-28 rounded-sm" src={image} alt="Neil image" /> | ||
| </a> | ||
| <Link href={{ pathname: "/book/[id]" }} as={`/book/${bookId}`}> | ||
| <a> | ||
| <Image | ||
| src={image} | ||
| alt="Just a flower" | ||
| unoptimized={true} | ||
| width={85} | ||
|
|
||
| height={100} | ||
| blurDataURL="YOUR_GENERATED_BLURHASH_STRING" | ||
| quality={20} | ||
| layout="intrinsic" | ||
| objectFit="contain" | ||
| className="rounded-md" | ||
| /> | ||
| </a> | ||
| </Link> | ||
|
|
||
| </div> | ||
| <div className="flex-1 min-w-0 pr-4"> | ||
| <Link | ||
| href={{ pathname: "/book/[id]" }} | ||
| as={`/book/${bookId}`} | ||
| > | ||
| <a> | ||
| <p className="text-sm font-medium text-gray-900 truncate "> | ||
| {bookname} | ||
| </p> | ||
| </a> | ||
| <Link href={{ pathname: "/book/[id]" }} as={`/book/${bookId}`}> | ||
| <a> | ||
| <p className="text-sm font-medium text-gray-900 truncate "> | ||
| {bookname} | ||
| </p> | ||
| </a> | ||
| </Link> | ||
| <p className="text-xs mt-3 font-medium text-gray-700 truncate "> | ||
| کد کتاب : {bookId} | ||
| کد کتاب : {bookId} | ||
| </p> | ||
| <p dir='ltr' className=" text-xs mt-3 font-medium text-gray-900 truncate "> | ||
| {expire}: تاریخ امانت کتاب | ||
| </p> | ||
|
|
||
| <p dir='ltr' className=" text-xs mt-3 font-medium text-gray-900 truncate "> | ||
| {createdAt}: موعد تحویل | ||
| <p | ||
| dir="ltr" | ||
| className=" text-xs mt-3 font-medium text-gray-900 truncate " | ||
| > | ||
| {expire}: تاریخ امانت کتاب | ||
| </p> | ||
|
|
||
| <p | ||
| dir="ltr" | ||
| className=" text-xs mt-3 font-medium text-gray-900 truncate " | ||
| > | ||
| {createdAt}: موعد تحویل | ||
| </p> | ||
| </div> | ||
| <div className="hidden md:block justify-items-start float-left mb-5 text-base font-semibold text-gray-900 "> | ||
| {setStatus()} | ||
| </div> | ||
| <div className="hidden md:block justify-items-start float-left mb-5 text-base font-semibold text-gray-900 "> | ||
| {setStatus()} | ||
| </div> | ||
| </div> | ||
| <div className="justify-items-start float-left mb-5 md:hidden text-base font-semibold text-gray-900 "> | ||
| <div className="justify-items-start float-left mb-5 md:hidden text-base font-semibold text-gray-900 "> | ||
| {setStatus()} | ||
| </div> | ||
|
|
||
|
|
||
|
|
||
| </li> | ||
|
|
||
| ) | ||
| } | ||
| ); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.