Merge branch 'v2' into feat/editor

Author: Lanttcat

pages/_app.tsx

@@ -155,65 +155,64 @@ function App({ Component, pageProps }) {
           <h1 className="text-4xl font-bold">Creative Commons NFT Playground</h1>
           <div>
             {renderActionButton()}
-            {
-              account && isSupportCurrentNetwork &&
+          </div>
+        </div>
+
+        {
+          sigInLocal && account && isSupportCurrentNetwork &&
+          <div className="absolute top-8 right-8 text-right fixed">
+            <Menu as="div" className="relative inline-block text-left">
               <div>
-                <Menu as="div" className="relative inline-block text-left">
-                  <div>
-                    <Menu.Button
-                      className="inline-flex justify-center w-full px-2 py-2 font-medium text-white bg-black rounded-md bg-opacity-20 hover:bg-opacity-30 focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75">
-                      <ChevronDownIcon
-                        className="w-5 h-5 text-violet-200 hover:text-violet-100"
-                        aria-hidden="true"
-                      />
-                    </Menu.Button>
-                  </div>
-                  <Transition
-                    as={Fragment}
-                    enter="transition ease-out duration-100"
-                    enterFrom="transform opacity-0 scale-95"
-                    enterTo="transform opacity-100 scale-100"
-                    leave="transition ease-in duration-75"
-                    leaveFrom="transform opacity-100 scale-100"
-                    leaveTo="transform opacity-0 scale-95"
-                  >
-                    <Menu.Items
-                      className="absolute right-0 w-56 mt-2 origin-top-right bg-white divide-y divide-gray-100 rounded-md shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none">
-                      <div className="px-1 py-1">
-                        <Menu.Item>
-                          {({ active }) => (
-                            <button
-                              className={`${
-                                active ? "bg-blue-500 text-gray-300" : "text-gray-900"
-                              } group flex rounded-md items-center w-full px-2 py-2 text-sm`}
-                            >
-                              ID: {getBrief(account)}
-                            </button>
-                          )}
-                        </Menu.Item>
-                        <Menu.Item>
-                          {({ active }) => (
-                            <button
-                              onClick={disconnectWallet}
-                              className={`${
-                                active ? "bg-blue-500 text-gray-300" : "text-gray-900"
-                              } group flex rounded-md items-center w-full px-2 py-2 text-sm`}
-                            >
-                              Logout
-                            </button>
-                          )}
-                        </Menu.Item>
-                      </div>
-                    </Menu.Items>
-                  </Transition>
-                </Menu>
+                <Menu.Button
+                  className="inline-flex justify-center w-full px-2 py-2 font-medium text-white bg-black rounded-md bg-opacity-20 hover:bg-opacity-30 focus:outline-none focus-visible:ring-2 focus-visible:ring-white focus-visible:ring-opacity-75">
+                  <ChevronDownIcon
+                    className="w-5 h-5 text-violet-200 hover:text-violet-100"
+                    aria-hidden="true"
+                  />
+                </Menu.Button>
               </div>
-            }
+              <Transition
+                as={Fragment}
+                enter="transition ease-out duration-100"
+                enterFrom="transform opacity-0 scale-95"
+                enterTo="transform opacity-100 scale-100"
+                leave="transition ease-in duration-75"
+                leaveFrom="transform opacity-100 scale-100"
+                leaveTo="transform opacity-0 scale-95"
+              >
+                <Menu.Items
+                  className="absolute right-0 w-56 mt-2 origin-top-right bg-white divide-y divide-gray-100 rounded-md shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none">
+                  <div className="px-1 py-1">
+                    <Menu.Item>
+                      {({ active }) => (
+                        <button
+                          className={`${
+                            active ? "bg-blue-500 text-gray-300" : "text-gray-900"
+                          } group flex rounded-md items-center w-full px-2 py-2 text-sm`}
+                        >
+                          id: {getBrief(account)}
+                        </button>
+                      )}
+                    </Menu.Item>
+
+                    <Menu.Item>
+                      {({ active }) => (
+                        <button
+                          onClick={disconnectWallet}
+                          className={`${
+                            active ? "bg-blue-500 text-gray-300" : "text-gray-900"
+                          } group flex rounded-md items-center w-full px-2 py-2 text-sm`}
+                        >
+                          Logout
+                        </button>
+                      )}
+                    </Menu.Item>
+                  </div>
+                </Menu.Items>
+              </Transition>
+            </Menu>
           </div>
-        </div>
-        <div className="flex justify-around">
-          <Navigation/>
-        </div>
+        }
       </nav>
       <Web3Context.Provider value={web3ContextValue}>
         <Component {...pageProps} />