create-bootstrap-react-app
Version:
Create React apps with Bootstrap
43 lines (41 loc) • 1.74 kB
JSX
import React, { Component } from 'react';
import { BDiv, BH4, BP, List } from 'bootstrap-4-react';
export default class Sidebar extends Component {
render() {
return (
<React.Fragment>
<BDiv p="3" mb="3" bg="light" rounded>
<BH4 font="italic">About</BH4>
<BP mb="0">
Etiam porta <em>sem malesuada magna</em> mollis euismod. Cras mattis consectetur purus sit amet fermentum. Aenean lacinia bibendum nulla sed consectetur.
</BP>
</BDiv>
<BDiv p="3">
<BH4 font="italic">Archives</BH4>
<List unstyled mb="0">
<List.Item><a href="#">March 2014</a></List.Item>
<List.Item><a href="#">Feburary 2014</a></List.Item>
<List.Item><a href="#">Janurary 2014</a></List.Item>
<List.Item><a href="#">December 2013</a></List.Item>
<List.Item><a href="#">November 2013</a></List.Item>
<List.Item><a href="#">October 2013</a></List.Item>
<List.Item><a href="#">September 2013</a></List.Item>
<List.Item><a href="#">August 2013</a></List.Item>
<List.Item><a href="#">July 2013</a></List.Item>
<List.Item><a href="#">June 2013</a></List.Item>
<List.Item><a href="#">May 2013</a></List.Item>
<List.Item><a href="#">April 2013</a></List.Item>
</List>
</BDiv>
<BDiv p="3">
<BH4 font="italic">Elsewhere</BH4>
<List.Item><a href="#">GitHub</a></List.Item>
<List.Item><a href="#">Twitter</a></List.Item>
<List.Item><a href="#">Facebook</a></List.Item>
<List unstyled>
</List>
</BDiv>
</React.Fragment>
)
}
}