UI structure (basic cards + css modules setup)

This commit is contained in:
Cássio Zen
2016-06-28 15:28:42 -03:00
parent 5f0ec91015
commit c6babdecff
9 changed files with 84 additions and 0 deletions

View File

@ -0,0 +1,23 @@
.card {
composes: base from "../theme.css";
composes: container from "../theme.css";
composes: rounded from "../theme.css";
composes: depth from "../theme.css";
overflow: hidden;
}
.card > *:not(iframe, video, img, header, footer) {
margin: 0 10px;
}
.card > *:not(iframe, video, img, header, footer):first-child {
margin-top: 10px;
}
.card > *:not(iframe, video, img, header, footer):last-child {
margin-bottom: 10px;
}
.card > iframe, .card > video, .card > img {
max-width: 100%;
}

View File

@ -0,0 +1,7 @@
import React from 'react';
import styles from './Card.css'
export default function Card({style, children}) {
return <div className={styles.card} style={style}>{children}</div>
}