added template for first line in gamemode section

This commit is contained in:
Kostya
2023-11-21 21:16:00 +03:00
parent 5806dedc22
commit c9eb8da1dd
3 changed files with 38 additions and 8 deletions

View File

@@ -122,7 +122,7 @@
.line__footer {
display: flex;
justify-content: center;
align-items: end;
align-items: center;
padding-top: 12%;
}
@@ -145,22 +145,27 @@
}
.line__btn--main a span {
color: #000;
font-size: 38px;
}
.gamemode__firstline {
background: #EF4444;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.25));
border-radius: 40px;
width: 50%;
height: 100%;
margin: 0 0 18px 35px;
}
.line__img {
float: right;
margin: 10px 66px 10px 47px;
}
.
.line__btn {
border-radius: 21px;
@@ -176,4 +181,25 @@
text-transform: uppercase;
}
.line__btn--elm {
color: #000;
font-size: 38px;
}
.linecontent-2 {
display: flex;
padding: 6px 6px;
}
.linecontent-2 h1 {
font-size: 91px;
color: #FFF;
text-align: center;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
font-family: Montserrat Alternates;
font-weight: 700;
text-transform: uppercase;
margin-bottom: 30px;
}
/* /GameMode */

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.6 KiB

View File

@@ -27,7 +27,7 @@
v-for="mode in mainGameMode"
:key="mode.id"
>
<div class="line__content" style="margin: 16px 38px 0px 0px" :id="'maincard-' + mode.id">
<div class="line__content">
<h3>{{ mode.title }}</h3>
<div class="line__footer">
<img src="../assets/icons-gamemodes/bomb-icon.svg">
@@ -45,10 +45,14 @@
v-for="mode in firstlineGameMode"
:key="mode.id"
>
.line__
<div class="line__img">
<img src="@/assets/icons-gamemodes/case-icon.png">
</div>
<div :class="'linecontent-' + mode.id">
<div class="container">
<h1>{{ mode.title }}</h1>
<a href="#" class="line__btn">play</a>
<a href="#" class="line__btn">play <span class="line__btn--elm">></span></a>
</div>
</div>
</li>
</ul>