Skip to content

fix: hide filter and action buttons on tablet screens to prevent UI o… #257

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Hell1213 wants to merge 1 commit into
base: main
Choose a base branch
from
+8 −8
Open

fix: hide filter and action buttons on tablet screens to prevent UI o… #257

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion frontend/src/components/HomeComponents/BottomBar/BottomBar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ const BottomBar: React.FC<BottomBarProps> = ({
setSelectedTag,
}) => {
return (
<header className="sm:hidden fixed bottom-0 w-full bg-white border-t-[1px] dark:border-b-slate-700 dark:bg-background shadow-lg flex justify-between items-center p-4 z-40">
<header className="lg:hidden fixed bottom-0 w-full bg-white border-t-[1px] dark:border-b-slate-700 dark:bg-background shadow-lg flex justify-between items-center p-4 z-40">
{/* Nav Links */}
<NavigationMenu className="mx-auto">
<div className="flex space-x-4 mr-2">
Expand Down
6 changes: 3 additions & 3 deletions ...d/src/components/HomeComponents/BottomBar/__tests__/__snapshots__/BottomBar.test.tsx.snap
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@
exports[`BottomBar Component using Snapshot renders correctly with only one selected props: Bottom bar with only one selected props 1`] = `
<DocumentFragment>
<header
class="sm:hidden fixed bottom-0 w-full bg-white border-t-[1px] dark:border-b-slate-700 dark:bg-background shadow-lg flex justify-between items-center p-4 z-40"
class="lg:hidden fixed bottom-0 w-full bg-white border-t-[1px] dark:border-b-slate-700 dark:bg-background shadow-lg flex justify-between items-center p-4 z-40"
>
<nav
aria-label="Main"
Expand Down Expand Up @@ -96,7 +96,7 @@ exports[`BottomBar Component using Snapshot renders correctly with only one sele
exports[`BottomBar Component using Snapshot renders correctly with several selected props: Bottom bar with several selected props 1`] = `
<DocumentFragment>
<header
class="sm:hidden fixed bottom-0 w-full bg-white border-t-[1px] dark:border-b-slate-700 dark:bg-background shadow-lg flex justify-between items-center p-4 z-40"
class="lg:hidden fixed bottom-0 w-full bg-white border-t-[1px] dark:border-b-slate-700 dark:bg-background shadow-lg flex justify-between items-center p-4 z-40"
>
<nav
aria-label="Main"
Expand Down Expand Up @@ -189,7 +189,7 @@ exports[`BottomBar Component using Snapshot renders correctly with several selec
exports[`BottomBar Component using Snapshot renders correctly without selected props: Bottom bar without selected props 1`] = `
<DocumentFragment>
<header
class="sm:hidden fixed bottom-0 w-full bg-white border-t-[1px] dark:border-b-slate-700 dark:bg-background shadow-lg flex justify-between items-center p-4 z-40"
class="lg:hidden fixed bottom-0 w-full bg-white border-t-[1px] dark:border-b-slate-700 dark:bg-background shadow-lg flex justify-between items-center p-4 z-40"
>
<nav
aria-label="Main"
Expand Down
8 changes: 4 additions & 4 deletions frontend/src/components/HomeComponents/Tasks/Tasks.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -896,7 +896,7 @@ export const Tasks = (
options={uniqueProjects}
selectedValues={selectedProjects}
onSelectionChange={setSelectedProjects}
className="hidden sm:flex min-w-[140px]"
className="hidden lg:flex min-w-[140px]"
icon={<Key lable="p" />}
/>
<MultiSelectFilter
Expand All @@ -905,7 +905,7 @@ export const Tasks = (
options={status}
selectedValues={selectedStatuses}
onSelectionChange={setSelectedStatuses}
className="hidden sm:flex min-w-[140px]"
className="hidden lg:flex min-w-[140px]"
icon={<Key lable="s" />}
/>
<MultiSelectFilter
Expand All @@ -914,7 +914,7 @@ export const Tasks = (
options={uniqueTags}
selectedValues={selectedTags}
onSelectionChange={setSelectedTags}
className="hidden sm:flex min-w-[140px]"
className="hidden lg:flex min-w-[140px]"
icon={<Key lable="t" />}
/>
<div className="pr-2">
Expand All @@ -931,7 +931,7 @@ export const Tasks = (
uniqueProjects={uniqueProjects}
/>
</div>
<div className="hidden sm:flex flex-col items-end gap-2">
<div className="flex flex-col items-end gap-2">
<Button
id="sync-task"
variant="outline"
Expand Down
Loading