mirror of
https://github.com/yawaflua/LuckyDiamond.git
synced 2025-12-10 12:19:31 +02:00
66 lines
2.0 KiB
Vue
66 lines
2.0 KiB
Vue
<link rel="stylesheet" href="../../assets/css/PagesStyles/adaptive-pages/homemobile.css">
|
|
<template>
|
|
<div class="content-grid__mobile-home">
|
|
<header class="header-mobile">
|
|
<div class="header-mobile__content">
|
|
<div class="header-mobile__logo">
|
|
<img src="@/assets/icons-adaptive/home-adaptive/logo.svg" alt="LuckyDiamond Play Now">
|
|
</div>
|
|
<div class="header-mobile__balance">
|
|
<div class="header-mobile__balance--content">
|
|
<div class="header-mobile__card card-display card-text card-img">
|
|
<h2><img src="@/assets/icons-adaptive/home-adaptive/icon-diamond-ore.png">999</h2>
|
|
</div>
|
|
<div class="header-mobile__btn--balance btn-card btn-card__margin">
|
|
<a href="#"><img src="@/assets/icons-adaptive/home-adaptive/icon-deposit.png"></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
<main class="main-mobile">
|
|
<div class="main-mobile__content">
|
|
<div class="main-mobile__first-line" v-for="mode in firstlineGameMode" :key="mode">
|
|
<div class="card-mobile__content bg-mobile card-first">
|
|
<h2>{{ mode.title }}</h2>
|
|
<div class="card-mobile__btn">
|
|
<a href="#">Play ></a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="main-mobile__two-line" v-for="mode in twolineGameMode" :key="mode">
|
|
<h1>1</h1>
|
|
</div>
|
|
</div>
|
|
</main>
|
|
<footer class="footer-mobile">
|
|
<h1>footer</h1>
|
|
</footer>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import '@/assets/css/PagesStyles/adaptive-pages/homemobile.css'
|
|
import '@/mocks/GameModes'
|
|
import GameModes from "@/mocks/GameModes";
|
|
|
|
export default {
|
|
data() {
|
|
return {
|
|
GameModes
|
|
}
|
|
},
|
|
computed: {
|
|
firstlineGameMode() {
|
|
return this.GameModes.filter(mode => [1, 2].includes(mode.id))
|
|
},
|
|
twolineGameMode() {
|
|
return this.GameModes.filter(mode => [3, 4].includes(mode.id))
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
|
|
</style> |