new

src/App.js

@@ -2,7 +2,7 @@ import React, {useState, useEffect} from 'react';
 import Start from './components/Start/Start';
 import Second from './components/Second/Second';
 import Tinder from './components/Tinder/Tinder';
-import Map from './components/Map/Map';
+import Main from './components/Main/Main';
 import City from './components/City/City';
 import axios from 'axios';
 import './App.css';
@@ -43,8 +43,8 @@ function App() {
     case '/tinder':
       content = <Tinder getValue={handleButtonValue} cardInfo={cardInfo}/>
       break;
-    case '/map':
+    case '/main':
-      content = <Map/>
+      content = <Main/>
       break;
     case '/city':
       content = <City getValue={handleButtonValue}/>

src/components/City/City.js

@@ -58,13 +58,17 @@ const City = (props) => {
       background: 'linear-gradient(180deg, #7EAFE7 0.27%, rgba(41, 134, 242, 0.38) 27.08%, rgba(41, 134, 242, 0.35) 31.77%, rgba(152, 198, 253, 0.28) 46.35%, rgba(41, 134, 242, 0.00) 100%)',
     }}>
       <div style={{
+        position: 'fixed',
+        top: 100,
         display: 'flex',
+        alignItems: 'center',
         flexDirection: 'column',
         justifyContent: 'center',
-        gap: 50,
+        gap: 80,
       }}>
         <div style={{
           display: 'flex',
+          justifyContent: 'center',
           width: 304,
         }}>
           <img src="./image 2.png" alt="#" style={{
@@ -72,7 +76,11 @@ const City = (props) => {
             height: 282,
           }} />
         </div>
-
+          <span style={{
+            fontWeight: 700,
+            fontSize: 30,
+            color: '#000'
+          }}>Выберите город</span>
         <select onChange={e => cityHandler(e)} value={selectedCity} id="city" name="city" style={{
           height: 40,
           width: 304,
@@ -93,6 +101,8 @@ const City = (props) => {
   <div className="button-container" style={{
     display: 'flex',
     flexDirection: 'column',
+    position: 'fixed',
+    bottom: 50,
     gap: 10,
     }}>
     <button
@@ -112,7 +122,7 @@ const City = (props) => {
       Я в этом городе
     </button>
     <button
-      onClick={() => window.location.href = 'https://www.aviasales.ru/?marker=15468.ydof241309826304&yclid=18373991699987824639&params=TGK1'}
+      onClick={() => window.open('https://www.aviasales.ru/?marker=15468.ydof241309826304&yclid=18373991699987824639&params=TGK1')}
       className="animated-button"
       style={{
         display: 'flex',

src/components/Main/Main.js

@@ -0,0 +1,9 @@
+const Main = () => {
+    return ( 
+        <div>
+            <span>Переход готов</span>
+        </div>
+     );
+}
+ 
+export default Main;

src/components/Tinder/Tinder.js

@@ -32,7 +32,6 @@ const Tinder = (props) => {
 
     return (
         <div className='tinder-container'>
-            <h1>Card</h1>
             <div className='card-container'>
                 {cardInfo.map((card) => (
                     <TinderCard
@@ -43,12 +42,11 @@ const Tinder = (props) => {
                             var unique = [...new Set(cardId)]
                             var uniqueIds = [...new Set(allIds)];
                             if(uniqueIds.length === cardInfo.length) {
-                                route('/map');
+                                route('/main');
                                 console.log(unique);
                             }
                         }}
                     >
-                        
                         <div className='card'>
                             <div
                                 className='card-content'