diff options
| author | Andrew Lee <andrew@alee14.me> | 2025-06-02 16:32:29 -0400 |
|---|---|---|
| committer | Andrew Lee <andrew@alee14.me> | 2025-06-02 16:32:29 -0400 |
| commit | 70d724e77942362f9387c0ca6fc06f2ee22071d9 (patch) | |
| tree | 810fe94ab633a1cff720a978b8b829d73f4f6eb6 /src/app/track | |
| parent | 1ea35f5ec0a43fbf8331ef8afa9dc2266e91eed6 (diff) | |
| download | alure-post-70d724e77942362f9387c0ca6fc06f2ee22071d9.tar.gz alure-post-70d724e77942362f9387c0ca6fc06f2ee22071d9.tar.bz2 alure-post-70d724e77942362f9387c0ca6fc06f2ee22071d9.zip | |
Make the page more pretty
Diffstat (limited to 'src/app/track')
| -rw-r--r-- | src/app/track/page.tsx | 20 |
1 files changed, 10 insertions, 10 deletions
diff --git a/src/app/track/page.tsx b/src/app/track/page.tsx index b4978f3..77fa81a 100644 --- a/src/app/track/page.tsx +++ b/src/app/track/page.tsx @@ -41,31 +41,31 @@ export default function Track() { </form> {params ? ( data ? ( - <div className="pt-5"> + <div className="pt-2"> {!data.abandon && !data.delivered && ( - <div className="p-3 bg-gray-700 rounded-sm">Package is in transit</div> + <div className="p-3 bg-indigo-800 rounded-sm my-2">Package is in transit</div> )} {data.signature && ( - <div className="p-3 bg-yellow-800 rounded-sm">Signature is required when the package arrive</div> + <div className="p-3 bg-yellow-800 rounded-sm my-2">Signature is required when the package arrive</div> )} {data.abandon && ( - <div className="p-3 bg-red-800 rounded-sm">Package has been abandoned</div> + <div className="p-3 bg-red-800 rounded-sm my-2">Package has been abandoned</div> )} {data.delivered && ( - <div className="p-3 bg-green-700 rounded-sm">Package has delivered</div> + <div className="p-3 bg-green-800 rounded-sm my-2">Package has delivered</div> )} - <div className="p-3 bg-sky-800 rounded-sm"> + <div className="p-3 bg-gray-700 rounded-sm"> <h1 className="text-xl">Origin: {data.sender}</h1> <h1 className="text-xl">Delivering to: {data.receiver}</h1> </div> - <h1 className="text-lg">Delivery progress</h1> - <div className="flex flex-col gap-1"> + <h1 className="text-lg my-2">Delivery progress</h1> + <div className="flex flex-col gap-2"> {[...data.history] .sort((a, b) => new Date(b.time).getTime() - new Date(a.time).getTime()) .map((history, idx) => ( - <div key={idx}> + <div key={idx} className="p-3 bg-gray-700 rounded-sm"> <div>{history.info}</div> - <div>{history.location}</div> + <div className="text-sm">{history.location}</div> <div>{new Date(history.time).toLocaleString()}</div> </div> ))} |