fix(ui): change sidebar breakpoint to lg (#1972)

src/components/Layout/SearchInput/index.tsx

@@ -13,7 +13,7 @@ const SearchInput: React.FC = () => {
   const { searchValue, setSearchValue, setIsOpen, clear } = useSearchInput();
   return (
     <div className="flex flex-1">
-      <div className="flex w-full md:ml-0">
+      <div className="flex w-full">
         <label htmlFor="search_field" className="sr-only">
           Search
         </label>

src/components/Layout/Sidebar/index.tsx

@@ -73,7 +73,7 @@ const Sidebar: React.FC<SidebarProps> = ({ open, setClosed }) => {
 
   return (
     <>
-      <div className="md:hidden">
+      <div className="lg:hidden">
         <Transition show={open}>
           <div className="fixed inset-0 z-40 flex">
             <Transition
@@ -174,7 +174,7 @@ const Sidebar: React.FC<SidebarProps> = ({ open, setClosed }) => {
         </Transition>
       </div>
 
-      <div className="fixed top-0 bottom-0 left-0 z-30 hidden md:flex md:flex-shrink-0">
+      <div className="fixed top-0 bottom-0 left-0 z-30 hidden lg:flex lg:flex-shrink-0">
         <div className="flex flex-col w-64 sidebar">
           <div className="flex flex-col flex-1 h-0">
             <div className="flex flex-col flex-1 pt-8 pb-4 overflow-y-auto">

src/components/Layout/index.tsx

@@ -52,11 +52,11 @@ const Layout: React.FC = ({ children }) => {
       </div>
       <Sidebar open={isSidebarOpen} setClosed={() => setSidebarOpen(false)} />
 
-      <div className="relative flex flex-col flex-1 w-0 min-w-0 mb-16 md:ml-64">
+      <div className="relative flex flex-col flex-1 w-0 min-w-0 mb-16 lg:ml-64">
         <div
           className={`searchbar fixed left-0 right-0 top-0 z-10 flex flex-shrink-0 bg-opacity-80 transition duration-300 ${
             isScrolled ? 'bg-gray-700' : 'bg-transparent'
-          } md:left-64`}
+          } lg:left-64`}
           style={{
             backdropFilter: isScrolled ? 'blur(5px)' : undefined,
             WebkitBackdropFilter: isScrolled ? 'blur(5px)' : undefined,
@@ -65,7 +65,7 @@ const Layout: React.FC = ({ children }) => {
           <button
             className={`px-4 text-white ${
               isScrolled ? 'opacity-90' : 'opacity-70'
-            } focus:outline-none md:hidden transition duration-300`}
+            } focus:outline-none lg:hidden transition duration-300`}
             aria-label="Open sidebar"
             onClick={() => setSidebarOpen(true)}
           >