правки по дизайну

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-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-base text-gray-600 z-20 relative">{subtitle}</div>
     </div>
   )
 }

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>

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}%` }}
     />
   )