Landings/Services
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit

Browse Source
This commit is contained in:
Tamara 2023-02-01 23:51:55 +03:00
commit eef568fcae
34 changed files with 29475 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

23
.gitignore vendored Normal file
View File

@ -0,0 +1,23 @@
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*

46
README.md Normal file
View File

@ -0,0 +1,46 @@
# Getting Started with Create React App
This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app).
## Available Scripts
In the project directory, you can run:
### `npm start`
Runs the app in the development mode.\
Open [http://localhost:3000](http://localhost:3000) to view it in the browser.
The page will reload if you make edits.\
You will also see any lint errors in the console.
### `npm test`
Launches the test runner in the interactive watch mode.\
See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information.
### `npm run build`
Builds the app for production to the `build` folder.\
It correctly bundles React in production mode and optimizes the build for the best performance.
The build is minified and the filenames include the hashes.\
Your app is ready to be deployed!
See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information.
### `npm run eject`
**Note: this is a one-way operation. Once you `eject`, you can’t go back!**
If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project.
Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own.
You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it.
## Learn More
You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started).
To learn React, check out the [React documentation](https://reactjs.org/).

28817
package-lock.json generated Normal file
View File

File diff suppressed because it is too large Load Diff

43
package.json Normal file
View File

@ -0,0 +1,43 @@
{
"name": "cra-typescript-example",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"@types/jest": "^27.5.2",
"@types/node": "^16.18.11",
"@types/react": "^18.0.27",
"@types/react-dom": "^18.0.10",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "5.0.1",
"typescript": "^4.9.5",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}

BIN
public/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

43
public/index.html Normal file
View File

@ -0,0 +1,43 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<meta
name="description"
content="Web site created using create-react-app"
/>
<link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
<!--
manifest.json provides metadata used when your web app is installed on a
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
-->
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<!--
Notice the use of %PUBLIC_URL% in the tags above.
It will be replaced with the URL of the `public` folder during the build.
Only files inside the `public` folder can be referenced from the HTML.
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
work correctly both with client-side routing and a non-root public URL.
Learn how to configure a non-root public URL by running `npm run build`.
-->
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
</body>
</html>

BIN
public/logo192.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
public/logo512.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.4 KiB

25
public/manifest.json Normal file
View File

@ -0,0 +1,25 @@
{
"short_name": "React App",
"name": "Create React App Sample",
"icons": [
{
"src": "favicon.ico",
"sizes": "64x64 32x32 24x24 16x16",
"type": "image/x-icon"
},
{
"src": "logo192.png",
"type": "image/png",
"sizes": "192x192"
},
{
"src": "logo512.png",
"type": "image/png",
"sizes": "512x512"
}
],
"start_url": ".",
"display": "standalone",
"theme_color": "#000000",
"background_color": "#ffffff"
}

3
public/robots.txt Normal file
View File

@ -0,0 +1,3 @@
# https://www.robotstxt.org/robotstxt.html
User-agent: *
Disallow:

BIN
src/fonts/Rubik-Light.woff2 Normal file
View File

Binary file not shown.

BIN
src/fonts/Rubik-VariableFont_wght.ttf Normal file
View File

Binary file not shown.

19
src/image/black_logo_PenaHab.svg Normal file
View File

@ -0,0 +1,19 @@
<svg width="180" height="70" viewBox="0 0 180 70" fill="none" xmlns="http://www.w3.org/2000/svg">
<g clip-path="url(#clip0_316_1239)">
<path fill-rule="evenodd" clip-rule="evenodd" d="M25.9138 3.31956C18.594 2.47167 13.5439 10.3345 8.84663 16.0182C4.72431 21.0062 1.6549 26.6402 1.29838 33.1042C0.919075 39.9813 2.16658 47.1435 6.85174 52.1873C11.6777 57.3827 18.9068 60.6653 25.9138 59.604C32.3391 58.6308 35.1822 51.5749 39.9658 47.1716C45.16 42.3905 54.837 40.1668 54.7027 33.1042C54.5683 26.0308 44.3552 24.6463 39.441 19.5621C34.3509 14.2959 33.1853 4.16185 25.9138 3.31956Z" fill="#7E2AEA"/>
<circle cx="44.126" cy="56.9181" r="4.03906" fill="#7E2AEA"/>
<circle cx="40.0865" cy="12.1038" r="1.53869" fill="#7E2AEA"/>
<path d="M64.699 31.4509C64.2503 27.0891 62.1983 23.0492 58.9405 20.1143C55.6828 17.1794 51.4514 15.5585 47.0666 15.5658C46.4441 15.5661 45.822 15.5987 45.2028 15.6634C40.8429 16.1212 36.807 18.1771 33.8735 21.4347C30.9399 24.6924 29.3165 28.9208 29.3164 33.3046V33.3046V58.6458H36.9188V47.8758C39.8912 49.9437 43.4267 51.0493 47.0476 51.0434C47.6702 51.0432 48.2923 51.0107 48.9115 50.9459C51.2282 50.7024 53.4744 50.005 55.5216 48.8934C57.5688 47.7818 59.3771 46.2779 60.8431 44.4675C62.3091 42.6571 63.4042 40.5757 64.0658 38.3421C64.7274 36.1085 64.9425 33.7664 64.699 31.4497V31.4509ZM54.935 39.6868C54.0999 40.7242 53.0673 41.5856 51.897 42.2211C50.7266 42.8566 49.4418 43.2536 48.117 43.3891C47.7617 43.426 47.4048 43.4446 47.0476 43.4449C44.7485 43.4428 42.5183 42.6591 40.7233 41.2225C38.9282 39.7859 37.6749 37.7817 37.1689 35.5389C36.663 33.2961 36.9346 30.948 37.9391 28.8798C38.9436 26.8117 40.6213 25.1465 42.6969 24.1576C44.7725 23.1687 47.1226 22.9147 49.3616 23.4374C51.6005 23.9602 53.5952 25.2285 55.0183 27.0343C56.4414 28.8401 57.2083 31.076 57.1932 33.3751C57.1781 35.6742 56.3818 37.8999 54.935 39.6868Z" fill="black"/>
<path d="M84.5348 15.5659C83.9123 15.5662 83.2902 15.5988 82.671 15.6635C78.1535 16.1392 73.9907 18.3299 71.0405 21.7839C68.0903 25.2379 66.5776 29.6921 66.8141 34.2284C67.0507 38.7647 69.0184 43.0374 72.3119 46.1659C75.6053 49.2944 79.9734 51.0402 84.5158 51.0435C85.1384 51.0433 85.7605 51.0108 86.3797 50.946C89.6368 50.5992 92.7351 49.3602 95.3331 47.3653C97.9312 45.3704 99.9282 42.6972 101.104 39.64H92.4388L92.4033 39.6844C91.2933 41.0563 89.8444 42.1147 88.1999 42.7549C86.5554 43.3951 84.7722 43.5948 83.0268 43.3343C81.2814 43.0739 79.6342 42.3622 78.2482 41.2699C76.8622 40.1775 75.7855 38.7421 75.1244 37.1059H101.859C102.422 34.5159 102.399 31.8329 101.79 29.2533C101.181 26.6737 100.003 24.2629 98.3424 22.1976C96.6813 20.1323 94.5791 18.4648 92.19 17.3173C89.8009 16.1698 87.1853 15.5714 84.5348 15.5659V15.5659ZM75.1244 29.5036C75.8165 27.8001 76.9578 26.3164 78.4267 25.2105C79.8956 24.1046 81.6371 23.4181 83.4655 23.224C83.8207 23.1871 84.1777 23.1685 84.5348 23.1683C86.5541 23.1649 88.528 23.7666 90.202 24.8959C91.876 26.0251 93.1732 27.63 93.9263 29.5036H75.1244Z" fill="black"/>
<path d="M120.638 15.5659C117.732 15.5613 114.882 16.3603 112.402 17.8745V15.5659H104.8V51.0436H112.402V31.4042C112.402 29.2199 113.27 27.125 114.814 25.5805C116.359 24.036 118.454 23.1683 120.638 23.1683C122.822 23.1683 124.917 24.036 126.462 25.5805C128.006 27.125 128.874 29.2199 128.874 31.4042V51.0436H136.476V31.4042C136.476 27.2036 134.808 23.1751 131.837 20.2048C128.867 17.2346 124.839 15.5659 120.638 15.5659Z" fill="black"/>
<path d="M174.492 35.5715V15.5659H166.889V18.7336C163.917 16.6648 160.382 15.5591 156.76 15.5659C156.138 15.5662 155.516 15.5988 154.897 15.6635C150.379 16.1393 146.216 18.3299 143.266 21.7839C140.316 25.238 138.803 29.6922 139.04 34.2285C139.276 38.7648 141.244 43.0375 144.537 46.1659C147.831 49.2944 152.199 51.0402 156.741 51.0436C157.364 51.0433 157.986 51.0107 158.605 50.946C163.024 50.4938 167.108 48.3889 170.04 45.0529C172.319 48.1011 175.618 50.2276 179.336 51.0436V43.0738C177.893 42.4204 176.669 41.3655 175.81 40.0351C174.951 38.7047 174.493 37.1551 174.492 35.5715ZM164.629 39.6844C163.794 40.7216 162.761 41.5828 161.591 42.2183C160.42 42.8538 159.136 43.2509 157.811 43.3867C157.456 43.4236 157.099 43.4422 156.741 43.4425C154.144 43.4424 151.646 42.4452 149.762 40.6568C147.879 38.8684 146.754 36.4252 146.619 33.8313C146.484 31.2374 147.351 28.6909 149.039 26.7171C150.727 24.7433 153.109 23.493 155.692 23.224C156.047 23.1871 156.404 23.1685 156.76 23.1683C158.674 23.1699 160.549 23.7133 162.166 24.7356C163.784 25.7579 165.08 27.2174 165.903 28.9451C166.726 30.6729 167.043 32.5984 166.818 34.4988C166.592 36.3993 165.833 38.1972 164.629 39.6844Z" fill="black"/>
<path d="M147.519 54.8937V59.1273C148.231 58.2947 149.082 57.8784 150.072 57.8784C150.58 57.8784 151.038 57.9727 151.446 58.1612C151.855 58.3497 152.161 58.5906 152.365 58.8838C152.575 59.1771 152.716 59.5017 152.79 59.8578C152.868 60.2139 152.907 60.7663 152.907 61.5151V66.4086H150.7V62.0021C150.7 61.1276 150.658 60.5726 150.575 60.3369C150.491 60.1013 150.342 59.9154 150.127 59.7793C149.917 59.6379 149.653 59.5672 149.334 59.5672C148.967 59.5672 148.64 59.6562 148.352 59.8342C148.064 60.0123 147.852 60.282 147.716 60.6433C147.585 60.9993 147.519 61.5282 147.519 62.2299V66.4086H145.312V54.8937H147.519Z" fill="black"/>
<path d="M160.644 66.4086V65.1597C160.341 65.6048 159.94 65.9556 159.442 66.2122C158.95 66.4688 158.429 66.5971 157.879 66.5971C157.319 66.5971 156.816 66.474 156.371 66.2279C155.926 65.9818 155.604 65.6362 155.405 65.1911C155.206 64.746 155.107 64.1307 155.107 63.3453V58.0669H157.314V61.9C157.314 63.073 157.353 63.793 157.432 64.06C157.515 64.3219 157.665 64.5313 157.879 64.6884C158.094 64.8403 158.366 64.9162 158.696 64.9162C159.073 64.9162 159.411 64.8141 159.71 64.6099C160.008 64.4004 160.212 64.1438 160.322 63.8401C160.432 63.5312 160.487 62.7797 160.487 61.5858V58.0669H162.694V66.4086H160.644Z" fill="black"/>
<path d="M164.894 66.4086V54.8937H167.101V59.0409C167.782 58.2659 168.588 57.8784 169.52 57.8784C170.536 57.8784 171.376 58.2476 172.041 58.9859C172.706 59.719 173.039 60.7742 173.039 62.1514C173.039 63.5757 172.699 64.6727 172.018 65.4425C171.342 66.2122 170.52 66.5971 169.551 66.5971C169.075 66.5971 168.604 66.4793 168.138 66.2436C167.677 66.0027 167.279 65.6493 166.944 65.1832V66.4086H164.894ZM167.085 62.0571C167.085 62.9211 167.221 63.56 167.493 63.9736C167.876 64.5601 168.384 64.8534 169.017 64.8534C169.504 64.8534 169.918 64.6465 170.258 64.2328C170.604 63.8139 170.777 63.1568 170.777 62.2613C170.777 61.3083 170.604 60.6223 170.258 60.2034C169.913 59.7793 169.47 59.5672 168.931 59.5672C168.402 59.5672 167.962 59.774 167.611 60.1877C167.26 60.5961 167.085 61.2193 167.085 62.0571Z" fill="black"/>
</g>
<defs>
<clipPath id="clip0_316_1239">
<rect width="179.509" height="69.4872" fill="white"/>
</clipPath>
</defs>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 6.6 KiB

BIN
src/image/block1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 342 KiB

BIN
src/image/block3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 497 KiB

BIN
src/image/block4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 357 KiB

BIN
src/image/block5.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 460 KiB

BIN
src/image/block6.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 552 KiB

BIN
src/image/block7.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 370 KiB

BIN
src/image/blok2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 515 KiB

BIN
src/image/bubbles.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 190 KiB

BIN
src/image/bubles_mini.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 388 KiB

12
src/image/logoPenaHab.svg Normal file
View File

@ -0,0 +1,12 @@
<svg width="124" height="48" viewBox="0 0 124 48" fill="none" xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd" clip-rule="evenodd" d="M17.9005 2.29318C12.8441 1.70747 9.35566 7.13894 6.11089 11.0651C3.2633 14.5107 1.14302 18.4025 0.896751 22.8677C0.634735 27.6182 1.49648 32.5656 4.73287 36.0498C8.06652 39.6386 13.0602 41.9062 17.9005 41.1731C22.3389 40.5008 24.3028 35.6268 27.6072 32.5851C31.1952 29.2824 37.8799 27.7463 37.7871 22.8677C37.6943 17.9816 30.6393 17.0251 27.2447 13.5131C23.7286 9.87537 22.9234 2.87501 17.9005 2.29318Z" fill="#7E2AEA"/>
<ellipse cx="30.4815" cy="39.3174" rx="2.79008" ry="2.79008" fill="#7E2AEA"/>
<circle cx="27.6908" cy="8.36074" r="1.06289" fill="#7E2AEA"/>
<path d="M44.6924 21.7255C44.3825 18.7125 42.9649 15.9218 40.7146 13.8944C38.4642 11.8671 35.5413 10.7474 32.5124 10.7525C32.0823 10.7526 31.6526 10.7751 31.2249 10.8199C28.2132 11.1361 25.4253 12.5563 23.3989 14.8066C21.3725 17.0568 20.2511 19.9778 20.251 23.006V23.006V40.511H25.5025V33.0714C27.5557 34.4998 29.998 35.2636 32.4992 35.2595C32.9293 35.2594 33.359 35.2369 33.7867 35.1921C35.3871 35.0239 36.9387 34.5422 38.3529 33.7743C39.767 33.0065 41.0161 31.9676 42.0288 30.717C43.0415 29.4665 43.798 28.0287 44.255 26.4857C44.712 24.9428 44.8606 23.325 44.6924 21.7246V21.7255ZM37.9477 27.4146C37.3708 28.1312 36.6575 28.7262 35.8491 29.1652C35.0406 29.6042 34.1531 29.8785 33.238 29.9721C32.9925 29.9976 32.746 30.0104 32.4992 30.0106C30.9111 30.0092 29.3705 29.4678 28.1306 28.4754C26.8906 27.4831 26.0248 26.0986 25.6753 24.5494C25.3258 23.0001 25.5134 21.3781 26.2073 19.9495C26.9012 18.5209 28.0601 17.3706 29.4939 16.6874C30.9276 16.0043 32.5511 15.8289 34.0977 16.19C35.6443 16.5511 37.0222 17.4272 38.0052 18.6746C38.9882 19.922 39.518 21.4665 39.5076 23.0547C39.4971 24.6428 38.9471 26.1803 37.9477 27.4146Z" fill="#F2F3F7"/>
<path d="M58.3944 10.7524C57.9643 10.7526 57.5346 10.7751 57.1069 10.8198C53.9863 11.1485 51.1108 12.6617 49.0728 15.0477C47.0349 17.4336 45.99 20.5105 46.1534 23.644C46.3168 26.7776 47.676 29.7291 49.9511 31.8902C52.2261 34.0512 55.2434 35.2572 58.3813 35.2595C58.8113 35.2593 59.241 35.2368 59.6688 35.1921C61.9187 34.9526 64.0589 34.0967 65.8536 32.7187C67.6482 31.3407 69.0277 29.494 69.8401 27.3822H63.8542L63.8297 27.4129C63.063 28.3606 62.0621 29.0917 60.9261 29.5339C59.7901 29.9761 58.5583 30.1141 57.3527 29.9342C56.147 29.7542 55.0092 29.2627 54.0517 28.5081C53.0943 27.7535 52.3505 26.762 51.8939 25.6317H70.3617C70.7505 23.8426 70.7342 21.9892 70.3138 20.2073C69.8934 18.4254 69.0797 16.7601 67.9323 15.3334C66.7848 13.9068 65.3327 12.7549 63.6824 11.9623C62.032 11.1696 60.2252 10.7562 58.3944 10.7524V10.7524ZM51.8939 20.3802C52.3719 19.2035 53.1603 18.1786 54.175 17.4147C55.1897 16.6508 56.3927 16.1765 57.6557 16.0425C57.9011 16.017 58.1477 16.0041 58.3944 16.004C59.7892 16.0016 61.1528 16.4173 62.3091 17.1973C63.4655 17.9774 64.3615 19.086 64.8818 20.3802H51.8939Z" fill="#F2F3F7"/>
<path d="M83.3332 10.7525C81.3261 10.7493 79.3571 11.3012 77.6441 12.3472V10.7525H72.3926V35.2595H77.6441V21.6931C77.6441 20.1842 78.2435 18.7372 79.3104 17.6703C80.3773 16.6034 81.8244 16.004 83.3332 16.004C84.8421 16.004 86.2891 16.6034 87.3561 17.6703C88.423 18.7372 89.0224 20.1842 89.0224 21.6931V35.2595H94.2739V21.6931C94.2739 18.7915 93.1212 16.0087 91.0694 13.9569C89.0177 11.9051 86.2349 10.7525 83.3332 10.7525Z" fill="#F2F3F7"/>
<path d="M120.534 24.5718V10.7525H115.283V12.9406C113.23 11.5115 110.787 10.7477 108.286 10.7525C107.856 10.7527 107.426 10.7751 106.998 10.8199C103.878 11.1485 101.002 12.6617 98.9644 15.0477C96.9265 17.4337 95.8816 20.5105 96.045 23.6441C96.2084 26.7776 97.5676 29.7291 99.8427 31.8902C102.118 34.0512 105.135 35.2572 108.273 35.2595C108.703 35.2593 109.133 35.2368 109.56 35.1921C112.613 34.8798 115.434 33.4257 117.46 31.1213C119.033 33.227 121.313 34.6959 123.88 35.2595V29.7542C122.884 29.3029 122.038 28.5742 121.445 27.6552C120.852 26.7362 120.535 25.6657 120.534 24.5718ZM113.721 27.4129C113.144 28.1293 112.431 28.7243 111.623 29.1632C110.814 29.6022 109.927 29.8766 109.012 29.9704C108.766 29.9958 108.52 30.0087 108.273 30.0089C106.479 30.0088 104.753 29.32 103.452 28.0846C102.151 26.8492 101.374 25.1615 101.281 23.3697C101.188 21.5779 101.786 19.8188 102.952 18.4554C104.118 17.092 105.764 16.2283 107.548 16.0425C107.793 16.017 108.04 16.0041 108.286 16.004C109.608 16.0051 110.903 16.3805 112.02 17.0866C113.138 17.7928 114.033 18.801 114.601 19.9945C115.17 21.1879 115.389 22.518 115.233 23.8308C115.078 25.1436 114.553 26.3855 113.721 27.4129Z" fill="#F2F3F7"/>
<path d="M101.903 37.9189V40.8434C102.395 40.2683 102.982 39.9807 103.666 39.9807C104.017 39.9807 104.333 40.0459 104.615 40.1761C104.898 40.3063 105.109 40.4727 105.25 40.6752C105.395 40.8778 105.493 41.1021 105.543 41.348C105.598 41.594 105.625 41.9756 105.625 42.4929V45.8731H104.1V42.8293C104.1 42.2252 104.071 41.8418 104.013 41.679C103.955 41.5162 103.852 41.3878 103.704 41.2938C103.559 41.1961 103.377 41.1473 103.156 41.1473C102.903 41.1473 102.677 41.2088 102.478 41.3318C102.279 41.4547 102.132 41.641 102.038 41.8906C101.948 42.1366 101.903 42.5019 101.903 42.9866V45.8731H100.378V37.9189H101.903Z" fill="#F2F3F7"/>
<path d="M110.969 45.8731V45.0104C110.759 45.3179 110.483 45.5603 110.139 45.7375C109.799 45.9147 109.439 46.0034 109.059 46.0034C108.672 46.0034 108.325 45.9184 108.017 45.7484C107.71 45.5783 107.488 45.3396 107.35 45.0321C107.213 44.7247 107.144 44.2997 107.144 43.7571V40.111H108.669V42.7587C108.669 43.569 108.696 44.0664 108.75 44.2508C108.808 44.4317 108.911 44.5764 109.059 44.6849C109.207 44.7898 109.396 44.8422 109.623 44.8422C109.884 44.8422 110.117 44.7717 110.323 44.6306C110.53 44.486 110.671 44.3087 110.747 44.0989C110.823 43.8855 110.861 43.3664 110.861 42.5417V40.111H112.385V45.8731H110.969Z" fill="#F2F3F7"/>
<path d="M113.904 45.8731V37.9189H115.429V40.7838C115.899 40.2484 116.456 39.9807 117.1 39.9807C117.802 39.9807 118.382 40.2358 118.842 40.7458C119.301 41.2522 119.531 41.981 119.531 42.9324C119.531 43.9162 119.296 44.674 118.826 45.2058C118.359 45.7375 117.791 46.0034 117.122 46.0034C116.793 46.0034 116.467 45.922 116.145 45.7592C115.827 45.5928 115.552 45.3487 115.321 45.0267V45.8731H113.904ZM115.418 42.8673C115.418 43.4641 115.512 43.9054 115.7 44.1912C115.964 44.5963 116.315 44.7988 116.753 44.7988C117.089 44.7988 117.375 44.656 117.61 44.3702C117.849 44.0808 117.968 43.6269 117.968 43.0083C117.968 42.35 117.849 41.8762 117.61 41.5868C117.371 41.2938 117.066 41.1473 116.693 41.1473C116.328 41.1473 116.024 41.2902 115.782 41.5759C115.539 41.8581 115.418 42.2885 115.418 42.8673Z" fill="#F2F3F7"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 6.5 KiB

18
src/index.tsx Normal file
View File

@ -0,0 +1,18 @@
import * as React from 'react';
import * as ReactDOM from 'react-dom/client';
import Home from './pages/home/home.tsx';
import { BrowserRouter, Route, Routes } from 'react-router-dom';
const root = ReactDOM.createRoot(
document.getElementById('root') as HTMLElement
);
root.render(
<React.StrictMode>
<BrowserRouter>
<Routes>
<Route path="/" element={ <Home /> } />
</Routes>
</BrowserRouter>
</React.StrictMode>
);

111
src/kit/footer.tsx Normal file
View File

@ -0,0 +1,111 @@
import * as React from 'react';
import Box from "@mui/material/Box";
import Typography from '@mui/material/Typography';
import Button from "@mui/material/Button";
import logotip from '../image/logoPenaHab.svg';
import SectionStyled from './section.tsx';
import {styled} from "@mui/material/styles";
const RootBox = styled('div')(({ theme }) => ({
[theme.breakpoints.down('sm')]: {
justifyContent: 'center',
},
}));
const BoxMenu = styled('div')(({ theme }) => ({
[theme.breakpoints.down('xs')]: {
width: '100%',
},
}));
export default function Component() {
return(
<SectionStyled tag={'footer'} bg={'#252734'} mwidth={'1160px'}
sxsect={{
justifyContent: 'space-around',
}}
sxcont={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
flexDirection: 'column',
minHeight: '433px',
padding: '100px 10px',
boxSizing: 'border-box',
}}>
<RootBox
sx={{
display: 'flex',
height: '50%',
justifyContent: "space-between",
alignItems: "center",
width: "100%",
flexWrap: 'wrap',
}}
>
<Box
sx={{
width: '124px',
height: '48px',
backgroundSize: 'contain',
}}
>
<img src={logotip}/>
</Box>
<Box
sx={{
display: 'flex',
width: '457px',
justifyContent: "space-between",
flexWrap: 'wrap',
}}
>
<BoxMenu
sx={{
display: 'flex',
flexDirection: 'column',
'button':{color: '#F2F3F7', textTransform: 'none'},
}}
>
<Button variant="text">Меню 1</Button>
<Button variant="text">Меню 1</Button>
<Button variant="text">Меню 1</Button>
</BoxMenu>
<BoxMenu
sx={{
display: 'flex',
flexDirection: 'column',
'button':{color: '#F2F3F7', textTransform: 'none'},
}}
>
<Button variant="text">Меню 1</Button>
<Button variant="text">Меню 1</Button>
<Button variant="text">Меню 1</Button>
</BoxMenu>
<BoxMenu
sx={{
display: 'flex',
flexDirection: 'column',
'button':{color: '#F2F3F7', textTransform: 'none'},
}}
>
<Button variant="text">Меню 1</Button>
<Button variant="text">Меню 1</Button>
<Button variant="text">Меню 1</Button>
</BoxMenu>
</Box>
</RootBox>
<Box
sx={{
display: 'flex',
justifyContent: 'center',
alignItems: 'end',
height: '50%',
}}
>
</Box>
</SectionStyled>
)
}

