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 full banner

Browse Source
This commit is contained in:
Kostya
2023-11-14 23:05:33 +03:00
parent 573c59a8d9
commit 6b59b4178a
2 changed files with 52 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
luckydiamond/src/assets/person-banner-img.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 83 KiB

57
luckydiamond/src/pages/HomePage.vue
View File

@@ -6,7 +6,18 @@
<section class="home"> <section class="home">
<div class="home__content"> <div class="home__content">
<div class="home__banner"> <div class="home__banner">
<h1>123</h1> <div class="home__banner--content">
<div class="home__banner--subtitle">
<h2>онлайн-казино</h2>
</div>
<div class="home__banner--title">
<h1>lucky diamond</h1>
</div>
<div class="home__banner--paragraph">
<h3>minecraft casino - spm</h3>
</div>
<img src="../assets/person-banner-img.png">
</div>
</div> </div>
</div> </div>
</section> </section>
@@ -46,7 +57,7 @@ export default {
.home::after { .home::after {
content: ''; content: '';
position: absolute; position: absolute;
top: 0%; top: 0;
left: 50%; left: 50%;
width: 100%; width: 100%;
height: 50%; height: 50%;
@@ -60,11 +71,47 @@ export default {
} }
.home__banner { .home__banner {
display: flex; display: flex;
justify-content: center;
align-items: center;
margin: 0 auto; margin: 0 auto;
width: 1276px; width: 1276px;
height: 299px; height: 299px;
background: radial-gradient(circle at center, #DF85FF99, #7000FF); background: linear-gradient(60deg, #DF85FF99, #7000FF);
border-radius: 27px;
box-shadow: 10px 10px 8px 0px rgba(0, 0, 0, 0.25);
}
.home__banner--content {
margin-left: 36px;
}
.home__banner--subtitle h2 {
font-size: 32px;
color: #ffb400;
font-family: Montserrat Alternates;
font-weight: 700;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
margin-top: 42px;
text-align: center;
position: relative;
top: 20px;
}
.home__banner--title h1 {
color: #ffb400;
font-size: 91px;
font-family: Montserrat Alternates;
font-weight: 700;
text-transform: uppercase;
}
.home__banner--paragraph h3 {
text-transform: uppercase;
text-align: center;
font-size: 24px;
color: #ffb400;
font-family: Montserrat Alternates;
font-weight: 700;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
}
.home__banner--content img {
position: relative;
float: right;
left: 35%;
bottom: 83%;
} }
</style> </style>