styled SubmitButton and making it disappear when invalid

2 files changed, 13 insertions, 3 deletions

diff --git a/src/components/Display/Display.scss b/src/components/Display/Display.scss
index 8be6c4e..214cb18 100644
--- a/src/components/Display/Display.scss
+++ b/src/components/Display/Display.scss
@@ -58,10 +58,18 @@
 }
 
 .SummaryDisplay {
+  position: relative;
   width: 30%;
   padding: 0.5rem 2rem;
 }
 
+.SummaryDisplay .SubmitButton {
+  position: absolute;
+  bottom: 1rem;
+  right: 1rem;
+  padding: 0.3rem;
+}
+
 .SummaryDisplay h1 {
   font-size: 3rem;
   margin: 0.5rem -1.5rem;
diff --git a/src/components/Display/SummaryDisplay.tsx b/src/components/Display/SummaryDisplay.tsx
index 5d1589e..37ba077 100644
--- a/src/components/Display/SummaryDisplay.tsx
+++ b/src/components/Display/SummaryDisplay.tsx
@@ -92,9 +92,11 @@ const SummaryDisplay: React.FC<props> = (props) => {
         </tbody>
       </table>
 
-      <button onClick={() => props.setShowSubmitMenu(true)}>
-        Submit
-      </button>
+      {props.items.length > 0 &&
+        <button className={"SubmitButton"} onClick={() => props.setShowSubmitMenu(true)}>
+          Submit (experimental)
+        </button>
+      }
     </div>
   );
 }