From 162e492f93a6f2c5070c88588e2bc75c4c924838 Mon Sep 17 00:00:00 2001 From: ITQ Date: Tue, 2 Apr 2024 22:45:22 +0300 Subject: [PATCH] Fixed navbar --- frontend/src/components/pages/Main/Main.tsx | 70 +++++++++++-------- .../widgets/Header/Header.module.less | 4 +- .../src/components/widgets/Header/Header.tsx | 24 ++++--- 3 files changed, 58 insertions(+), 40 deletions(-) diff --git a/frontend/src/components/pages/Main/Main.tsx b/frontend/src/components/pages/Main/Main.tsx index cce580e..e802d31 100644 --- a/frontend/src/components/pages/Main/Main.tsx +++ b/frontend/src/components/pages/Main/Main.tsx @@ -1,4 +1,4 @@ -import less from "./Main.module.less" +import less from "./Main.module.less"; import { useTranslation } from "react-i18next"; import { Input } from "../../shared/ui/input"; import { submitRegister } from "../../widgets/Header/AuthAPI"; @@ -8,31 +8,44 @@ import { Link, useNavigate } from "react-router-dom"; import { useEffect, useState } from "react"; import { deleteEvent, eventList } from "../AdminEventPage/AdminEventAPI"; import VacancyCard from "../../entities/VacancyCard/VacancyCard"; -import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../../ui/card"; +import { + Card, + CardContent, + CardDescription, + CardHeader, + CardTitle, +} from "../../ui/card"; import { TrashIcon } from "lucide-react"; -import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogTrigger } from "../../shared/ui/dialog"; +import { + Dialog, + DialogContent, + DialogDescription, + DialogHeader, + DialogTitle, + DialogTrigger, +} from "../../shared/ui/dialog"; import { t } from "i18next"; - - const Main = () => { - const { t } = useTranslation(); - const navigate = useNavigate(); + const { t } = useTranslation(); + const navigate = useNavigate(); - const [events, setEvents] = useState([]); + const [events, setEvents] = useState([]); - useEffect(() => { - eventList().then((data) => { - setEvents(data) - }).catch(error => { - console.error('Возникла ошибка с получением:', error) - }) - }, []); + useEffect(() => { + eventList() + .then((data) => { + setEvents(data); + }) + .catch((error) => { + console.error("Возникла ошибка с получением:", error); + }); + }, []); -return ( + return (
-
- {events.map((event) => ( +
+ {/* {events.map((event) => (
@@ -70,15 +83,14 @@ return (
- ))} - - -
-
- -
- + ))} */} + +
+
-) -} -export default Main; \ No newline at end of file + ); +}; + +export default Main; diff --git a/frontend/src/components/widgets/Header/Header.module.less b/frontend/src/components/widgets/Header/Header.module.less index 2808aaa..7426dd5 100644 --- a/frontend/src/components/widgets/Header/Header.module.less +++ b/frontend/src/components/widgets/Header/Header.module.less @@ -5,13 +5,15 @@ justify-content:space-between; align-items: center; padding: 0px 32px; +} + +.header_no_index { width: 100%; z-index: 999; position: fixed; width: 100%; top: 0; background-color: hsl(var(--background)); - } @logo-size: 80px; diff --git a/frontend/src/components/widgets/Header/Header.tsx b/frontend/src/components/widgets/Header/Header.tsx index d69c50e..6e7e2bb 100644 --- a/frontend/src/components/widgets/Header/Header.tsx +++ b/frontend/src/components/widgets/Header/Header.tsx @@ -1,18 +1,22 @@ -import less from "./Header.module.less" - +import less from "./Header.module.less"; import { ModeToggle } from "../../mode-toggle"; -import { Link } from "react-router-dom"; - +import { Link, useLocation } from "react-router-dom"; const Header = () => { + const location = useLocation(); + + const isRoot = location.pathname !== "/"; + + const headerClasses = isRoot ? `${less.header} ${less.header_no_index}` : less.header; + return ( -
- +
+ Logo
-
- ) -} -export default Header; \ No newline at end of file + ); +}; + +export default Header;