mirror of
https://github.com/logto-io/logto.git
synced 2025-03-10 22:22:45 -05:00
fix(console): align console input field height (#3471)
This commit is contained in:
parent
74e1c8132f
commit
8227b50f20
9 changed files with 5 additions and 18 deletions
|
@ -44,7 +44,7 @@ const Markdown = ({ className, children }: Props) => {
|
|||
remarkPlugins={[remarkGfm]}
|
||||
className={classNames(styles.markdown, className)}
|
||||
components={{
|
||||
code: ({ node, inline, className, children, ...props }) => {
|
||||
code: ({ inline, className, children, ...props }) => {
|
||||
const [, codeBlockType] = /language-(\w+)/.exec(className ?? '') ?? [];
|
||||
|
||||
return inline ? (
|
||||
|
|
|
@ -20,10 +20,6 @@
|
|||
background: var(--color-layer-1);
|
||||
font: var(--font-body-2);
|
||||
|
||||
&.large {
|
||||
height: 44px;
|
||||
}
|
||||
|
||||
&.withIcon {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
@ -9,7 +9,6 @@ type Props = Omit<HTMLProps<HTMLInputElement>, 'size'> & {
|
|||
errorMessage?: string;
|
||||
icon?: ReactElement;
|
||||
suffix?: ReactElement;
|
||||
size?: 'medium' | 'large';
|
||||
};
|
||||
|
||||
const TextInput = (
|
||||
|
@ -21,7 +20,6 @@ const TextInput = (
|
|||
disabled,
|
||||
className,
|
||||
readOnly,
|
||||
size = 'medium',
|
||||
...rest
|
||||
}: Props,
|
||||
reference: ForwardedRef<HTMLInputElement>
|
||||
|
@ -34,8 +32,7 @@ const TextInput = (
|
|||
hasError && styles.error,
|
||||
icon && styles.withIcon,
|
||||
disabled && styles.disabled,
|
||||
readOnly && styles.readOnly,
|
||||
styles[size]
|
||||
readOnly && styles.readOnly
|
||||
)}
|
||||
>
|
||||
{icon && <span className={styles.icon}>{icon}</span>}
|
||||
|
|
|
@ -14,8 +14,8 @@ import FormField from '@/components/FormField';
|
|||
import OverlayScrollbar from '@/components/OverlayScrollbar';
|
||||
import TextInput from '@/components/TextInput';
|
||||
import { ImageUploaderField } from '@/components/Uploader';
|
||||
import type { RequestError } from '@/hooks/use-api';
|
||||
import useApi from '@/hooks/use-api';
|
||||
import type { RequestError } from '@/hooks/use-api';
|
||||
import useUserAssetsService from '@/hooks/use-user-assets-service';
|
||||
import ActionBar from '@/onboarding/components/ActionBar';
|
||||
import { CardSelector, MultiCardSelector } from '@/onboarding/components/CardSelector';
|
||||
|
@ -118,7 +118,6 @@ const SignInExperience = () => {
|
|||
/>
|
||||
) : (
|
||||
<TextInput
|
||||
size="large"
|
||||
{...register('logo', {
|
||||
validate: (value) =>
|
||||
!value || uriValidator(value) || t('errors.invalid_uri_format'),
|
||||
|
|
|
@ -133,7 +133,6 @@ const BasicUserInfoUpdateModal = ({ field, value: initialValue, isOpen, onClose
|
|||
autoFocus
|
||||
placeholder={getInputPlaceholder()}
|
||||
errorMessage={errors[field]?.message}
|
||||
size="large"
|
||||
onKeyDown={(event) => {
|
||||
if (event.key === 'Enter') {
|
||||
void onSubmit();
|
||||
|
|
|
@ -4,7 +4,7 @@ import { useState } from 'react';
|
|||
import { useForm } from 'react-hook-form';
|
||||
import { toast } from 'react-hot-toast';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useLocation, useNavigate } from 'react-router-dom';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
|
||||
import ClearInput from '@/assets/images/clear-input.svg';
|
||||
import Button from '@/components/Button';
|
||||
|
@ -34,7 +34,6 @@ const ChangePasswordModal = () => {
|
|||
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
|
||||
const navigate = useNavigate();
|
||||
const { show: showModal } = useConfirmModal();
|
||||
const { state } = useLocation();
|
||||
const {
|
||||
watch,
|
||||
reset,
|
||||
|
@ -118,7 +117,6 @@ const ChangePasswordModal = () => {
|
|||
<ClearInput />
|
||||
</IconButton>
|
||||
}
|
||||
size="large"
|
||||
onKeyDown={onKeyDown}
|
||||
/>
|
||||
<TextInput
|
||||
|
@ -138,7 +136,6 @@ const ChangePasswordModal = () => {
|
|||
<ClearInput />
|
||||
</IconButton>
|
||||
}
|
||||
size="large"
|
||||
onKeyDown={onKeyDown}
|
||||
/>
|
||||
<Checkbox
|
||||
|
|
|
@ -64,7 +64,6 @@ const LinkEmailModal = () => {
|
|||
// eslint-disable-next-line jsx-a11y/no-autofocus
|
||||
autoFocus
|
||||
errorMessage={errors.email?.message}
|
||||
size="large"
|
||||
onKeyDown={(event) => {
|
||||
if (event.key === 'Enter') {
|
||||
onSubmit();
|
||||
|
|
|
@ -90,7 +90,6 @@ const VerifyPasswordModal = () => {
|
|||
{showPassword ? <PasswordShowIcon /> : <PasswordHideIcon />}
|
||||
</IconButton>
|
||||
}
|
||||
size="large"
|
||||
onKeyDown={(event) => {
|
||||
if (event.key === 'Enter') {
|
||||
onSubmit();
|
||||
|
|
|
@ -68,6 +68,7 @@
|
|||
position: absolute;
|
||||
bottom: 0;
|
||||
transform: translateY(calc(100% + _.unit(7)));
|
||||
// Have to use padding instead of margin. Overflow margin spacing will be ignored by the browser.
|
||||
padding-bottom: _.unit(7);
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue