fix: Ensure left border is always draggable

As per the feedback here, the left border of the app wasn't draggable when multiple sites were listed in the sidebar: #82 (comment)

This commit addresses that.

src/components/main-sidebar.tsx

@@ -127,7 +127,12 @@ export default function MainSidebar( { className }: MainSidebarProps ) {
 		>
 			<SidebarToolbar />
 			<div className="flex flex-col h-full">
-				<div className="flex-1 overflow-y-auto sites-scrollbar">
+				<div
+					className={ cx(
+						'flex-1 overflow-y-auto sites-scrollbar app-no-drag-region',
+						isMac() ? 'ml-5' : 'ml-4'
+					) }
+				>
 					<SiteMenu />
 				</div>
 				<div className="flex flex-col gap-4 pt-5 border-white border-t border-opacity-10 app-no-drag-region">

src/components/site-menu.tsx

@@ -101,7 +101,7 @@ function SiteItem( { site }: { site: SiteDetails } ) {
 		<li
 			className={ cx(
 				'flex flex-row min-w-[168px] h-8 hover:bg-[#ffffff0C] focus:bg-[#ffffff0C] rounded transition-all',
-				isMac() ? 'mx-5' : 'mx-4',
+				isMac() ? 'mr-5' : 'mr-4',
 				isSelected && 'bg-[#ffffff19] hover:bg-[#ffffff19] focus:bg-[#ffffff19]'
 			) }
 		>
@@ -127,7 +127,7 @@ export default function SiteMenu( { className }: SiteMenuProps ) {
 				scrollbarGutter: 'stable',
 			} }
 			className={ cx(
-				'w-full overflow-y-auto overflow-x-hidden flex flex-col gap-0.5 pb-4 app-no-drag-region',
+				'w-full overflow-y-auto overflow-x-hidden flex flex-col gap-0.5 pb-4',
 				className
 			) }
 		>