diff --git a/package-lock.json b/package-lock.json index 83f3116..3704f4f 100644 --- a/package-lock.json +++ b/package-lock.json @@ -53,6 +53,8 @@ "postcss-logical": "^7.0.1", "postcss-modules": "^6.0.0", "prettier": "^3.1.1", + "react": "^18.3.1", + "react-dom": "^18.3.1", "remove-files-webpack-plugin": "^1.5.0", "storybook": "^7.6.7", "swc-loader": "^0.2.3", @@ -6435,7 +6437,7 @@ "version": "15.7.11", "resolved": "https://registry.npmjs.org/@types/prop-types/-/prop-types-15.7.11.tgz", "integrity": "sha512-ga8y9v9uyeiLdpKddhxYQkxNDrfvuPrlFb0N1qnZZByvcElJaXthF1UhvCh9TLWJBEHeNtdnbysW7Y6Uq8CVng==", - "devOptional": true, + "dev": true, "license": "MIT" }, "node_modules/@types/qs": { @@ -6456,7 +6458,7 @@ "version": "18.2.0", "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.0.tgz", "integrity": "sha512-0FLj93y5USLHdnhIhABk83rm8XEGA7kH3cr+YUlvxoUGp1xNt/DINUMvqPxLyOQMzLmZe8i4RTHbvb8MC7NmrA==", - "devOptional": true, + "dev": true, "license": "MIT", "dependencies": { "@types/prop-types": "*", @@ -6466,7 +6468,7 @@ }, "node_modules/@types/react-dom": { "version": "18.2.0", - "devOptional": true, + "dev": true, "license": "MIT", "dependencies": { "@types/react": "*" @@ -6493,7 +6495,7 @@ "version": "0.16.8", "resolved": "https://registry.npmjs.org/@types/scheduler/-/scheduler-0.16.8.tgz", "integrity": "sha512-WZLiwShhwLRmeV6zH+GkbOFT6Z6VklCItrDioxUnv+u4Ll+8vKeFySoFyK/0ctcRpOmwAicELfmys1sDc/Rw+A==", - "devOptional": true, + "dev": true, "license": "MIT" }, "node_modules/@types/semver": { @@ -9614,7 +9616,7 @@ "version": "3.1.3", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz", "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", - "devOptional": true, + "dev": true, "license": "MIT" }, "node_modules/damerau-levenshtein": { @@ -10223,29 +10225,6 @@ "node": ">= 0.8" } }, - "node_modules/encoding": { - "version": "0.1.13", - "dev": true, - "license": "MIT", - "optional": true, - "peer": true, - "dependencies": { - "iconv-lite": "^0.6.2" - } - }, - "node_modules/encoding/node_modules/iconv-lite": { - "version": "0.6.3", - "dev": true, - "license": "MIT", - "optional": true, - "peer": true, - "dependencies": { - "safer-buffer": ">= 2.1.2 < 3.0.0" - }, - "engines": { - "node": ">=0.10.0" - } - }, "node_modules/end-of-stream": { "version": "1.4.4", "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz", @@ -10952,19 +10931,6 @@ "eslint": "^3 || ^4 || ^5 || ^6 || ^7 || ^8" } }, - "node_modules/eslint-plugin-react-hooks": { - "version": "4.6.0", - "resolved": "https://registry.npmjs.org/eslint-plugin-react-hooks/-/eslint-plugin-react-hooks-4.6.0.tgz", - "integrity": "sha512-oFc7Itz9Qxh2x4gNHStv3BqJq54ExXmfC+a1NjAta66IAN87Wu0R/QArgIS9qKzX3dXKPI9H5crl9QchNMY9+g==", - "dev": true, - "peer": true, - "engines": { - "node": ">=10" - }, - "peerDependencies": { - "eslint": "^3.0.0 || ^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0 || ^8.0.0-0" - } - }, "node_modules/eslint-plugin-react/node_modules/doctrine": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/doctrine/-/doctrine-2.1.0.tgz", @@ -17275,10 +17241,10 @@ } }, "node_modules/react": { - "version": "18.2.0", - "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", - "integrity": "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ==", - "peer": true, + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", + "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0" }, @@ -17337,16 +17303,16 @@ "license": "MIT" }, "node_modules/react-dom": { - "version": "18.2.0", - "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz", - "integrity": "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g==", - "peer": true, + "version": "18.3.1", + "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", + "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0", - "scheduler": "^0.23.0" + "scheduler": "^0.23.2" }, "peerDependencies": { - "react": "^18.2.0" + "react": "^18.3.1" } }, "node_modules/react-element-to-jsx-string": { @@ -18079,10 +18045,10 @@ "license": "MIT" }, "node_modules/scheduler": { - "version": "0.23.0", - "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz", - "integrity": "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw==", - "peer": true, + "version": "0.23.2", + "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.2.tgz", + "integrity": "sha512-UOShsPwz7NrMUqhR6t0hWjFduvOzbtv7toDH1/hIrfRNIDBnnBWd0CwJTGvTpngVlmwGCdP9/Zl/tVrDqcuYzQ==", + "dev": true, "dependencies": { "loose-envify": "^1.1.0" } diff --git a/package.json b/package.json index 2d5e00c..6255b4a 100644 --- a/package.json +++ b/package.json @@ -84,6 +84,8 @@ "postcss-logical": "^7.0.1", "postcss-modules": "^6.0.0", "prettier": "^3.1.1", + "react": "^18.3.1", + "react-dom": "^18.3.1", "remove-files-webpack-plugin": "^1.5.0", "storybook": "^7.6.7", "swc-loader": "^0.2.3", diff --git a/src/components/Blocks/Section/Section.module.css b/src/components/Blocks/Section/Section.module.css index 439fe63..029bd11 100644 --- a/src/components/Blocks/Section/Section.module.css +++ b/src/components/Blocks/Section/Section.module.css @@ -4,6 +4,9 @@ } .wrapper--ios .body { + display: flex; + flex-direction: column; + gap: 0.5px; border-radius: 12px; background: var(--tgui--section_bg_color); } diff --git a/src/components/Blocks/Section/Section.stories.tsx b/src/components/Blocks/Section/Section.stories.tsx index 6f08822..ef48cc4 100644 --- a/src/components/Blocks/Section/Section.stories.tsx +++ b/src/components/Blocks/Section/Section.stories.tsx @@ -67,6 +67,16 @@ export const Playground: Story = { header="Last name" placeholder="21 y.o. designer from San Francisco" /> + + ), diff --git a/src/components/Form/Input/Input.module.css b/src/components/Form/Input/Input.module.css index 7ec2d60..6b7bae8 100644 --- a/src/components/Form/Input/Input.module.css +++ b/src/components/Form/Input/Input.module.css @@ -1,6 +1,7 @@ .wrapper { padding: 12px 16px; gap: 12px; + position: relative; } .wrapper--ios {