Skip to content

fix: add spacing between email field and action buttons in change email #6292

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
MicahXX wants to merge 4 commits into
base: main
Choose a base branch
from
+10 −5
Open

fix: add spacing between email field and action buttons in change email #6292

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
7c521d7
fix: add spacing between email field and action buttons in change ema…
Jun 2, 2026
bcbf473
feat: use NewModal nd the #actions slot for the buttons
Jun 3, 2026
f757976
refactor: use native NewModal styling for change email modal
Jun 3, 2026
176dbb1
Merge branch 'main' into fix-change-email-modal-spacing
IMB11 Jun 4, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
15 changes: 10 additions & 5 deletions apps/frontend/src/pages/settings/account.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,12 @@
:has-to-type="true"
@proceed="deleteAccount"
/>
<Modal
<NewModal
ref="changeEmailModal"
:header="`${auth.user.email ? formatMessage(messages.changeEmailHeaderChange) : formatMessage(messages.changeEmailHeaderAdd)}`"
width="600px"
>
<div class="universal-modal">
<div class="universal-body">
<p>{{ formatMessage(messages.emailNotPublicNotice) }}</p>
<label for="email-input">
<span class="label__title">{{ formatMessage(messages.emailAddressLabel) }}</span>
Expand All @@ -24,9 +25,12 @@
:maxlength="2048"
type="email"
:placeholder="formatMessage(messages.emailAddressPlaceholder)"
wrapper-class="w-full"
@keyup.enter="saveEmail()"
/>
<div class="input-group push-right">
</div>
<template #actions>
<div class="flex justify-end gap-2">
<ButtonStyled>
<button @click="$refs.changeEmailModal.hide()">
<XIcon />
Expand All @@ -40,8 +44,8 @@
</button>
</ButtonStyled>
</div>
</div>
</Modal>
</template>
</NewModal>
<Modal
ref="managePasswordModal"
:header="`${
Expand Down Expand Up @@ -477,6 +481,7 @@ import {
defineMessages,
injectNotificationManager,
IntlFormatted,
NewModal,
StyledInput,
useVIntl,
} from '@modrinth/ui'
Expand Down