monoid/ionian
1
0
Fork 0
Code Issues 9 Pull Requests Projects Releases Wiki Activity

shortening info tag

Browse Source
This commit is contained in:
monoid 2021-01-15 21:51:36 +09:00
parent dfc154b711
commit 29beb1dc80
2 changed files with 31 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
src/client/component/contentinfo.tsx
View File

@ -43,9 +43,9 @@ const useStyles = makeStyles((theme: Theme) => ({
overflowY: 'hidden',
},
short_subinfoContainer:{
[theme.breakpoints.up("xs")]:{
[theme.breakpoints.down("md")]:{
display:'none',
}
},
},
short_root:{
overflowY:'hidden',
@ -103,8 +103,10 @@ export const ContentInfo = (props: {
<Link className={propclasses.thumbnail_anchor || thumbnail_anchor} component={RouterLink} to={{
pathname:makeContentReaderUrl(document.id)
}}>
<ThumbnailContainer content={document}
className={propclasses.thumbnail_content || thumbnail_content}/>
{document.deleted_at === null ?
(<ThumbnailContainer content={document}
className={propclasses.thumbnail_content || thumbnail_content}/>)
: (<Typography className={propclasses.thumbnail_content || thumbnail_content} variant='h4'>Deleted</Typography>)}
</Link>
<Box className={propclasses.infoContainer || classes.infoContainer}>
<Link variant='h5' color='inherit' component={RouterLink} to={{
@ -114,14 +116,20 @@ export const ContentInfo = (props: {
{document.title}
</Link>
<Box className={propclasses.subinfoContainer || subinfoContainer}>
<Typography variant='subtitle1'>Artist</Typography>
<Box style={{ alignSelf: "center" }}>{artists.join(", ")}</Box>
<Typography variant='subtitle1'>Tags</Typography>
<Box className={propclasses.tag_list || classes.tag_list}>
{allTag.map(x => {
return (<TagChip key={x} label={x} clickable={true} tagname={x} size="small"></TagChip>);
})}
</Box>
{props.short ? (<Box className={propclasses.tag_list || classes.tag_list}>{document.tags.map(x =>
(<TagChip key={x} label={x} clickable={true} tagname={x} size="small"></TagChip>)
)}</Box>) : (
<>
<Typography variant='subtitle1'>Artist</Typography>
<Box style={{ alignSelf: "center" }}>{artists.join(", ")}</Box>
<Typography variant='subtitle1'>Tags</Typography>
<Box className={propclasses.tag_list || classes.tag_list}>
{allTag.map(x => {
return (<TagChip key={x} label={x} clickable={true} tagname={x} size="small"></TagChip>);
})}
</Box>
</>)
}
</Box>
</Box>
</Paper>);

13
src/client/component/tagchip.tsx
View File

@ -59,6 +59,15 @@ export const ColorChip = (props:Omit<ChipProps,"color"> & {color: string})=>{
}
export const TagChip = (props:Omit<ChipProps,"color"> & {tagname: string})=>{
const {tagname,...rest} = props;
return <ColorChip color={getTagColorName(tagname)} {...rest}></ColorChip>;
const {tagname,label,...rest} = props;
let newlabel:string|undefined = undefined;
if(typeof label === "string"){
if(label.startsWith("female:")){
newlabel ="♀ "+label.substr(7);
}
else if(label.startsWith("male:")){
newlabel = "♂ "+label.substr(5);
}
}
return <ColorChip color={getTagColorName(tagname)} label={newlabel||label} {...rest}></ColorChip>;
}