From d1e6f37bdaec80a34d23816595cd6183dbd78c4a Mon Sep 17 00:00:00 2001
From: Jon Maxwell Diebold <max.diebold@erg.com>
Date: Tue, 2 Jan 2024 15:17:53 -0500
Subject: [PATCH] feat(HMW-137): fixed more broken styles

---
 app/client/public/index.html       |  33 ++++-----
 app/client/public/site.webmanifest |   4 +-
 app/server/app/public/400.html     | 113 +----------------------------
 app/server/app/public/500.html     | 113 +----------------------------
 4 files changed, 20 insertions(+), 243 deletions(-)

diff --git a/app/client/public/index.html b/app/client/public/index.html
index a6189618f..23713d4ef 100644
--- a/app/client/public/index.html
+++ b/app/client/public/index.html
@@ -178,12 +178,7 @@
 
     <!-- Style overrides for the EPA template -->
     <style>
-      /* bootstrap style overrides */
-      .epa-search .form-text {
-        display: inline-block;
-        margin-top: 0;
-      }
-
+      /* bootstrap overrides */
       a {
         color: #0071bc;
       }
@@ -205,8 +200,20 @@
         white-space: normal;
       }
 
+      li {
+        margin-bottom: unset;
+      }
+
       ul {
-        margin: 0;
+        margin: unset;
+      }
+
+      ul:last-child {
+        margin-bottom: unset;
+      }
+
+      table {
+        font-size: inherit;
       }
 
       table td,
@@ -232,18 +239,6 @@
         text-transform: uppercase;
       }
 
