MrSphay/Modrinth-plus
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor: migrate all input fields to StyledInput (#5306)

Browse Source 
* feat: StyledInput component

* migrate: auth pages to styledInput

* migrate: search/filter inputs

* migrate: dashboard inputs

* migrate: app frontend

* migrate: search related inputs

* migrate: all of app-frontend

* fix: missing inputs on app-frontend

* migrate: frontend

* feat: multiline

* migrate: textareas

* fix: storybook use text-primary

* fix: lint

* fix: merge conflict

* feat: cleanup
This commit is contained in:
Calum H.
2026-02-09 14:57:31 +00:00
committed by GitHub
parent 90438a1ad5
commit 37eac92329
108 changed files with 1670 additions and 1479 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
apps/frontend/src/pages/settings/account.vue
View File

@@ -13,10 +13,10 @@
<div class="universal-modal">
<p>Your account information is not displayed publicly.</p>
<label for="email-input"><span class="label__title">Email address</span> </label>
<input
<StyledInput
id="email-input"
v-model="email"
maxlength="2048"
:maxlength="2048"
type="email"
:placeholder="`Enter your email address...`"
@keyup.enter="saveEmail()"
@@ -58,21 +58,21 @@
<label v-else-if="auth.user.has_password" for="old-password">
<span class="label__title">Old password</span>
</label>
<input
<StyledInput
v-if="auth.user.has_password"
id="old-password"
v-model="oldPassword"
maxlength="2048"
:maxlength="2048"
type="password"
autocomplete="current-password"
:placeholder="`${removePasswordMode ? 'Confirm' : 'Old'} password`"
/>
<template v-if="!removePasswordMode">
<label for="new-password"><span class="label__title">New password</span></label>
<input
<StyledInput
id="new-password"
v-model="newPassword"
maxlength="2048"
:maxlength="2048"
type="password"
autocomplete="new-password"
placeholder="New password"
@@ -80,10 +80,10 @@
<label for="confirm-new-password"
><span class="label__title">Confirm new password</span></label
>
<input
<StyledInput
id="confirm-new-password"
v-model="confirmNewPassword"
maxlength="2048"
:maxlength="2048"
type="password"
autocomplete="new-password"
placeholder="Confirm new password"
@@ -145,11 +145,10 @@
<span class="label__title">Enter two-factor code</span>
<span class="label__description">Please enter a two-factor code to proceed.</span>
</label>
<input
<StyledInput
id="two-factor-code"
v-model="twoFactorCode"
maxlength="11"
type="text"
:maxlength="11"
placeholder="Enter code..."
@keyup.enter="removeTwoFactor()"
/>
@@ -197,11 +196,10 @@
>Enter the one-time code from authenticator to verify access.
</span>
</label>
<input
<StyledInput
id="verify-code"
v-model="twoFactorCode"
maxlength="6"
type="text"
:maxlength="6"
autocomplete="one-time-code"
placeholder="Enter code..."
@keyup.enter="verifyTwoFactorCode()"
@@ -421,7 +419,7 @@ import {
UpdatedIcon,
XIcon,
} from '@modrinth/assets'
import { ConfirmModal, injectNotificationManager } from '@modrinth/ui'
import { ConfirmModal, injectNotificationManager, StyledInput } from '@modrinth/ui'
import KeyIcon from 'assets/icons/auth/key.svg'
import DiscordIcon from 'assets/icons/auth/sso-discord.svg'
import GithubIcon from 'assets/icons/auth/sso-github.svg'