Fix issue/patch placeholder centering on mobile

This commit is contained in:
Rūdolfs Ošiņš
2024-05-16 16:18:10 +02:00
parent 0400af2470
commit 538b0ccac8
2 changed files with 24 additions and 4 deletions
+12 -2
View File
@@ -91,6 +91,17 @@
background-color: var(--color-fill-counter);
color: var(--color-foreground-dim);
}
.placeholder {
height: calc(100% - 4rem);
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 719.98px) {
.placeholder {
height: calc(100vh - 10rem);
}
}
</style>
<Layout {baseUrl} {project} activeTab="issues">
@@ -184,8 +195,7 @@
{/if}
{#if project.issues[state] === 0}
<div
style="height: calc(100% - 4rem); display: flex; align-items: center; justify-content: center;">
<div class="placeholder">
<Placeholder iconName="no-issues" caption={`No ${state} issues`} />
</div>
{/if}
+12 -2
View File
@@ -106,6 +106,17 @@
flex-direction: column;
gap: 1rem;
}
.placeholder {
height: calc(100% - 4rem);
display: flex;
align-items: center;
justify-content: center;
}
@media (max-width: 719.98px) {
.placeholder {
height: calc(100vh - 10rem);
}
}
</style>
<Layout {baseUrl} {project} activeTab="patches">
@@ -203,8 +214,7 @@
{/if}
{#if project.patches[state] === 0}
<div
style="height: calc(100% - 4rem); display: flex; align-items: center; justify-content: center;">
<div class="placeholder">
<Placeholder iconName="no-patches" caption={`No ${state} patches`} />
</div>
{/if}