changes requests #13 #18

FACG4 · Jul 26, 2018 · 12394ec · 12394ec
1 parent 4a3ff62
commit 12394ec
Show file tree

Hide file tree

Showing 18 changed files with 28 additions and 43 deletions.
diff --git a/client/src/components/button/index.js b/client/src/components/button/index.js
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import '../../App.css';
 import './button.css'
 
 class Button extends Component {

diff --git a/client/src/components/detailscard/detailscard.css b/client/src/components/detailscard/detailscard.css
@@ -6,29 +6,26 @@
   background-color: #91ADF630;
   width: 50%;
   margin: 0 auto 40px auto;
+  font-family: 'Volkhov';
 }
 
 .flightno-style {
   text-align: center;
-  font-family: 'Volkhov';
   font-size: 15px;
   width: 100%;
   margin: 10px 0;
 }
 
 .duration-label {
-  font-family: 'Volkhov';
-  font-size: 16px;
   margin-right: 10px;
 }
 
 .float-style {
-  font-family: 'Volkhov';
-  font-size: 16px;
   float: right;
 }
 
 .labels-container {
+  font-size: 16px;
   padding: 0 10px;
   width: 300px;
   height: 30px;

diff --git a/client/src/components/detailscard/index.js b/client/src/components/detailscard/index.js
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import '../../App.css';
 import './detailscard.css'
 
 class Card extends Component {

diff --git a/client/src/components/durationcard/durationcard.css b/client/src/components/durationcard/durationcard.css
@@ -1,13 +1,14 @@
 .inline-div {
   float: right;
+  font-family: 'Volkhov';
 }
 
 .container-card {
   display: flex;
   align-items: center;
   border-radius: 10px;
   background-color: #91ADF630;
-  width: 225px;
+  width: 280px;
   padding: 10px;
   margin-bottom: 40px;
 }
@@ -19,7 +20,6 @@
 }
 
 .duration-label {
-  font-family: 'Volkhov';
   font-size: 12px;
   margin-right: 10px;
 }
diff --git a/client/src/components/durationcard/index.js b/client/src/components/durationcard/index.js
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import '../../App.css';
 import './durationcard.css'
 
 class Card extends Component {

diff --git a/client/src/components/header/header.css b/client/src/components/header/header.css
@@ -6,6 +6,7 @@
   width: 100%;
   display: flex;
   align-items: center;
+  font-family: 'Volkhov';
 }
 
 .plane-image {
@@ -17,5 +18,4 @@
 .username {
   float: right;
   color: #f2f2f2;
-  font-family: 'Volkhov';
 }
diff --git a/client/src/components/header/index.js b/client/src/components/header/index.js
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import '../../App.css';
 import './header.css'
 
 class Header extends Component {

diff --git a/client/src/components/input/index.js b/client/src/components/input/index.js
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import '../../App.css';
 import './input.css';
 
 class Input extends Component {

diff --git a/client/src/components/input/input.css b/client/src/components/input/input.css
@@ -2,6 +2,7 @@
   width: 500px;
   height: 50px;
   margin-bottom: 40px;
+  font-family: 'Volkhov';
 }
 
 .input-style {
@@ -12,7 +13,6 @@
   width: 300px;
   height: 50px;
   padding-left: 10px;
-  font-family: 'Volkhov';
   float: right;
 }
 
@@ -24,5 +24,4 @@
   font-size: 16px;
   margin-bottom: 20px;
   height: 50px;
-  font-family: 'Volkhov';
 }
diff --git a/client/src/components/radiobuttons/index.js b/client/src/components/radiobuttons/index.js
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import '../../App.css';
 import './radiobutton.css'
 
 class Radiobutton extends Component {

diff --git a/client/src/components/select/index.js b/client/src/components/select/index.js
@@ -1,21 +1,16 @@
 import React, { Component } from 'react';
-import '../../App.css';
 import './select.css';
 
 class Select extends Component {
   render() {
-    const { labelText, firstItem } = this.props;
+    const { labelText, firstItem, cities } = this.props;
     return (
       <div className='container-select'>
         <label className='label-style'>{labelText}</label>
         <select className='select-style'>
           <option>{firstItem}</option>
-          <option>city1</option>
-          <option>city2</option>
-          <option>city3</option>
-          <option>city4</option>
+          {cities.map(city => <option>{city}</option>)}
         </select>
-
       </div>
     );
   }

diff --git a/client/src/components/select/select.css b/client/src/components/select/select.css
@@ -2,6 +2,7 @@
   width: 500px;
   height: 50px;
   margin-bottom: 40px;
+  font-family: 'Volkhov';
 }
 
 .select-style {
@@ -12,7 +13,6 @@
   width: 300px;
   height: 50px;
   padding-left: 10px;
-  font-family: 'Volkhov';
   float: right;
 }
 
@@ -24,5 +24,4 @@
   font-size: 18px;
   margin-bottom: 20px;
   height: 50px;
-  font-family: 'Volkhov';
 }
diff --git a/client/src/components/sidenav/index.js b/client/src/components/sidenav/index.js
@@ -1,30 +1,29 @@
 import React, { Component } from 'react';
-import '../../App.css';
 import './sidenav.css'
 
 class Sidenav extends Component {
   render() {
     const { thirdTap } = this.props;
     return (
-      <div className="sidenav-container">
+      <ul className="sidenav-container">
 
-        <div className="flights">
+        <li>
           <img src={require('./tables.png')} alt='tables' />
           <a href="#">Flights</a>
-        </div>
+        </li>
 
-        <div className="add-flight">
+        <li>
           <img src={require('./addtable.png')} alt='atables' />
           <a href="#">Add Flights</a>
-        </div>
+        </li>
 
       { thirdTap &&
-        (<div className="update-flight">
+        (<li>
           <img src={require('./edittable.png')} alt='etables' />
           <a href="#">Update flight status</a>
-        </div>)
+        </li>)
       }
-      </div>
+      </ul>
     );
   }
 }

diff --git a/client/src/components/sidenav/sidenav.css b/client/src/components/sidenav/sidenav.css
@@ -4,24 +4,30 @@
   height: 100vh;
   padding-top: 10px;
   display: inline;
+  font-family: 'Volkhov';
 }
 
-.flights img, .add-flight img, .update-flight img {
+.sidenav-container li img{
   padding-left: 3px;
   font-size: 25px;
   width: 30px;
   height: 30px;
   margin-right: 10px;
 }
 
-.flights, .add-flight, .update-flight {
+.sidenav-container  li {
   display: flex;
   flex-direction: row;
   align-items: center;
   padding: 15px;
 }
 
-.flights:hover, .add-flight:hover, .update-flight:hover {
+.sidenav-container li a {
+  text-decoration: none;
+  color: black;
+}
+
+.sidenav-container li:hover {
   background-color: #d6d0d0;
   cursor: pointer;
 }
diff --git a/client/src/pages/addFlight/index.js b/client/src/pages/addFlight/index.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import './addflight.css';
-import '../../App.css';
 import Durationcard from '../../components/durationcard';
 import Select from '../../components/select';
 import Input from '../../components/input';
@@ -18,8 +17,8 @@ class UpdateFlight extends Component {
             <div className="sub-container-sidenav-form">
               <Sidenav />
               <div className="sub-container-form">
-                <Select labelText='Origin' firstItem='from' />
-                <Select labelText='Destination' firstItem='to' />
+                <Select labelText='Origin' firstItem='from' cities={['city1','city2']}/>
+                <Select labelText='Destination' firstItem='to' cities={['city1','city2']} />
                 <Input labelText='Flight date' placeholder='flight date' />
                 <Input labelText='Aircraft type' placeholder='aircraft type' />
                 <div className='width-div'>

diff --git a/client/src/pages/flights/index.js b/client/src/pages/flights/index.js
@@ -1,5 +1,4 @@
 import React, { Component } from 'react';
-import '../../App.css';
 import './flight.css';
 import Header from '../../components/header';
 import Sidenav from '../../components/sidenav';

diff --git a/client/src/pages/login/index.js b/client/src/pages/login/index.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import './login.css';
-import '../../App.css';
 import Input from '../../components/input';
 import Button from '../../components/button';
 

diff --git a/client/src/pages/updateFlight/index.js b/client/src/pages/updateFlight/index.js
@@ -1,6 +1,5 @@
 import React, { Component } from 'react';
 import '../addFlight/addflight.css';
-import '../../App.css';
 import Input from '../../components/input';
 import Button from '../../components/button';
 import Header from '../../components/header';