From 0168aa7b718d3ff293acf13bdb20b200fb42bf00 Mon Sep 17 00:00:00 2001 From: Iskandarov Timur Date: Tue, 8 Oct 2024 11:10:56 +0500 Subject: [PATCH] =?UTF-8?q?=D0=9F=D0=BE=D0=B4=D1=80=D1=83=D0=B6=D0=B8?= =?UTF-8?q?=D0=BB=20=D0=B8=D0=B3=D1=80=D1=83=20=D0=B8=20=D1=81=D1=82=D1=80?= =?UTF-8?q?=D0=B0=D0=BD=D0=B8=D1=86=D1=83=20=D0=B8=D0=B3=D1=80=D1=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/client/src/app/App.tsx | 7 +----- packages/client/src/components/Game/Game.scss | 25 ------------------- packages/client/src/components/Game/Game.tsx | 12 ++++----- packages/client/src/pages/Game/Game.scss | 6 ++++- packages/client/src/pages/Game/Game.tsx | 20 +++++++++++---- packages/client/src/pages/Game/GamePage.scss | 7 ------ 6 files changed, 26 insertions(+), 51 deletions(-) delete mode 100644 packages/client/src/pages/Game/GamePage.scss diff --git a/packages/client/src/app/App.tsx b/packages/client/src/app/App.tsx index 82d6ee9..7e87010 100644 --- a/packages/client/src/app/App.tsx +++ b/packages/client/src/app/App.tsx @@ -3,19 +3,14 @@ import RootLayout from '@/layouts/RootLayout/RootLayout' import PrivateLayout from '@/layouts/PrivateLayout/PrivateLayout' import AuthLayout from '@/layouts/AuthLayout/AuthLayout' import PublicLayout from '@/layouts/PublicLayout/PublicLayout' -import RootLayout from '@/layouts/RootLayout/RootLayout' import { Error } from '@/pages/Error/Error' import { Forum } from '@/pages/Forum/Forum' -import { GamePage } from '@/pages/Game/Game' import { Leaderboard } from '@/pages/Leaderboard/Leaderboard' import { Main } from '@/pages/Main/Main' import { SignIn } from '@/pages/SignIn/SignIn' import { SignUp } from '@/pages/SignUp/SignUp' import { Game } from '@/pages/Game/Game' -import { Forum } from '@/pages/Forum/Forum' -import { Error } from '@/pages/Error/Error' import { Thread } from '@/pages/Thread/Thread' -import { Leaderboard } from '@/pages/Leaderboard/Leaderboard' import { Profile } from '@/pages/Profile/Profile' import { ChangePassword } from '@/pages/Profile/ChangePassword' import { SvgSprite } from '@/components/ui/SvgSprite/SvgSprite' @@ -39,7 +34,7 @@ const routerConfig = createBrowserRouter([ children: [ { path: '/game', - element: , + element: , }, { path: '/forum', diff --git a/packages/client/src/components/Game/Game.scss b/packages/client/src/components/Game/Game.scss index ede582f..93e80be 100644 --- a/packages/client/src/components/Game/Game.scss +++ b/packages/client/src/components/Game/Game.scss @@ -11,31 +11,6 @@ position: relative; } -.modal { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - background-color: rgba(0, 0, 0, 0.8); - color: white; - padding: 20px; - border-radius: 8px; - text-align: center; -} - -button { - margin-top: 10px; - padding: 10px 20px; - border: none; - background-color: $c_button; - color: white; - border-radius: 8px; - cursor: pointer; -} - -button:hover { - background-color: $c_button-bottom; -} canvas { border-radius: $border-radius--default; box-shadow: 0 4px 8px rgba($c_black, 0.5); diff --git a/packages/client/src/components/Game/Game.tsx b/packages/client/src/components/Game/Game.tsx index 916c93b..46cc8c7 100644 --- a/packages/client/src/components/Game/Game.tsx +++ b/packages/client/src/components/Game/Game.tsx @@ -10,6 +10,7 @@ import { } from '@/components/Game/controls' import { ControlsProps, Obstacle } from '@/components/Game/gameTypes' import { initializeObstacle } from '@/components/Game/obstacle' +import { Modal } from '../common/Modal/Modal' const livesUse = 3 @@ -103,13 +104,10 @@ export const Game: React.FC = () => { )} - {/* Модальное окно при проигрыше */} - {isGameOver && ( -
-

Игра окончена

- -
- )} + setIsGameOver(false)}> +

Игра окончена

+ + ) } diff --git a/packages/client/src/pages/Game/Game.scss b/packages/client/src/pages/Game/Game.scss index 05aa4d7..74732fb 100644 --- a/packages/client/src/pages/Game/Game.scss +++ b/packages/client/src/pages/Game/Game.scss @@ -19,7 +19,7 @@ $border-color: #70842f; .game-wrapper { position: relative; width: 800px; - height: 600px; + height: auto; background-color: $c_black; border-radius: 8px; overflow: hidden; @@ -150,6 +150,10 @@ $border-color: #70842f; position: absolute; inset: 12px; background-color: $overlay-color; + + &_hide { + display: none; + } } .game-over-screen { diff --git a/packages/client/src/pages/Game/Game.tsx b/packages/client/src/pages/Game/Game.tsx index 9f8002c..e3f46de 100644 --- a/packages/client/src/pages/Game/Game.tsx +++ b/packages/client/src/pages/Game/Game.tsx @@ -1,13 +1,14 @@ +import './Game.scss' import { CustomPageTitle } from '@/components/ui/CustomPageTitle/CustomPageTitle' import { Arrows } from './components/Arrows/Arrows' import { KillsCounter } from './components/KillsCounter/KillsCounter' -import './Game.scss' import { PauseHelp } from './components/PauseHelp/PauseHelp' import { FireControll } from './components/FireControll/FireControll' import { useEffect, useState } from 'react' import { Modal } from '@/components/common/Modal/Modal' import GameInfo from '@/assets/images/game-info.jpg' import { Button } from '@/components/ui/Button/Button' +import { Game as GamePrototype } from '@/components/Game/Game' export const Game = () => { const [isInfoModalOpen, setIsInfoModalOpen] = useState(false) @@ -18,6 +19,7 @@ export const Game = () => { rightButton: false, fireButton: false, }) + const [isStartedGame, setIsStartedGame] = useState(false) const pauseHandler = () => { console.log('pauseHandler') @@ -83,11 +85,19 @@ export const Game = () => {
- Воот тут игра -
-
-
+
Game Over
diff --git a/packages/client/src/pages/Game/GamePage.scss b/packages/client/src/pages/Game/GamePage.scss deleted file mode 100644 index 8ba7e90..0000000 --- a/packages/client/src/pages/Game/GamePage.scss +++ /dev/null @@ -1,7 +0,0 @@ -.game-page { - display: flex; - justify-content: center; - align-items: center; - height: 100vh; - background-color: #010101; // Цвет фона для всей страницы -}