59
src/kit/header.tsx Normal file
View File

@ -0,0 +1,59 @@
import * as React from "react";
import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import SectionStyled from './section.tsx';
import logotip from '../image/logoPenaHab.svg';
const buttonMenu: Array<string> = ['Меню 1', 'Меню 2', 'Меню 3', 'Меню 4', 'Меню 5', 'Меню 6', 'Меню 7']
export default function Component() {
const [select, setSelect] = React.useState(0)
return (
<SectionStyled tag={'header'} bg={'#252734'} mwidth={'1160px'}
sxsect={{
minHeight: '80px',
}}
sxcont={{
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
}}>
<Box>
<img src={logotip}/>
</Box>
<Box
sx={{
maxWidth: '595px',
width: '100%',
display: 'flex',
justifyContent: 'space-between',
flexWrap: 'wrap'
}}
>
{buttonMenu.map( (element, index) => (
<Button key={index} to={element[0]}
onClick={() => {
setSelect(index)
}}
variant="text"
sx={{
color: select === index ? '#7E2AEA' : '#ffffff',
textTransform: 'none',
}}>{element} </Button>
))}
</Box>
<Button variant="outlined"
sx={{
color: '#ffffff',
border: '1px solid #ffffff',
textTransform: 'none',
fontWeight: '400',
fontSize: '18px',
lineHeight: '24px',
borderRadius: '8px',
padding: '8px 17px',
}}
>Связаться с нами</Button>
</SectionStyled>
)
}

