Skip to content

Commit

Permalink
Merge pull request #59 from rahulg1254/course-planner
Browse files Browse the repository at this point in the history
Task #222912 feat : Responsive design updates and ts issue resolved
  • Loading branch information
itsvick authored Jul 28, 2024
2 parents 15e5465 + 0a2ae3c commit 99d11d6
Show file tree
Hide file tree
Showing 2 changed files with 67 additions and 84 deletions.
4 changes: 2 additions & 2 deletions src/pages/course-planner/foundation.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,7 @@ const Foundation = () => {
) : (
<Box>
<Box
sx={{
sx={{
display: "grid",
gridTemplateColumns: "1fr 2fr 1fr",
gap: isSmallScreen ? "8px" : "16px",
Expand All @@ -115,7 +115,7 @@ const Foundation = () => {
{!selectedCardId ? (
cardData.map((card) => (
<Card
key={card.id}
key={card.id}
sx={{
display: "grid",
gridTemplateColumns: "1fr 2fr 1fr",
Expand Down
147 changes: 65 additions & 82 deletions src/pages/stateDetails.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,6 @@ import {
Card,
Typography,
Button,
CircularProgress,
IconButton,
useTheme,
useMediaQuery,
Expand Down Expand Up @@ -38,7 +37,6 @@ const StateDetails = () => {

useEffect(() => {
const fetchData = async () => {
// Simulate data fetching
setTimeout(() => {
const foundCard = cardData.find((c) => c.id === cardId);
setCard(foundCard);
Expand Down Expand Up @@ -130,94 +128,79 @@ const StateDetails = () => {
</Box>
</Box>
<Box sx={{ marginTop: "16px" }}>
{card.boards.map(
(
board:
| string
| number
| bigint
| boolean
| React.ReactElement<
any,
string | React.JSXElementConstructor<any>
>
| Iterable<React.ReactNode>
| Promise<React.AwaitedReactNode>
| null
| undefined,
index: React.Key | null | undefined
) => (
<Card
key={index}
{card.boards.map((board: string, index: number) => (
<Card
key={index}
sx={{
display: "grid",
gridTemplateColumns: "1fr 2fr 1fr",
alignItems: "center",
cursor: "pointer",
border: "1px solid #0000001A",
boxShadow: "none",
transition: "background-color 0.3s",
"&:hover": {
backgroundColor: "#EAF2FF",
},
marginTop: "8px",
padding: "16px",
}}
onClick={() => {
if (typeof board === "string") {
handleBoardClick(board);
}
}}
>
<Box
sx={{
display: "grid",
gridTemplateColumns: "1fr 2fr 1fr",
display: "flex",
alignItems: "center",
cursor: "pointer",
border: "1px solid #0000001A",
boxShadow: "none",
transition: "background-color 0.3s",
"&:hover": {
backgroundColor: "#EAF2FF",
},
marginTop: "8px",
padding: "16px",
gap: "8px",
}}
onClick={() => {
if (typeof board === "string") {
handleBoardClick(board);
}
>
<FolderOutlinedIcon />
<Typography variant="h6" sx={{ fontSize: "16px" }}>
{board}
</Typography>
</Box>
<Box
sx={{
display: "flex",
alignItems: "center",
gap: "16px",
}}
>
<Box
sx={{
display: "flex",
alignItems: "center",
gap: "8px",
}}
>
<FolderOutlinedIcon />
<Typography variant="h6" sx={{ fontSize: "16px" }}>
{board}
</Typography>
<Box sx={{ width: "40px", height: "40px" }}>
<CircularProgressbar
value={(card.boardsUploaded / card.totalBoards) * 100}
strokeWidth={10}
styles={buildStyles({
pathColor: "#06A816",
trailColor: "#E6E6E6",
strokeLinecap: "round",
})}
/>
</Box>
<Box
sx={{
display: "flex",
alignItems: "center",
gap: "16px",
<Typography sx={{ fontSize: "14px" }}>
{card.boardsUploaded} / {card.totalBoards}{" "}
{t("COURSE_PLANNER.SUBJECTS_UPLOADED")}
</Typography>
</Box>
<Box sx={{ display: "flex", justifyContent: "center" }}>
<Button
onClick={(e) => {
e.stopPropagation();
if (typeof board === "string") {
handleCopyLink(board);
}
}}
sx={{ minWidth: "auto", padding: 0 }}
>
<Box sx={{ width: "40px", height: "40px" }}>
<CircularProgressbar
value={(card.boardsUploaded / card.totalBoards) * 100}
strokeWidth={10}
styles={buildStyles({
pathColor: "#06A816",
trailColor: "#E6E6E6",
strokeLinecap: "round",
})}
/>
</Box>
<Typography sx={{ fontSize: "14px" }}>
{card.boardsUploaded} / {card.totalBoards}{" "}
{t("COURSE_PLANNER.SUBJECTS_UPLOADED")}
</Typography>
</Box>
<Box sx={{ display: "flex", justifyContent: "center" }}>
<Button
onClick={(e: React.MouseEvent<HTMLButtonElement>) => {
e.stopPropagation();
handleCopyLink(board as string);
}}
sx={{ minWidth: "auto", padding: 0 }}
>
<InsertLinkOutlinedIcon />
</Button>
</Box>
</Card>
)
)}
<InsertLinkOutlinedIcon />
</Button>
</Box>
</Card>
))}{" "}
</Box>
</Box>
);
Expand Down

0 comments on commit 99d11d6

Please sign in to comment.