Skip to content

Commit

Permalink
deployable version
Browse files Browse the repository at this point in the history
  • Loading branch information
dasunx committed Mar 21, 2020
1 parent 51eb09f commit 331a91b
Show file tree
Hide file tree
Showing 25 changed files with 15,463 additions and 52 deletions.
14,360 changes: 14,360 additions & 0 deletions package-lock.json

Large diffs are not rendered by default.

7 changes: 6 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,14 +1,19 @@
{
"name": "covid",
"homepage": "http://dasunx.com",
"version": "0.1.0",
"private": true,
"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
"html-to-image": "^0.1.1",
"node-sass": "^4.13.1",
"react": "^16.13.0",
"react-dom": "^16.13.0",
"react-scripts": "3.4.0"
"react-scripts": "3.4.0",
"react-share": "^4.1.0",
"react-switch-lang": "^1.0.2"
},
"scripts": {
"start": "react-scripts start",
Expand Down
58 changes: 33 additions & 25 deletions public/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,42 +2,50 @@
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
<link rel="icon" href="%PUBLIC_URL%/logo192.png" />
<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"
content="Covid-19 analytics"
/>
<meta property="og:url" content="http://www.dasunx.com" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Covid-19" />
<meta property="og:description" content="Present status and analytics of Covid-19 outbreak in sri lanka" />
<meta property="og:image" content="%PUBLIC_URL%/thumb.jpg" />
<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>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<link href="https://fonts.googleapis.com/css?family=Muli&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Abhaya+Libre&display=swap" rel="stylesheet">
<script>
window.fbAsyncInit = function() {
FB.init({
appId : '338033986838626',
autoLogAppEvents : true,
xfbml : true,
version : 'v6.0'
});
};
</script>
<script async defer src="https://connect.facebook.net/en_US/sdk.js"></script>


<title>Covid-19 Current status of Sri Lanka
</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.


</body>
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>


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>
Binary file modified public/logo192.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added public/thumb.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
154 changes: 154 additions & 0 deletions src/App.css
Original file line number Diff line number Diff line change
@@ -1,3 +1,8 @@
body{
font-family: 'Muli', sans-serif;
background-color: whitesmoke;
}

.App {
text-align: center;
}
Expand Down Expand Up @@ -36,3 +41,152 @@
transform: rotate(360deg);
}
}

.title{
font-size: 3.5vh;
}

.title-max{
font-size: 4vh;
color: white;
font-weight: 500;
background-color: rgb(0, 0, 0);
}

.x-bd{
border-top: 0 !important;
}

#error{
display: none;
}



.ball {
width: 10px;
height: 10px;
margin: 10px auto;
border-radius: 50px;
}

.ball:nth-child(1) {
background: #000000;
-webkit-animation: right 1s infinite ease-in-out;
-moz-animation: right 1s infinite ease-in-out;
animation: right 1s infinite ease-in-out;
}

.ball:nth-child(2) {
background: #000000;
-webkit-animation: left 1.1s infinite ease-in-out;
-moz-animation: left 1.1s infinite ease-in-out;
animation: left 1.1s infinite ease-in-out;
}

.ball:nth-child(3) {
background: #000000;
-webkit-animation: right 1.05s infinite ease-in-out;
-moz-animation: right 1.05s infinite ease-in-out;
animation: right 1.05s infinite ease-in-out;
}

.ball:nth-child(4) {
background: #000000;
-webkit-animation: left 1.15s infinite ease-in-out;
-moz-animation: left 1.15s infinite ease-in-out;
animation: left 1.15s infinite ease-in-out;
}

.ball:nth-child(5) {
background: #000000;
-webkit-animation: right 1.1s infinite ease-in-out;
-moz-animation: right 1.1s infinite ease-in-out;
animation: right 1.1s infinite ease-in-out;
}

.ball:nth-child(6) {
background: #000000;
-webkit-animation: left 1.05s infinite ease-in-out;
-moz-animation: left 1.05s infinite ease-in-out;
animation: left 1.05s infinite ease-in-out;
}

.ball:nth-child(7) {
background: #000000;
-webkit-animation: right 1s infinite ease-in-out;
-moz-animation: right 1s infinite ease-in-out;
animation: right 1s infinite ease-in-out;
}

@-webkit-keyframes right {
0% {
-webkit-transform: translate(-15px);
}
50% {
-webkit-transform: translate(15px);
}
100% {
-webkit-transform: translate(-15px);
}
}

@-webkit-keyframes left {
0% {
-webkit-transform: translate(15px);
}
50% {
-webkit-transform: translate(-15px);
}
100% {
-webkit-transform: translate(15px);
}
}

@-moz-keyframes right {
0% {
-moz-transform: translate(-15px);
}
50% {
-moz-transform: translate(15px);
}
100% {
-moz-transform: translate(-15px);
}
}

@-moz-keyframes left {
0% {
-moz-transform: translate(15px);
}
50% {
-moz-transform: translate(-15px);
}
100% {
-moz-transform: translate(15px);
}
}

@keyframes right {
0% {
transform: translate(-15px);
}
50% {
transform: translate(15px);
}
100% {
transform: translate(-15px);
}
}

@keyframes left {
0% {
transform: translate(15px);
}
50% {
transform: translate(-15px);
}
100% {
transform: translate(15px);
}
}
83 changes: 63 additions & 20 deletions src/App.js
Original file line number Diff line number Diff line change
@@ -1,26 +1,69 @@
import React from 'react';
import logo from './logo.svg';
import NotFound from './components/notfound/notfound.component';
import Main from './components/main/main.component';
import Loader from './components/loader/loader.component';
import './App.css';

function App() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
</div>
);
class App extends React.Component {
constructor() {
super();

this.state = {
error: null,
datas: [],
language: 'en',
isLoaded: false
}
}
componentDidMount() {
fetch("http://hpb.health.gov.lk/api/get-current-statistical")
.then(res => res.json())
.then(
(result) => {
this.setState({
isLoaded: true,

datas: result.data
});
},
// Note: it's important to handle errors here
// instead of a catch() block so that we don't swallow
// exceptions from actual bugs in components.
(error) => {
this.setState({
isLoaded: true,
error
});
}
)
}

render() {
const { error, datas, language, isLoaded } = this.state;
if (error) {
return <NotFound error={error}></NotFound>;
} else if (!isLoaded) {
return <div className="container mt-5">
<div className="ball"></div>
<div className="ball"></div>
<div className="ball"></div>
<div className="ball"></div>
<div className="ball"></div>
<div className="ball"></div>
<div className="ball"></div>
</div>;
} else {
return (
<Main datas={datas} lang={language} key={"main"}>

</Main>


);
}
}
}



export default App;
Loading

0 comments on commit 331a91b

Please sign in to comment.