From d565ad730b1ddf9d93a4c8c6bc7c1174537ce274 Mon Sep 17 00:00:00 2001
From: James Ritchie <james@jamesritchie.co.uk>
Date: Fri, 15 Apr 2022 18:38:59 +0100
Subject: [PATCH] Fixed mobile homepage header

---
 app/components/Home/HomeHeader.tsx | 4 ++--
 app/components/Icons/Logo.tsx      | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/components/Home/HomeHeader.tsx b/app/components/Home/HomeHeader.tsx
index 3d870bb..41b589b 100644
--- a/app/components/Home/HomeHeader.tsx
+++ b/app/components/Home/HomeHeader.tsx
@@ -12,13 +12,13 @@ import {
 export function HomeHeader() {
   return (
     <header className="fixed z-20 flex items-center justify-between w-screen h-[82px] px-4 bg-indigo-700">
-      <div className="flex flex-grow items-start ">
+      <div className="flex w-44 mr-3">
         <Logo />
       </div>
       <ol className="flex items-center gap-2">
         <Popover>
           <PopoverTrigger>
-            <button className="bg-lime-500 text-slate-900 text-lg font-bold px-2 py-0.5 rounded-sm uppercase cursor-pointer opacity-90 hover:opacity-100 transition">
+            <button className="bg-lime-500 text-slate-900 text-lg font-bold px-2 py-0.5 rounded-sm uppercase whitespace-nowrap cursor-pointer opacity-90 hover:opacity-100 transition">
               Try now
             </button>
           </PopoverTrigger>
diff --git a/app/components/Icons/Logo.tsx b/app/components/Icons/Logo.tsx
index c922c8a..c2da566 100644
--- a/app/components/Icons/Logo.tsx
+++ b/app/components/Icons/Logo.tsx
@@ -2,7 +2,7 @@ import { Link } from "remix";
 
 export function Logo({
   className,
-  width = "196",
+  width = "100%",
 }: {
   className?: string;
   width?: string;