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

added styles for text and input in saperpage

Browse Source
This commit is contained in:
Kostya
2023-12-03 08:53:19 +03:00
parent f3161918e3
commit a9f0ad9a10
2 changed files with 57 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
luckydiamond/src/assets/css/PagesStyles/games-pages/saper.css
View File

@@ -2,6 +2,12 @@
height: 95%;
}
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
.saper {
padding-top: 15%;
border-radius: 20px;
@@ -14,18 +20,63 @@
border-radius: 20px;
background: #22252F;
box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
width: 25%;
height: 70%;
width: 27%;
height: 75%;
}
.padding-elements {
padding-left: 22px;
}
.title-saper h2 {
padding: 16px 0 5px 0;
color: #FFF;
font-weight: 700;
line-height: 31px;
text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.00);
font-family: Montserrat Alternates;
font-size: 26px;
}
.saper-start__content p {
color: #FFFFFF84;
font-weight: 700;
line-height: 31px;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
font-family: Montserrat Alternates;
font-size: 13px;
}
.crystals h3 {
color: #44C6EF54;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
font-family: Montserrat Alternates;
font-size: 12px;
font-weight: 700;
line-height: 31px;
}
.crystals .crystals__choises input {
width: 110px;
height: 38px;
border-radius: 10px;
padding-left: 25px;
border: 2px solid #2B3458;
background: #22252F;
}
.crystals .crystals__choises input:focus {
outline: none;
}
.crystals-input__margin {
margin-left: -15px;
margin-left: -22px;
}
.crystal-icon {
position: relative;
left: 23px;
left: 25px;
top: 11px;
}

4
luckydiamond/src/pages/games-pages/SapergamePage.vue
View File

@@ -8,14 +8,14 @@
<section class="saper">
<div class="saper-start">
<div class="saper-start__content">
<div class="saper-start__content title-saper padding-elements">
<h2>Сапёр</h2>
<p>Находи изумруды на поле и избегай кристалы</p>
<div class="saper-start__choises crystals">
<h3>Количество кристалов</h3>
<div class="crystals__choises crystals-input__margin">
<img class="crystal-icon" width="25" height="25" src="@/assets/icons-games/saper-game/icon-crystall-saper.svg">
<input type="text">
<input type="number">
</div>
</div>
</div>