From 6ca73a89b79b23007956703b4468dca69ca21f88 Mon Sep 17 00:00:00 2001
From: Matthew Stratford <hi@mstratford.net>
Date: Sat, 19 Sep 2020 17:46:55 +0100
Subject: [PATCH] Pretties, move the close to top.

---
 src/showplanner/PISModal.tsx | 16 ++++++++++++----
 1 file changed, 12 insertions(+), 4 deletions(-)

diff --git a/src/showplanner/PISModal.tsx b/src/showplanner/PISModal.tsx
index e93fe28..3207e4e 100644
--- a/src/showplanner/PISModal.tsx
+++ b/src/showplanner/PISModal.tsx
@@ -2,13 +2,15 @@ import React, { useEffect, useState } from "react";
 import Modal from "react-modal";
 import { getLatestNewsItem, NewsEntry } from "../api";
 import { Button } from "reactstrap";
+import { FaTimes } from "react-icons/fa";
 
 function DevWarning() {
   if (process.env.REACT_APP_PRODUCTION === "true") {
     return null;
   }
   return (
-    <div style={{ color: "white", backgroundColor: "#960000" }}>
+    <>
+    <div className="p-2 btn-warning">
       <h1>Development Version</h1>
       <strong>You are using a development version of WebStudio.</strong> This
       version is NOT tested and may have severe bugs and performance problems.
@@ -23,6 +25,8 @@ function DevWarning() {
       </a>
       .
     </div>
+    <hr />
+    </>
   );
 }
 
@@ -58,6 +62,12 @@ export function PisModal({
 
   return (
     <Modal isOpen={isOpen} onRequestClose={close}>
+      <div className="text-right">
+        <Button onClick={close} color="primary">
+          Close <FaTimes />
+        </Button>
+      </div>
+      <hr className="m-1" />
       <DevWarning />
       <h1>Presenter News</h1>
       {(news === "loading" || news === "not_loaded") && (
@@ -75,9 +85,7 @@ export function PisModal({
           </em>
         </div>
       )}
-      <Button onClick={close} color="primary">
-        Close
-      </Button>
+
     </Modal>
   );
 }