Merge pull request #78 from Pkcarreno/improves-6

fix(ui): hide layout toggler on mobile view
Pkcarreno · Jan 20, 2025 · 8748bbf · 8748bbf
2 parents e95497e + ce7ca99
commit 8748bbf
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 2 deletions.
diff --git a/src/features/editor/components/header/index.tsx b/src/features/editor/components/header/index.tsx
@@ -30,7 +30,7 @@ export const Header = () => {
           <div className="flex space-x-3">
             {isIframe && <OpenInSite />}
             {!isIframe && <SharingMenu />}
-            <LayoutDirectionToggler />
+            <LayoutDirectionToggler className="hidden md:flex" />
             <ActionButtons />
           </div>
         </div>

diff --git a/src/features/editor/components/header/layout-direction-toggler.tsx b/src/features/editor/components/header/layout-direction-toggler.tsx
@@ -1,5 +1,6 @@
 import { FlipHorizontal, FlipVertical } from 'lucide-react';
 
+import type { ButtonProps } from '@/components/ui/button';
 import { Button } from '@/components/ui/button';
 import {
   Tooltip,
@@ -9,7 +10,11 @@ import {
 } from '@/components/ui/tooltip';
 import { useSettingsStore } from '@/features/editor/stores/settings';
 
-export const LayoutDirectionToggler = () => {
+interface Props {
+  className?: ButtonProps['className'];
+}
+
+export const LayoutDirectionToggler: React.FC<Props> = ({ className }) => {
   const { layout_direction, updateLayoutDirection } = useSettingsStore();
 
   const nextDirection =
@@ -24,6 +29,7 @@ export const LayoutDirectionToggler = () => {
           variant="outline"
           size="icon"
           onClick={() => updateLayoutDirection(nextDirection)}
+          className={className}
           asChild
         >
           <TooltipTrigger>