добавила компонент хедера

src/components/HeaderNav.tsx

@@ -0,0 +1,31 @@
+import type React from "react"
+
+
+interface HeaderProps {
+    item: string
+    text: string
+}
+
+const HeaderNav: React.FC<HeaderProps> = ({
+    item,
+    text,
+}) => {
+
+  
+
+return (
+<div className="opacity-90 fixed top-0 left-0 right-0 bg-gradient-to-br from-[#3ABBC7] to-[#0D212C] pt-6 pb-2 z-50 shadow-lg rounded-b-3xl">
+    <div className="absolute inset-0 bg-gradient-to-r from-black/10 to-transparent"></div>
+    <div className="relative px-4 sm:px-6 py-4 max-w-4xl mx-auto ">
+        <p className="text-cyan-100 text-sm font-medium">{text}</p>
+        <h1 className="text-xl sm:text-2xl font-semibold text-white">{item}</h1>
+    </div>
+</div>
+)
+
+}
+
+export default HeaderNav; 
+
+
+

src/pages/Home.tsx

@@ -1,6 +1,9 @@
 "use client"
 import { useEffect, useState } from "react"
 import { useHistory } from "react-router-dom"
+
+
+import HeaderNav from "../components/HeaderNav"
 import BottomNavigation from "../components/BottomNavigation"
 import CircularProgressDisplay from "../components/CircularProgressDisplay"
 
@@ -11,7 +14,6 @@ export default function Home() {
   useEffect(() => {
     setCurrentDate(
       new Date().toLocaleDateString("ru-RU", {
-
         year: "numeric",
         month: "long",
         day: "numeric",
@@ -22,10 +24,6 @@ export default function Home() {
 
 
 
-
-
-
-
   const courses = [
     {
       id: 1,
@@ -62,13 +60,18 @@ export default function Home() {
   const overallProgress = Math.round(courses.reduce((sum, course) => sum + course.progress, 0) / totalCourses)
 
   return (
-    <div className="bg-gray-50 w-full h-full overflow-auto pb-50">
+
-      <div className="py-20 min-h-screen max-w-4xl mx-auto">
+    
-        {/* Header */}
+
+    <div className="bg-gray-50 w-full h-full overflow-auto">
+      <div className="my-32 min-h-screen max-w-4xl mx-auto">
+
+ <HeaderNav  item='Результаты' text='главная'/>
+
         <div className="bg-white rounded-3xl p-6 shadow-lg mb-6 mx-4 sm:mx-6">
           <div className="flex items-center justify-between mb-6 border-b-2 pb-4">
             <div>
-              <h1 className="text-2xl font-bold text-gray-600 mb-2">Результаты</h1>
+              <h1 className="text-2xl font-bold text-gray-600 mb-2">Добрый день!</h1>
             </div>
             <div className="text-right">
               <p className="text-gray-600 font-medium text-sm sm:text-base">{currentDate}</p>
@@ -100,9 +103,14 @@ export default function Home() {
             {/* Заголовок и статус */}
             <div className="flex items-center justify-between flex-wrap mb-6 border-b-2 pb-4">
               <h2 className="text-xl sm:text-2xl font-extrabold">Тренировка</h2>
-              <div className="px-3 py-1 bg-white/20 rounded-full shadow-lg backdrop-blur-sm">
+              <button
-                <span className="text-white text-sm font-semibold">Активно</span>
+                onClick={() => history.goBack()}
-              </div>
+                className="w-12 h-12 glass-morphism rounded-2xl flex items-center justify-center border border-white/30 hover:bg-white/30 transition-all duration-300 shadow-lg ml-auto"
+              >
+                <svg className="w-6 h-6 text-white transform rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 19l-7-7L15 5" />
+                </svg>
+              </button>
             </div>
             {/* Основной блок с иконками и прогрессом */}
             <div className="flex items-start flex-wrap space-x-4 mb-6">
@@ -128,14 +136,7 @@ export default function Home() {
                 <p className="text-white/70 font-medium mb-4 text-base">Текущее упражнение</p>
                 {/* Кнопка с стрелкой */}
               </div>
-              <button
+
-                onClick={() => history.goBack()}
-                className="w-12 h-12 glass-morphism rounded-2xl flex items-center justify-center border border-white/30 hover:bg-white/30 transition-all duration-300 shadow-lg ml-auto"
-              >
-                <svg className="w-6 h-6 text-white transform rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                  <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 19l-7-7L15 5" />
-                </svg>
-              </button>
             </div>
           </div>
           {/* Quick Stats (Total Exercises & Total Courses) */}