yawaflua/LuckyDiamond
1
0
Fork 0
mirror of https://github.com/yawaflua/LuckyDiamond.git synced 2025-12-10 12:19:31 +02:00
Code Issues Packages Projects Releases Wiki Activity

added template for jackpot-history

Browse Source
This commit is contained in:
Kostya
2024-03-31 21:24:43 +03:00
parent 7c0616710d
commit d8977ae282
6 changed files with 853 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

62
luckydiamond/src/assets/css/PagesStyles/jackpot-history.css Normal file
View File

@@ -0,0 +1,62 @@
.jackpot-history__content {
display: flex;
flex-wrap: wrap;
max-width: 80%;
max-height: 800px;
overflow-y: auto;
margin: 0 auto;
}
.jackpot-history__element {
margin: 15px;
}
.element-info {
display: flex;
align-items: center;
}
.element-info .element-info__icon img {
height: 50px;
}
.element-info .element-info__user-info {
margin-left: 4px;
}
.element-info .element-info__user-info .username {
color: #515D83;
font-family: 'Montserrat';
font-weight: 700;
font-size: 20px;
}
.element-info .element-info__user-info .user-deposit {
font-family: 'Montserrat';
font-weight: 700;
font-size: 20px;
}
.element-info .element-info__user-info .img-width img {
width: 16px;
height: 16px;
}
.element-chance {
margin-top: 10px;
}
.element-chance h2 {
font-family: 'Montserrat';
font-weight: 700;
font-size: 18px;
text-align: center;
background: #27345C;
border-radius: 7px;
}
.element-chance .chance-style {
color: #EF4444;
margin-left: 2px;
}

23
luckydiamond/src/assets/css/global.css
View File

@@ -109,6 +109,22 @@ button {
grid-gap: 0.625rem;
}
.jackpot-history__content-grid {
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-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
"menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
"menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
"menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
"menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat"
"menu jackpot-history jackpot-history jackpot-history jackpot-history jackpot-history chat";
grid-gap: 0.625rem;
}
.grid-crash {
display: grid;
grid-template-columns: 0.35fr repeat(5, 1fr) 1fr;
@@ -211,6 +227,13 @@ button {
margin: 0.625rem 2.438rem 1.125rem 1.125rem; */
}
.jackpot-history {
grid-area: jackpot-history;
background: #17181C;
border-radius: 20px;
height: 97%;
}
.about {
grid-area: about;

BIN
luckydiamond/src/assets/icons-test/user-icon-test.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

41
luckydiamond/src/pages/JackopthistoryPage.vue
View File

@@ -1,9 +1,50 @@
t<template>
<div class="jackpot-history__content-grid">
<aside-bar-element/>
<chat-component/>
<header-element-page/>
<div class="jackpot-history">
<div class="jackpot-history__content">
<!-- TEMPLATE -->
<div class="jackpot-history__element">
<div class="element-info">
<div class="element-info__icon">
<img src="@/assets/icons-test/user-icon-test.png">
</div>
<div class="element-info__user-info">
<h2 class="username">FUpir</h2>
<h2 class="user-deposit">
1000
<span class="img-width"><img src="@/assets/icons-profile/icon-diamond-ore.png"></span>
</h2>
</div>
</div>
<div class="element-chance">
<h2>
Шанс <span class="chance-style">15.55%</span>
</h2>
</div>
</div>
<!-- TEMPLATE -->
</div>
</div>
</div>
</template>
<script>
import ChatComponent from "@/components/ChatComponent.vue";
import AsideBarElement from "@/components/AsidebarComponent.vue";
import HeaderElementPage from "@/components/HeaderComponent.vue";
import '@/assets/css/PagesStyles/jackpot-history.css'
export default {
components: {HeaderElementPage, ChatComponent, AsideBarElement}
}
</script>