Merge pull request #434 from proddy/dev

smaller icons in customization table
This commit is contained in:
Proddy
2022-04-01 09:17:12 +02:00
committed by GitHub
3 changed files with 28 additions and 28 deletions

View File

@@ -30,7 +30,7 @@
"react-dom": "^17.0.2", "react-dom": "^17.0.2",
"react-dropzone": "^12.0.4", "react-dropzone": "^12.0.4",
"react-icons": "^4.3.1", "react-icons": "^4.3.1",
"react-router-dom": "^6.2.2", "react-router-dom": "^6.3.0",
"react-scripts": "5.0.0", "react-scripts": "5.0.0",
"sockette": "^2.0.6", "sockette": "^2.0.6",
"typescript": "^4.6.3" "typescript": "^4.6.3"
@@ -14524,9 +14524,9 @@
} }
}, },
"node_modules/react-router": { "node_modules/react-router": {
"version": "6.2.2", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.2.2.tgz", "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.3.0.tgz",
"integrity": "sha512-/MbxyLzd7Q7amp4gDOGaYvXwhEojkJD5BtExkuKmj39VEE0m3l/zipf6h2WIB2jyAO0lI6NGETh4RDcktRm4AQ==", "integrity": "sha512-7Wh1DzVQ+tlFjkeo+ujvjSqSJmkt1+8JO+T5xklPlgrh70y7ogx75ODRW0ThWhY7S+6yEDks8TYrtQe/aoboBQ==",
"dependencies": { "dependencies": {
"history": "^5.2.0" "history": "^5.2.0"
}, },
@@ -14535,12 +14535,12 @@
} }
}, },
"node_modules/react-router-dom": { "node_modules/react-router-dom": {
"version": "6.2.2", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.2.2.tgz", "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.3.0.tgz",
"integrity": "sha512-AtYEsAST7bDD4dLSQHDnk/qxWLJdad5t1HFa1qJyUrCeGgEuCSw0VB/27ARbF9Fi/W5598ujvJOm3ujUCVzuYQ==", "integrity": "sha512-uaJj7LKytRxZNQV8+RbzJWnJ8K2nPsOOEuX7aQstlMZKQT0164C+X2w6bnkqU3sjtLvpd5ojrezAyfZ1+0sStw==",
"dependencies": { "dependencies": {
"history": "^5.2.0", "history": "^5.2.0",
"react-router": "6.2.2" "react-router": "6.3.0"
}, },
"peerDependencies": { "peerDependencies": {
"react": ">=16.8", "react": ">=16.8",
@@ -27978,20 +27978,20 @@
"integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==" "integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A=="
}, },
"react-router": { "react-router": {
"version": "6.2.2", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/react-router/-/react-router-6.2.2.tgz", "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.3.0.tgz",
"integrity": "sha512-/MbxyLzd7Q7amp4gDOGaYvXwhEojkJD5BtExkuKmj39VEE0m3l/zipf6h2WIB2jyAO0lI6NGETh4RDcktRm4AQ==", "integrity": "sha512-7Wh1DzVQ+tlFjkeo+ujvjSqSJmkt1+8JO+T5xklPlgrh70y7ogx75ODRW0ThWhY7S+6yEDks8TYrtQe/aoboBQ==",
"requires": { "requires": {
"history": "^5.2.0" "history": "^5.2.0"
} }
}, },
"react-router-dom": { "react-router-dom": {
"version": "6.2.2", "version": "6.3.0",
"resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.2.2.tgz", "resolved": "https://registry.npmjs.org/react-router-dom/-/react-router-dom-6.3.0.tgz",
"integrity": "sha512-AtYEsAST7bDD4dLSQHDnk/qxWLJdad5t1HFa1qJyUrCeGgEuCSw0VB/27ARbF9Fi/W5598ujvJOm3ujUCVzuYQ==", "integrity": "sha512-uaJj7LKytRxZNQV8+RbzJWnJ8K2nPsOOEuX7aQstlMZKQT0164C+X2w6bnkqU3sjtLvpd5ojrezAyfZ1+0sStw==",
"requires": { "requires": {
"history": "^5.2.0", "history": "^5.2.0",
"react-router": "6.2.2" "react-router": "6.3.0"
} }
}, },
"react-scripts": { "react-scripts": {

View File

@@ -26,7 +26,7 @@
"react-app-rewired": "^2.2.1", "react-app-rewired": "^2.2.1",
"react-dropzone": "^12.0.4", "react-dropzone": "^12.0.4",
"react-icons": "^4.3.1", "react-icons": "^4.3.1",
"react-router-dom": "^6.2.2", "react-router-dom": "^6.3.0",
"react-scripts": "5.0.0", "react-scripts": "5.0.0",
"sockette": "^2.0.6", "sockette": "^2.0.6",
"typescript": "^4.6.3" "typescript": "^4.6.3"

View File

@@ -41,12 +41,12 @@ import { DeviceShort, Devices, DeviceEntity } from './types';
const StyledTableCell = styled(TableCell)(({ theme }) => ({ const StyledTableCell = styled(TableCell)(({ theme }) => ({
[`&.${tableCellClasses.head}`]: { [`&.${tableCellClasses.head}`]: {
backgroundColor: '#607d8b', backgroundColor: '#607d8b'
color: theme.palette.common.white, // color: theme.palette.common.white,
fontSize: 11 // fontSize: 12
}, },
[`&.${tableCellClasses.body}`]: { [`&.${tableCellClasses.body}`]: {
fontSize: 12 // fontSize: 12
} }
})); }));
@@ -119,19 +119,19 @@ const SettingsCustomization: FC = () => {
<Box color="warning.main"> <Box color="warning.main">
<Typography variant="body2">Select a device and customize each of its entities using the options:</Typography> <Typography variant="body2">Select a device and customize each of its entities using the options:</Typography>
<Typography mt={1} ml={2} display="block" variant="body2" sx={{ alignItems: 'center', display: 'flex' }}> <Typography mt={1} ml={2} display="block" variant="body2" sx={{ alignItems: 'center', display: 'flex' }}>
<FavoriteBorderOutlinedIcon color="success" fontSize="small" /> <FavoriteBorderOutlinedIcon color="success" sx={{ fontSize: 13 }} />
&nbsp;mark it as favorite to be listed at the top of the Dashboard &nbsp;mark it as favorite to be listed at the top of the Dashboard
</Typography> </Typography>
<Typography ml={2} display="block" variant="body2" sx={{ alignItems: 'center', display: 'flex' }}> <Typography ml={2} display="block" variant="body2" sx={{ alignItems: 'center', display: 'flex' }}>
<EditOffOutlinedIcon color="action" fontSize="small" /> <EditOffOutlinedIcon color="action" sx={{ fontSize: 13 }} />
&nbsp;make it read-only, only if it has write operation available &nbsp;make it read-only, only if it has write operation available
</Typography> </Typography>
<Typography ml={2} display="block" variant="body2" sx={{ alignItems: 'center', display: 'flex' }}> <Typography ml={2} display="block" variant="body2" sx={{ alignItems: 'center', display: 'flex' }}>
<CommentsDisabledOutlinedIcon color="action" fontSize="small" /> <CommentsDisabledOutlinedIcon color="action" sx={{ fontSize: 13 }} />
&nbsp;excluded it from MQTT and API outputs &nbsp;excluded it from MQTT and API outputs
</Typography> </Typography>
<Typography ml={2} mb={1} display="block" variant="body2" sx={{ alignItems: 'center', display: 'flex' }}> <Typography ml={2} mb={1} display="block" variant="body2" sx={{ alignItems: 'center', display: 'flex' }}>
<VisibilityOffOutlinedIcon color="action" fontSize="small" /> <VisibilityOffOutlinedIcon color="action" sx={{ fontSize: 13 }} />
&nbsp;hide it from the Dashboard &nbsp;hide it from the Dashboard
</Typography> </Typography>
</Box> </Box>
@@ -233,16 +233,16 @@ const SettingsCustomization: FC = () => {
}} }}
> >
<ToggleButton value="8" color="success" disabled={(de.m & 1) !== 0 || de.n === ''}> <ToggleButton value="8" color="success" disabled={(de.m & 1) !== 0 || de.n === ''}>
<FavoriteBorderOutlinedIcon fontSize="small" /> <FavoriteBorderOutlinedIcon sx={{ fontSize: 14 }} />
</ToggleButton> </ToggleButton>
<ToggleButton value="4" disabled={!de.w}> <ToggleButton value="4" disabled={!de.w}>
<EditOffOutlinedIcon fontSize="small" /> <EditOffOutlinedIcon sx={{ fontSize: 14 }} />
</ToggleButton> </ToggleButton>
<ToggleButton value="2"> <ToggleButton value="2">
<CommentsDisabledOutlinedIcon fontSize="small" /> <CommentsDisabledOutlinedIcon sx={{ fontSize: 14 }} />
</ToggleButton> </ToggleButton>
<ToggleButton value="1"> <ToggleButton value="1">
<VisibilityOffOutlinedIcon fontSize="small" /> <VisibilityOffOutlinedIcon sx={{ fontSize: 14 }} />
</ToggleButton> </ToggleButton>
</ToggleButtonGroup> </ToggleButtonGroup>
</StyledTableCell> </StyledTableCell>