andry/EMS-ESP32
1
0
Fork 0
mirror of https://github.com/emsesp/EMS-ESP32.git synced 2025-12-06 07:49:52 +03:00
Code Issues Packages Projects Releases Wiki Activity

consistent design between dashboard and device tables

Browse Source
This commit is contained in:
proddy
2025-10-25 16:59:20 +02:00
parent accfeab6fa
commit c32ee4dfb5
2 changed files with 68 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
interface/src/app/main/Dashboard.tsx
View File

@@ -206,7 +206,7 @@ const Dashboard = memo(() => {
// if its a device (parent node) and has entities // if its a device (parent node) and has entities
if (di.nodes?.length) { if (di.nodes?.length) {
return ( return (
<span style={{ fontWeight: 'bold', fontSize: '14px' }}> <span style={{ fontSize: '15px' }}>
<DeviceIcon type_id={di.t ?? 0} /> <DeviceIcon type_id={di.t ?? 0} />
&nbsp;&nbsp;{showType(di.n, di.t)} &nbsp;&nbsp;{showType(di.n, di.t)}
<span style={{ color: 'lightblue' }}>&nbsp;({di.nodes?.length})</span> <span style={{ color: 'lightblue' }}>&nbsp;({di.nodes?.length})</span>
@@ -312,7 +312,7 @@ const Dashboard = memo(() => {
flexDirection="column" flexDirection="column"
sx={{ sx={{
borderRadius: 1, borderRadius: 1,
border: '1px solid grey' border: '1px solid rgb(65, 65, 65)'
}} }}
> >
<IconContext.Provider <IconContext.Provider

21
interface/src/app/main/Devices.tsx
View File

@@ -176,6 +176,12 @@ const Devices = memo(() => {
useTheme([ useTheme([
common_theme, common_theme,
{ {
BaseRow: `
font-size: 15px;
.td {
height: 28px;
}
`,
Table: ` Table: `
--data-table-library_grid-template-columns: repeat(1, minmax(0, 1fr)) 130px; --data-table-library_grid-template-columns: repeat(1, minmax(0, 1fr)) 130px;
`, `,
@@ -184,9 +190,12 @@ const Devices = memo(() => {
padding: 8px; padding: 8px;
`, `,
Row: ` Row: `
font-weight: bold; &:nth-of-type(odd) .td {
background-color: #303030;
},
&:hover .td { &:hover .td {
background-color: #177ac9; background-color: #177ac9;
},
` `
} }
]), ]),
@@ -526,6 +535,15 @@ const Devices = memo(() => {
const renderCoreData = () => ( const renderCoreData = () => (
<> <>
<Box
padding={1}
justifyContent="center"
flexDirection="column"
sx={{
borderRadius: 1,
border: '1px solid rgb(65, 65, 65)'
}}
>
<IconContext.Provider <IconContext.Provider
value={{ value={{
color: 'lightblue', color: 'lightblue',
@@ -575,6 +593,7 @@ const Devices = memo(() => {
</Table> </Table>
)} )}
</IconContext.Provider> </IconContext.Provider>
</Box>
</> </>
); );