From e693525f8f6646d86e1e1ce9b967adfe04609647 Mon Sep 17 00:00:00 2001 From: Elhoucine Azayou Date: Fri, 28 Jun 2024 14:32:57 +0200 Subject: [PATCH] feat(#vil-493): responsive activities - Fix layout - Fix pagination --- .../PaginationNav/PaginationNav.module.css | 7 ----- .../PaginationNav/PaginationNav.tsx | 28 ++++++++----------- .../activities/ActivityCard/AnthemCard.tsx | 2 +- .../activities/ActivityCard/DefiCard.tsx | 2 +- .../activities/ActivityCard/EnigmeCard.tsx | 2 +- .../ActivityCard/FreeContentCard.tsx | 2 +- .../activities/ActivityCard/IndiceCard.tsx | 2 +- .../activities/ActivityCard/MascotteCard.tsx | 2 +- .../ActivityCard/PresentationCard.tsx | 2 +- .../activities/ActivityCard/ReportageCard.tsx | 2 +- .../activities/ActivityCard/StoryCard.tsx | 2 +- .../activities/ActivityCard/SymbolCard.tsx | 2 +- .../ActivityCard/VerseRecordCard.tsx | 14 ++++++---- .../activities/ActivityCard/index.tsx | 23 +++++++++------ 14 files changed, 46 insertions(+), 46 deletions(-) delete mode 100644 src/components/PaginationNav/PaginationNav.module.css diff --git a/src/components/PaginationNav/PaginationNav.module.css b/src/components/PaginationNav/PaginationNav.module.css deleted file mode 100644 index 30449c9ad..000000000 --- a/src/components/PaginationNav/PaginationNav.module.css +++ /dev/null @@ -1,7 +0,0 @@ -.paginationContainer{ - position: relative; -} - -.itemsPerPageContainer{ - display: inline; -} \ No newline at end of file diff --git a/src/components/PaginationNav/PaginationNav.tsx b/src/components/PaginationNav/PaginationNav.tsx index 37e46e2de..1b529fe22 100644 --- a/src/components/PaginationNav/PaginationNav.tsx +++ b/src/components/PaginationNav/PaginationNav.tsx @@ -1,9 +1,7 @@ import React from 'react'; import type { SelectChangeEvent } from '@mui/material'; -import { InputLabel, MenuItem, Pagination, Select } from '@mui/material'; - -import styles from './PaginationNav.module.css'; +import { Box, InputLabel, MenuItem, Pagination, Select } from '@mui/material'; interface PaginationNavProps { page: number; @@ -15,8 +13,14 @@ interface PaginationNavProps { const PaginationNav = ({ page, itemsPerPage, totalItems, handlePage, handleItemsPerPage }: PaginationNavProps) => { return ( -
-
+ + Activités par page @@ -32,17 +36,9 @@ const PaginationNav = ({ page, itemsPerPage, totalItems, handlePage, handleItems 10 25 -
- {totalItems > itemsPerPage && ( - - )} -
+ + {totalItems > itemsPerPage && } + ); }; export default PaginationNav; diff --git a/src/components/activities/ActivityCard/AnthemCard.tsx b/src/components/activities/ActivityCard/AnthemCard.tsx index 8c86ce3d4..6bd51527d 100644 --- a/src/components/activities/ActivityCard/AnthemCard.tsx +++ b/src/components/activities/ActivityCard/AnthemCard.tsx @@ -18,7 +18,7 @@ export const AnthemCard = ({ activity, isSelf, noButtons, isDraft, showEditButto >

Paramétrage de l'hymne du village idéal

-
+

{activity.data.chorusLyrics.map((syllable) => diff --git a/src/components/activities/ActivityCard/DefiCard.tsx b/src/components/activities/ActivityCard/DefiCard.tsx index 3f5a8c416..745c6d3c7 100644 --- a/src/components/activities/ActivityCard/DefiCard.tsx +++ b/src/components/activities/ActivityCard/DefiCard.tsx @@ -69,7 +69,7 @@ export const DefiCard = ({ activity, isSelf, noButtons, isDraft, showEditButtons ? getLanguageTheme(activity.data) : null} -

+
{isCooking(activity) ? `${activity.data.history}. ${activity.data.explanation}` diff --git a/src/components/activities/ActivityCard/EnigmeCard.tsx b/src/components/activities/ActivityCard/EnigmeCard.tsx index 1fb4ae9f8..0efcf3f4f 100644 --- a/src/components/activities/ActivityCard/EnigmeCard.tsx +++ b/src/components/activities/ActivityCard/EnigmeCard.tsx @@ -60,7 +60,7 @@ export const EnigmeCard = ({ activity, isSelf, noButtons, isDraft, showEditButto )}

{enigmeTitle}

-
+
{firstText}
diff --git a/src/components/activities/ActivityCard/FreeContentCard.tsx b/src/components/activities/ActivityCard/FreeContentCard.tsx index 9a08dd2f5..0ce370b72 100644 --- a/src/components/activities/ActivityCard/FreeContentCard.tsx +++ b/src/components/activities/ActivityCard/FreeContentCard.tsx @@ -47,7 +47,7 @@ export const FreeContentCard = ({ activity, isSelf, noButtons, isDraft, showEdit
)}
-
+
{activity.data.title}
diff --git a/src/components/activities/ActivityCard/IndiceCard.tsx b/src/components/activities/ActivityCard/IndiceCard.tsx index 590d6819e..4c4fa84c9 100644 --- a/src/components/activities/ActivityCard/IndiceCard.tsx +++ b/src/components/activities/ActivityCard/IndiceCard.tsx @@ -53,7 +53,7 @@ export const IndiceCard = ({ activity, isSelf, noButtons, isDraft, showEditButto )}

{indiceType.title}

-
+
{firstText}
diff --git a/src/components/activities/ActivityCard/MascotteCard.tsx b/src/components/activities/ActivityCard/MascotteCard.tsx index 89e64cd77..6158ca857 100644 --- a/src/components/activities/ActivityCard/MascotteCard.tsx +++ b/src/components/activities/ActivityCard/MascotteCard.tsx @@ -41,7 +41,7 @@ export const MascotteCard = ({ activity, isSelf, noButtons, isDraft, showEditBut

Notre mascotte {activity.data.mascotteName}

-
+
{firstText}
diff --git a/src/components/activities/ActivityCard/PresentationCard.tsx b/src/components/activities/ActivityCard/PresentationCard.tsx index 8bfda0c43..250d371f1 100644 --- a/src/components/activities/ActivityCard/PresentationCard.tsx +++ b/src/components/activities/ActivityCard/PresentationCard.tsx @@ -53,7 +53,7 @@ export const PresentationCard = ({ activity, isSelf, noButtons, isDraft, showEdi {activity.data.theme !== undefined && (

{PRESENTATION_THEMATIQUE[activity.data.theme as number].cardTitle}

)} -
+
{firstText}
diff --git a/src/components/activities/ActivityCard/ReportageCard.tsx b/src/components/activities/ActivityCard/ReportageCard.tsx index 0c828022a..bf5c5ef2a 100644 --- a/src/components/activities/ActivityCard/ReportageCard.tsx +++ b/src/components/activities/ActivityCard/ReportageCard.tsx @@ -79,7 +79,7 @@ export const ReportageCard = ({ activity, isSelf, noButtons, isDraft, showEditBu )}

{reportageType.title}

-
+
{firstText}
diff --git a/src/components/activities/ActivityCard/StoryCard.tsx b/src/components/activities/ActivityCard/StoryCard.tsx index f9a1bd2c2..7f7af01d9 100644 --- a/src/components/activities/ActivityCard/StoryCard.tsx +++ b/src/components/activities/ActivityCard/StoryCard.tsx @@ -49,7 +49,7 @@ export const StoryCard = ({ activity, isSelf, noButtons, isDraft, showEditButton
)}
-
+

Une histoire du village idéal

{firstText} diff --git a/src/components/activities/ActivityCard/SymbolCard.tsx b/src/components/activities/ActivityCard/SymbolCard.tsx index 28f9af326..61ba895bb 100644 --- a/src/components/activities/ActivityCard/SymbolCard.tsx +++ b/src/components/activities/ActivityCard/SymbolCard.tsx @@ -53,7 +53,7 @@ export const SymbolCard = ({ activity, isSelf, noButtons, isDraft, showEditButto )}

{symbolType.title}

-
+
{firstText}
diff --git a/src/components/activities/ActivityCard/VerseRecordCard.tsx b/src/components/activities/ActivityCard/VerseRecordCard.tsx index 4eaa8bb84..ae4e27bbc 100644 --- a/src/components/activities/ActivityCard/VerseRecordCard.tsx +++ b/src/components/activities/ActivityCard/VerseRecordCard.tsx @@ -1,7 +1,7 @@ import Link from 'next/link'; import React from 'react'; -import { Button } from '@mui/material'; +import { Box, Button } from '@mui/material'; import { CommentIcon } from './CommentIcon'; import type { ActivityCardProps } from './activity-card.types'; @@ -9,11 +9,15 @@ import { RedButton } from 'src/components/buttons/RedButton'; import type { ClassAnthemActivity } from 'types/classAnthem.types'; export const VerseRecordCard = ({ activity, isSelf, noButtons, isDraft, showEditButtons, onDelete }: ActivityCardProps) => ( -
@@ -21,7 +25,7 @@ export const VerseRecordCard = ({ activity, isSelf, noButtons, isDraft, showEdit

Un couplet de l'hymne du village idéal

-
+

{activity.data.verseLyrics.map((syllable, index) => @@ -81,5 +85,5 @@ export const VerseRecordCard = ({ activity, isSelf, noButtons, isDraft, showEdit

)}
-
+ ); diff --git a/src/components/activities/ActivityCard/index.tsx b/src/components/activities/ActivityCard/index.tsx index 978bd37fe..1d0f9a671 100644 --- a/src/components/activities/ActivityCard/index.tsx +++ b/src/components/activities/ActivityCard/index.tsx @@ -1,6 +1,7 @@ import Link from 'next/link'; import React from 'react'; +import { Box } from '@mui/material'; import Paper from '@mui/material/Paper'; import { titles, icons, REACTIONS } from '../utils'; @@ -130,14 +131,6 @@ export const ActivityCard = ({ )}
- {!showEditButtons && isEnigme(activity) && ( - <> - -
- {timeLeft > 0 ? `Temps restant: ${timeLeft}j` : 'La réponse est disponible !'} -
- - )} {activity.isPinned && } {ActivityIcon && !isReaction(activity) && ( )}
+ {!showEditButtons && isEnigme(activity) && ( + + +
+ {timeLeft > 0 ? `Temps restant: ${timeLeft}j` : 'La réponse est disponible !'} +
+ + )}