-      .main-footer .region-footer .row {
-        margin: 0;
-      }
-
-      .main-footer .region-footer .col:first-of-type {
-        padding-left: 0;
-      }
-
-      .main-footer .region-footer .col:last-of-type {
-        padding-right: 0;
-      }
-
       .unsupportedMessageContainer {
         position: -webkit-sticky; /* Safari */
         position: sticky;
diff --git a/app/client/public/site.webmanifest b/app/client/public/site.webmanifest
index 47d254925..5603acc97 100644
--- a/app/client/public/site.webmanifest
+++ b/app/client/public/site.webmanifest
@@ -3,12 +3,12 @@
   "name": "How’s My Waterway?",
   "icons": [
     {
-      "src": "/images/android-chrome-192x192.png",
+      "src": "/epa-template-files/images/android-chrome-192x192.png",
       "sizes": "192x192",
       "type": "image/png"
     },
     {
-      "src": "/images/android-chrome-384x384.png",
+      "src": "/epa-template-files/images/android-chrome-384x384.png",
       "sizes": "384x384",
       "type": "image/png"
     }
diff --git a/app/server/app/public/400.html b/app/server/app/public/400.html
index eeb1b6681..9335eac57 100644
--- a/app/server/app/public/400.html
+++ b/app/server/app/public/400.html
@@ -165,119 +165,10 @@
       media="all"
       href="./epa-template-files/css/epa.css"
     />
-
     <!-- Style overrides for the EPA template -->
     <style>
-      /* bootstrap style overrides */
-      .epa-search .form-text {
-        display: inline-block;
-        margin-top: 0;
-      }
-
-      a {
-        color: #0071bc;
-      }
-
-      /* epa template overrides */
-      button {
-        background-color: #0071bc;
-        border: 0;
-        border-radius: 3px;
-        color: #fff;
-        display: inline-block;
-        font-weight: bold;
-        line-height: 1;
-        margin: 0 0 1.5em;
-        padding: 0.5882em 1.1765em;
-        text-align: center;
-        text-decoration: none;
-        vertical-align: baseline;
-        white-space: normal;
-      }
-
-      ul {
-        margin: 0;
-      }
-
-      table td,
-      table th {
-        background-color: inherit;
-        border: 0;
-        border-top: 1px solid #dee2e6;
-      }
-
-      table thead th {
-        background-color: inherit;
-      }
-
-      .exit-disclaimer {
-        background-color: #aeb0b5;
-        border-radius: 3px;
-        color: #323a45 !important;
-        display: inline-block;
-        font-size: 88.2352941176%;
-        margin: 0 0.3333333333em;
-        padding: 0.0666666667em 0.4666666667em;
-        text-decoration: none;
-        text-transform: uppercase;
-      }
-
-      .main-footer .region-footer .row {
-        margin: 0;
-      }
-
-      .main-footer .region-footer .col:first-of-type {
-        padding-left: 0;
-      }
-
-      .main-footer .region-footer .col:last-of-type {
-        padding-right: 0;
-      }
-
-      .unsupportedMessageContainer {
-        position: -webkit-sticky; /* Safari */
-        position: sticky;
-        top: 0;
-        z-index: 900;
-      }
-
-      .unsupportedErrorBox {
-        padding: 1rem;
-        text-align: center;
-        border-color: #f5c6cb;
-        color: #721c24;
-        background-color: #f8d7da;
-      }
-
-      .unsupportedMessage {
-        margin-right: 1rem;
-      }
-
-      .unsupportedCloseButton {
-        position: absolute;
-        top: 0;
-        right: 0;
-        padding: 0;
-        border: none;
-        border-radius: 0;
-        width: 1.5rem;
-        height: 1.5rem;
-        color: white;
-        background-color: rgba(0, 0, 0, 0.5);
-      }
-
-      @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
-        /* IE10 and IE11 styles */
-        .unsupportedMessageContainer {
-          display: block;
-        }
-      }
-
-      @media screen {
-        main p {
-          margin-bottom: 0;
-          padding-bottom: 1.5em;
-        }
+      [tabindex='-1']:focus {
+        outline: none !important;
       }
     </style>
 
diff --git a/app/server/app/public/500.html b/app/server/app/public/500.html
index 07914bde8..79d4d9d80 100644
--- a/app/server/app/public/500.html
+++ b/app/server/app/public/500.html
@@ -165,119 +165,10 @@
       media="all"
       href="./epa-template-files/css/epa.css"
     />
-
     <!-- Style overrides for the EPA template -->
     <style>
-      /* bootstrap style overrides */
-      .epa-search .form-text {
-        display: inline-block;
-        margin-top: 0;
-      }
-
-      a {
-        color: #0071bc;
-      }
-
-      /* epa template overrides */
-      button {
-        background-color: #0071bc;
-        border: 0;
-        border-radius: 3px;
-        color: #fff;
-        display: inline-block;
-        font-weight: bold;
-        line-height: 1;
-        margin: 0 0 1.5em;
-        padding: 0.5882em 1.1765em;
-        text-align: center;
-        text-decoration: none;
-        vertical-align: baseline;
-        white-space: normal;
-      }
-
-      ul {
-        margin: 0;
-      }
-
-      table td,
-      table th {
-        background-color: inherit;
-        border: 0;
-        border-top: 1px solid #dee2e6;
-      }
-
-      table thead th {
-        background-color: inherit;
-      }
-
-      .exit-disclaimer {
-        background-color: #aeb0b5;
-        border-radius: 3px;
-        color: #323a45 !important;
-        display: inline-block;
-        font-size: 88.2352941176%;
-        margin: 0 0.3333333333em;
-        padding: 0.0666666667em 0.4666666667em;
-        text-decoration: none;
-        text-transform: uppercase;
-      }
-
-      .main-footer .region-footer .row {
-        margin: 0;
-      }
-
-      .main-footer .region-footer .col:first-of-type {
-        padding-left: 0;
-      }
-
-      .main-footer .region-footer .col:last-of-type {
-        padding-right: 0;
-      }
-
-      .unsupportedMessageContainer {
-        position: -webkit-sticky; /* Safari */
-        position: sticky;
-        top: 0;
-        z-index: 900;
-      }
-
-      .unsupportedErrorBox {
-        padding: 1rem;
-        text-align: center;
-        border-color: #f5c6cb;
-        color: #721c24;
-        background-color: #f8d7da;
-      }
-
-      .unsupportedMessage {
-        margin-right: 1rem;
-      }
-
-      .unsupportedCloseButton {
-        position: absolute;
-        top: 0;
-        right: 0;
-        padding: 0;
-        border: none;
-        border-radius: 0;
-        width: 1.5rem;
-        height: 1.5rem;
-        color: white;
-        background-color: rgba(0, 0, 0, 0.5);
-      }
-
-      @media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
-        /* IE10 and IE11 styles */
-        .unsupportedMessageContainer {
-          display: block;
-        }
-      }
-
-      @media screen {
-        main p {
-          margin-bottom: 0;
-          padding-bottom: 1.5em;
-        }
+      [tabindex='-1']:focus {
+        outline: none !important;
       }
     </style>