preact-material-components
Version:
preact wrapper for "Material Components for the web"
63 lines (61 loc) • 2.62 kB
Plain Text
import {h, Component} from 'preact';
import ImageList from '../../../../ImageList';
import 'preact-material-components/ImageList/style.css';
export default class ImageListPage extends Component {
render(){
return (
<div>
<ImageList mdc-image-list--with-text-protection>
<ImageList.Item>
<ImageList.AspectContainer>
<ImageList.Image src='https://material-components-web.appspot.com/images/photos/3x2/1.jpg'/>
<ImageList.Supporting>
<ImageList.Label>Text Label</ImageList.Label>
</ImageList.Supporting>
</ImageList.AspectContainer>
</ImageList.Item>
<ImageList.Item>
<ImageList.AspectContainer>
<ImageList.Image src='https://material-components-web.appspot.com/images/photos/3x2/6.jpg'/>
<ImageList.Supporting>
<ImageList.Label>Text Label</ImageList.Label>
</ImageList.Supporting>
</ImageList.AspectContainer>
</ImageList.Item>
<ImageList.Item>
<ImageList.AspectContainer>
<ImageList.Image src='https://material-components-web.appspot.com/images/photos/3x2/2.jpg'/>
<ImageList.Supporting>
<ImageList.Label>Text Label</ImageList.Label>
</ImageList.Supporting>
</ImageList.AspectContainer>
</ImageList.Item>
<ImageList.Item>
<ImageList.AspectContainer>
<ImageList.Image src='https://material-components-web.appspot.com/images/photos/3x2/3.jpg'/>
<ImageList.Supporting>
<ImageList.Label>Text Label</ImageList.Label>
</ImageList.Supporting>
</ImageList.AspectContainer>
</ImageList.Item>
<ImageList.Item>
<ImageList.AspectContainer>
<ImageList.Image src='https://material-components-web.appspot.com/images/photos/3x2/4.jpg'/>
<ImageList.Supporting>
<ImageList.Label>Text Label</ImageList.Label>
</ImageList.Supporting>
</ImageList.AspectContainer>
</ImageList.Item>
<ImageList.Item>
<ImageList.AspectContainer>
<ImageList.Image src='https://material-components-web.appspot.com/images/photos/3x2/5.jpg'/>
<ImageList.Supporting>
<ImageList.Label>Text Label</ImageList.Label>
</ImageList.Supporting>
</ImageList.AspectContainer>
</ImageList.Item>
</ImageList>
</div>
);
}
}