From 6494bb76259c972418c60c9f7819d40c34022888 Mon Sep 17 00:00:00 2001
From: Tatyana <krasnovavgma@yandex.ru>
Date: Mon, 8 Sep 2025 21:19:06 +0300
Subject: [PATCH] =?UTF-8?q?=D0=BF=D1=80=D0=B0=D0=B2=D0=BA=D0=B8=20=D0=BF?=
 =?UTF-8?q?=D0=BE=20=D0=B4=D0=B8=D0=B7=D0=B0=D0=B9=D0=BD=D1=83?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/cards/StatCardHome.tsx    | 19 ++-----------------
 src/components/cards/WorkoutCardHome.tsx |  6 +++---
 src/pages/Courses.tsx                    |  2 +-
 3 files changed, 6 insertions(+), 21 deletions(-)

diff --git a/src/components/cards/StatCardHome.tsx b/src/components/cards/StatCardHome.tsx
index 25b0474..d37dac0 100644
--- a/src/components/cards/StatCardHome.tsx
+++ b/src/components/cards/StatCardHome.tsx
@@ -1,8 +1,4 @@
 "use client"
-//Когда нужен "use client"?
-// Если компонент использует React хуки (useState, useEffect, useContext и т.п.).
-// Если он взаимодействует с браузерными API или DOM.
-// Если он содержит обработчики событий или управляет состоянием.
 
 import type React from "react"
 
@@ -14,17 +10,6 @@ interface StatCardProps {
   onClick: () => void
 }
 
-//Это тип компонента React, который принимает определенные пропсы.
-//     React.ComponentType<...> — это тип компонента, который можно использовать как JSX <Icon />.
-//     Внутри <...> указаны пропсы, которые этот компонент принимает.
-
-// Какие пропсы у иконки?
-
-//     size?: number — необязательный размер иконки (например, в пикселях).
-//     fill?: string — необязательный цвет заливки.
-//     className?: string — необязственный CSS-класс.
-//     style?: React.CSSProperties — необязательные inline-стили.
-
 export const StatCardHome: React.FC<StatCardProps> = ({ title, subtitle, icon: Icon, fill, onClick }) => {
   return (
     <div
@@ -40,8 +25,8 @@ export const StatCardHome: React.FC<StatCardProps> = ({ title, subtitle, icon: I
       </div>
 
       {/* Текст */}
-      <div className="text-base sm:text-xl font-bold text-gray-800 sm:mb-1 z-20 relative">{title}</div>
-      <div className="text-sm sm:text-base text-gray-600 z-20 relative">{subtitle}</div>
+      <div className="text-xl font-bold text-gray-800 sm:mb-1 z-20 relative">{title}</div>
+      <div className="text-base text-gray-600 z-20 relative">{subtitle}</div>
     </div>
   )
 }
diff --git a/src/components/cards/WorkoutCardHome.tsx b/src/components/cards/WorkoutCardHome.tsx
index a41e703..9e74e61 100644
--- a/src/components/cards/WorkoutCardHome.tsx
+++ b/src/components/cards/WorkoutCardHome.tsx
@@ -62,9 +62,9 @@ export const WorkoutCardHome: React.FC<WorkoutCardProps> = ({ onBackClick, onCar
       </div>
 
       {/* Основной блок с иконками и прогрессом */}
-      <div className="flex items-start flex-wrap space-x-4 mb-1">
+      <div className="flex items-start flex-wrap space-x-4 sm:mb-1">
         {/* Иконка часов */}
-        <div className="relative flex-shrink-0 mr-6">
+        <div className="relative flex-shrink-0 mr-6 mb-4 sm:mb-0">
           <div className="w-20 h-20 bg-white/70 rounded-2xl flex items-center justify-center shadow-xl transition-transform hover:scale-105 duration-300">
             {/* Clock SVG */}
             <svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 20 20" fill="none">
@@ -90,7 +90,7 @@ export const WorkoutCardHome: React.FC<WorkoutCardProps> = ({ onBackClick, onCar
         {/* Информация о упражнении */}
         <div className="flex flex-col justify-center flex-grow">
           <h3 className="font-extrabold text-lg mb-2">{getExerciseStatus()}</h3>
-          <p className="text-white/70 font-medium mb-4 text-base">{getExerciseDescription()}</p>
+          <p className="text-white/70 font-medium text-base">{getExerciseDescription()}</p>
         </div>
       </div>
     </div>
diff --git a/src/pages/Courses.tsx b/src/pages/Courses.tsx
index 4ec143c..ef43493 100644
--- a/src/pages/Courses.tsx
+++ b/src/pages/Courses.tsx
@@ -33,7 +33,7 @@ interface User {
 const ProgressLine = ({ progress }: { progress: number }) => {
   return (
     <div
-      className="h-full bg-gradient-to-r from-orange-300 to-orange-500 transition-all duration-500 absolute left-0 top-0 rounded-l-2xl"
+      className="h-full bg-gradient-to-r from-orange-300 to-orange-500 transition-all duration-500 absolute left-0 top-0 rounded-2xl "
       style={{ width: `${progress}%` }}
     />
   )