QRunIO/qqq-frontend-material-dashboard
2
0
Fork 0
mirror of https://github.com/Kingsrook/qqq-frontend-material-dashboard.git synced 2025-07-18 05:10:45 +00:00
Code Issues Packages Projects Releases Wiki Activity

CE-740 more widget padding changes

Browse Source
This commit is contained in:
darin.kelkhoff
2023-11-16 10:01:20 -06:00
parent 40ac89dac3
commit 627dd3c9f5
4 changed files with 49 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
src/qqq/components/widgets/Widget.tsx
View File

@ -64,6 +64,7 @@ interface Props
isChild?: boolean;
footerHTML?: string;
storeDropdownSelections?: boolean;
omitPadding: boolean;
}
Widget.defaultProps = {
@ -74,6 +75,7 @@ Widget.defaultProps = {
labelAdditionalComponentsLeft: [],
labelAdditionalElementsLeft: [],
labelAdditionalComponentsRight: [],
omitPadding: false,
};
@ -460,7 +462,7 @@ function Widget(props: React.PropsWithChildren<Props>): JSX.Element
//////////////////////////////////////////////////////////////////////////////////////////
const labelToUse = props.widgetData?.label ?? props.widgetMetaData?.label
let labelElement = (
<Typography sx={{cursor: "default"}} variant="h6" display="inline">
<Typography sx={{cursor: "default", pl: props.widgetMetaData.isCard ? "auto" : "1rem", pt: props.widgetMetaData.type == "parentWidget" ? "1rem" : "auto"}} variant="h6" display="inline">
{labelToUse}
</Typography>
);
@ -480,21 +482,17 @@ function Widget(props: React.PropsWithChildren<Props>): JSX.Element
{
hasPermission ?
props.widgetMetaData?.icon && (
<Box
ml={1}
mr={2}
mt={-4}
sx={{
display: "flex",
justifyContent: "center",
alignItems: "center",
width: "64px",
height: "64px",
borderRadius: "8px",
background: colors.info.main,
color: "#ffffff",
float: "left"
}}
<Box ml={1} mr={2} mt={-4} sx={{
display: "flex",
justifyContent: "center",
alignItems: "center",
width: "64px",
height: "64px",
borderRadius: "8px",
background: colors.info.main,
color: "#ffffff",
float: "left"
}}
>
<Icon fontSize="medium" color="inherit">
{props.widgetMetaData.icon}
@ -502,20 +500,17 @@ function Widget(props: React.PropsWithChildren<Props>): JSX.Element
</Box>
) :
(
<Box
ml={3}
mt={-4}
sx={{
display: "flex",
justifyContent: "center",
alignItems: "center",
width: "64px",
height: "64px",
borderRadius: "8px",
background: colors.info.main,
color: "#ffffff",
float: "left"
}}
<Box ml={3} mt={-4} sx={{
display: "flex",
justifyContent: "center",
alignItems: "center",
width: "64px",
height: "64px",
borderRadius: "8px",
background: colors.info.main,
color: "#ffffff",
float: "left"
}}
>
<Icon fontSize="medium" color="inherit">lock</Icon>
</Box>
@ -583,11 +578,12 @@ function Widget(props: React.PropsWithChildren<Props>): JSX.Element
}
</Box>;
const padding = props.omitPadding? "auto" : "24px 16px";
return props.widgetMetaData?.isCard
? <Card sx={{marginTop: props.widgetMetaData?.icon ? 2 : 0, width: "100%", py: "24px", px: "16px"}} className={fullScreenWidgetClassName}>
? <Card sx={{marginTop: props.widgetMetaData?.icon ? 2 : 0, width: "100%", p: padding}} className={fullScreenWidgetClassName}>
{widgetContent}
</Card>
: <span style={{width: "100%"}}>{widgetContent}</span>;
: <span style={{width: "100%", padding: padding}}>{widgetContent}</span>;
}
export default Widget;