one-click-accessibility/modules/settings/assets/js/components/sidebar-app-bar/index.js
Nirbhay Singh 1972e7c029
[APP-1561] New menu layout (#308)
* update: app menu and layout

* merge: latest changes from feature/remediation

* add: alert indicator to the closed sidebar

* fix: page layout for statement page

* update: menu display names

* fix: topbar menu layout

* update: sidebar menu width

* update: sidebar menu width

* fix: popup menu layout

* add: hover action to the toggle button

* update: my account menu

* fix: quota indicator for closed sidebar

* fix: icon alignments

* fix: scroll behaviour

* fix: page scroll behaviour

* fix: popup menu hover state

* update: quota bar and group layouts

* add: tooltips to the menu items

* update: make scans page fixed height and scrollable

* update: styles with theme references and added new styled components

* fix: make sidebar smoother

* update: accessibility page heading
2025-07-02 14:29:57 +05:30

34 lines
906 B
JavaScript

import AppBar from '@elementor/ui/AppBar';
import IconButton from '@elementor/ui/IconButton';
import Toolbar from '@elementor/ui/Toolbar';
import { useSettings } from '@ea11y/hooks';
import { SquareRoundedChevronsLeft } from '@ea11y/icons';
import { __ } from '@wordpress/i18n';
const SidebarAppBar = () => {
const { openSidebar, setOpenSidebar } = useSettings();
return (
<AppBar position="static" color="transparent" elevation={0}>
<Toolbar
disableGutters
variant="dense"
sx={{ justifyContent: 'space-between' }}
>
<IconButton
color="inherit"
onClick={() => setOpenSidebar(!openSidebar)}
size="small"
>
<SquareRoundedChevronsLeft
role="img"
aria-label={__('Toggle sidebar', 'pojo-accessibility')}
sx={{ rotate: !openSidebar ? '180deg' : '0' }}
/>
</IconButton>
</Toolbar>
</AppBar>
);
};
export default SidebarAppBar;