better modal layout

This commit is contained in:
Henry Jameson 2025-07-17 15:13:13 +03:00
commit b014489295
4 changed files with 23 additions and 10 deletions

View file

@ -11,6 +11,7 @@
<slot /> <slot />
<template #footer> <template #footer>
<slot name="footerLeft" />
<button <button
class="btn button-default" class="btn button-default"
@click.prevent="onAccept" @click.prevent="onAccept"

View file

@ -6,4 +6,8 @@
.input-expire-at { .input-expire-at {
margin-left: 0.25em; margin-left: 0.25em;
} }
.footer-left-checkbox {
width: max-content;
}
} }

View file

@ -1,6 +1,7 @@
<template> <template>
<confirm-modal <confirm-modal
v-if="showing" v-if="showing"
class="UserTimedFilterModal"
:title="$t(isMute ? $t('user_card.mute') : $t('user_card.block'))" :title="$t(isMute ? $t('user_card.mute') : $t('user_card.block'))"
:confirm-text="$t(isMute ? 'user_card.mute_confirm_accept_button' : 'user_card.block_confirm_accept_button')" :confirm-text="$t(isMute ? 'user_card.mute_confirm_accept_button' : 'user_card.block_confirm_accept_button')"
:cancel-text="$t(isMute ? 'user_card.mute_confirm_cancel_button' : 'user_card.block_confirm_cancel_button')" :cancel-text="$t(isMute ? 'user_card.mute_confirm_cancel_button' : 'user_card.block_confirm_cancel_button')"
@ -34,25 +35,30 @@
<option key="d" value="d"> {{ $t('time.unit.days_suffix') }} </option> <option key="d" value="d"> {{ $t('time.unit.days_suffix') }} </option>
</Select> </Select>
<br /> {{ $t('user_card.mute_or') }}
<Checkbox <Checkbox
id="forever" id="forever"
v-model="forever" v-model="forever"
name="forever" name="forever"
class="input-forever" class="input-forever"
> >
{{ $t('user_card.mute_block_forever') }} {{ $t('user_card.mute_block_never') }}
</Checkbox> </Checkbox>
</p> </p>
<Checkbox <template #footerLeft>
id="dontAskAgain" <div class="footer-left-checkbox">
v-model="dontAskAgain" <Checkbox
name="dontAskAgain" id="dontAskAgain"
class="input-dont-ask-again" v-model="dontAskAgain"
> name="dontAskAgain"
{{ $t(isMute ? 'user_card.dont_ask_again_mute' : 'user_card.dont_ask_again_block') }} class="input-dont-ask-again"
</Checkbox> >
{{ $t(isMute ? 'user_card.dont_ask_again_mute' : 'user_card.dont_ask_again_block') }}
</Checkbox>
</div>
</template>
</confirm-modal> </confirm-modal>
</template> </template>

View file

@ -1405,6 +1405,7 @@
"mute_confirm": "Do you really want to mute {user}?", "mute_confirm": "Do you really want to mute {user}?",
"mute_confirm_accept_button": "Mute", "mute_confirm_accept_button": "Mute",
"mute_confirm_cancel_button": "Do not mute", "mute_confirm_cancel_button": "Do not mute",
"mute_or": "or",
"expire_in": "Expire in", "expire_in": "Expire in",
"expire_mute_message": "Are you sure you want to mute {0}?", "expire_mute_message": "Are you sure you want to mute {0}?",
"expire_block_message": "Are you sure you want to block {0}?", "expire_block_message": "Are you sure you want to block {0}?",
@ -1412,6 +1413,7 @@
"dont_ask_again_block": "Always block users this way", "dont_ask_again_block": "Always block users this way",
"mute_block_temporarily": "Temporarily", "mute_block_temporarily": "Temporarily",
"mute_block_forever": "Forever", "mute_block_forever": "Forever",
"mute_block_never": "Never",
"mute_block_ask": "Ask", "mute_block_ask": "Ask",
"default_mute_expiration": "Always mute users", "default_mute_expiration": "Always mute users",
"default_block_expiration": "Always block users", "default_block_expiration": "Always block users",