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

some styling changes for bin yard tabs

Browse source
This commit is contained in:
Carter 2025-03-24 12:00:52 -06:00
parent b4da0d6859
commit c573101669
1 changed files with 18 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

34
src/bin/BinYards.tsx
View file

@ -57,7 +57,7 @@ const parentTab = {
marginTop: "4px",
marginLeft: "4px",
animationDuration: "10s",
background: "rgba(150, 150, 150, 0)",
// background: "rgba(150, 150, 150, 0)",
borderRadius: "-5px",
borderTopLeftRadius: "6px",
@ -100,7 +100,7 @@ const useStyles = makeStyles((theme: Theme) => {
minWidth: theme.spacing(8),
left: 0,
height: "100%",
background: theme.palette.background.paper
// background: theme.palette.background.paper
},
searchTabExpanded: {
...parentTab,
@ -108,7 +108,7 @@ const useStyles = makeStyles((theme: Theme) => {
minWidth: theme.spacing(30),
left: 0,
height: "100%",
background: theme.palette.background.paper
// background: theme.palette.background.paper
},
tab: {
...parentTab,
@ -117,17 +117,19 @@ const useStyles = makeStyles((theme: Theme) => {
...parentTab,
width: theme.spacing(8),
minWidth: theme.spacing(8),
background: theme.palette.background.paper
// background: theme.palette.background.paper
},
selectedTab: {
borderRadius: "-5px",
borderTopLeftRadius: "6px",
borderTopRightRadius: "6px",
background: theme.palette.background.default,
"&:hover": {
background:
"linear-gradient(rgba(150, 150, 150, 0.3)," + theme.palette.background.default + " 80%)"
}
background: theme.palette.background.default
// "linear-gradient(rgba(150, 150, 150, 0.3),"
// + theme.palette.background.default + " 80%)"
// "&:hover": {
// background:
// "linear-gradient(rgba(150, 150, 150, 0.3)," + theme.palette.background.default + " 80%)"
// }
},
icon: {
display: "flex",
@ -139,11 +141,11 @@ const useStyles = makeStyles((theme: Theme) => {
width: 36,
height: 36,
borderRadius: "18px",
background: "rgba(0,0,0,0)",
"&:hover": {
background:
"radial-gradient(closest-side, rgba(150, 150, 150, 0.5) 50%, rgba(150, 150, 150, 0.5))"
}
// background: "rgba(0,0,0,0)",
// "&:hover": {
// background:
// "radial-gradient(closest-side, rgba(150, 150, 150, 0.5) 50%, rgba(150, 150, 150, 0.5))"
// }
},
tabText: {
position: "absolute",
@ -678,6 +680,7 @@ export default function BinYard(props: Props) {
<DraggableTabs
variant="scrollable"
scrollButtons="auto"
sx={{ background: theme.palette.background.paper }}
value={tab}
TabIndicatorProps={{ style: { background: "rgba(0,0,0,0)" } }}
onChange={(_, newValue) => {
@ -789,7 +792,6 @@ export default function BinYard(props: Props) {
/>
</Tooltip>
))}
{/* {grainBags.length > 0 && (
<Tab
classes={{ root: classes.smallTab, selected: classes.selectedTab }}
@ -804,4 +806,4 @@ export default function BinYard(props: Props) {
</DraggableTabs>
</AppBar>
);
}
}