diff --git a/package-lock.json b/package-lock.json index 08211c4..7e635e4 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10982,6 +10982,14 @@ } } }, + "react-router-bootstrap": { + "version": "0.25.0", + "resolved": "https://registry.npmjs.org/react-router-bootstrap/-/react-router-bootstrap-0.25.0.tgz", + "integrity": "sha512-/22eqxjn6Zv5fvY2rZHn57SKmjmJfK7xzJ6/G1OgxAjLtKVfWgV5sn41W2yiqzbtV5eE4/i4LeDLBGYTqx7jbA==", + "requires": { + "prop-types": "^15.5.10" + } + }, "react-router-dom": { "version": "5.1.2", "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-5.1.2.tgz", diff --git a/package.json b/package.json index 2a2c539..85bac7c 100644 --- a/package.json +++ b/package.json @@ -12,6 +12,7 @@ "react-bootstrap": "^1.0.0-beta.17", "react-dom": "^16.13.0", "react-leaflet": "^2.6.3", + "react-router-bootstrap": "^0.25.0", "react-router-dom": "^5.1.2", "react-scripts": "3.4.0" }, diff --git a/public/android-icon-144x144.png b/public/android-icon-144x144.png new file mode 100644 index 0000000..8ca26fd Binary files /dev/null and b/public/android-icon-144x144.png differ diff --git a/public/android-icon-192x192.png b/public/android-icon-192x192.png new file mode 100644 index 0000000..3126174 Binary files /dev/null and b/public/android-icon-192x192.png differ diff --git a/public/android-icon-36x36.png b/public/android-icon-36x36.png new file mode 100644 index 0000000..e424293 Binary files /dev/null and b/public/android-icon-36x36.png differ diff --git a/public/android-icon-48x48.png b/public/android-icon-48x48.png new file mode 100644 index 0000000..d0c25c0 Binary files /dev/null and b/public/android-icon-48x48.png differ diff --git a/public/android-icon-72x72.png b/public/android-icon-72x72.png new file mode 100644 index 0000000..c7eb8f6 Binary files /dev/null and b/public/android-icon-72x72.png differ diff --git a/public/android-icon-96x96.png b/public/android-icon-96x96.png new file mode 100644 index 0000000..7b27c78 Binary files /dev/null and b/public/android-icon-96x96.png differ diff --git a/public/apple-icon-114x114.png b/public/apple-icon-114x114.png new file mode 100644 index 0000000..689aaaa Binary files /dev/null and b/public/apple-icon-114x114.png differ diff --git a/public/apple-icon-120x120.png b/public/apple-icon-120x120.png new file mode 100644 index 0000000..49918c7 Binary files /dev/null and b/public/apple-icon-120x120.png differ diff --git a/public/apple-icon-144x144.png b/public/apple-icon-144x144.png new file mode 100644 index 0000000..8ca26fd Binary files /dev/null and b/public/apple-icon-144x144.png differ diff --git a/public/apple-icon-152x152.png b/public/apple-icon-152x152.png new file mode 100644 index 0000000..3312648 Binary files /dev/null and b/public/apple-icon-152x152.png differ diff --git a/public/apple-icon-180x180.png b/public/apple-icon-180x180.png new file mode 100644 index 0000000..3f3d39e Binary files /dev/null and b/public/apple-icon-180x180.png differ diff --git a/public/apple-icon-57x57.png b/public/apple-icon-57x57.png new file mode 100644 index 0000000..9e9b7bf Binary files /dev/null and b/public/apple-icon-57x57.png differ diff --git a/public/apple-icon-60x60.png b/public/apple-icon-60x60.png new file mode 100644 index 0000000..c986a37 Binary files /dev/null and b/public/apple-icon-60x60.png differ diff --git a/public/apple-icon-72x72.png b/public/apple-icon-72x72.png new file mode 100644 index 0000000..c7eb8f6 Binary files /dev/null and b/public/apple-icon-72x72.png differ diff --git a/public/apple-icon-76x76.png b/public/apple-icon-76x76.png new file mode 100644 index 0000000..30c3283 Binary files /dev/null and b/public/apple-icon-76x76.png differ diff --git a/public/apple-icon-precomposed.png b/public/apple-icon-precomposed.png new file mode 100644 index 0000000..2dc0b02 Binary files /dev/null and b/public/apple-icon-precomposed.png differ diff --git a/public/apple-icon.png b/public/apple-icon.png new file mode 100644 index 0000000..2dc0b02 Binary files /dev/null and b/public/apple-icon.png differ diff --git a/public/browserconfig.xml b/public/browserconfig.xml new file mode 100644 index 0000000..c554148 --- /dev/null +++ b/public/browserconfig.xml @@ -0,0 +1,2 @@ + +#ffffff \ No newline at end of file diff --git a/public/favicon-16x16.png b/public/favicon-16x16.png new file mode 100644 index 0000000..7a3b3b2 Binary files /dev/null and b/public/favicon-16x16.png differ diff --git a/public/favicon-32x32.png b/public/favicon-32x32.png new file mode 100644 index 0000000..6716388 Binary files /dev/null and b/public/favicon-32x32.png differ diff --git a/public/favicon-96x96.png b/public/favicon-96x96.png new file mode 100644 index 0000000..7b27c78 Binary files /dev/null and b/public/favicon-96x96.png differ diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..5de317c Binary files /dev/null and b/public/favicon.ico differ diff --git a/public/index.html b/public/index.html index 732fff9..197ee9d 100644 --- a/public/index.html +++ b/public/index.html @@ -4,10 +4,29 @@ - + + + + + + + + + + + + + + + + + + + + + + + @@ -18,7 +37,7 @@ crossorigin="" /> - React App + COVID-19 Response App diff --git a/public/manifest.json b/public/manifest.json index f9051fe..e07e3eb 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -4,5 +4,43 @@ "start_url": ".", "display": "standalone", "theme_color": "#000000", - "background_color": "#ffffff" + "background_color": "#ffffff", + "icons": [ + { + "src": "\/android-icon-36x36.png", + "sizes": "36x36", + "type": "image\/png", + "density": "0.75" + }, + { + "src": "\/android-icon-48x48.png", + "sizes": "48x48", + "type": "image\/png", + "density": "1.0" + }, + { + "src": "\/android-icon-72x72.png", + "sizes": "72x72", + "type": "image\/png", + "density": "1.5" + }, + { + "src": "\/android-icon-96x96.png", + "sizes": "96x96", + "type": "image\/png", + "density": "2.0" + }, + { + "src": "\/android-icon-144x144.png", + "sizes": "144x144", + "type": "image\/png", + "density": "3.0" + }, + { + "src": "\/android-icon-192x192.png", + "sizes": "192x192", + "type": "image\/png", + "density": "4.0" + } + ] } diff --git a/public/ms-icon-144x144.png b/public/ms-icon-144x144.png new file mode 100644 index 0000000..8ca26fd Binary files /dev/null and b/public/ms-icon-144x144.png differ diff --git a/public/ms-icon-150x150.png b/public/ms-icon-150x150.png new file mode 100644 index 0000000..b0bd870 Binary files /dev/null and b/public/ms-icon-150x150.png differ diff --git a/public/ms-icon-310x310.png b/public/ms-icon-310x310.png new file mode 100644 index 0000000..8f30efd Binary files /dev/null and b/public/ms-icon-310x310.png differ diff --git a/public/ms-icon-70x70.png b/public/ms-icon-70x70.png new file mode 100644 index 0000000..c4faffd Binary files /dev/null and b/public/ms-icon-70x70.png differ diff --git a/src/App.css b/src/App.css index 3f812b9..556465b 100644 --- a/src/App.css +++ b/src/App.css @@ -1,14 +1,15 @@ +html, body, #root { min-height: 100vh; } + .App { - height: 100vh; + background-color: rgb(245, 243, 243); + min-height: 100vh; } -/* Container for each page */ -.Content-Container { +.flex { display: flex; + flex-direction: column; justify-content: center; - height: 100%; - width: 100%; - background-color: rgb(245, 243, 243); + align-items: center; } /* Bootstrap NavBar additional CSS */ diff --git a/src/App.js b/src/App.js index e8eec7c..b622d42 100644 --- a/src/App.js +++ b/src/App.js @@ -1,26 +1,40 @@ import React from 'react'; -import { BrowserRouter, Route } from 'react-router-dom'; +import { Route, Switch } from 'react-router-dom'; import './App.css'; import NaviBar from './Components/NavBar'; import Home from './Components/Home'; import About from './Components/About'; -import Resources from './Components/Resources'; -import MapComponent from './Components/MapComponent'; -import SomePage from './Components/SomePage'; import 'bootstrap/dist/css/bootstrap.min.css'; +import FoodCategory from './Components/FoodNavigation'; +import FoodDistribution from './Components/FoodCategory/FoodDistribution'; +import RestarauntInfo from './Components/FoodCategory/RestaurantInfo'; +import CovidCategory from './Components/CovidNavigation'; +import TestingCenters from './Components/CovidCategory/TestingCenters'; +import SomeNavigation from './Components/SomeNavigation'; function App() { return ( -
- - - - - + + + + + + + + + {/* FoodNavigation */} + + + + + {/* CovidNavigation */} + + + + {/* SomeNavigation */}
- ); } diff --git a/src/Components/About.js b/src/Components/About.js index 632d28b..fe13c03 100644 --- a/src/Components/About.js +++ b/src/Components/About.js @@ -1,11 +1,12 @@ import React, { Component } from 'react'; +import { Container } from 'react-bootstrap'; class About extends Component { render() { return ( -
+

I'm also page.

-
+ ); } } diff --git a/src/Components/CategoryCard.js b/src/Components/CategoryCard.js new file mode 100644 index 0000000..522917b --- /dev/null +++ b/src/Components/CategoryCard.js @@ -0,0 +1,36 @@ +import React, { Component } from 'react'; +import { Card, Button } from 'react-bootstrap'; +import { LinkContainer } from 'react-router-bootstrap'; + +class CategoryCard extends Component { + render() { + const { heading, title, description, link } = this.props; + return ( + + + {heading} + + + {title} + + {description} + + {/* The LinkContainer is what actually needs CSS applied to be moved/placed at the bottom of the card. + The LinkContainer wraps the bootstrap button to make it function as a Link from React-Router. */} + + + + + + ); + } +} + +export default CategoryCard; \ No newline at end of file diff --git a/src/Components/CovidCategory/TestingCenters.js b/src/Components/CovidCategory/TestingCenters.js new file mode 100644 index 0000000..1a26222 --- /dev/null +++ b/src/Components/CovidCategory/TestingCenters.js @@ -0,0 +1,14 @@ +import React, { Component } from 'react'; +import { Container } from 'react-bootstrap'; + +class TestingCenters extends Component { + render() { + return ( + +

Information about testing center locations.

+ + ); + } +} + +export default TestingCenters; \ No newline at end of file diff --git a/src/Components/CovidNavigation.js b/src/Components/CovidNavigation.js new file mode 100644 index 0000000..0f14cdb --- /dev/null +++ b/src/Components/CovidNavigation.js @@ -0,0 +1,29 @@ +import React, { Component } from 'react'; +import CategoryCard from './CategoryCard'; +import { Container, CardColumns } from 'react-bootstrap'; + +class CovidCategory extends Component { + render() { + return ( + + + + + + + ); + } +} + +export default CovidCategory; \ No newline at end of file diff --git a/src/Components/FoodCategory/FoodDistribution.js b/src/Components/FoodCategory/FoodDistribution.js new file mode 100644 index 0000000..98fcba7 --- /dev/null +++ b/src/Components/FoodCategory/FoodDistribution.js @@ -0,0 +1,14 @@ +import React, { Component } from 'react'; +import { Container } from 'react-bootstrap'; + +class FoodDistribution extends Component { + render() { + return ( + +

Information about food distribution sites.

+ + ); + } +} + +export default FoodDistribution; \ No newline at end of file diff --git a/src/Components/FoodCategory/RestaurantInfo.js b/src/Components/FoodCategory/RestaurantInfo.js new file mode 100644 index 0000000..9af86f2 --- /dev/null +++ b/src/Components/FoodCategory/RestaurantInfo.js @@ -0,0 +1,14 @@ +import React, { Component } from 'react'; +import { Container } from 'react-bootstrap'; + +class RestarauntInfo extends Component { + render() { + return ( + +

Information about restaurants.

+ + ); + } +} + +export default RestarauntInfo; \ No newline at end of file diff --git a/src/Components/FoodNavigation.js b/src/Components/FoodNavigation.js new file mode 100644 index 0000000..e7f4f6b --- /dev/null +++ b/src/Components/FoodNavigation.js @@ -0,0 +1,38 @@ +import React, { Component } from 'react'; +import CategoryCard from './CategoryCard'; +import { Container, CardColumns } from 'react-bootstrap'; + +class FoodNavigation extends Component { + render() { + return ( + + + + + + + + + ); + } +} + +export default FoodNavigation; \ No newline at end of file diff --git a/src/Components/Home.js b/src/Components/Home.js index bb937ca..9980d67 100644 --- a/src/Components/Home.js +++ b/src/Components/Home.js @@ -1,11 +1,48 @@ import React, { Component } from 'react'; +import CategoryCard from './CategoryCard'; +import { Container, CardColumns } from 'react-bootstrap'; class Home extends Component { render() { return ( -
-

I'm a page.

-
+ + + + + + + + + + + + ); } } diff --git a/src/Components/MapComponent.js b/src/Components/MapComponent.js index e0d0200..e1df2f2 100644 --- a/src/Components/MapComponent.js +++ b/src/Components/MapComponent.js @@ -1,10 +1,11 @@ import React, { Component } from 'react'; -import { Map, Marker, Popup, TileLayer } from "react-leaflet"; +import { Map, TileLayer } from "react-leaflet"; +import { Container} from 'react-bootstrap'; class MapComponent extends Component { render() { return ( -
+
-
+ ); } } diff --git a/src/Components/NavBar.js b/src/Components/NavBar.js index efd6e18..7491140 100644 --- a/src/Components/NavBar.js +++ b/src/Components/NavBar.js @@ -1,10 +1,9 @@ import React from 'react'; import { NavLink } from 'react-router-dom'; -import { Navbar, Nav, Form, FormControl, Button, NavDropdown } from 'react-bootstrap'; +import { Navbar, Nav } from 'react-bootstrap'; const NaviBar = () => { return ( - { -