From 433163d33513389c1550f7e0b2bbd74b0bf6c0a1 Mon Sep 17 00:00:00 2001
From: Sina Rohde <s.rohde@indiscale.com>
Date: Mon, 23 Sep 2024 12:51:39 +0200
Subject: [PATCH] styled cells
---
package-lock.json | 8 ++++----
package.json | 2 +-
pages/fdo/show/[prefix]/sandbox.tsx | 11 +++++------
src/components/fdos/details.tsx | 18 +++++++++---------
4 files changed, 19 insertions(+), 20 deletions(-)
diff --git a/package-lock.json b/package-lock.json
index d60ef17..75ba102 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,7 +11,7 @@
"@auth/unstorage-adapter": "^1.6.0",
"@emotion/react": "^11.11.4",
"@emotion/styled": "^11.11.5",
- "@fontsource/roboto": "^5.0.14",
+ "@fontsource/roboto": "^5.1.0",
"@mui/icons-material": "^5.15.19",
"@mui/lab": "^5.0.0-alpha.85",
"@mui/material": "^5.15.19",
@@ -1099,9 +1099,9 @@
"integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q=="
},
"node_modules/@fontsource/roboto": {
- "version": "5.0.14",
- "resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-5.0.14.tgz",
- "integrity": "sha512-zHAxlTTm9RuRn9/StwclFJChf3z9+fBrOxC3fw71htjHP1BgXNISwRjdJtAKAmMe5S2BzgpnjkQR93P9EZYI/Q=="
+ "version": "5.1.0",
+ "resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-5.1.0.tgz",
+ "integrity": "sha512-cFRRC1s6RqPygeZ8Uw/acwVHqih8Czjt6Q0MwoUoDe9U3m4dH1HmNDRBZyqlMSFwgNAUKgFImncKdmDHyKpwdg=="
},
"node_modules/@humanwhocodes/config-array": {
"version": "0.11.14",
diff --git a/package.json b/package.json
index 1eecb80..edeb12c 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
"@auth/unstorage-adapter": "^1.6.0",
"@emotion/react": "^11.11.4",
"@emotion/styled": "^11.11.5",
- "@fontsource/roboto": "^5.0.14",
+ "@fontsource/roboto": "^5.1.0",
"@mui/icons-material": "^5.15.19",
"@mui/lab": "^5.0.0-alpha.85",
"@mui/material": "^5.15.19",
diff --git a/pages/fdo/show/[prefix]/sandbox.tsx b/pages/fdo/show/[prefix]/sandbox.tsx
index 292f2c1..67cc663 100644
--- a/pages/fdo/show/[prefix]/sandbox.tsx
+++ b/pages/fdo/show/[prefix]/sandbox.tsx
@@ -8,7 +8,7 @@ import { Typography } from '@mui/material'
import CircularProgress from '@mui/material/CircularProgress'
import AssignmentIcon from '@mui/icons-material/Assignment'
import Avatar from '@mui/material/Avatar'
-import { blue, green } from '@mui/material/colors'
+import { blue } from '@mui/material/colors'
import Box from '@mui/material/Box'
import Stack from '@mui/material/Stack'
import Chip from '@mui/material/Chip'
@@ -45,7 +45,7 @@ const ShowFDO = () => {
if (isError) {
return <ErrorComponent message={t('fdo.show.handle_not_found', 'Handle not found.')} />
}
-
+ const displayName = 'FDO-Name'
const handleUrl = resolvePid(showId)
const dataPid = data?.data?.dataPid
const metadataPid = data?.data?.metadataPid
@@ -153,16 +153,15 @@ const ShowFDO = () => {
</MenuList>
</Item>
- <Item sx={{ width: '60%' }}>
+ <Item sx={{ width: '60%' }} >
<Stack direction="row" spacing={3}>
<Avatar sx={{ bgcolor: blue[500] }} variant="rounded">
<AssignmentIcon />
</Avatar>
- <h2>displayName</h2>
+ <Typography variant="h6" gutterBottom> {displayName} </Typography>
</Stack><br/>
<Details/>
- </Item>
-
+ </Item>
</Stack>
</div><br/><br/>
diff --git a/src/components/fdos/details.tsx b/src/components/fdos/details.tsx
index 3663515..d3e49e0 100644
--- a/src/components/fdos/details.tsx
+++ b/src/components/fdos/details.tsx
@@ -7,6 +7,7 @@ import TableContainer from '@mui/material/TableContainer'
import TableHead from '@mui/material/TableHead'
import TableRow from '@mui/material/TableRow'
import Paper from '@mui/material/Paper'
+import Typography from '@mui/material/Typography'
const StyledTableCell = styled(TableCell)(({ theme }) => ({
[`&.${tableCellClasses.head}`]: {
@@ -22,11 +23,10 @@ const StyledTableCell = styled(TableCell)(({ theme }) => ({
const StyledTableRow = styled(TableRow)(({ theme }) => ({
'&:nth-of-type(odd)': {
- backgroundColor: theme.palette.action.hover
- },
+ backgroundColor: theme.palette.action.hover },
// hide last border
'&:last-child td, &:last-child th': {
- border: 0
+ border: 0
}
}))
@@ -42,7 +42,7 @@ function createData (
}
const rows = [
- createData('Desription:', info, 'xx'),
+ createData('Desription:', info, ''),
createData('Type:', 'CETTS', 'xx'),
createData('Repository:', 'LinkAhead', 'xx'),
createData('Dataspace:', 'RWTH', 'xx'),
@@ -53,7 +53,7 @@ const rows = [
export default function CustomizedTables () {
return (
<TableContainer component={Paper}>
- <Table aria-label="FDP Details">
+ <Table aria-label="simple table">
<TableHead>
{/* <TableRow>
<StyledTableCell>Info1 </StyledTableCell>
@@ -61,14 +61,14 @@ export default function CustomizedTables () {
<StyledTableCell align="right">Info3</StyledTableCell>
</TableRow> */}
</TableHead>
- <TableBody>
+ <TableBody >
{rows.map((row) => (
<StyledTableRow key={row.category}>
- <StyledTableCell component="th" scope="row">
- {row.category}
+ <StyledTableCell component="th" scope="row" sx={{ border: 0 }}>
+ <Typography variant="h6" gutterBottom> {row.category}</Typography>
</StyledTableCell>
<StyledTableCell align="left">{row.classification}</StyledTableCell>
- <StyledTableCell align="left">{row.logo}</StyledTableCell>
+ <StyledTableCell align="left" sx={{ border: 0 }}>{row.logo}</StyledTableCell>
</StyledTableRow>
))}
</TableBody>
--
GitLab