From 2c867e0ae8cac7c6b39709a335607814433ba9be Mon Sep 17 00:00:00 2001
From: Danny Coates <dannycoates@gmail.com>
Date: Fri, 22 Feb 2019 13:31:54 -0800
Subject: [PATCH] fixed modals on other than home page

---
 app/main.css          | 1 +
 app/ui/blank.js       | 2 +-
 app/ui/download.js    | 2 +-
 app/ui/error.js       | 2 +-
 app/ui/home.js        | 2 +-
 app/ui/legal.js       | 2 +-
 app/ui/notFound.js    | 2 +-
 app/ui/unsupported.js | 2 +-
 8 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/app/main.css b/app/main.css
index b18f1d04..bdad0b17 100644
--- a/app/main.css
+++ b/app/main.css
@@ -146,6 +146,7 @@ footer li:hover {
 
 .main {
   display: flex;
+  position: relative;
   max-width: 64rem;
   width: 100%;
   height: 100%;
diff --git a/app/ui/blank.js b/app/ui/blank.js
index 837f8c40..42d8f423 100644
--- a/app/ui/blank.js
+++ b/app/ui/blank.js
@@ -2,7 +2,7 @@ const html = require('choo/html');
 
 module.exports = function() {
   return html`
-    <main class="main relative">
+    <main class="main">
       <section
         class="h-full w-full p-6 z-10 md:flex md:flex-row md:rounded-lg md:shadow-big"
       >
diff --git a/app/ui/download.js b/app/ui/download.js
index ca97addc..ca9f38e8 100644
--- a/app/ui/download.js
+++ b/app/ui/download.js
@@ -153,7 +153,7 @@ module.exports = function(state, emit) {
     content = password(state, emit);
   }
   return html`
-    <main class="main container">
+    <main class="main">
       ${state.modal && modal(state, emit)}
       <section class="relative h-full w-full p-6 md:rounded-lg md:shadow-big">
         ${content}
diff --git a/app/ui/error.js b/app/ui/error.js
index 36f9a7ba..5bc91401 100644
--- a/app/ui/error.js
+++ b/app/ui/error.js
@@ -4,7 +4,7 @@ const modal = require('./modal');
 
 module.exports = function(state, emit) {
   return html`
-    <main class="main container">
+    <main class="main">
       ${state.modal && modal(state, emit)}
       <div
         class="flex flex-col items-center bg-white m-6 px-6 py-8 border border-grey-light md:border-none md:px-12 md:py-16 shadow w-full md:h-full"
diff --git a/app/ui/home.js b/app/ui/home.js
index 1d84a5e0..925df5f9 100644
--- a/app/ui/home.js
+++ b/app/ui/home.js
@@ -27,7 +27,7 @@ module.exports = function(state, emit) {
         );
 
   return html`
-    <main class="main relative">
+    <main class="main">
       ${state.modal && modal(state, emit)}
       <section
         class="h-full w-full p-6 z-10 overflow-hidden md:flex md:flex-row md:rounded-lg md:shadow-big"
diff --git a/app/ui/legal.js b/app/ui/legal.js
index 6756cfc9..f9f1095c 100644
--- a/app/ui/legal.js
+++ b/app/ui/legal.js
@@ -4,7 +4,7 @@ const modal = require('./modal');
 
 module.exports = function(state, emit) {
   return html`
-    <main class="main container">
+    <main class="main">
       ${state.modal && modal(state, emit)}
       <div
         class="flex flex-col items-center bg-white m-6 px-6 py-8 border border-grey-light md:border-none md:px-12 md:py-16 shadow w-full md:h-full"
diff --git a/app/ui/notFound.js b/app/ui/notFound.js
index 7ebbc9ad..fb7e743a 100644
--- a/app/ui/notFound.js
+++ b/app/ui/notFound.js
@@ -4,7 +4,7 @@ const modal = require('./modal');
 
 module.exports = function(state, emit) {
   return html`
-    <main class="main container">
+    <main class="main">
       ${state.modal && modal(state, emit)}
       <div
         class="flex flex-col items-center bg-white m-6 px-6 py-8 border border-grey-light md:border-none md:px-12 md:py-16 shadow w-full"
diff --git a/app/ui/unsupported.js b/app/ui/unsupported.js
index c7bc889e..f0ede3aa 100644
--- a/app/ui/unsupported.js
+++ b/app/ui/unsupported.js
@@ -24,7 +24,7 @@ module.exports = function(state, emit) {
   }
 
   return html`
-    <main class="main container">
+    <main class="main">
       ${state.modal && modal(state, emit)}
       <div
         class="flex flex-col items-center justify-center text-center bg-white m-6 px-6 py-8 border border-grey-light md:border-none md:px-12 md:py-16 shadow w-full md:h-full"