Docker/flame
Docker/flame
1
0
Fork 0
mirror of https://github.com/pawelmalak/flame.git synced 2025-08-03 18:05:18 +02:00
Code Issues Releases Wiki Activity

Apps grid

Browse source
This commit is contained in:
unknown 2021-05-09 18:36:55 +02:00
parent 7199e296b8
commit 0502a653ac
12 changed files with 171 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

34
client/src/components/Apps/AppCard/AppCard.module.css Normal file
View file

@ -0,0 +1,34 @@
.AppCard {
width: 100%;
/* height: 50px; */
/* max-width: 150px; */
/* border: 1px solid red; */
display: flex;
align-items: center;
margin-bottom: 20px;
}
.AppCardIcon {
width: 40px;
}
.AppCardDetails {
text-transform: uppercase;
/* display: flex;
flex-direction: column;
justify-content: center; */
}
.AppCardDetails h5 {
font-size: 1em;
font-weight: 500;
color: var(--color-primary);
margin-bottom: -8px;
}
.AppCardDetails a {
color: var(--color-accent);
font-weight: 400;
font-size: 0.8em;
opacity: 1;
}

18
client/src/components/Apps/AppCard/AppCard.tsx Normal file
View file

@ -0,0 +1,18 @@
import classes from './AppCard.module.css';
import Icon from '../../UI/Icon/Icon';
const AppCard = (): JSX.Element => {
return (
<div className={classes.AppCard}>
<div className={classes.AppCardIcon}>
<Icon icon='mdiBookOpenBlankVariant' />
</div>
<div className={classes.AppCardDetails}>
<h5>plex</h5>
<a href="/">plex.example.com</a>
</div>
</div>
)
}
export default AppCard;