Tatyana/Rehab_React_Vite_my_old
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

адаптивность страницы Курсы

Browse Source
This commit is contained in:
Tatyana 2025-08-29 15:06:17 +03:00
parent 9af2258517
commit 89464a2cd1
2 changed files with 7 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/pages/CourseExercises.tsx
View File

@ -1,6 +1,5 @@
"use client"
import { useState, useEffect } from "react";
import { useParams, useHistory, useLocation } from "react-router-dom";

14
src/pages/Courses.tsx
View File

@ -36,7 +36,7 @@ const AnalitcsCards = () => {
<ProgressLine />
{/* Текст поверх линии */}
<div className="absolute text-white font-semibold text-base">Вы прошли реабилитацию на {85}%</div>
<div className="absolute text-white font-semibold text-sm sm:text-base">Вы прошли реабилитацию на {85}%</div>
</div>
</div>
</div>
@ -133,9 +133,9 @@ export const Courses = () => {
)}
{/* Заголовок секции */}
<div className="flex items-center justify-between mb-6">
<div className="flex flex-col sm:flex-row content-center justify-between mb-6">
<h2 className="text-xl font-black text-[#5F5C5C]">Мои курсы</h2>
<span className="text-sm text-gray-500">{courses.length} курсов</span>
<span className="text-sm text-gray-500"> Назначенных: {courses.length}</span>
</div>
{/* Выводим список курсов */}
@ -151,10 +151,10 @@ export const Courses = () => {
onClick={() => history.push(getRouteCourseExercises(course.ID.toString()), { course })}
className="bg-white/30 backdrop-blur-2xl rounded-3xl p-6 border border-white/20 shadow-xl cursor-pointer hover:shadow-2xl transition-all duration-300 transform hover:scale-[1.02]"
>
<div className="flex items-center space-x-5">
<div className="flex flex-col sm:flex-row sm:content-center space-x-5">
{/* Изображение курса */}
{course.url_file_img && (
<div className="w-16 h-16 rounded-2xl overflow-hidden flex-shrink-0">
<div className="h-10 w-10 md:h-20 md:w-20 rounded-2xl overflow-hidden flex-shrink-0">
<img
src={course.url_file_img || "/placeholder.svg"}
alt={course.title}
@ -183,14 +183,14 @@ export const Courses = () => {
</div>
{/* Информация о прогрессе */}
<div className="flex justify-between items-center">
<div className="flex flex-col md:flex-row md:justify-between content-center">
<p className="text-sm text-[#5F5C5C]/70 font-semibold">{progress}% завершено</p>
<p className="text-xs text-[#5F5C5C]/50">{Math.floor(Math.random() * 15) + 5} упражнений</p>
</div>
</div>
{/* Иконка стрелки */}
<div className="text-[#2BACBE] transform transition-transform duration-300 hover:translate-x-1">
<div className="hidden sm:block text-[#2BACBE] transform transition-transform duration-300 hover:translate-x-1 my-auto">
<svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
</svg>