Docker/flame
Docker/flame
1
0
Fork 0
mirror of https://github.com/pawelmalak/flame.git synced 2025-07-24 21:39:36 +02:00
Code Issues Releases Wiki Activity

Added support for custom SVG icons

Browse source
This commit is contained in:
unknown 2021-08-06 15:15:54 +02:00
parent a01661d0d5
commit 1699146f79
14 changed files with 356 additions and 270 deletions
Download patch file Download diff file Expand all files Collapse all files

42
client/src/components/Apps/AppCard/AppCard.tsx
View file

@ -13,6 +13,31 @@ interface ComponentProps {
const AppCard = (props: ComponentProps): JSX.Element => {
const [displayUrl, redirectUrl] = urlParser(props.app.url);
let iconEl: JSX.Element;
const { icon } = props.app;
if (/.(jpeg|jpg|png)$/i.test(icon)) {
iconEl = (
<img
src={`/uploads/${icon}`}
alt={`${props.app.name} icon`}
className={classes.CustomIcon}
/>
);
} else if (/.(svg)$/i.test(icon)) {
iconEl = (
<div className={classes.CustomIcon}>
<svg
data-src={`/uploads/${icon}`}
fill='var(--color-primary)'
className={classes.CustomIcon}
></svg>
</div>
);
} else {
iconEl = <Icon icon={iconParser(icon)} />;
}
return (
<a
href={redirectUrl}
@ -20,22 +45,13 @@ const AppCard = (props: ComponentProps): JSX.Element => {
rel='noreferrer'
className={classes.AppCard}
>
<div className={classes.AppCardIcon}>
{(/.(jpeg|jpg|png)$/i).test(props.app.icon)
? <img
src={`/uploads/${props.app.icon}`}
alt={`${props.app.name} icon`}
className={classes.CustomIcon}
/>
: <Icon icon={iconParser(props.app.icon)} />
}
</div>
<div className={classes.AppCardIcon}>{iconEl}</div>
<div className={classes.AppCardDetails}>
<h5>{props.app.name}</h5>
<span>{displayUrl}</span>
</div>
</a>
)
}
);
};
export default AppCard;
export default AppCard;