From 380e5362c20085fcbee7df58e3ba2e8ff8939278 Mon Sep 17 00:00:00 2001
From: Ken Erwin <ken@devopslibrary.com>
Date: Tue, 14 Dec 2021 21:58:13 -0500
Subject: [PATCH] made edit tiles dark too

---
 frontend/chart/values/prod.yaml |   2 +-
 frontend/components/Header.tsx  | 101 ++++++++++++++++----------------
 frontend/pages/edit/index.tsx   |   2 +-
 3 files changed, 51 insertions(+), 54 deletions(-)

diff --git a/frontend/chart/values/prod.yaml b/frontend/chart/values/prod.yaml
index 827fa6d..6509b64 100644
--- a/frontend/chart/values/prod.yaml
+++ b/frontend/chart/values/prod.yaml
@@ -1,4 +1,4 @@
-IMAGE: 389059433654.dkr.ecr.us-east-1.amazonaws.com/frontend:1.1.0
+IMAGE: 389059433654.dkr.ecr.us-east-1.amazonaws.com/frontend:1.1.21
 API_ENDPOINT: https://api.pixelmap.io
 DOMAINS:
   - "pixelmap.io"
diff --git a/frontend/components/Header.tsx b/frontend/components/Header.tsx
index 5fc52b4..df27ea5 100644
--- a/frontend/components/Header.tsx
+++ b/frontend/components/Header.tsx
@@ -1,18 +1,18 @@
-import Image from 'next/image'
-import Link from 'next/link'
+import Image from "next/image";
+import Link from "next/link";
 
 import { useWeb3React } from "@web3-react/core";
 import useEagerConnect from "../hooks/useEagerConnect";
 
-import Account from './Account';
-import SearchBar from './SearchBar';
-import logo from '../public/assets/images/logo.png';
+import Account from "./Account";
+import SearchBar from "./SearchBar";
+import logo from "../public/assets/images/logo.png";
 
 const navigation = [
-  { name: 'Wrapper', link: '/wrap' },
-  { name: 'Discord', href: 'https://discord.gg/pixelmap', target: "_blank" },
-  { name: 'About', link: '/about' },
-]
+  { name: "Wrapper", link: "/wrap" },
+  { name: "Discord", href: "https://discord.gg/pixelmap", target: "_blank" },
+  { name: "About", link: "/about" },
+];
 
 export default function Header() {
   const { account, library } = useWeb3React();
@@ -23,56 +23,55 @@ export default function Header() {
 
   return (
     <header className="relative">
-      <nav className="relative border-b-4 md:border-none border-black" aria-label="Global">
+      <nav
+        className="relative border-b-4 md:border-none border-black"
+        aria-label="Global"
+      >
         <div className="flex items-center justify-between px-3 md:px-6 py-2 md:py-3">
           <div className="flex items-center flex-1">
             <div className="flex items-center justify-between w-full md:w-auto">
               <Link href="/">
                 <a className="w-8 h-8 md:h-10 md:w-10">
                   <span className="sr-only">PixelMap</span>
-                  <Image
-                    className="w-full h-auto"
-                    src={logo}
-                    alt="PixelMap"
-                  />
+                  <Image className="w-full h-auto" src={logo} alt="PixelMap" />
                 </a>
               </Link>
             </div>
-            
+
             <div className="hidden md:flex md:mx-8 md:items-center md:flex-grow">
               <div className="flex space-x-6 items-center">
-              <SearchBar />
+                <SearchBar />
 
-              {navigation.map((item) => {
-                if( item.link ) {
-                  return (
-                    <Link key={item.name} href={item.link}>
+                {navigation.map((item) => {
+                  if (item.link) {
+                    return (
+                      <Link key={item.name} href={item.link}>
+                        <a className="inline-flex items-center px-4 py-1 border border-white shadow-sm text-sm font-semibold rounded-full text-white bg-blur hover:opacity-80 transition duration-150">
+                          {item.name}
+                        </a>
+                      </Link>
+                    );
+                  } else {
+                    return (
                       <a
+                        key={item.name}
+                        href={item.href}
                         className="inline-flex items-center px-4 py-1 border border-white shadow-sm text-sm font-semibold rounded-full text-white bg-blur hover:opacity-80 transition duration-150"
+                        target={item.target}
                       >
                         {item.name}
                       </a>
-                    </Link>
-                  )
-                } else {
-                  return (
-                    <a
-                      key={item.name}
-                      href={item.href}
-                      className="inline-flex items-center px-4 py-1 border border-white shadow-sm text-sm font-semibold rounded-full text-white bg-blur hover:opacity-80 transition duration-150"
-                      target={item.target}
-                    >
-                      {item.name}
-                    </a>
-                  )}
-              })}
+                    );
+                  }
+                })}
               </div>
-              { account &&
+              {account && (
                 <Link href="/edit">
-                  <a className="ml-auto text-sm font-bold text-white hover:text-white transition duration-150">Edit tiles</a>
+                  <a className="px-6 py-1.5 rounded-full bg-gray-900 bg-opacity-70 border ml-auto text-sm font-bold text-white hover:text-white transition duration-150">
+                    Edit tiles
+                  </a>
                 </Link>
-              }
-
+              )}
             </div>
           </div>
           <div className="flex items-center">
@@ -84,16 +83,14 @@ export default function Header() {
           {/* <SearchBar /> */}
 
           {navigation.map((item) => {
-            if( item.link ) {
+            if (item.link) {
               return (
                 <Link key={item.name} href={item.link}>
-                  <a
-                    className="text-sm font-semibold text-gray-300 hover:text-white transition duration-150"
-                  >
+                  <a className="text-sm font-semibold text-gray-300 hover:text-white transition duration-150">
                     {item.name}
                   </a>
                 </Link>
-              )
+              );
             } else {
               return (
                 <a
@@ -104,19 +101,19 @@ export default function Header() {
                 >
                   {item.name}
                 </a>
-              )}
+              );
+            }
           })}
 
-          { account &&
+          {account && (
             <Link href="/edit">
-              <a className="self-end ml-auto text-sm font-semibold text-gray-300 hover:text-white transition duration-150">Edit tiles</a>
+              <a className="self-end ml-auto text-sm font-semibold text-gray-300 hover:text-white transition duration-150">
+                Edit tiles
+              </a>
             </Link>
-          }
-
+          )}
         </div>
-
       </nav>
-      
     </header>
-  )
+  );
 }
diff --git a/frontend/pages/edit/index.tsx b/frontend/pages/edit/index.tsx
index 0b40705..8b89c7a 100644
--- a/frontend/pages/edit/index.tsx
+++ b/frontend/pages/edit/index.tsx
@@ -118,7 +118,7 @@ function Edit() {
       </Head>
       <Layout>
         <main className="w-full max-w-2xl mx-auto mt-12 sm:mt-24 min-h-80 px-3">
-          <h1 className="text-3xl font-bold mb-4 text-white">
+          <h1 className="text-3xl font-bold mb-4 text-white ">
             Edit your tiles
           </h1>
           <div className="">