krikkert/habitica
1
0
Fork 0
mirror of https://github.com/HabitRPG/habitica.git synced 2025-12-16 14:17:22 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(css): flex gap is a thing

Browse Source
This commit is contained in:
Sabe Jones
2024-05-22 15:53:24 -05:00
parent 66c56225a4
commit a53a9be4b7
1 changed files with 5 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
website/client/src/components/creatorIntro.vue
View File

@@ -170,7 +170,7 @@
{{ $t('incentiveBackgroundsUnlockedWithCheckins') }}
</div>
</div>
<div class="row justify-content-center mb-4">
<div class="background-row d-flex justify-content-center mb-4">
<div
v-for="bg in standardBackgrounds"
:id="bg.key"
@@ -209,7 +209,7 @@
<strong>{{ allBackgrounds.eventBackgrounds.text }}</strong>
</div>
<div
class="row justify-content-center mb-4"
class="background-row d-flex justify-content-center mb-4"
>
<div
v-for="bg in allBackgrounds.eventBackgrounds.items"
@@ -240,7 +240,7 @@
<strong>{{ $t('timeTravelBackgrounds') }}</strong>
</div>
<div
class="row justify-content-center mb-4"
class="background-row d-flex justify-content-center mb-4"
>
<div
v-for="bg in timeTravelBackgrounds"
@@ -270,7 +270,7 @@
>
<strong>{{ $t('monthlyBackgrounds') }}</strong>
</div>
<div class="d-flex background-row justify-content-left mx-auto mb-4">
<div class="background-row d-flex justify-content-center mx-auto mb-4 px-5">
<div
v-for="(bg) in monthlyBackgrounds"
:id="bg.key"
@@ -795,8 +795,8 @@
#backgrounds {
.background-row {
width: 82%;
flex-wrap: wrap;
gap: 1.5rem;
}
.background-item {
@@ -821,14 +821,6 @@
border-radius: 0;
}
&:not(:nth-of-type(8n)) {
margin-right: 24px;
}
&:nth-of-type(n+9) {
margin-top: 24px;
}
&:hover {
outline: 4px solid rgba($purple-300, .25);
border-radius: 4px;