Add Footer & some messaging

This commit is contained in:
Johannes Zillmann 2017-03-29 08:08:55 +02:00
parent a0c5bb29d6
commit c4c23ac6ee
5 changed files with 44 additions and 3 deletions

View File

@ -4,9 +4,9 @@
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>PDF to Markdown</title> <title>PDF to Markdown</title>
<meta name="description" content="Converts PDF files to Markdown." /> <meta name="description" content="Converts PDF files to Markdown." />
<meta name="keywords" content="PDF, Markdown, converter"> <meta name="keywords" content="PDF, Markdown, converter, online">
</head> </head>
<body> <body>
<div id="main"</div> <div id="main"/>
</body> </body>
</html> </html>

View File

@ -3,6 +3,7 @@ import React from 'react';
import Grid from 'react-bootstrap/lib/Grid' import Grid from 'react-bootstrap/lib/Grid'
import TopBar from './TopBar.jsx'; import TopBar from './TopBar.jsx';
import FooterBar from './FooterBar.jsx'
import { View } from '../models/AppState.jsx'; import { View } from '../models/AppState.jsx';
import PdfUploadView from './PdfUploadView.jsx'; import PdfUploadView from './PdfUploadView.jsx';
import LoadingView from './LoadingView.jsx'; import LoadingView from './LoadingView.jsx';
@ -46,6 +47,7 @@ export default class App extends React.Component {
{ mainView } { mainView }
</div> </div>
</Grid> </Grid>
<FooterBar/>
</div> </div>
); );
} }

View File

@ -0,0 +1,25 @@
import React from 'react';
import Navbar from 'react-bootstrap/lib/Navbar'
export default class TopBar extends React.Component {
render() {
return (
<Navbar>
<Navbar.Header>
<Navbar.Text>
This is a offline tool, your data stays locally and is not send to any server!
</Navbar.Text>
</Navbar.Header>
<Navbar.Collapse>
<Navbar.Text pullRight>
<a href="https://github.com/jzillmann/pdf-to-markdown/issues" target="_blank">Feedback & Bug Reports</a>
</Navbar.Text>
</Navbar.Collapse>
</Navbar>
);
}
}

View File

@ -1,5 +1,7 @@
import React from 'react'; import React from 'react';
import Alert from 'react-bootstrap/lib/Alert'
import Dropzone from 'react-dropzone' import Dropzone from 'react-dropzone'
import FaCloudUpload from 'react-icons/lib/fa/cloud-upload' import FaCloudUpload from 'react-icons/lib/fa/cloud-upload'
@ -38,9 +40,19 @@ export default class PdfUploadView extends React.Component {
<h2>Drop your PDF file here!</h2> <h2>Drop your PDF file here!</h2>
</div> </div>
<h1><FaCloudUpload width={ 100 } height={ 100 } /></h1> <h1><FaCloudUpload width={ 100 } height={ 100 } /></h1>
<br/>
<Alert bsStyle="warning">
<i>This tool converts a PDF file into a Markdown text format! Simply drag & drop your PDF file on the upload area and go from there. Don't expect wonders, there are a lot of variances in generated PDF's from different tools and different ages. Though this tool aims to be general purpose, it has been tested on a certain set of PDF's only.</i>
</Alert>
</Dropzone> </Dropzone>
<br/>
<br/>
<br/>
<br/>
<br/>
<br/>
</div> </div>
); );
} }
} }

View File

@ -39,6 +39,8 @@ export default class TopBar extends React.Component {
<AppLogo bsRole="toggle" /> <AppLogo bsRole="toggle" />
<Dropdown.Menu> <Dropdown.Menu>
<MenuItem divider /> <MenuItem divider />
<MenuItem href="https://github.com/jzillmann/pdf-to-markdown/issues" target="_blank"> Feedback & Bug Reports
</MenuItem>
<MenuItem href="http://github.com/jzillmann/pdf-to-markdown" target="_blank"> Github <MenuItem href="http://github.com/jzillmann/pdf-to-markdown" target="_blank"> Github
</MenuItem> </MenuItem>
<OverlayTrigger <OverlayTrigger