replace grid
This commit is contained in:
parent
3dbcf56546
commit
62fd2cb1d3
@ -2,7 +2,7 @@ import React, { } from 'react';
|
|||||||
import { Link as RouterLink } from 'react-router-dom';
|
import { Link as RouterLink } from 'react-router-dom';
|
||||||
import { Document } from '../accessor/document';
|
import { Document } from '../accessor/document';
|
||||||
|
|
||||||
import { Link, Paper, Theme, Box, useTheme, Typography } from '@mui/material';
|
import { Link, Paper, Theme, Box, useTheme, Typography, Grid } from '@mui/material';
|
||||||
import { ThumbnailContainer } from '../page/reader/reader';
|
import { ThumbnailContainer } from '../page/reader/reader';
|
||||||
import { TagChip } from '../component/tagchip';
|
import { TagChip } from '../component/tagchip';
|
||||||
|
|
||||||
@ -117,7 +117,7 @@ export const ContentInfo = (props: {
|
|||||||
{props.short ? (<Box /*className={propclasses.tag_list ?? classes.tag_list}*/>{document.tags.map(x =>
|
{props.short ? (<Box /*className={propclasses.tag_list ?? classes.tag_list}*/>{document.tags.map(x =>
|
||||||
(<TagChip key={x} label={x} clickable tagname={x} size="small"></TagChip>)
|
(<TagChip key={x} label={x} clickable tagname={x} size="small"></TagChip>)
|
||||||
)}</Box>) : (
|
)}</Box>) : (
|
||||||
<ComicDetailTag tags={document.tags}/* classes={({tag_list:classes.tag_list})}*/ ></ComicDetailTag>)
|
<ComicDetailTag tags={document.tags} path={document.basepath+"/"+document.filename}/* classes={({tag_list:classes.tag_list})}*/ ></ComicDetailTag>)
|
||||||
}
|
}
|
||||||
</Box>
|
</Box>
|
||||||
</Box>
|
</Box>
|
||||||
@ -125,9 +125,11 @@ export const ContentInfo = (props: {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function ComicDetailTag(prop: {
|
function ComicDetailTag(prop: {
|
||||||
tags: string[]/*classes:{
|
tags: string[];/*classes:{
|
||||||
tag_list:string
|
tag_list:string
|
||||||
}*/}) {
|
}*/
|
||||||
|
path?: string;
|
||||||
|
}) {
|
||||||
let allTag = prop.tags;
|
let allTag = prop.tags;
|
||||||
const tagKind = ["artist", "group", "series", "type", "character"];
|
const tagKind = ["artist", "group", "series", "type", "character"];
|
||||||
let tagTable: { [kind: string]: string[] } = {};
|
let tagTable: { [kind: string]: string[] } = {};
|
||||||
@ -136,16 +138,28 @@ function ComicDetailTag(prop: {
|
|||||||
tagTable[kind] = tags;
|
tagTable[kind] = tags;
|
||||||
allTag = allTag.filter(x => !x.startsWith(kind + ":"));
|
allTag = allTag.filter(x => !x.startsWith(kind + ":"));
|
||||||
}
|
}
|
||||||
return (<React.Fragment>
|
return (<Grid container>
|
||||||
{tagKind.map(key => (
|
{tagKind.map(key => (
|
||||||
<React.Fragment key={key}>
|
<React.Fragment key={key}>
|
||||||
|
<Grid item xs={3}>
|
||||||
<Typography variant='subtitle1'>{key}</Typography>
|
<Typography variant='subtitle1'>{key}</Typography>
|
||||||
|
</Grid>
|
||||||
|
<Grid item xs={9}>
|
||||||
<Box>{tagTable[key].length !== 0 ? tagTable[key].join(", ") : "N/A"}</Box>
|
<Box>{tagTable[key].length !== 0 ? tagTable[key].join(", ") : "N/A"}</Box>
|
||||||
|
</Grid>
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
))}
|
))}
|
||||||
<Typography variant='subtitle1'>Tags</Typography>
|
{ prop.path != undefined && <><Grid item xs={3}>
|
||||||
<Box /*lassName={prop.classes.tag_list}*/>
|
<Typography variant='subtitle1'>Path</Typography>
|
||||||
{allTag.map(x => (<TagChip key={x} label={x} clickable tagname={x} size="small"></TagChip>))}
|
</Grid><Grid item xs={9}>
|
||||||
</Box>
|
<Box>{prop.path}</Box>
|
||||||
</React.Fragment>);
|
</Grid></>
|
||||||
|
}
|
||||||
|
<Grid item xs={3}>
|
||||||
|
<Typography variant='subtitle1'>Tags</Typography>
|
||||||
|
</Grid>
|
||||||
|
<Grid item xs={9}>
|
||||||
|
{allTag.map(x => (<TagChip key={x} label={x} clickable tagname={x} size="small"></TagChip>))}
|
||||||
|
</Grid>
|
||||||
|
</Grid>);
|
||||||
}
|
}
|
Loading…
Reference in New Issue
Block a user