alignmemnt things

app/modules/SidePanel/SidePanel.tsx

@@ -27,7 +27,7 @@ export const SidePanel =({
       className='fixed right-0 top-20 mt-2 mr-4'
       onClick={handleOpen}
     >
-      <FontAwesomeIcon className="h-6 w-6" icon={faGears} />
+      <FontAwesomeIcon className="fa-2xl -mx-2" icon={faGears} />
     </Button>
     <Transition.Root show={open} as={Fragment}>
       <Dialog as="div" className="relative z-10" onClose={setOpen}>
@@ -35,7 +35,7 @@ export const SidePanel =({
 
         <div className="fixed inset-0 overflow-hidden">
           <div className="absolute inset-0 overflow-hidden">
-            <div className="pointer-events-none fixed inset-y-0 right-0 flex max-w-full pl-10 sm:pl-16">
+            <div className="pointer-events-none inset-y-0 fixed top-16 mt-2 right-0 flex max-w-full pl-10 sm:pl-16 border-t border-ui-panel-border">
               <Transition.Child
                 as={Fragment}
                 enter="transform transition ease-in-out duration-500 sm:duration-700"
@@ -49,6 +49,7 @@ export const SidePanel =({
                   <div className="flex h-full flex-col overflow-y-scroll bg-ui-panel py-6 shadow-xl">
                     <div className="px-4 sm:px-6">
                       <div className="flex items-start justify-between">
+                        {!title && <span/>}
                         {title &&
                           <Dialog.Title className="text-base font-semibold leading-6 text-white">
                             {title}

app/modules/TopBar/TopBar.tsx

@@ -10,11 +10,11 @@ export const TopBar = () => {
       fixed top-0 left-0 w-full
       bg-ui-panel border-b border-ui-panel-border
     ">
-      <nav className="mx-auto flex max-w-full items-center justify-between p-4 lg:px-8" aria-label="Global">
+      <nav className="mx-auto flex max-w-full items-center justify-between p-4" aria-label="Global">
         <div className="flex lg:flex-1">
           <a href="#" className="-m-1.5 p-1.5">
             <span className="sr-only">FakeYou</span>
-            <img className="h-10 w-auto" src="/resources/images/Storyteller-Logo-1.png" alt="Logo FakeYou StoryTeller.ai" />
+            <img className="h-10 w-auto ml-0.5" src="/resources/images/Storyteller-Logo-1.png" alt="Logo FakeYou StoryTeller.ai" />
           </a>
           <span className="w-4 lg:w-8"/>
           <TopBarInner />