fix bug field text mui
This commit is contained in:
@@ -11,7 +11,7 @@ import theme from '../theme/theme';
|
||||
export default function ThemeRegistry({
|
||||
children
|
||||
}) {
|
||||
const options = {key: 'mui'}
|
||||
const options = { key: 'mui' }
|
||||
const [{ cache, flush }] = React.useState(() => {
|
||||
const cache = createCache(options);
|
||||
cache.compat = true;
|
||||
|
||||
@@ -0,0 +1,48 @@
|
||||
import { TextField } from "@mui/material"
|
||||
|
||||
function Field({ title, type, isPlaceHolder }) {
|
||||
return (
|
||||
<TextField
|
||||
label={title}
|
||||
type={type || 'text'}
|
||||
className="!w-full !mx-auto !bg-[#FFF]"
|
||||
sx={{
|
||||
'& .mui-fxnuf-MuiFormLabel-root-MuiInputLabel-root': {
|
||||
right: '30px'
|
||||
},
|
||||
'& .mui-18r6uqa-MuiFormLabel-root-MuiInputLabel-root': {
|
||||
right: '0',
|
||||
left: 'auto',
|
||||
background: '#FFF',
|
||||
padding: '0 10px'
|
||||
},
|
||||
'& .mui-14lo706': {
|
||||
display: 'none'
|
||||
},
|
||||
'& .MuiFormLabel-root': {
|
||||
top: '-4px !important'
|
||||
},
|
||||
|
||||
// Hide Icon Number
|
||||
'& input::-webkit-outer-spin-button, & input::-webkit-inner-spin-button': {
|
||||
display: 'none'
|
||||
},
|
||||
'& input[type=number]': {
|
||||
MozAppearance: 'textfield'
|
||||
},
|
||||
|
||||
'& .MuiInputBase-input': { padding: '12.5px 14px' },
|
||||
'& .MuiInputBase-root': { borderRadius: '6px !important' },
|
||||
'& .MuiOutlinedInput-notchedOutline': { border: '1px solid #E9ECEF !important' },
|
||||
".Mui-focused": {
|
||||
'& .MuiOutlinedInput-notchedOutline': {
|
||||
border: '1px solid #0FA1B3 !important',
|
||||
transition: '0.5s all'
|
||||
}
|
||||
}
|
||||
}}
|
||||
/>
|
||||
)
|
||||
}
|
||||
|
||||
export default Field
|
||||
@@ -1,3 +1,4 @@
|
||||
import Field from '@/app/component/element/Field'
|
||||
import React from 'react'
|
||||
|
||||
function SignInPage() {
|
||||
@@ -7,6 +8,12 @@ function SignInPage() {
|
||||
<div className='flex flex-col justify-center gap-[24px] mt-[48px] items-center'>
|
||||
<p className='text-[#616161] text-[14px] font-normal'>شماره همراه خود را وارد نمایید.</p>
|
||||
</div>
|
||||
<div className='mt-[24px] mb-[32px]'>
|
||||
<Field
|
||||
type='number'
|
||||
title='شماره همراه'
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Generated
+36
-71
@@ -11,8 +11,7 @@
|
||||
"@emotion/cache": "^11.11.0",
|
||||
"@emotion/react": "^11.11.4",
|
||||
"@emotion/styled": "^11.11.5",
|
||||
"@mui/material": "^5.15.17",
|
||||
"@mui/material-nextjs": "^5.15.11",
|
||||
"@mui/material": "^5.14.17",
|
||||
"@mui/styled-engine-sc": "^6.0.0-alpha.18",
|
||||
"aos": "^2.3.4",
|
||||
"next": "14.2.3",
|
||||
@@ -248,9 +247,9 @@
|
||||
"integrity": "sha512-EsBwpc7hBUJWAsNPBmJy4hxWx12v6bshQsldrVmjxJoc3isbxhOrF2IcCpaXxfvq03NwkI7sbsOLXbYuqF/8Ww=="
|
||||
},
|
||||
"node_modules/@floating-ui/core": {
|
||||
"version": "1.6.1",
|
||||
"resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.1.tgz",
|
||||
"integrity": "sha512-42UH54oPZHPdRHdw6BgoBD6cg/eVTmVrFcgeRDM3jbO7uxSoipVcmcIGFcA5jmOHO5apcyvBhkSKES3fQJnu7A==",
|
||||
"version": "1.6.2",
|
||||
"resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.6.2.tgz",
|
||||
"integrity": "sha512-+2XpQV9LLZeanU4ZevzRnGFg2neDeKHgFLjP6YLW+tly0IvrhqT4u8enLGjLH3qeh85g19xY5rsAusfwTdn5lg==",
|
||||
"dependencies": {
|
||||
"@floating-ui/utils": "^0.2.0"
|
||||
}
|
||||
@@ -265,9 +264,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@floating-ui/react-dom": {
|
||||
"version": "2.0.9",
|
||||
"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.0.9.tgz",
|
||||
"integrity": "sha512-q0umO0+LQK4+p6aGyvzASqKbKOJcAHJ7ycE9CuUvfx3s9zTHWmGJTPOIlM/hmSBfUfg/XfY5YhLBLR/LHwShQQ==",
|
||||
"version": "2.1.0",
|
||||
"resolved": "https://registry.npmjs.org/@floating-ui/react-dom/-/react-dom-2.1.0.tgz",
|
||||
"integrity": "sha512-lNzj5EQmEKn5FFKc04+zasr09h/uX8RtJRNj5gUXsSQIXHVWTVh+hVAg1vOMCexkX8EgvemMvIFpQfkosnVNyA==",
|
||||
"dependencies": {
|
||||
"@floating-ui/dom": "^1.0.0"
|
||||
},
|
||||
@@ -347,16 +346,16 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@mui/base": {
|
||||
"version": "5.0.0-beta.40",
|
||||
"resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-beta.40.tgz",
|
||||
"integrity": "sha512-I/lGHztkCzvwlXpjD2+SNmvNQvB4227xBXhISPjEaJUXGImOQ9f3D2Yj/T3KasSI/h0MLWy74X0J6clhPmsRbQ==",
|
||||
"version": "5.0.0-beta.23",
|
||||
"resolved": "https://registry.npmjs.org/@mui/base/-/base-5.0.0-beta.23.tgz",
|
||||
"integrity": "sha512-9L8SQUGAWtd/Qi7Qem26+oSSgpY7f2iQTuvcz/rsGpyZjSomMMO6lwYeQSA0CpWM7+aN7eGoSY/WV6wxJiIxXw==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.23.9",
|
||||
"@floating-ui/react-dom": "^2.0.8",
|
||||
"@mui/types": "^7.2.14",
|
||||
"@mui/utils": "^5.15.14",
|
||||
"@babel/runtime": "^7.23.2",
|
||||
"@floating-ui/react-dom": "^2.0.2",
|
||||
"@mui/types": "^7.2.8",
|
||||
"@mui/utils": "^5.14.17",
|
||||
"@popperjs/core": "^2.11.8",
|
||||
"clsx": "^2.1.0",
|
||||
"clsx": "^2.0.0",
|
||||
"prop-types": "^15.8.1"
|
||||
},
|
||||
"engines": {
|
||||
@@ -364,7 +363,7 @@
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/mui-org"
|
||||
"url": "https://opencollective.com/mui"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@types/react": "^17.0.0 || ^18.0.0",
|
||||
@@ -387,19 +386,19 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@mui/material": {
|
||||
"version": "5.15.17",
|
||||
"resolved": "https://registry.npmjs.org/@mui/material/-/material-5.15.17.tgz",
|
||||
"integrity": "sha512-ru/MLvTkCh0AZXmqwIpqGTOoVBS/sX48zArXq/DvktxXZx4fskiRA2PEc7Rk5ZlFiZhKh4moL4an+l8zZwq49Q==",
|
||||
"version": "5.14.17",
|
||||
"resolved": "https://registry.npmjs.org/@mui/material/-/material-5.14.17.tgz",
|
||||
"integrity": "sha512-+y0VeOLWfEA4Z98We/UH6KCo8+f2HLZDK45FY+sJf8kSojLy3VntadKtC/u0itqnXXb1Pr4wKB2tSIBW02zY4Q==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.23.9",
|
||||
"@mui/base": "5.0.0-beta.40",
|
||||
"@mui/core-downloads-tracker": "^5.15.17",
|
||||
"@mui/system": "^5.15.15",
|
||||
"@mui/types": "^7.2.14",
|
||||
"@mui/utils": "^5.15.14",
|
||||
"@types/react-transition-group": "^4.4.10",
|
||||
"clsx": "^2.1.0",
|
||||
"csstype": "^3.1.3",
|
||||
"@babel/runtime": "^7.23.2",
|
||||
"@mui/base": "5.0.0-beta.23",
|
||||
"@mui/core-downloads-tracker": "^5.14.17",
|
||||
"@mui/system": "^5.14.17",
|
||||
"@mui/types": "^7.2.8",
|
||||
"@mui/utils": "^5.14.17",
|
||||
"@types/react-transition-group": "^4.4.8",
|
||||
"clsx": "^2.0.0",
|
||||
"csstype": "^3.1.2",
|
||||
"prop-types": "^15.8.1",
|
||||
"react-is": "^18.2.0",
|
||||
"react-transition-group": "^4.4.5"
|
||||
@@ -409,7 +408,7 @@
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/mui-org"
|
||||
"url": "https://opencollective.com/mui"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@emotion/react": "^11.5.0",
|
||||
@@ -430,47 +429,13 @@
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@mui/material-nextjs": {
|
||||
"version": "5.15.11",
|
||||
"resolved": "https://registry.npmjs.org/@mui/material-nextjs/-/material-nextjs-5.15.11.tgz",
|
||||
"integrity": "sha512-cp5RWYbBngyi7NKP91R9QITllfxumCVPFjqe4AKzNROVuCot0VpgkafxXqfbv0uFsyUU0ROs0O2M3r17q604Aw==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.23.9"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/mui-org"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"@emotion/cache": "^11.11.0",
|
||||
"@emotion/server": "^11.11.0",
|
||||
"@mui/material": "^5.0.0",
|
||||
"@types/react": "^17.0.0 || ^18.0.0",
|
||||
"next": "^13.0.0 || ^14.0.0",
|
||||
"react": "^17.0.0 || ^18.0.0"
|
||||
},
|
||||
"peerDependenciesMeta": {
|
||||
"@emotion/cache": {
|
||||
"optional": true
|
||||
},
|
||||
"@emotion/server": {
|
||||
"optional": true
|
||||
},
|
||||
"@types/react": {
|
||||
"optional": true
|
||||
}
|
||||
}
|
||||
},
|
||||
"node_modules/@mui/private-theming": {
|
||||
"version": "5.15.14",
|
||||
"resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.15.14.tgz",
|
||||
"integrity": "sha512-UH0EiZckOWcxiXLX3Jbb0K7rC8mxTr9L9l6QhOZxYc4r8FHUkefltV9VDGLrzCaWh30SQiJvAEd7djX3XXY6Xw==",
|
||||
"version": "5.15.20",
|
||||
"resolved": "https://registry.npmjs.org/@mui/private-theming/-/private-theming-5.15.20.tgz",
|
||||
"integrity": "sha512-BK8F94AIqSrnaPYXf2KAOjGZJgWfvqAVQ2gVR3EryvQFtuBnG6RwodxrCvd3B48VuMy6Wsk897+lQMUxJyk+6g==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.23.9",
|
||||
"@mui/utils": "^5.15.14",
|
||||
"@mui/utils": "^5.15.20",
|
||||
"prop-types": "^15.8.1"
|
||||
},
|
||||
"engines": {
|
||||
@@ -595,9 +560,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@mui/utils": {
|
||||
"version": "5.15.14",
|
||||
"resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.15.14.tgz",
|
||||
"integrity": "sha512-0lF/7Hh/ezDv5X7Pry6enMsbYyGKjADzvHyo3Qrc/SSlTsQ1VkbDMbH0m2t3OR5iIVLwMoxwM7yGd+6FCMtTFA==",
|
||||
"version": "5.15.20",
|
||||
"resolved": "https://registry.npmjs.org/@mui/utils/-/utils-5.15.20.tgz",
|
||||
"integrity": "sha512-mAbYx0sovrnpAu1zHc3MDIhPqL8RPVC5W5xcO1b7PiSCJPtckIZmBkp8hefamAvUiAV8gpfMOM6Zb+eSisbI2A==",
|
||||
"dependencies": {
|
||||
"@babel/runtime": "^7.23.9",
|
||||
"@types/prop-types": "^15.7.11",
|
||||
|
||||
+1
-2
@@ -12,8 +12,7 @@
|
||||
"@emotion/cache": "^11.11.0",
|
||||
"@emotion/react": "^11.11.4",
|
||||
"@emotion/styled": "^11.11.5",
|
||||
"@mui/material": "^5.15.17",
|
||||
"@mui/material-nextjs": "^5.15.11",
|
||||
"@mui/material": "^5.14.17",
|
||||
"@mui/styled-engine-sc": "^6.0.0-alpha.18",
|
||||
"aos": "^2.3.4",
|
||||
"next": "14.2.3",
|
||||
|
||||
Reference in New Issue
Block a user