rmorawski/standardnotes-app-web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: hide dynamic panels & focused mode options on mobile

Browse Source
This commit is contained in:
Aman Harwara
2022-10-18 21:02:41 +05:30
parent 07ffc01ede
commit e4de9c1be7
2 changed files with 18 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
packages/web/src/javascripts/Components/QuickSettingsMenu/FocusModeSwitch.tsx
View File

@@ -21,17 +21,20 @@ const FocusModeSwitch: FunctionComponent<Props> = ({ application, onToggle, onCl
[onToggle, isEnabled, onClose],
)
const isMobile = application.isNativeMobileWeb() || isMobileScreen()
if (isMobile) {
return null
}
return (
<>
<button
className="group flex w-full cursor-pointer items-center justify-between border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none disabled:bg-default disabled:text-passive-2"
onClick={toggle}
disabled={application.isNativeMobileWeb() || isMobileScreen()}
>
<div className="flex items-center">Focused Writing</div>
<Switch className="px-0" checked={isEnabled} />
</button>
</>
<button
className="group flex w-full cursor-pointer items-center justify-between border-0 bg-transparent px-3 py-1.5 text-left text-sm text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none disabled:bg-default disabled:text-passive-2"
onClick={toggle}
>
<div className="flex items-center">Focused Writing</div>
<Switch className="px-0" checked={isEnabled} />
</button>
)
}

6
packages/web/src/javascripts/Components/QuickSettingsMenu/ThemesMenuButton.tsx
View File

@@ -46,13 +46,17 @@ const ThemesMenuButton: FunctionComponent<Props> = ({ application, item }) => {
)
const isMobile = application.isNativeMobileWeb() || isMobileScreen()
const shouldHideButton = item.identifier === FeatureIdentifier.DynamicTheme && isMobile
if (shouldHideButton) {
return null
}
return (
<button
className={
'group flex w-full cursor-pointer items-center justify-between border-0 bg-transparent px-3 py-1.5 text-left text-mobile-menu-item text-text hover:bg-contrast hover:text-foreground focus:bg-info-backdrop focus:shadow-none disabled:bg-default disabled:text-passive-2 md:text-sm'
}
disabled={item.identifier === FeatureIdentifier.DynamicTheme && isMobile}
onClick={toggleTheme}
>
{item.component?.isLayerable() ? (