diff --git a/jams-react-client/src/assets/jss/material-dashboard-react/components/cardFooterStyle.js b/jams-react-client/src/assets/jss/material-dashboard-react/components/cardFooterStyle.js
index 3488ec30288c43e6ebbf34556d14c3134a9e1a19..b3554ac2eb83642f90566223e3796e926fa27f6b 100644
--- a/jams-react-client/src/assets/jss/material-dashboard-react/components/cardFooterStyle.js
+++ b/jams-react-client/src/assets/jss/material-dashboard-react/components/cardFooterStyle.js
@@ -11,7 +11,7 @@ const cardFooterStyle = (theme) => ({
display: "flex",
backgroundColor: "transparent",
border: "0",
- [theme.breakpoints.down("xs")]: {
+ [theme.breakpoints.down("sm")]: {
display: "flex",
flexDirection: "column",
"& div": {
diff --git a/jams-react-client/src/assets/jss/material-dashboard-react/components/headerLinksStyle.js b/jams-react-client/src/assets/jss/material-dashboard-react/components/headerLinksStyle.js
index 818cb007dee624c8ffc771918f17df6d6b5ba249..d00a992d99bb0d319db6ad625cae707fc4b621d3 100644
--- a/jams-react-client/src/assets/jss/material-dashboard-react/components/headerLinksStyle.js
+++ b/jams-react-client/src/assets/jss/material-dashboard-react/components/headerLinksStyle.js
@@ -12,7 +12,7 @@ const headerLinksStyle = (theme) => ({
"& > div": {
marginTop: "0",
},
- [theme.breakpoints.down("sm")]: {
+ [theme.breakpoints.down("md")]: {
margin: "10px 15px !important",
float: "none !important",
paddingTop: "1px",
@@ -32,7 +32,7 @@ const headerLinksStyle = (theme) => ({
margin: "0px",
},
buttonLink: {
- [theme.breakpoints.down("sm")]: {
+ [theme.breakpoints.down("md")]: {
display: "flex",
margin: "10px 15px 0",
width: "-webkit-fill-available",
@@ -57,7 +57,7 @@ const headerLinksStyle = (theme) => ({
},
},
searchButton: {
- [theme.breakpoints.down("sm")]: {
+ [theme.breakpoints.down("md")]: {
top: "-50px !important",
marginRight: "22px",
float: "right",
@@ -89,20 +89,20 @@ const headerLinksStyle = (theme) => ({
verticalAlign: "middle",
display: "block",
},
- [theme.breakpoints.down("sm")]: {
+ [theme.breakpoints.down("md")]: {
...defaultFont,
fontSize: "14px",
marginRight: "8px",
},
},
manager: {
- [theme.breakpoints.down("sm")]: {
+ [theme.breakpoints.down("md")]: {
width: "100%",
},
display: "inline-block",
},
searchWrapper: {
- [theme.breakpoints.down("sm")]: {
+ [theme.breakpoints.down("md")]: {
width: "-webkit-fill-available",
margin: "10px 15px 0",
},
diff --git a/jams-react-client/src/assets/jss/material-dashboard-react/components/headerStyle.js b/jams-react-client/src/assets/jss/material-dashboard-react/components/headerStyle.js
index 3837478dffc3b90777eb4d61fccd5bb8ee6487ab..8b241a8483cebeb0c1ea97e30aab59a647beac9c 100644
--- a/jams-react-client/src/assets/jss/material-dashboard-react/components/headerStyle.js
+++ b/jams-react-client/src/assets/jss/material-dashboard-react/components/headerStyle.js
@@ -19,7 +19,7 @@ const headerStyle = (theme) => ({
marginBottom: "0",
position: "absolute",
width: "50%",
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
width: "130px",
},
[theme.breakpoints.up("md")]: {
diff --git a/jams-react-client/src/assets/jss/material-dashboard-react/components/sidebarStyle.js b/jams-react-client/src/assets/jss/material-dashboard-react/components/sidebarStyle.js
index 3866e6b45a551a510c8c21adf2c58316d026c4a6..c2202b68dbb20fb10facdea3e08f82a6252c1e0c 100644
--- a/jams-react-client/src/assets/jss/material-dashboard-react/components/sidebarStyle.js
+++ b/jams-react-client/src/assets/jss/material-dashboard-react/components/sidebarStyle.js
@@ -29,7 +29,7 @@ const sidebarStyle = (theme) => ({
position: "fixed",
height: "100%",
},
- [theme.breakpoints.down("sm")]: {
+ [theme.breakpoints.down("md")]: {
width: drawerWidth,
...boxShadow,
position: "fixed",
@@ -54,7 +54,7 @@ const sidebarStyle = (theme) => ({
left: "auto !important",
right: "0 !important",
},
- [theme.breakpoints.down("sm")]: {
+ [theme.breakpoints.down("md")]: {
left: "0 !important",
right: "auto !important",
},
diff --git a/jams-react-client/src/assets/jss/material-dashboard-react/dropdownStyle.js b/jams-react-client/src/assets/jss/material-dashboard-react/dropdownStyle.js
index 6e61466309f09d5cd4b1e7e493393cd2592f3a12..83edd189b99906b5fc12cbc60fa522520bf8b3cc 100644
--- a/jams-react-client/src/assets/jss/material-dashboard-react/dropdownStyle.js
+++ b/jams-react-client/src/assets/jss/material-dashboard-react/dropdownStyle.js
@@ -10,7 +10,7 @@ import {
const dropdownStyle = (theme) => ({
buttonLink: {
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
display: "flex",
marginLeft: "30px",
width: "auto",
@@ -20,7 +20,7 @@ const dropdownStyle = (theme) => ({
width: "20px",
height: "20px",
zIndex: "4",
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
display: "block",
width: "30px",
height: "30px",
@@ -37,7 +37,7 @@ const dropdownStyle = (theme) => ({
pointerEvents: "none",
},
popperResponsive: {
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
zIndex: "1640",
position: "static",
float: "none",
@@ -51,7 +51,7 @@ const dropdownStyle = (theme) => ({
},
},
popperNav: {
- [theme.breakpoints.down("sm")]: {
+ [theme.breakpoints.down("md")]: {
position: "static !important",
left: "unset !important",
top: "unset !important",
diff --git a/jams-react-client/src/assets/jss/material-dashboard-react/layouts/adminStyle.js b/jams-react-client/src/assets/jss/material-dashboard-react/layouts/adminStyle.js
index 224045e988b8c64c828f99ad8e9723e38a8a555e..ca56414d94ca56a35b9157b04c62bbc213b5ea37 100644
--- a/jams-react-client/src/assets/jss/material-dashboard-react/layouts/adminStyle.js
+++ b/jams-react-client/src/assets/jss/material-dashboard-react/layouts/adminStyle.js
@@ -24,7 +24,7 @@ const appStyle = (theme) => ({
},
content: {
marginTop: "0px",
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
marginTop: "30px",
},
padding: "30px 15px",
diff --git a/jams-react-client/src/components/CustomPopupState/CustomPopupState.js b/jams-react-client/src/components/CustomPopupState/CustomPopupState.js
index a9d3e621256c1366c69395dc369f1976f2b7996f..214298f90c7a28c30543cdc3b891bcd619910e30 100644
--- a/jams-react-client/src/components/CustomPopupState/CustomPopupState.js
+++ b/jams-react-client/src/components/CustomPopupState/CustomPopupState.js
@@ -8,7 +8,7 @@ import Typography from "@mui/material/Typography";
export default function CustomPopupState(props) {
return (
- <IconButton>
+ <IconButton size="large">
<PopupState variant="popover" popupId="demo-popup-popover">
{(popupState) => (
<div>
diff --git a/jams-react-client/src/components/Devices/Devices.js b/jams-react-client/src/components/Devices/Devices.js
index ecaf88e5d7ab2cb6f9b90c55e8fb9ac9e8bcd1bb..381d5eb21ffcaac61eda0f82781679c37cb4acb6 100755
--- a/jams-react-client/src/components/Devices/Devices.js
+++ b/jams-react-client/src/components/Devices/Devices.js
@@ -279,6 +279,7 @@ export default function Devices(props) {
aria-label="Edit"
className={classes.tableActionButton}
onClick={(e) => handleClickEdit(e, device)}
+ size="large"
>
<Edit
className={
@@ -297,6 +298,7 @@ export default function Devices(props) {
aria-label="Close"
className={classes.tableActionButton}
onClick={(e) => handleClickRevoke(e, device)}
+ size="large"
>
<Close
className={
diff --git a/jams-react-client/src/components/Navbars/Navbar.js b/jams-react-client/src/components/Navbars/Navbar.js
index ebf21761b1fa802cc0086c009c0bd51ae143bd61..aacd9e71ee2cae5e8e2bc80f5727e85885f9582e 100755
--- a/jams-react-client/src/components/Navbars/Navbar.js
+++ b/jams-react-client/src/components/Navbars/Navbar.js
@@ -37,6 +37,7 @@ export default function Header(props) {
color="default"
aria-label="open drawer"
onClick={props.handleDrawerToggle}
+ size="large"
>
<Menu />
</IconButton>
diff --git a/jams-react-client/src/components/PasswordDialog/PasswordDialog.js b/jams-react-client/src/components/PasswordDialog/PasswordDialog.js
index dd59997a45a860537bf9bfeea7d05c7797ba4162..5b588f6986eda4af31cb90c05f3257d8842a0ddc 100644
--- a/jams-react-client/src/components/PasswordDialog/PasswordDialog.js
+++ b/jams-react-client/src/components/PasswordDialog/PasswordDialog.js
@@ -177,6 +177,7 @@ export default function PasswordDialog(props) {
aria-label="toggle password visibility"
onMouseDown={handleMouseDownPassword}
onMouseUp={handleMouseUpPassword}
+ size="large"
>
{passwordVisible ? (
<VisibilityIcon />
@@ -205,6 +206,7 @@ export default function PasswordDialog(props) {
aria-label="toggle password visibility"
onMouseDown={handleMouseDownPassword}
onMouseUp={handleMouseUpPassword}
+ size="large"
>
{passwordVisible ? (
<VisibilityIcon />
diff --git a/jams-react-client/src/components/Sidebar/Sidebar.js b/jams-react-client/src/components/Sidebar/Sidebar.js
index 12beefb378a66bdf7a7a0413ffa5d277bc4ce6c7..146e00d0bededa79ce6be8688ca459aa59bec1c6 100755
--- a/jams-react-client/src/components/Sidebar/Sidebar.js
+++ b/jams-react-client/src/components/Sidebar/Sidebar.js
@@ -193,7 +193,7 @@ export default function Sidebar(props) {
) : null}
</Drawer>
</Hidden>
- <Hidden smDown implementation="css">
+ <Hidden mdDown implementation="css">
<Drawer
anchor={props.rtlActive ? "right" : "left"}
variant="permanent"
diff --git a/jams-react-client/src/index.js b/jams-react-client/src/index.js
index 3c3063da7aa83649318a15053330b78e72ad4e1d..ba4e3798d13297779e73fd4e074e4d687d6b7749 100644
--- a/jams-react-client/src/index.js
+++ b/jams-react-client/src/index.js
@@ -23,7 +23,11 @@ import { ProtectedRoute } from "protected.route";
import { ConfiguredRoute } from "configured.route";
import auth from "./auth";
-import { ThemeProvider, createTheme } from "@mui/material";
+import {
+ ThemeProvider,
+ StyledEngineProvider,
+ createTheme,
+} from "@mui/material";
// core components
import UsersRoute from "routes/UsersRoute.js";
@@ -65,39 +69,44 @@ auth.checkServerInstalled(() => {
auth.checkLastKnownStep(() => {
ReactDOM.render(
<StrictMode>
- <ThemeProvider theme={theme}>
- <Suspense fallback={<div>Loading...</div>}>
- <Router history={hist}>
- <Switch>
- <ConfiguredRoute path="/signin" component={SignIn} />
- <ProtectedRoute path="/users" component={UsersRoute} />
- <ProtectedRoute
- path="/user/:username"
- component={UserRoute}
- />
- <ProtectedRoute
- path="/createuser"
- component={CreateUserRoute}
- />
- <ProtectedRoute path="/groups" component={GroupsRoute} />
- <ProtectedRoute
- path="/group/:groupid"
- component={GroupRoute}
- />
- <ProtectedRoute
- path="/blueprints"
- component={BlueprintsRoute}
- />
- <ProtectedRoute
- path="/blueprint/:blueprintname"
- component={BlueprintRoute}
- />
- <ProtectedRoute path="/settings" component={SettingsRoute} />
- <Redirect from="/" to="/signin" />
- </Switch>
- </Router>
- </Suspense>
- </ThemeProvider>
+ <StyledEngineProvider injectFirst>
+ <ThemeProvider theme={theme}>
+ <Suspense fallback={<div>Loading...</div>}>
+ <Router history={hist}>
+ <Switch>
+ <ConfiguredRoute path="/signin" component={SignIn} />
+ <ProtectedRoute path="/users" component={UsersRoute} />
+ <ProtectedRoute
+ path="/user/:username"
+ component={UserRoute}
+ />
+ <ProtectedRoute
+ path="/createuser"
+ component={CreateUserRoute}
+ />
+ <ProtectedRoute path="/groups" component={GroupsRoute} />
+ <ProtectedRoute
+ path="/group/:groupid"
+ component={GroupRoute}
+ />
+ <ProtectedRoute
+ path="/blueprints"
+ component={BlueprintsRoute}
+ />
+ <ProtectedRoute
+ path="/blueprint/:blueprintname"
+ component={BlueprintRoute}
+ />
+ <ProtectedRoute
+ path="/settings"
+ component={SettingsRoute}
+ />
+ <Redirect from="/" to="/signin" />
+ </Switch>
+ </Router>
+ </Suspense>
+ </ThemeProvider>
+ </StyledEngineProvider>
</StrictMode>,
document.getElementById("root")
);
diff --git a/jams-react-client/src/views/Blueprint/EditBlueprintConfiguration.js b/jams-react-client/src/views/Blueprint/EditBlueprintConfiguration.js
index 6bc9896a01870d46bfac4e7ce9da319ff5dff16c..9aa2b6f7c98d592f108f75cf8f955665e04d5f31 100644
--- a/jams-react-client/src/views/Blueprint/EditBlueprintConfiguration.js
+++ b/jams-react-client/src/views/Blueprint/EditBlueprintConfiguration.js
@@ -361,6 +361,7 @@ export default function EditBlueprintConfiguration(props) {
aria-label="toggle password visibility"
onMouseDown={handleMouseDownPassword}
onMouseUp={handleMouseUpPassword}
+ size="large"
>
{turnPasswordVisible ? (
<VisibilityIcon />
diff --git a/jams-react-client/src/views/Blueprints/Blueprints.js b/jams-react-client/src/views/Blueprints/Blueprints.js
index c137d58d60a77944958b236a0a22e0df5c78b50e..f5bc0b5d2a2f97a91235d5252dfe85bd985b487e 100644
--- a/jams-react-client/src/views/Blueprints/Blueprints.js
+++ b/jams-react-client/src/views/Blueprints/Blueprints.js
@@ -404,6 +404,7 @@ export default function Blueprints() {
onClick={() => {
handleRemoveBlueprint(blueprint.name);
}}
+ size="large"
>
<DeleteOutlineIcon />
</IconButton>
diff --git a/jams-react-client/src/views/Contacts/Contacts.js b/jams-react-client/src/views/Contacts/Contacts.js
index 7ed9da0a53e4c89876368cd021b697153311ed44..6981934ab602e3d2b080f5ec6662c0b08d0fe903 100644
--- a/jams-react-client/src/views/Contacts/Contacts.js
+++ b/jams-react-client/src/views/Contacts/Contacts.js
@@ -489,6 +489,7 @@ export default function Users(props) {
onClick={() => {
handleRemoveContact(contact.uri, contact.username);
}}
+ size="large"
>
<DeleteOutlineIcon />
</IconButton>
diff --git a/jams-react-client/src/views/Groups/EditGroup.js b/jams-react-client/src/views/Groups/EditGroup.js
index cf15e2f15fea4d43a499d3bd4068280b5051f441..d49ef7d9f2fb8e6da3c6a13b4f86f21b8ccb7921 100644
--- a/jams-react-client/src/views/Groups/EditGroup.js
+++ b/jams-react-client/src/views/Groups/EditGroup.js
@@ -411,6 +411,7 @@ export default function EditGroup(props) {
updateGroup();
}}
disabled={groupNameExits || name === newName}
+ size="large"
>
<SaveIcon />
</IconButton>
diff --git a/jams-react-client/src/views/Groups/Groups.js b/jams-react-client/src/views/Groups/Groups.js
index 07af29799f5d9f965e9981aeb64b6f37cf66f463..3461d86d0becdf3e2688ddea120fbb1dc2f59ef1 100644
--- a/jams-react-client/src/views/Groups/Groups.js
+++ b/jams-react-client/src/views/Groups/Groups.js
@@ -513,6 +513,7 @@ export default function Groups() {
onClick={() => {
handleRemoveGroup(group);
}}
+ size="large"
>
<DeleteOutlineIcon />
</IconButton>
diff --git a/jams-react-client/src/views/Settings/General.js b/jams-react-client/src/views/Settings/General.js
index f7e8c528a4819639f9b7173c5d33b92debcd1ea8..04ebe33adfb4433435b08c07179db532dd4db7c2 100644
--- a/jams-react-client/src/views/Settings/General.js
+++ b/jams-react-client/src/views/Settings/General.js
@@ -180,6 +180,7 @@ export default function General(props) {
aria-label="toggle password visibility"
onMouseDown={handleMouseDownPassword}
onMouseUp={handleMouseUpPassword}
+ size="large"
>
{passwordVisible ? (
<VisibilityIcon />
@@ -217,6 +218,7 @@ export default function General(props) {
aria-label="toggle password visibility"
onMouseDown={handleMouseDownPassword}
onMouseUp={handleMouseUpPassword}
+ size="large"
>
{passwordVisible ? (
<VisibilityIcon />
diff --git a/jams-react-client/src/views/UserProfile/DisplayUserProfile.js b/jams-react-client/src/views/UserProfile/DisplayUserProfile.js
index 62c1796ba2b24e13799a935e8d5ed9a8b74a6cb5..7863a4c6e83e689d46c4977509437f1b297fa7b1 100644
--- a/jams-react-client/src/views/UserProfile/DisplayUserProfile.js
+++ b/jams-react-client/src/views/UserProfile/DisplayUserProfile.js
@@ -128,7 +128,7 @@ const styles = (theme) => ({
maxWidth: "80vh",
},
profileFooter: {
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
display: "flex",
flexDirection: "column",
},
@@ -140,7 +140,7 @@ const styles = (theme) => ({
"& button": {
marginRight: "1rem",
},
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
flexDirection: "column",
alignItems: "stretch",
"& button": {
@@ -153,7 +153,7 @@ const styles = (theme) => ({
display: "flex",
justifyContent: "flex-end",
alignItems: "end",
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
flexDirection: "column",
justifyContent: "center",
alignItems: "stretch",
@@ -166,7 +166,7 @@ const styles = (theme) => ({
userProfileHeader: {
display: "flex",
justifyContent: "space-between",
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
display: "flex",
flexDirection: "column",
textAlign: "center",
@@ -181,7 +181,7 @@ const styles = (theme) => ({
},
},
cardAvatarMobile: {
- [theme.breakpoints.down("md")]: {
+ [theme.breakpoints.down("lg")]: {
textAlign: "center",
},
},
diff --git a/jams-react-client/src/views/UserProfile/EditCreateUserProfile.js b/jams-react-client/src/views/UserProfile/EditCreateUserProfile.js
index 7c4d86c690efe6ebc8946efbb78aef75396e4f6a..389179238e6f33282bdc9e97091d2e06a95e280d 100644
--- a/jams-react-client/src/views/UserProfile/EditCreateUserProfile.js
+++ b/jams-react-client/src/views/UserProfile/EditCreateUserProfile.js
@@ -136,7 +136,7 @@ const styles = (theme) => ({
},
alignRight: {
float: "right",
- [theme.breakpoints.down("xs")]: {
+ [theme.breakpoints.down("sm")]: {
display: "flex",
flexDirection: "column",
"& button": {
@@ -176,7 +176,7 @@ const styles = (theme) => ({
alignItems: "center",
},
sliderLabel: {
- [theme.breakpoints.down("xs")]: {
+ [theme.breakpoints.down("sm")]: {
minWidth: 65,
},
},
@@ -191,14 +191,14 @@ const styles = (theme) => ({
},
},
profileEditHeaderMobile: {
- [theme.breakpoints.down("xs")]: {
+ [theme.breakpoints.down("sm")]: {
display: "flex",
flexDirection: "column",
alignItems: "center",
},
},
profileEditAvatarMobile: {
- [theme.breakpoints.down("xs")]: {
+ [theme.breakpoints.down("sm")]: {
display: "flex",
flexDirection: "column",
alignItems: "center",
@@ -206,7 +206,7 @@ const styles = (theme) => ({
},
},
profileEditAvatarInputMobile: {
- [theme.breakpoints.down("xs")]: {
+ [theme.breakpoints.down("sm")]: {
display: "flex",
flexDirection: "row",
justifyContent: "center",
@@ -665,6 +665,7 @@ export default function EditCreateUserProfile(props) {
id="change-profile-picture"
aria-label="upload picture"
component="span"
+ size="large"
>
<PhotoCamera />
</IconButton>{" "}
@@ -725,6 +726,7 @@ export default function EditCreateUserProfile(props) {
aria-label="toggle password visibility"
onMouseDown={handleMouseDownPassword}
onMouseUp={handleMouseUpPassword}
+ size="large"
>
{passwordVisible ? (
<VisibilityIcon />
@@ -764,6 +766,7 @@ export default function EditCreateUserProfile(props) {
aria-label="toggle password visibility"
onMouseDown={handleMouseDownPassword}
onMouseUp={handleMouseUpPassword}
+ size="large"
>
{passwordVisible ? (
<VisibilityIcon />