rebuild grid for crash

This commit is contained in:
Kostya
2024-02-04 12:53:26 +03:00
parent d6ecad2554
commit a530bf2c6a
3 changed files with 46 additions and 24 deletions

View File

@@ -0,0 +1,16 @@
.crash-content {
display: grid;
grid-template-columns: repeat(6, 1fr);
grid-template-rows: repeat(5, 1fr);
gap: 10px;
grid-auto-flow: row;
grid-template-areas:
"crashgame crashgame crashgame crashgame crashgame crashgame"
"crashgame crashgame crashgame crashgame crashgame crashgame"
"crashgame crashgame crashgame crashgame crashgame crashgame"
"crashplayers crashplayers crashplayers crashplayers crashplayers crashplayers"
"crashplayers crashplayers crashplayers crashplayers crashplayers crashplayers";
background: #17181C;
box-shadow: 0 4px #00000040;
border-radius: 20px;
}

View File

@@ -82,12 +82,12 @@ body, html {
grid-auto-flow: row;
grid-template-areas:
"menu header header header header header header"
"menu crashgame crashgame crashgame crashgame crashgame chat"
"menu crashgame crashgame crashgame crashgame crashgame chat"
"menu crashgame crashgame crashgame crashgame crashgame chat"
"menu crashgame crashgame crashgame crashgame crashgame chat"
"menu crashplayers crashplayers crashplayers crashplayers crashplayers chat"
"menu crashplayers crashplayers crashplayers crashplayers crashplayers 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 crash crash crash crash crash chat";
}
/* /Content Grid */
@@ -177,13 +177,15 @@ body, html {
/* Crash */
.crash-content {
grid-area: crash;
}
.crash-game {
grid-area: crashgame;
background: #8f07ff;
}
.crash-game__players {
background: #1900ff;
grid-area: crashplayers;
}

View File

@@ -7,13 +7,14 @@
<header-component></header-component>
<div class="crash-content">
<section class="crash-game">
<div class="crash-game__content">
<div class="crash-game__start-window">
</div>
<div class="crash-game__graph">
<crash-graph-component></crash-graph-component>
<!-- <crash-graph-component></crash-graph-component>-->
</div>
</div>
</section>
@@ -23,6 +24,7 @@
</div>
</section>
</div>
</div>
</template>
@@ -31,9 +33,11 @@
import HeaderComponent from "@/components/HeaderComponent.vue";
import AsideBarComponent from "@/components/AsidebarComponent.vue";
import ChatComponent from "@/components/ChatComponent.vue";
import CrashGraphComponent from "@/components/games-components/CrashGraphComponent.vue";
// import CrashGraphComponent from "@/components/games-components/CrashGraphComponent.vue";
import '@/assets/css/PagesStyles/games-pages/crash.css'
export default {
components: { HeaderComponent, AsideBarComponent, ChatComponent, CrashGraphComponent }
components: { HeaderComponent, AsideBarComponent, ChatComponent }
}
</script>