added styles and template for steps-btns, saperpage

This commit is contained in:
Kostya
2023-12-03 10:12:14 +03:00
parent 6d5dbd0804
commit 0c85ce289f
2 changed files with 26 additions and 1 deletions

View File

@@ -162,7 +162,7 @@ input[type="number"]::-webkit-outer-spin-button {
.saper-start__btns button {
width: 100%;
padding: 14px;
padding: 12px;
margin-bottom: 5px;
border: none;
color: #FFF;
@@ -182,4 +182,22 @@ input[type="number"]::-webkit-outer-spin-button {
.btn-claim {
border-radius: 10px;
background: #252C47;
}
.steps-btns__display {
display: flex;
}
.btns-style__steps button {
border-radius: 10px;
background: #252C47;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
border: none;
color: #FFF;
font-weight: 700;
line-height: 31px;
font-family: Montserrat Alternates;
font-size: 12px;
padding: 6px 16px;
margin-right: 8px;
}

View File

@@ -41,6 +41,13 @@
<button class="btn-start">Начать игру</button>
<button class="btn-claim">Забрать 15 АР</button>
</div>
<div class="saper-start__steps btns-style__steps">
<ul class="steps-btns__display">
<li v-for="(item, index) in SaperNumbers" :key="index">
<button v-if="item.steps !== undefined">{{ item.steps }}</button>
</li>
</ul>
</div>
</div>
</div>
</section>