diff --git a/luckydiamond/src/assets/css/PagesStyles/games-pages/jackpot.css b/luckydiamond/src/assets/css/PagesStyles/games-pages/jackpot.css new file mode 100644 index 0000000..e69de29 diff --git a/luckydiamond/src/assets/css/global.css b/luckydiamond/src/assets/css/global.css index 52575a5..c2a4cbc 100644 --- a/luckydiamond/src/assets/css/global.css +++ b/luckydiamond/src/assets/css/global.css @@ -11,7 +11,8 @@ ul { list-style: none; } -body, html { +body, +html { background: #121212; height: 100%; margin: 0; @@ -47,12 +48,12 @@ button { grid-auto-columns: 1fr; grid-auto-flow: row; grid-template-areas: - "menu header header header header header header" - "menu main main main main main chat" - "menu main main main main main chat" - "menu gamemode gamemode gamemode gamemode gamemode chat" - "menu gamemode gamemode gamemode gamemode gamemode chat" - "menu gamemode gamemode gamemode gamemode gamemode chat"; + "menu header header header header header header" + "menu main main main main main chat" + "menu main main main main main chat" + "menu gamemode gamemode gamemode gamemode gamemode chat" + "menu gamemode gamemode gamemode gamemode gamemode chat" + "menu gamemode gamemode gamemode gamemode gamemode chat"; height: 100%; grid-gap: 0.625rem; } @@ -64,13 +65,14 @@ button { grid-auto-columns: 1fr; grid-auto-flow: row; grid-template-areas: - "menu header header header header header header" - "menu profile profile profile profile profile chat" - "menu profile profile profile profile profile chat" - "menu profile profile profile profile profile chat" - "menu profile profile profile profile profile chat" - "menu profile profile profile profile profile chat" - "menu profile profile profile profile profile chat"; + "menu header header header header header header" + "menu profile profile profile profile profile chat" + "menu profile profile profile profile profile chat" + "menu profile profile profile profile profile chat" + "menu profile profile profile profile profile chat" + "menu profile profile profile profile profile chat" + "menu profile profile profile profile profile chat" + "menu profile profile profile profile profile chat"; grid-gap: 0.625rem; height: 100%; } @@ -81,13 +83,29 @@ button { grid-template-columns: 0.35fr repeat(5, 1fr) 1fr; grid-template-rows: auto 0fr repeat(4, 1fr); grid-template-areas: - "menu header header header header header header" - "menu saper saper saper saper saper chat" - "menu saper saper saper saper saper chat" - "menu saper saper saper saper saper chat" - "menu saper saper saper saper saper chat" - "menu saper saper saper saper saper chat" - "menu saper saper saper saper saper chat"; + "menu header header header header header header" + "menu saper saper saper saper saper chat" + "menu saper saper saper saper saper chat" + "menu saper saper saper saper saper chat" + "menu saper saper saper saper saper chat" + "menu saper saper saper saper saper chat" + "menu saper saper saper saper saper chat"; + grid-gap: 0.625rem; +} + +.content-grid--jackpot { + display: grid; + grid-auto-columns: 1fr; + grid-template-columns: 0.35fr repeat(5, 1fr) 1fr; + grid-template-rows: auto 0fr repeat(4, 1fr); + grid-template-areas: + "menu header header header header header header" + "menu jackpot jackpot jackpot jackpot jackpot chat" + "menu jackpot jackpot jackpot jackpot jackpot chat" + "menu jackpot jackpot jackpot jackpot jackpot chat" + "menu jackpot jackpot jackpot jackpot jackpot chat" + "menu jackpot jackpot jackpot jackpot jackpot chat" + "menu jackpot jackpot jackpot jackpot jackpot chat"; grid-gap: 0.625rem; } @@ -99,13 +117,13 @@ button { gap: 0.625rem; grid-auto-flow: row; grid-template-areas: - "menu header header header header header header" - "menu crash crash crash crash crash chat" - "menu crash crash crash crash crash chat" - "menu crash crash crash crash crash chat" - "menu crash crash crash crash crash chat" - "menu crash crash crash crash crash chat" - "menu crash crash crash crash crash chat"; + "menu header header header header header header" + "menu crash crash crash crash crash chat" + "menu crash crash crash crash crash chat" + "menu crash crash crash crash crash chat" + "menu crash crash crash crash crash chat" + "menu crash crash crash crash crash chat" + "menu crash crash crash crash crash chat"; } /* /Content Grid */ @@ -182,6 +200,16 @@ button { margin: 0.625rem 2.438rem 1.125rem 1.125rem; } +.jackpot { + display: flex; + grid-area: jackpot; + height: 95%; + border-radius: 3.125rem; + background: #17181C; + box-shadow: 0.25rem 0.25rem 0.25rem 0px rgba(0, 0, 0, 0.25); + margin: 0.625rem 2.438rem 1.125rem 1.125rem; +} + /* /Profile */ /* Saper */ @@ -211,4 +239,4 @@ button { /* Media */ -/* /Media */ +/* /Media */ \ No newline at end of file diff --git a/luckydiamond/src/pages/HomePage.vue b/luckydiamond/src/pages/HomePage.vue index baa1abd..0ba80f7 100644 --- a/luckydiamond/src/pages/HomePage.vue +++ b/luckydiamond/src/pages/HomePage.vue @@ -50,7 +50,8 @@

{{ mode.title }}

- play > + + play >
diff --git a/luckydiamond/src/pages/games-pages/JackpotPage.vue b/luckydiamond/src/pages/games-pages/JackpotPage.vue new file mode 100644 index 0000000..62c5d55 --- /dev/null +++ b/luckydiamond/src/pages/games-pages/JackpotPage.vue @@ -0,0 +1,51 @@ + + diff --git a/luckydiamond/src/router/router.js b/luckydiamond/src/router/router.js index 25c678e..2085a1e 100644 --- a/luckydiamond/src/router/router.js +++ b/luckydiamond/src/router/router.js @@ -4,6 +4,7 @@ import HomePage from "../pages/HomePage.vue"; import ProfilePage from "@/pages/ProfilePage.vue"; import SapergamePage from "@/pages/games-pages/SapergamePage.vue"; import CrashGamePage from "@/pages/games-pages/CrashgamePage.vue"; +import JackpotPage from "@/pages/games-pages/JackpotPage.vue"; import SettingsPage from "@/pages/SettingsPage.vue" import AboutPage from "@/pages/AboutPage.vue" export default createRouter({ @@ -13,6 +14,7 @@ export default createRouter({ { path: '/profile', component: ProfilePage, name: 'profile' }, { path: '/game/saper', component: SapergamePage, name: 'saper' }, { path: '/game/crash', component: CrashGamePage, name: 'crash' }, + { path: '/game/jackpot', component: JackpotPage, name: 'jackpot' }, { path: '/settings', component: SettingsPage, name: 'settings' }, { path: '/about', component: AboutPage, name: 'about' }, ]