+ 
+
+
+ {name}
+
+ {error && (
+
+ {error}
+
+ )}
+
+
+
+ );
+}
+
+export default CompetitionsPage;
\ No newline at end of file
diff --git a/services/frontend/src/pages/CompetitionsPage/modules/CompetitionGrid/index.tsx b/services/frontend/src/pages/CompetitionsPage/modules/CompetitionGrid/index.tsx
new file mode 100644
index 0000000..abbe28e
--- /dev/null
+++ b/services/frontend/src/pages/CompetitionsPage/modules/CompetitionGrid/index.tsx
@@ -0,0 +1,46 @@
+import { Competition } from "../../types";
+import { CompetitionCard } from "../../components/CompetitionCard";
+import CompetitionSkeleton from "../../components/CompetitionSkeleton";
+import { cn } from "@/shared/lib/utils";
+
+interface CompetitionGridProps {
+ competitions: Competition[];
+ isLoading?: boolean;
+ className?: string;
+ skeletonCount?: number;
+}
+
+export function CompetitionGrid({
+ competitions,
+ isLoading = false,
+ className,
+ skeletonCount
+}: CompetitionGridProps) {
+ const gridClasses = cn(
+ "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6",
+ className
+ );
+
+ const numberOfSkeletons = skeletonCount ?? (competitions.length > 0 ? competitions.length : 4);
+
+ if (isLoading) {
+ return (
+
+
+
+
+
+
+ Текущие
+ Завершенные
+
+
+
+
+ {isLoading ? (
+ Мои события
+
+
+ )}
+ + {activeTab === "ongoing" ? "У вас нет текущих соревнований" : "У вас нет завершенных соревнований"} +
+
+
+ Доступные события
+ + {isLoading ? ( +
+
+ )}
+ Нет доступных соревнований
+
+ {Array.from({ length: numberOfSkeletons }).map((_, index) => (
+
+ );
+ }
+
+ return (
+
+ {competitions.map((competition) => (
+
+ );
+}
\ No newline at end of file
diff --git a/services/frontend/src/pages/CompetitionsPage/modules/Navbar/index.tsx b/services/frontend/src/pages/CompetitionsPage/modules/Navbar/index.tsx
new file mode 100644
index 0000000..ba1062a
--- /dev/null
+++ b/services/frontend/src/pages/CompetitionsPage/modules/Navbar/index.tsx
@@ -0,0 +1,24 @@
+import { ChevronDown } from "lucide-react";
+
+const Navbar = () => {
+ return (
+
+ );
+};
+
+
+export default Navbar
\ No newline at end of file
diff --git a/services/frontend/src/pages/CompetitionsPage/types.ts b/services/frontend/src/pages/CompetitionsPage/types.ts
new file mode 100644
index 0000000..544f4f3
--- /dev/null
+++ b/services/frontend/src/pages/CompetitionsPage/types.ts
@@ -0,0 +1,13 @@
+export enum Status {
+ InProgress = 'В процессе',
+ NotParticipating = 'Не участвую',
+ Completed = 'Завершено'
+}
+
+export interface Competition {
+ id: string;
+ name: string;
+ imageUrl: string;
+ isOlympics: boolean;
+ status: Status;
+}
diff --git a/services/frontend/src/styles/fonts.css b/services/frontend/src/styles/fonts.css
new file mode 100644
index 0000000..8f6986d
--- /dev/null
+++ b/services/frontend/src/styles/fonts.css
@@ -0,0 +1,20 @@
+@font-face {
+ font-family: 'HSE Sans';
+ src: url('/fonts/HSESans-Regular.otf') format('opentype');
+ font-weight: normal;
+ font-style: normal;
+}
+
+@font-face {
+ font-family: 'HSE Sans';
+ src: url('/fonts/HSESans-Bold.otf') format('opentype');
+ font-weight: bold;
+ font-style: normal;
+}
+
+@font-face {
+ font-family: 'HSE Sans';
+ src: url('/fonts/HSESans-SemiBold.otf') format('opentype');
+ font-weight: 600;
+ font-style: normal;
+}
\ No newline at end of file
diff --git a/services/frontend/src/styles/globals.css b/services/frontend/src/styles/globals.css
index 1f613d0..9df6fec 100644
--- a/services/frontend/src/styles/globals.css
+++ b/services/frontend/src/styles/globals.css
@@ -1,5 +1,5 @@
@import "tailwindcss";
-
+@import "./fonts.css";
@plugin "tailwindcss-animate";
@custom-variant dark (&:is(.dark *));
@@ -40,6 +40,9 @@
--sidebar-ring: oklch(0.87 0 0);
}
+@theme inline {
+ --font-hse-sans: "HSE Sans", system-ui, sans-serif
+}
.dark {
--background: oklch(0.145 0 0);
--foreground: oklch(0.985 0 0);
diff --git a/services/frontend/tailwind.config.js b/services/frontend/tailwind.config.js
new file mode 100644
index 0000000..50cd5f6
--- /dev/null
+++ b/services/frontend/tailwind.config.js
@@ -0,0 +1,11 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+ theme: {
+ extend: {
+ fontFamily: {
+ 'hse-sans': ['"HSE Sans"', 'system-ui', 'sans-serif'],
+ },
+ },
+ },
+ plugins: [],
+}