diff --git a/src/components/UI/Video/SGLVideoCard.tsx b/src/components/UI/Video/SGLVideoCard.tsx index 82bf9c8..c1be629 100644 --- a/src/components/UI/Video/SGLVideoCard.tsx +++ b/src/components/UI/Video/SGLVideoCard.tsx @@ -25,7 +25,7 @@ export const SGLVideoCard = ({ const theme = useTheme() return ( - +
{title} {description} diff --git a/src/constants/index.ts b/src/constants/index.ts index bb59691..5cf56e9 100644 --- a/src/constants/index.ts +++ b/src/constants/index.ts @@ -2,3 +2,5 @@ export const DOT = '•' export const METRIC_MAX_VALUE = '10' export const SLIDER_MIN_VALUE = 1 export const SLIDER_MAX_VALUE = 10 +export const BALANCE_VIDEO_TIME = 15 +export const STRETCH_VIDEO_TIME = 10 diff --git a/src/locales/ar/translation.json b/src/locales/ar/translation.json index 5366858..4272cf5 100644 --- a/src/locales/ar/translation.json +++ b/src/locales/ar/translation.json @@ -78,5 +78,11 @@ "balanceTraining.title": "مصمم لتحسين التوازن", "balanceTraining.description": "سلسلة تمارين لتحسين الاستقرار ومنع السقوط، مصممة خصيصًا لاحتياجاتك.", "balanceTraining.button": "شاهد مقاطع تدريب التوازن", - "dailyReport.title": "مؤشراتي (PROMs)" + "dailyReport.title": "مؤشراتي (PROMs)", + "lifeStyle.todayRecommendations": "توصيات اليوم", + "lifeStyle.balanceExercises": "تمارين التوازن", + "lifeStyle.morningStretchingTitle": "تمارين التمدد الصباحية", + "lifeStyle.morningStretchingDescription": "تحسين تدفق الدم والمرونة", + "lifeStyle.balanceTrainingTitle": "تمارين التوازن", + "lifeStyle.balanceTrainingDescription": "تقوية عضلات الجسم الأساسية وتحسين القوام" } diff --git a/src/locales/en/translation.json b/src/locales/en/translation.json index 0676779..403a887 100644 --- a/src/locales/en/translation.json +++ b/src/locales/en/translation.json @@ -125,5 +125,11 @@ "metricsReport.description": "Your report helps us improve your care", "metricsReport.sendButton": "Submit daily report", "metricsReport.submitSuccess": "Submitted successfully!", - "dailyReport.title": "My Metrics (PROMs)" + "dailyReport.title": "My Metrics (PROMs)", + "lifeStyle.todayRecommendations": "Today's Recommendations", + "lifeStyle.balanceExercises": "Balance Exercises", + "lifeStyle.morningStretchingTitle": "Morning Stretching", + "lifeStyle.morningStretchingDescription": "Improve Blood Flow and Flexibility", + "lifeStyle.balanceTrainingTitle": "Balance Training", + "lifeStyle.balanceTrainingDescription": "Strengthen Core Muscles and Posture" } diff --git a/src/locales/he/translation.json b/src/locales/he/translation.json index 752cb48..db0aa5b 100644 --- a/src/locales/he/translation.json +++ b/src/locales/he/translation.json @@ -126,5 +126,11 @@ "metricsReport.description": "הדיווח שלך עוזר לנו לשפר את הטיפול", "metricsReport.sendButton": "שלח דיווח יומי", "metricsReport.submitSuccess": "בוצע בהצלחה!", - "dailyReport.title": "המדדים שלי (PROMs)" + "dailyReport.title": "המדדים שלי (PROMs)", + "lifeStyle.todayRecommendations": "המלצות להיום", + "lifeStyle.balanceExercises": "תרגילי שיווי משקל", + "lifeStyle.morningStretchingTitle": "מתיחות בוקר", + "lifeStyle.morningStretchingDescription": "שיפור זרימת דם וגמישות", + "lifeStyle.balanceTrainingTitle": "אימון שיווי משקל", + "lifeStyle.balanceTrainingDescription": "חיזוק שרירי ליבה ויציבה" } diff --git a/src/locales/ru/translation.json b/src/locales/ru/translation.json index 451602f..825f4fb 100644 --- a/src/locales/ru/translation.json +++ b/src/locales/ru/translation.json @@ -125,5 +125,11 @@ "metricsReport.description": "Ваш отчет помогает нам улучшить лечение", "metricsReport.sendButton": "Отправить ежедневный отчет", "metricsReport.submitSuccess": "Отправлено успешно!", - "dailyReport.title": "Мои показатели (PROMs)" + "dailyReport.title": "Мои показатели (PROMs)", + "lifeStyle.todayRecommendations": "Рекомендации на сегодня", + "lifeStyle.balanceExercises": "Упражнения на равновесие", + "lifeStyle.morningStretchingTitle": "Утренняя растяжка", + "lifeStyle.morningStretchingDescription": "Улучшение кровообращения и гибкости", + "lifeStyle.balanceTrainingTitle": "Тренировка равновесия", + "lifeStyle.balanceTrainingDescription": "Укрепление мышц кора и осанки" } diff --git a/src/pages/lifeStyle/LifeStyle.tsx b/src/pages/lifeStyle/LifeStyle.tsx index 8e8429a..743df60 100644 --- a/src/pages/lifeStyle/LifeStyle.tsx +++ b/src/pages/lifeStyle/LifeStyle.tsx @@ -1,12 +1,5 @@ -import { useTranslation } from 'react-i18next' -import { BalanceTraining } from './physioAndTrainingTab/balanceTraining/BalanceTraining' +import { RecomendationTraining } from './physioAndTrainingTab/recomendationTraining/RecomendationTraining' export const LifeStyle = () => { - const { t } = useTranslation() - return ( - <> -
{t('lifestyle.page')}
- - - ) + return } diff --git a/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/RecomendationTraining.tsx b/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/RecomendationTraining.tsx new file mode 100644 index 0000000..51479b6 --- /dev/null +++ b/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/RecomendationTraining.tsx @@ -0,0 +1,8 @@ +import { useIsMobile } from '@/hooks/useIsMobile' +import { RecomendationTrainingMobile } from './RecomendationTrainingMobile' +import { RecomendationTrainingDesktop } from './RecomendationTrainingDesktop' +export const RecomendationTraining = () => { + const isMobile = useIsMobile() + + return isMobile ? : +} diff --git a/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/RecomendationTrainingDesktop.tsx b/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/RecomendationTrainingDesktop.tsx new file mode 100644 index 0000000..41f856b --- /dev/null +++ b/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/RecomendationTrainingDesktop.tsx @@ -0,0 +1,44 @@ +import { SGLTypography } from '@/components/UI/Typography/SGLTypography' +import { SGLVideoCard } from '@/components/UI/Video/SGLVideoCard' +import { useTranslation } from 'react-i18next' +import { BalanceTraining } from '../balanceTraining/BalanceTraining' +import { rootStyleDesktop, conteinerDesktop, headerDesktop, videoContainerDesktop } from './style' +import { BALANCE_VIDEO_TIME, STRETCH_VIDEO_TIME } from '@/constants' + +export const RecomendationTrainingDesktop = () => { + const { t } = useTranslation() + + return ( +
+
+
+ + {t('lifeStyle.todayRecommendations')} + +
+
+ + +
+
+
+
+ + {t('lifeStyle.balanceExercises')} + +
+
+ +
+
+
+ ) +} diff --git a/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/RecomendationTrainingMobile.tsx b/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/RecomendationTrainingMobile.tsx new file mode 100644 index 0000000..f143dcd --- /dev/null +++ b/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/RecomendationTrainingMobile.tsx @@ -0,0 +1,34 @@ +import { SGLTypography } from '@/components/UI/Typography/SGLTypography' +import { SGLVideoCard } from '@/components/UI/Video/SGLVideoCard' +import { useTranslation } from 'react-i18next' +import { BalanceTraining } from '../balanceTraining/BalanceTraining' +import { rootStyleMobile } from './style' +import { BALANCE_VIDEO_TIME, STRETCH_VIDEO_TIME } from '@/constants' + +export const RecomendationTrainingMobile = () => { + const { t } = useTranslation() + + return ( + <> +
+ + {t('lifeStyle.todayRecommendations')} + + + + + {t('lifeStyle.balanceExercises')} + + +
+ + ) +} diff --git a/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/style.ts b/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/style.ts new file mode 100644 index 0000000..da2b954 --- /dev/null +++ b/src/pages/lifeStyle/physioAndTrainingTab/recomendationTraining/style.ts @@ -0,0 +1,36 @@ +import type { CSSProperties } from 'react' + +export const rootStyleMobile = { + display: 'flex', + flexDirection: 'column', + gap: '1rem', + padding: '1rem', + paddingBottom: '1rem', +} as CSSProperties + +export const rootStyleDesktop = { + display: 'flex', + flexDirection: 'row', + gap: '1rem', + padding: '1rem', + paddingBottom: '1rem', +} as CSSProperties + +export const conteinerDesktop = { + display: 'flex', + flexDirection: 'column', + flex: 1, + gap: '1rem', + paddingTop: '1rem', +} as CSSProperties + +export const headerDesktop = { + paddingTop: '0.5em', + paddingBottom: '0.5rem', +} as CSSProperties + +export const videoContainerDesktop = { + display: 'flex', + flexDirection: 'column', + gap: '0.5rem', +} as CSSProperties