hj/pleroma-fe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

fix pleroma-tan being stabbed by panel-footer

Browse source
This commit is contained in:
Henry Jameson 2026-03-13 11:16:45 +02:00
commit 4e44af04b7
3 changed files with 58 additions and 29 deletions
Download patch file Download diff file Expand all files Collapse all files

33
src/components/update_notification/update_notification.scss
View file

@ -6,6 +6,7 @@
--__top-fringe: 15em; // how much pleroma-tan should stick her head above
--__bottom-fringe: 80em; // just reserving as much as we can, number is mostly irrelevant
--__right-fringe: 8em;
--__panel-background: rgb(0,255,255 / 80%);
font-size: 15px;
position: relative;
@ -18,6 +19,29 @@
padding-left: 1em;
}
.footer-buttons {
--panel-heading-height-padding: calc(var(--panel-header-height) * 0.2);
--__panel-heading-gap: calc(var(--panel-header-height) * 0.1565);
--__panel-heading-height: var(--panel-header-height);
--__panel-heading-height-inner: calc(var(--__panel-heading-height) - 2 * var(--panel-heading-height-padding, 0));
box-sizing: border-box;
position: absolute;
bottom: 0;
left: 0;
right: 0;
display: grid;
z-index: 20;
grid-auto-flow: column;
grid-template-columns: auto;
grid-auto-columns: auto;
grid-column-gap: var(--__panel-heading-gap);
padding: var(--panel-heading-height-padding);
height: var(--__panel-heading-height);
line-height: var(--__panel-heading-height-inner);
font-size: calc(var(--panelHeaderSize) / 3.2);
}
@media all and (width <= 800px) {
/* For mobile, the modal takes 100% of the available screen.
This ensures the minimized modal is always 50px above the browser
@ -50,10 +74,13 @@
}
.panel-footer {
z-index: 22;
z-index: 10;
position: relative;
border-width: 0;
grid-template-columns: auto;
.button-default {
z-index: 2;
}
}
.pleroma-tan {
@ -76,7 +103,7 @@
}
.spacer-bottom {
min-height: var(--__bottom-fringe);
min-height: calc(var(--__bottom-fringe) + var(--panel-header-height));
}
.extra-info-group {

48
src/components/update_notification/update_notification.vue
View file

@ -35,14 +35,14 @@
>
<i18n-t
scope="global"
keypath="update.update_bugs"
keypath="update.update_bugs2"
tag="p"
>
<template #pleromaGitlab>
<template #pleromaForgejo>
<a
target="_blank"
href="https://git.pleroma.social/"
>{{ $t('update.update_bugs_gitlab') }}</a>
>{{ $t('update.update_bugs_forgejo') }}</a>
</template>
</i18n-t>
<i18n-t
@ -73,30 +73,30 @@
</p>
</div>
</div>
<div class="footer-buttons">
<button
class="button-default"
@click.prevent="neverShowAgain"
>
{{ $t("general.never_show_again") }}
</button>
<button
v-if="!showingMore"
class="button-default"
@click.prevent="toggleShow"
>
{{ $t("general.show_more") }}
</button>
<button
class="button-default"
@click.prevent="dismiss"
>
{{ $t("general.dismiss") }}
</button>
</div>
<div class="spacer-bottom" />
</div>
</div>
<div class="panel-footer">
<button
class="button-default"
@click.prevent="neverShowAgain"
>
{{ $t("general.never_show_again") }}
</button>
<button
v-if="!showingMore"
class="button-default"
@click.prevent="toggleShow"
>
{{ $t("general.show_more") }}
</button>
<button
class="button-default"
@click.prevent="dismiss"
>
{{ $t("general.dismiss") }}
</button>
</div>
</div>
</Modal>
</template>