30
src/kit/section.tsx Normal file
View File

@ -0,0 +1,30 @@
import * as React from "react";
import Box from '@mui/material/Box';
export default function Section (props) {
return (
<Box
component={props.tag}
backgroundColor={props.bg}
sx={{
width: '100%',
fontFamily: 'Rubik',
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
...props.sxsect
}}
>
<Box
maxWidth={props.mwidth}
sx={{
width: '100%',
...props.sxcont
}}
>
{props.children}
</Box>
</Box>
);
}

45
src/kit/theme.ts Normal file
View File

@ -0,0 +1,45 @@
import {createTheme} from "@mui/material";
declare module '@mui/material/Button' {
interface ButtonPropsVariantOverrides {
template: true;
}
}
const theme = createTheme({
breakpoints: {
values: {
xs: 460,
sm: 600,
md: 680,
lg: 900,
xl: 1000,
}
},
typography: {
fontFamily: 'Rubik',
},
components: {
MuiButton: {
variants: [
{
props: {
variant: "template"
},
style: {
background: '#7E2AEA',
border: '1px solid #7E2AEA',
borderRadius: '8px',
padding: '15px 40px',
textTransform: 'none',
color: '#ffffff',
fontWeight: 400,
fontSize: '18px',
lineHeight: '24px'
},
},
],
},
},
})
export default theme

