Header RWD fix + links (#38)

--------- Co-authored-by: Pablo Alayeto <[email protected]>
BuidlGuidl · Aug 16, 2024 · 2571027 · 2571027
1 parent 74d3c59
commit 2571027
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 12 deletions.
diff --git a/packages/nextjs/components/Footer.tsx b/packages/nextjs/components/Footer.tsx
@@ -45,7 +45,12 @@ export const Footer = () => {
         <ul className="menu menu-horizontal w-full">
           <div className="flex justify-center items-center gap-2 text-sm w-full">
             <div className="text-center">
-              <a href="https://github.com/scaffold-eth/se-2" target="_blank" rel="noreferrer" className="link">
+              <a
+                href="https://github.com/BuidlGuidl/extensions-hackathon"
+                target="_blank"
+                rel="noreferrer"
+                className="link"
+              >
                 Fork me
               </a>
             </div>
@@ -66,7 +71,7 @@ export const Footer = () => {
             </div>
             <span>·</span>
             <div className="text-center">
-              <a href="https://t.me/joinchat/KByvmRe5wkR-8F_zz6AjpA" target="_blank" rel="noreferrer" className="link">
+              <a href="https://t.me/+jgKFHjb9B_cyNmMx" target="_blank" rel="noreferrer" className="link">
                 Support
               </a>
             </div>

diff --git a/packages/nextjs/components/Header.tsx b/packages/nextjs/components/Header.tsx
@@ -22,8 +22,7 @@ export const menuLinks: HeaderMenuLink[] = [
   },
   {
     label: "Join Telegram",
-    // TODO: Real TG link
-    href: "https://t.me/ToDo",
+    href: "https://t.me/+jgKFHjb9B_cyNmMx",
     icon: <ChatBubbleLeftEllipsisIcon className="h-4 w-4" />,
   },
 ];
@@ -79,12 +78,12 @@ export const Header = () => {
   );
 
   return (
-    <div className="sticky lg:static top-0 navbar bg-base-100 min-h-0 flex-shrink-0 justify-between z-20 sm:px-6 py-6">
+    <div className="sticky md:static top-0 navbar bg-base-100 min-h-0 flex-shrink-0 justify-between z-20 px-6 py-6">
       <div className="navbar-start w-auto lg:w-1/2">
-        <div className="lg:hidden dropdown" ref={burgerMenuRef}>
+        <div className="md:hidden dropdown" ref={burgerMenuRef}>
           <label
             tabIndex={0}
-            className={`ml-1 btn btn-ghost ${isDrawerOpen ? "hover:bg-secondary" : "hover:bg-transparent"}`}
+            className={`p-0 mr-2 btn btn-ghost ${isDrawerOpen ? "hover:bg-secondary" : "hover:bg-transparent"}`}
             onClick={() => {
               setIsDrawerOpen(prevIsOpenState => !prevIsOpenState);
             }}
@@ -103,15 +102,21 @@ export const Header = () => {
             </ul>
           )}
         </div>
-        <Link href="/" passHref className="hidden lg:flex items-center gap-2 ml-4 mr-6 shrink-0">
+        <Link
+          href="/"
+          passHref
+          className="max-w-[160px] lg:max-w-none lg:flex items-center gap-2 ml-1 lg:ml-4 mr-2 lg:mr-6 shrink-0"
+        >
           <Image alt="SE2 logo" className="cursor-pointer" width={205} height={54} src="/logo.svg" />
         </Link>
       </div>
-      <div className="navbar-end flex-grow mr-4">
-        <ul className="hidden lg:flex lg:flex-nowrap px-1 gap-2 pr-4">
+      <div className="navbar-end flex-grow items-center justify-end">
+        <ul className="hidden md:flex md:flex-nowrap items-center gap-2 mr-2">
           <HeaderMenuLinks />
         </ul>
-        <RainbowKitCustomConnectButton />
+        <div className="flex-shrink-0">
+          <RainbowKitCustomConnectButton />
+        </div>
       </div>
     </div>
   );

diff --git a/...ages/nextjs/components/scaffold-eth/RainbowKitCustomConnectButton/AddressInfoDropdown.tsx b/...ages/nextjs/components/scaffold-eth/RainbowKitCustomConnectButton/AddressInfoDropdown.tsx
@@ -59,7 +59,7 @@ export const AddressInfoDropdown = ({
           </span>
           <ChevronDownIcon className="h-6 w-4 ml-2 sm:ml-0" />
         </summary>
-        <ul tabIndex={0} className="dropdown-content menu z-[2] p-2 mt-2 shadow-center shadow-accent gap-1">
+        <ul tabIndex={0} className="dropdown-content bg-base-100 menu z-[2] p-2 mt-2 shadow-center shadow-accent gap-1">
           <NetworkOptions hidden={!selectingNetwork} />
           <li className={selectingNetwork ? "hidden" : ""}>
             {addressCopied ? (