mirror of
https://gh.wpcy.net/https://github.com/elementor/one-click-accessibility.git
synced 2026-04-25 02:15:31 +08:00
55 lines
1.4 KiB
JavaScript
55 lines
1.4 KiB
JavaScript
import AppBar from '@elementor/ui/AppBar';
|
|
import Box from '@elementor/ui/Box';
|
|
import IconButton from '@elementor/ui/IconButton';
|
|
import Toolbar from '@elementor/ui/Toolbar';
|
|
import Typography from '@elementor/ui/Typography';
|
|
import { styled } from '@elementor/ui/styles';
|
|
import { useSettings } from '@ea11y/hooks';
|
|
import { ElementorLogo, SquareRoundedChevronsLeft } from '@ea11y/icons';
|
|
import { __ } from '@wordpress/i18n';
|
|
|
|
const StyledHeading = styled(Box)`
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: ${({ theme }) => theme.spacing(0.5)};
|
|
padding-top: 0;
|
|
`;
|
|
|
|
const SidebarAppBar = () => {
|
|
const { openSidebar, setOpenSidebar } = useSettings();
|
|
|
|
return (
|
|
<AppBar position="static" color="transparent" elevation={0}>
|
|
<Toolbar
|
|
disableGutters
|
|
variant="dense"
|
|
sx={{ justifyContent: 'flex-start' }}
|
|
>
|
|
<StyledHeading>
|
|
<ElementorLogo />
|
|
|
|
<Typography
|
|
variant="h6"
|
|
marginLeft={0.5}
|
|
display={!openSidebar ? 'none' : 'inherit'}
|
|
>
|
|
{__('Web accessibility', 'pojo-accessibility')}
|
|
</Typography>
|
|
</StyledHeading>
|
|
|
|
<IconButton
|
|
color="inherit"
|
|
onClick={() => setOpenSidebar(!openSidebar)}
|
|
size="small"
|
|
>
|
|
<SquareRoundedChevronsLeft
|
|
sx={{ rotate: !openSidebar ? '180deg' : '0' }}
|
|
/>
|
|
</IconButton>
|
|
</Toolbar>
|
|
</AppBar>
|
|
);
|
|
};
|
|
|
|
export default SidebarAppBar;
|
