HoovesSocial/hippofish
2
0
Fork 0
Code Issues 3 Pull requests 1 Projects Releases Packages Wiki Activity Actions

🎨

Browse source
This commit is contained in:
syuilo 2024-07-30 20:58:25 +09:00
parent 400ae6ef01
commit 63f9c271ca
3 changed files with 30 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
packages/frontend/src/components/MkSystemWebhookEditor.vue
View file

@ -19,8 +19,8 @@ SPDX-License-Identifier: AGPL-3.0-only
{{ mode === 'create' ? i18n.ts._webhookSettings.createWebhook : i18n.ts._webhookSettings.modifyWebhook }} {{ mode === 'create' ? i18n.ts._webhookSettings.createWebhook : i18n.ts._webhookSettings.modifyWebhook }}
</template> </template>
<div> <div style="display: flex; flex-direction: column; min-height: 100%;">
<MkSpacer :marginMin="20" :marginMax="28"> <MkSpacer :marginMin="20" :marginMax="28" style="flex-grow: 1;">
<MkLoading v-if="loading !== 0"/> <MkLoading v-if="loading !== 0"/>
<div v-else :class="$style.root" class="_gaps_m"> <div v-else :class="$style.root" class="_gaps_m">
<MkInput v-model="title"> <MkInput v-model="title">
@ -226,6 +226,7 @@ onMounted(async () => {
.footer { .footer {
position: sticky; position: sticky;
z-index: 10000;
bottom: 0; bottom: 0;
left: 0; left: 0;
padding: 12px; padding: 12px;

43
packages/frontend/src/pages/admin/abuse-report/notification-recipient.editor.vue
View file

@ -16,8 +16,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<template #header> <template #header>
{{ mode === 'create' ? i18n.ts._abuseReport._notificationRecipient.createRecipient : i18n.ts._abuseReport._notificationRecipient.modifyRecipient }} {{ mode === 'create' ? i18n.ts._abuseReport._notificationRecipient.createRecipient : i18n.ts._abuseReport._notificationRecipient.modifyRecipient }}
</template> </template>
<div v-if="loading === 0"> <div v-if="loading === 0" style="display: flex; flex-direction: column; min-height: 100%;">
<MkSpacer :marginMin="20" :marginMax="28"> <MkSpacer :marginMin="20" :marginMax="28" style="flex-grow: 1;">
<div :class="$style.root" class="_gaps_m"> <div :class="$style.root" class="_gaps_m">
<MkInput v-model="title"> <MkInput v-model="title">
<template #label>{{ i18n.ts.title }}</template> <template #label>{{ i18n.ts.title }}</template>
@ -44,7 +44,7 @@ SPDX-License-Identifier: AGPL-3.0-only
{{ webhook.name }} {{ webhook.name }}
</option> </option>
</MkSelect> </MkSelect>
<MkButton rounded @click="onEditSystemWebhookClicked"> <MkButton rounded :class="$style.systemWebhookEditButton" @click="onEditSystemWebhookClicked">
<span v-if="systemWebhookId === null" class="ti ti-plus" style="line-height: normal"/> <span v-if="systemWebhookId === null" class="ti ti-plus" style="line-height: normal"/>
<span v-else class="ti ti-settings" style="line-height: normal"/> <span v-else class="ti ti-settings" style="line-height: normal"/>
</MkButton> </MkButton>
@ -60,8 +60,8 @@ SPDX-License-Identifier: AGPL-3.0-only
</MkSpacer> </MkSpacer>
<div :class="$style.footer" class="_buttonsCenter"> <div :class="$style.footer" class="_buttonsCenter">
<MkButton primary :disabled="disableSubmitButton" @click="onSubmitClicked"><i class="ti ti-check"></i> {{ i18n.ts.ok }}</MkButton> <MkButton primary rounded :disabled="disableSubmitButton" @click="onSubmitClicked"><i class="ti ti-check"></i> {{ i18n.ts.ok }}</MkButton>
<MkButton @click="onCancelClicked"><i class="ti ti-x"></i> {{ i18n.ts.cancel }}</MkButton> <MkButton rounded @click="onCancelClicked"><i class="ti ti-x"></i> {{ i18n.ts.cancel }}</MkButton>
</div> </div>
</div> </div>
<div v-else> <div v-else>
@ -289,10 +289,15 @@ onMounted(async () => {
} }
.footer { .footer {
display: flex; position: sticky;
justify-content: center; z-index: 10000;
align-items: flex-end; bottom: 0;
margin-top: 20px; left: 0;
padding: 12px;
border-top: solid 0.5px var(--divider);
background: var(--acrylicBg);
-webkit-backdrop-filter: var(--blur, blur(15px));
backdrop-filter: var(--blur, blur(15px));
} }
.systemWebhook { .systemWebhook {
@ -301,16 +306,16 @@ onMounted(async () => {
justify-content: stretch; justify-content: stretch;
align-items: flex-end; align-items: flex-end;
gap: 8px; gap: 8px;
}
button { .systemWebhookEditButton {
min-width: 0; min-width: 0;
min-height: 0; min-height: 0;
width: 34px; width: 34px;
height: 34px; height: 34px;
flex-shrink: 0; flex-shrink: 0;
box-sizing: border-box; box-sizing: border-box;
margin: 1px 0; margin: 1px 0;
padding: 6px; padding: 6px;
}
} }
</style> </style>

5
packages/frontend/src/pages/emoji-edit-dialog.vue
View file

@ -15,8 +15,8 @@ SPDX-License-Identifier: AGPL-3.0-only
<template v-if="emoji" #header>:{{ emoji.name }}:</template> <template v-if="emoji" #header>:{{ emoji.name }}:</template>
<template v-else #header>New emoji</template> <template v-else #header>New emoji</template>
<div> <div style="display: flex; flex-direction: column; min-height: 100%;">
<MkSpacer :marginMin="20" :marginMax="28"> <MkSpacer :marginMin="20" :marginMax="28" style="flex-grow: 1;">
<div class="_gaps_m"> <div class="_gaps_m">
<div v-if="imgUrl != null" :class="$style.imgs"> <div v-if="imgUrl != null" :class="$style.imgs">
<div style="background: #000;" :class="$style.imgContainer"> <div style="background: #000;" :class="$style.imgContainer">
@ -239,6 +239,7 @@ async function del() {
.footer { .footer {
position: sticky; position: sticky;
z-index: 10000;
bottom: 0; bottom: 0;
left: 0; left: 0;
padding: 12px; padding: 12px;