brandxtech/frontend
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed alignment issues on local credentials front end

Browse source
This commit is contained in:
Carter 2026-05-20 12:08:43 -06:00
parent 0410a5ccae
commit dd25770a07
3 changed files with 21 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/app/UserWrapper.tsx
View file

@ -32,7 +32,7 @@ const useStyles = makeStyles((theme: Theme) => ({
paddingBottom: 0, paddingBottom: 0,
}, },
[theme.breakpoints.up("md")]: { [theme.breakpoints.up("md")]: {
paddingLeft: theme.spacing(9) paddingLeft: theme.spacing(8)
}, },
}, },
container: { container: {
@ -195,4 +195,4 @@ export default function UserWrapper(props: Props) {
</AppThemeProvider> </AppThemeProvider>
</StateProvider> </StateProvider>
) )
} }

1
src/bin/AddBinFab.tsx
View file

@ -28,6 +28,7 @@ const useStyles = makeStyles((theme: Theme) => {
position: "fixed", position: "fixed",
bottom: theme.spacing(8), //for mobile navigator bottom: theme.spacing(8), //for mobile navigator
right: theme.spacing(2), right: theme.spacing(2),
zIndex: theme.zIndex.speedDial,
[theme.breakpoints.up("sm")]: { [theme.breakpoints.up("sm")]: {
bottom: theme.spacing(1.75) bottom: theme.spacing(1.75)
} }

24
src/navigation/SideNavigator.tsx
View file

@ -53,6 +53,7 @@ import CNHiIcon from "products/CommonIcons/cnhiIcon";
import LibraCartIcon from "products/CommonIcons/libracartIcon"; import LibraCartIcon from "products/CommonIcons/libracartIcon";
const drawerWidth = 230; const drawerWidth = 230;
const closedDrawerWidth = 8;
const useStyles = makeStyles((theme: Theme) => ({ const useStyles = makeStyles((theme: Theme) => ({
sideMenu: { sideMenu: {
@ -66,6 +67,8 @@ const useStyles = makeStyles((theme: Theme) => ({
sideMenuOpened: { sideMenuOpened: {
zIndex: theme.zIndex.drawer + 2, zIndex: theme.zIndex.drawer + 2,
width: drawerWidth, width: drawerWidth,
minWidth: drawerWidth,
maxWidth: drawerWidth,
transition: theme.transitions.create(["width"], { transition: theme.transitions.create(["width"], {
easing: theme.transitions.easing.sharp, easing: theme.transitions.easing.sharp,
duration: theme.transitions.duration.enteringScreen duration: theme.transitions.duration.enteringScreen
@ -76,12 +79,16 @@ const useStyles = makeStyles((theme: Theme) => ({
easing: theme.transitions.easing.sharp, easing: theme.transitions.easing.sharp,
duration: theme.transitions.duration.leavingScreen duration: theme.transitions.duration.leavingScreen
}), }),
// overflowX: "hidden", overflowX: "hidden",
width: theme.spacing(0), width: theme.spacing(0),
minWidth: theme.spacing(0),
maxWidth: theme.spacing(0),
// zIndex: theme.zIndex.drawer, // zIndex: theme.zIndex.drawer,
// opacity: 0, // opacity: 0,
[theme.breakpoints.up("md")]: { [theme.breakpoints.up("md")]: {
width: theme.spacing(9.25), width: theme.spacing(closedDrawerWidth),
minWidth: theme.spacing(closedDrawerWidth),
maxWidth: theme.spacing(closedDrawerWidth),
opacity: 1 opacity: 1
} }
}, },
@ -538,11 +545,16 @@ export default function SideNavigator(props: Props) {
onClose={onClose} onClose={onClose}
sx={{ pointerEvents: isMobile&&!open ? "none" : "auto"}} sx={{ pointerEvents: isMobile&&!open ? "none" : "auto"}}
> >
<Toolbar > <Toolbar>
<Grid container direction="row" justifyContent={"flex-end"}> <Grid container direction="row" justifyContent={"flex-end"}>
<Grid> <Grid>
<IconButton onClick={onClose} aria-label="onClose side menu"> <IconButton
{theme.direction === "rtl" ? <ChevronRight /> : <ChevronLeft />} onClick={open ? onClose : onOpen}
aria-label={open ? "Close side menu" : "Open side menu"}
>
{open
? theme.direction === "rtl" ? <ChevronRight /> : <ChevronLeft />
: theme.direction === "rtl" ? <ChevronLeft /> : <ChevronRight />}
</IconButton> </IconButton>
</Grid> </Grid>
</Grid> </Grid>
@ -552,4 +564,4 @@ export default function SideNavigator(props: Props) {
{isAuthenticated && authenticatedSideMenu()} {isAuthenticated && authenticatedSideMenu()}
</SwipeableDrawer> </SwipeableDrawer>
); );
} }