fix ui

assets/src/App.js

@@ -1,7 +1,6 @@
 import React, { Component } from 'react';
 import { BrowserRouter, Route, Switch } from 'react-router-dom';
 
-import 'bootstrap/dist/css/bootstrap.css';
 import './paste/Framework.css';
 
 import Paste from './paste/Paste';
@@ -21,7 +20,7 @@ class App extends Component {
   }
 
 componentDidMount() {
-  req('/app-info').get()
+  req('https://paste.dn42.us/app-info').get()
   .then((response) => {
     if (response.ok) return response.text().catch(()=>"");
     else return "Unknown API"; })

assets/src/paste/Framework.css

@@ -1,9 +1,9 @@
-body,html {color: #c8c8c8; background-color: #272b30; }
+body,html {color: #c8c8c8 !important; background-color: #272b30 !important; }
 header + section  { padding-top: 52px; padding-bottom: 2.1em }
 footer { background-color: #3e444c; position:fixed; bottom:0; width: 100%; height: 2em; border-top: 1px solid #bbb; padding: 4px }
 footer span.left { float: left; }
 footer span.right { float: right; }
-
+pre {background-color: #c8c8c8; color: black}
 .breadcrumb label { color: black; }
 
 .sidebar .list-group {

assets/src/paste/Paste.js

@@ -1,5 +1,5 @@
 import React, { Component } from "react";
-import { Form, Button, Alert } from "react-bootstrap";
+import { Form, Button, Alert } from "bootstrap-4-react";
 
 import "./paste.css";
 
@@ -185,7 +185,7 @@ class Paste extends Component {
     this.setState(function(state, props) {
       return {entropy: state.entropy + s.length};
     } );
-    Math.seedrandom(s, {entropy: true});
+    seedrandom(s, {entropy: true});
   };
 
   onChange(event) {
@@ -319,24 +319,21 @@ function PasteCreate({error, onSubmit, onChange, syntax, syntaxItems, expire, ex
           </Alert> : ""}
 
         <Form name='paste' onSubmit={onSubmit}>
-          <div className="form form-inline">
-            <ol className='breadcrumb'>
-              <li>
-                <label>Syntax</label>
-                <select className='form-control input-sm' name="syntax" onChange={onChange} value={syntax}>
-                  {syntaxItems.map((o) => <option key={o[0]} value={o[0]}>{o[1]}</option>)}
-                </select>
-              </li>
-              <li>
-                <label>Expires</label>
-                <select className='form-control input-sm' name="expire" onChange={onChange} value={expire}>
-                  {expireItems.map((o) => <option key={o[0]} value={o[0]}>{o[1]}</option>)}
-                </select>
-              </li>
-              <li>
-                <label><input type='checkbox' name="burn" onChange={onChange} value={burn}/> Burn on Read</label>
-              </li>
-            </ol>
+          <div className="form-inline">
+            <label className="my-1 mr-2" for="syntax">Syntax</label>
+            <select className='custom-select my-1 mr-sm-2' id="syntax" name="syntax" onChange={onChange} value={syntax}>
+              {syntaxItems.map((o) => <option key={o[0]} value={o[0]}>{o[1]}</option>)}
+            </select>
+
+            <label className="my-1 mr-2" for="expire">Expires</label>
+            <select className='custom-select my-1 mr-sm-2' id="expire" name="expire" onChange={onChange} value={expire}>
+              {expireItems.map((o) => <option key={o[0]} value={o[0]}>{o[1]}</option>)}
+            </select>
+
+            <div className="custom-control custom-checkbox my-1 mr-sm-2">
+              <input className="custom-control-input" type='checkbox' id="burn-on-read" name="burn" onChange={onChange} value={burn}/>
+              <label className="custom-control-label" for="burn-on-read">Burn on Read</label>
+            </div>
           </div>
 
           <textarea required className='form-control' rows='20' name="plain" onChange={onChange} value={plain}></textarea>
@@ -346,7 +343,6 @@ function PasteCreate({error, onSubmit, onChange, syntax, syntaxItems, expire, ex
         </Form>
 
         <p>Create pastes from the command line! <a href='./paste.sh' download>paste.sh</a></p>
-
         <pre>{`$ echo /etc/passwd | ./paste.sh
 
 env options:
@@ -366,11 +362,11 @@ function PasteView({hash, decryptKey, expires, gzip, cipher, plain, syntax, onNe
       <section className="container">
       <div className="input-group">
         <span className="input-group-btn">
-          <a className="btn btn-default" type="button" onClick={onNew}>New</a>
+          <button className="btn btn-default" type="button" onClick={onNew}>New</button>
         </span>
         <input type='text' readOnly className='form-control' value={`${window.location.origin}/paste/#/${hash}!${decryptKey}`} onClick={(e) => e.target.select()}/>
         <span className="input-group-btn">
-          <a className="btn btn-default" type="button" onClick={onCopy}>Copy</a>
+          <button className="btn btn-default" type="button" onClick={onCopy}>Copy</button>
         </span>
       </div>