68
src/pages/home/hero.tsx Normal file
View File

@ -0,0 +1,68 @@
import * as React from "react";
import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import SectionStyled from '../../kit/section';
import {Typography} from '@mui/material';
import buble from '../../image/bubbles.png';
declare module '@mui/material/Button' {
interface ButtonPropsVariantOverrides {
template: true;
}
}
export default function Component() {
return (
<SectionStyled
tag={'section'}
bg={'#252734'}
mwidth={'1160px'}
sxsect={{
height: '700px',
alignItems: 'flex-start'
}}
sxcont={{margin: '74px 0',
position: 'relative',
}}
>
<Box sx={{maxWidth: '873px'}}>
<Typography sx={{
color: '#A45EFF',
fontWeight: 500,
fontSize: '24px',
}}>
Работаем быстро, дёшево, качественно
</Typography>
<Typography
sx={{
color: '#ffffff',
fontWeight: 500,
fontSize: '60px',
lineHeight: '100%',
marginTop: '24px'
}}
>
Pena предоставляет услуги
по разработке всего спектра программного обеспечения
для частных и юридических
лиц по всему миру
</Typography>
</Box>
<Button variant="template"
sx={{
marginTop: '70px'
}}
>
Связаться с нами
</Button>
<Box
sx={{
position: 'absolute',
top: '187px',
right: '-140px',
}}>
<img src={buble}/>
</Box>
</SectionStyled>
)
}

