Skip to content

Commit b00b80e

Browse files
TJun-JieTJun-Jie
committed
change logo and styles
1 parent 2df1c81 commit b00b80e

File tree

4 files changed

+154
-130
lines changed

4 files changed

+154
-130
lines changed

‎public/logo.jpg

-11 KB
Binary file not shown.

‎public/newnewlogo.jpg

9.1 KB
Loading

‎src/app/layout.tsx

+8-2
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@ import "./globals.css";
22
import type { Metadata } from "next";
33
import { Inter } from "next/font/google";
44
import ConvexClientProvider from "./ConvexClientProvider";
5+
import Image from "next/image";
56

67
import "overlayscrollbars/overlayscrollbars.css";
78

@@ -18,8 +19,13 @@ export default function RootLayout({
1819
<div className="tw-flex tw-flex-col tw-min-h-screen tw-bg-gray-900 tw-text-gray-100">
1920
<header className="tw-p-4 tw-bg-gray-800">
2021
<div className="tw-flex tw-justify-left tw-items-center">
21-
<a href="/" className="tw-text-2xl tw-font-semibold">AtlasAI</a>
22-
<a href="/stats" className="tw-text-xl tw-ml-4">📊</a>
22+
<Image src="/newnewlogo.jpg" alt="logo" width={70} height={70} />
23+
<a href="/" className="tw-text-2xl tw-font-semibold">
24+
AtlasAI
25+
</a>
26+
<a href="/stats" className="tw-text-xl tw-ml-8">
27+
Stats
28+
</a>
2329
</div>
2430
</header>
2531
<main className="tw-flex-grow tw-p-4">

‎src/app/page.tsx

+146-128
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@ import {
1010
Typography,
1111
Button,
1212
IconButton,
13+
CircularProgress,
1314
} from "@mui/material";
1415
import { Delete, DoneAll, AddReaction } from "@mui/icons-material";
1516
import { useState } from "react";
@@ -76,10 +77,6 @@ export default function Home() {
7677

7778
const [isModalOpen, setIsModalOpen] = useState(false);
7879

79-
if (!tasks && !reccos) {
80-
return <div>Loading...</div>;
81-
}
82-
8380
function cleanString(str: string) {
8481
const stopwords = [
8582
"schedule",
@@ -435,7 +432,7 @@ export default function Home() {
435432
</div>
436433

437434
<div className="tw-flex tw-flex-col tw-justify-between tw-w-max">
438-
{Array.from({ length: 24 }, (_, i) => i).map((hour) => (
435+
{Array.from({ length: 17 }, (_, i) => i + 7).map((hour) => (
439436
<div
440437
key={hour}
441438
className="tw-flex tw-row tw-items-center"
@@ -517,51 +514,54 @@ export default function Home() {
517514
</div>
518515

519516
<div className="tw-flex tw-flex-col tw-justify-between tw-w-max">
520-
{Array.from({ length: 24 }, (_, i) => i).map((hour) => (
521-
<div
522-
key={hour}
523-
className="tw-flex tw-row tw-items-center"
524-
>
525-
<div className="tw-h-12 tw-flex tw-items-center tw-justify-start tw-w-[70px] tw-text-white">
526-
{hour}:00
527-
</div>
528-
<div className="tw-flex tw-row tw-item-center tw-w-full tw-justify-start">
529-
{["Mon"].map((day) => {
530-
const currentTask = getReccosForTimeSlot(
531-
day,
532-
hour
533-
);
534-
const shouldDisplayTitle =
535-
currentTask && isReccosStart(currentTask, hour);
536-
537-
if (currentTask) {
517+
{Array.from({ length: 17 }, (_, i) => i + 7).map(
518+
(hour) => (
519+
<div
520+
key={hour}
521+
className="tw-flex tw-row tw-items-center"
522+
>
523+
<div className="tw-h-12 tw-flex tw-items-center tw-justify-start tw-w-[70px] tw-text-white">
524+
{hour}:00
525+
</div>
526+
<div className="tw-flex tw-row tw-item-center tw-w-full tw-justify-start">
527+
{["Mon"].map((day) => {
528+
const currentTask = getReccosForTimeSlot(
529+
day,
530+
hour
531+
);
532+
const shouldDisplayTitle =
533+
currentTask &&
534+
isReccosStart(currentTask, hour);
535+
536+
if (currentTask) {
537+
return (
538+
<div
539+
className="tw-w-[100px] tw-flex tw-justify-center tw-text-center"
540+
key={day}
541+
>
542+
{/* Content for each hour can be added here */}
543+
<div className="tw-w-full tw-h-12 tw-border-l-2 tw-border-r-2 tw-border-gray-200 tw-bg-[#3f50b5] tw-text-white">
544+
{shouldDisplayTitle && (
545+
<TaskItem task={currentTask} />
546+
)}
547+
</div>
548+
</div>
549+
);
550+
}
538551
return (
539552
<div
540553
className="tw-w-[100px] tw-flex tw-justify-center tw-text-center"
541554
key={day}
542555
>
543556
{/* Content for each hour can be added here */}
544-
<div className="tw-w-full tw-h-12 tw-border-l-2 tw-border-r-2 tw-border-gray-200 tw-bg-[#3f50b5] tw-text-white">
545-
{shouldDisplayTitle && (
546-
<TaskItem task={currentTask} />
547-
)}
548-
</div>
557+
<div className="tw-w-full tw-h-12 tw-border-b-2 tw-border-l-2 tw-border-r-2 tw-text-white "></div>
549558
</div>
550559
);
551-
}
552-
return (
553-
<div
554-
className="tw-w-[100px] tw-flex tw-justify-center tw-text-center"
555-
key={day}
556-
>
557-
{/* Content for each hour can be added here */}
558-
<div className="tw-w-full tw-h-12 tw-border-b-2 tw-border-l-2 tw-border-r-2 tw-text-white "></div>
559-
</div>
560-
);
561-
})}
560+
})}
561+
</div>
562562
</div>
563-
</div>
564-
))}
563+
)
564+
)}
565565
</div>
566566
</div>
567567

@@ -594,48 +594,51 @@ export default function Home() {
594594
</div>
595595

596596
<div className="tw-flex tw-flex-col tw-justify-between tw-w-max">
597-
{Array.from({ length: 24 }, (_, i) => i).map((hour) => (
598-
<div
599-
key={hour}
600-
className="tw-flex tw-row tw-items-center"
601-
>
602-
<div className="tw-flex tw-row tw-item-center tw-w-full tw-justify-start">
603-
{["Mon"].map((day) => {
604-
const currentTask = getReccosForTimeSlot(
605-
day,
606-
hour
607-
);
608-
const shouldDisplayTitle =
609-
currentTask && isReccosStart(currentTask, hour);
610-
611-
if (currentTask) {
597+
{Array.from({ length: 17 }, (_, i) => i + 7).map(
598+
(hour) => (
599+
<div
600+
key={hour}
601+
className="tw-flex tw-row tw-items-center"
602+
>
603+
<div className="tw-flex tw-row tw-item-center tw-w-full tw-justify-start">
604+
{["Mon"].map((day) => {
605+
const currentTask = getReccosForTimeSlot(
606+
day,
607+
hour
608+
);
609+
const shouldDisplayTitle =
610+
currentTask &&
611+
isReccosStart(currentTask, hour);
612+
613+
if (currentTask) {
614+
return (
615+
<div
616+
className="tw-w-[500px] tw-flex tw-justify-center tw-text-center"
617+
key={day}
618+
>
619+
{/* Content for each hour can be added here */}
620+
<div className="tw-w-full tw-h-12 tw-border-l-2 tw-border-r-2 tw-border-gray-200 tw-bg-[#3f50b5] tw-text-white">
621+
{shouldDisplayTitle && (
622+
<Recommended recco={currentTask} />
623+
)}
624+
</div>
625+
</div>
626+
);
627+
}
612628
return (
613629
<div
614-
className="tw-w-[500px] tw-flex tw-justify-center tw-text-center"
630+
className="tw-w-full tw-flex tw-justify-center tw-text-center"
615631
key={day}
616632
>
617633
{/* Content for each hour can be added here */}
618-
<div className="tw-w-full tw-h-12 tw-border-l-2 tw-border-r-2 tw-border-gray-200 tw-bg-[#3f50b5] tw-text-white">
619-
{shouldDisplayTitle && (
620-
<Recommended recco={currentTask} />
621-
)}
622-
</div>
634+
<div className="tw-w-full tw-h-12 tw-border-b-2 tw-border-l-2 tw-border-r-2 tw-text-white "></div>
623635
</div>
624636
);
625-
}
626-
return (
627-
<div
628-
className="tw-w-full tw-flex tw-justify-center tw-text-center"
629-
key={day}
630-
>
631-
{/* Content for each hour can be added here */}
632-
<div className="tw-w-full tw-h-12 tw-border-b-2 tw-border-l-2 tw-border-r-2 tw-text-white "></div>
633-
</div>
634-
);
635-
})}
637+
})}
638+
</div>
636639
</div>
637-
</div>
638-
))}
640+
)
641+
)}
639642
</div>
640643
</div>
641644
</div>
@@ -728,15 +731,21 @@ export default function Home() {
728731
Insights
729732
</div>
730733
<OverlayScrollbarsComponent style={{ height: "400px" }}>
731-
<div className="tw-text-base tw-space-y-2">
732-
{/* Assuming insights is an array of strings */}
734+
{!tasks ? (
735+
<div className="tw-w-full tw-flex tw-justify-center">
736+
<CircularProgress />
737+
</div>
738+
) : (
739+
<div className="tw-text-base tw-space-y-2">
740+
{/* Assuming insights is an array of strings */}
733741

734-
{insights.map((insight, index) => (
735-
<div key={index} className="tw-p-1">
736-
{insight}
737-
</div>
738-
))}
739-
</div>
742+
{insights.map((insight, index) => (
743+
<div key={index} className="tw-p-1">
744+
{insight}
745+
</div>
746+
))}
747+
</div>
748+
)}
740749
</OverlayScrollbarsComponent>
741750
</div>
742751

@@ -757,6 +766,7 @@ export default function Home() {
757766
Calendar
758767
</h1>
759768
</div>
769+
760770
<div className="tw-flex tw-flex-col tw-px-6 tw-rounded-lg tw-shadow-md tw-overflow-x-auto tw-text-black tw-h-[80vh]">
761771
<div className="tw-grid tw-grid-cols-25 tw-w-fit tw-ml-auto tw-mr-auto">
762772
{/* Hour Labels */}
@@ -784,9 +794,19 @@ export default function Home() {
784794
className="tw-flex tw-flex-row tw-w-max tw-justify-between tw-align-center "
785795
>
786796
<div className="tw-h-3 tw-flex tw-items-center tw-justify-start tw-w-[50px]"></div>
787-
<div className="tw-flex tw-row tw-item-center tw-w-full tw-justify-start ">
788-
{daysOfWeek.map((day) => {
789-
if (day === "Sun") {
797+
{tasks && (
798+
<div className="tw-flex tw-row tw-item-center tw-w-full tw-justify-start ">
799+
{daysOfWeek.map((day) => {
800+
if (day === "Sun") {
801+
return (
802+
<div
803+
key={day}
804+
className="tw-w-[100px] tw-flex tw-justify-center tw-text-center "
805+
>
806+
<div className="tw-w-full tw-h-3 tw-border-l-2"></div>
807+
</div>
808+
);
809+
}
790810
return (
791811
<div
792812
key={day}
@@ -795,61 +815,59 @@ export default function Home() {
795815
<div className="tw-w-full tw-h-3 tw-border-l-2"></div>
796816
</div>
797817
);
798-
}
799-
return (
800-
<div
801-
key={day}
802-
className="tw-w-[100px] tw-flex tw-justify-center tw-text-center "
803-
>
804-
<div className="tw-w-full tw-h-3 tw-border-l-2"></div>
805-
</div>
806-
);
807-
})}
808-
</div>
818+
})}
819+
</div>
820+
)}
809821
</div>
810822
</div>
811823

812-
<div className="tw-flex tw-flex-col tw-justify-between tw-w-max">
813-
{Array.from({ length: 24 }, (_, i) => i).map((hour) => (
814-
<div key={hour} className="tw-flex tw-row tw-items-center">
815-
<div className="tw-h-12 tw-flex tw-items-center tw-justify-start tw-w-[50px] tw-text-white">
816-
{hour}:00
817-
</div>
818-
<div className="tw-flex tw-row tw-item-center tw-w-full tw-justify-start">
819-
{daysOfWeek.map((day) => {
820-
const currentTask = getTaskForTimeSlot(day, hour);
821-
const shouldDisplayTitle =
822-
currentTask && istaskStart(currentTask, day, hour);
824+
{!tasks ? (
825+
<div className="tw-flex tw-w-full tw-justify-center tw-mt-10 ">
826+
<CircularProgress />
827+
</div>
828+
) : (
829+
<div className="tw-flex tw-flex-col tw-justify-between tw-w-max">
830+
{Array.from({ length: 17 }, (_, i) => i + 7).map((hour) => (
831+
<div key={hour} className="tw-flex tw-row tw-items-center">
832+
<div className="tw-h-12 tw-flex tw-items-center tw-justify-start tw-w-[50px] tw-text-white">
833+
{hour}:00
834+
</div>
835+
<div className="tw-flex tw-row tw-item-center tw-w-full tw-justify-start">
836+
{daysOfWeek.map((day) => {
837+
const currentTask = getTaskForTimeSlot(day, hour);
838+
const shouldDisplayTitle =
839+
currentTask && istaskStart(currentTask, day, hour);
823840

824-
if (currentTask) {
841+
if (currentTask) {
842+
return (
843+
<div
844+
className="tw-w-[100px] tw-flex tw-justify-center tw-text-center"
845+
key={day}
846+
>
847+
{/* Content for each hour can be added here */}
848+
<div className="tw-w-full tw-h-12 tw-border-l-2 tw-border-gray-200 tw-bg-[#3f50b5] tw-text-white">
849+
{shouldDisplayTitle && (
850+
<TaskItem task={currentTask} />
851+
)}
852+
</div>
853+
</div>
854+
);
855+
}
825856
return (
826857
<div
827858
className="tw-w-[100px] tw-flex tw-justify-center tw-text-center"
828859
key={day}
829860
>
830861
{/* Content for each hour can be added here */}
831-
<div className="tw-w-full tw-h-12 tw-border-l-2 tw-border-gray-200 tw-bg-[#3f50b5] tw-text-white">
832-
{shouldDisplayTitle && (
833-
<TaskItem task={currentTask} />
834-
)}
835-
</div>
862+
<div className="tw-w-full tw-h-12 tw-border-b-2 tw-border-l-2 tw-text-white "></div>
836863
</div>
837864
);
838-
}
839-
return (
840-
<div
841-
className="tw-w-[100px] tw-flex tw-justify-center tw-text-center"
842-
key={day}
843-
>
844-
{/* Content for each hour can be added here */}
845-
<div className="tw-w-full tw-h-12 tw-border-b-2 tw-border-l-2 tw-text-white "></div>
846-
</div>
847-
);
848-
})}
865+
})}
866+
</div>
849867
</div>
850-
</div>
851-
))}
852-
</div>
868+
))}
869+
</div>
870+
)}
853871
</div>
854872
</div>
855873
</div>

0 commit comments

Comments
 (0)