shpaq/sct-overseerr
1
0
Fork 0
mirror of https://github.com/sct/overseerr.git synced 2025-09-17 17:24:35 +02:00
Code Issues Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
Nicolás Espinoza
2021-08-09 14:19:34 +09:00
committed by GitHub
parent 1e65a299a1
commit 70bd9e9308
3 changed files with 6 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/Layout/SearchInput/index.tsx
View File

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

4
src/components/Layout/Sidebar/index.tsx
View File

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

6
src/components/Layout/index.tsx
View File

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