This commit is contained in:
parent
400ae6ef01
commit
63f9c271ca
|
@ -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;
|
||||||
|
|
|
@ -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>
|
||||||
|
|
|
@ -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;
|
||||||
|
|
Loading…
Reference in New Issue