22
src/pages/home/home.tsx Normal file
View File

@ -0,0 +1,22 @@
import * as React from 'react';
import Header from '../../kit/header.tsx';
import Footer from '../../kit/footer.tsx';
import Hero from './hero.tsx';
import Questions from './your_questions.tsx'
import theme from '../../kit/theme.ts';
import { ThemeProvider } from '@mui/material/styles';
import {CssBaseline} from "@mui/material";
export default function Home() {
return(
<>
<CssBaseline />
<ThemeProvider theme={theme}>
<Header/>
<Hero />
<Questions />
<Footer />
</ThemeProvider>
</>
)
}

59
src/pages/home/your_questions.tsx Normal file
View File

@ -0,0 +1,59 @@
import * as React from "react";
import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import SectionStyled from '../../kit/section.tsx';
import {Typography} from '@mui/material';
import bubles2 from '../../image/bubles_mini.png';
export default function Component() {
return (
<SectionStyled
tag={'section'}
bg={'#7E2AEA'}
mwidth={'1160px'}
sxsect={{
height: '700px',
alignItems: 'flex-start'
}}
sxcont={{margin: '74px 0',
position: 'relative',
display: 'flex'
}}
>
<Box>
<Typography variant='h2'
sx={{
color: '#ffffff',
fontWeight: 500,
fontSize: '70px',
lineHeight: '100%',
}}
>
Ответим на все
ваши вопросы
</Typography>
<Typography
sx={{
color: '#ffffff',
fontWeight: 400,
fontSize: '18px',
lineHeight: '21px',
}}
>
Напишите нам по поводу проекта, мы свяжемся с вами для детального обсуждения. Отвечаем на все заявки без исключения. Работаем вне рамок географии и часовых поясов
</Typography>
</Box>
<Box>
<Button>
Заполнить форму
</Button>
<Button>
Написать на почту
</Button>
</Box>
<Box>
<img src={'bubles2'}/>
</Box>
</SectionStyled>
)
}

1
src/react-app-env.d.ts vendored Normal file
View File

@ -0,0 +1 @@
/// <reference types="react-scripts" />

5
src/setupTests.ts Normal file
View File

@ -0,0 +1,5 @@
// jest-dom adds custom jest matchers for asserting on DOM nodes.
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
import '@testing-library/jest-dom';

26
tsconfig.json Normal file
View File

@ -0,0 +1,26 @@
{
"compilerOptions": {
"target": "es5",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noFallthroughCasesInSwitch": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": [
"src"
]
}