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 style for display in one row for twolines elements

Browse Source
This commit is contained in:
Kostya
2023-11-23 20:06:42 +03:00
parent 58f9533a55
commit e0fa6e615e
2 changed files with 45 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
luckydiamond/src/assets/css/PagesStyles/home.css
View File

@@ -156,7 +156,15 @@
font-size: 38px; font-size: 38px;
} }
.gamemode__lines {
display: flex;
flex-direction: column;
}
.gamemode__twolines {
display: flex;
align-items: flex-start;
}
.gamemode__firstline { .gamemode__firstline {
background: #EF4444; background: #EF4444;
@@ -213,7 +221,7 @@
background: #EF4444; background: #EF4444;
filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.25)); filter: drop-shadow(4px 4px 4px rgba(0, 0, 0, 0.25));
border-radius: 40px; border-radius: 40px;
width: 60%; width: 55%;
height: 50%; height: 50%;
margin: 18px 36px 0 35px; margin: 18px 36px 0 35px;
} }
@@ -226,7 +234,7 @@
} }
.gamemode__twoline--first__element .linecontent-3 h3 { .gamemode__twoline--first__element .linecontent-3 h3 {
padding-left: 15%; padding-left: 5%;
text-align: center; text-align: center;
color: #fff; color: #fff;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25); text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
@@ -247,4 +255,10 @@
padding: 20px 20px; padding: 20px 20px;
} }
.gamemode__twoline--two__element {
border-radius: 40px;
background: #EF4444;
box-shadow: 4px 4px 4px 0px rgba(0, 0, 0, 0.25);
}
/* /GameMode */ /* /GameMode */

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

@@ -58,6 +58,7 @@
</li> </li>
</ul> </ul>
</div> </div>
<div class="gamemode__twolines">
<div class="gamemode__twoline--first__element"> <div class="gamemode__twoline--first__element">
<ul> <ul>
<li <li
@@ -77,13 +78,18 @@
<div class="gamemode__twoline--two__element"> <div class="gamemode__twoline--two__element">
<ul> <ul>
<li <li
v-for="mode in two" v-for="mode in twolinetwoelementGameMode"
:key="mode.id"
> >
<div :class="'linecontent' + mode.id">
<h3>{{ mode.title }}</h3>
</div>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
</div>
</section> </section>
</div> </div>
</template> </template>