archive/theorangeone.net-legacy
Archived
1
Fork 0
Code Releases Packages Activity

Added glyphicon support for icons

Browse source
This commit is contained in:
Jake Howard 2016-01-29 22:56:59 +00:00
parent d87e5b0bd1
commit 63d96d0a2e
3 changed files with 11 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
static/src/js/components/navbar/item.js
View file

@ -28,9 +28,15 @@ export default class Item extends React.Component {
render() { render() {
let icon; let icon;
if (this.props.icon) { if (this.props.icon) {
if (this.props.icon.startsWith('ion')) {
icon = ( icon = (
<i className={'icon ' + this.props.icon}></i> <i className={'icon ' + this.props.icon} />
); );
} else if (this.props.icon.startsWith('glyphicon')) {
icon = (
<span className={'glyphicon ' + this.props.icon} aria-hidden="true" />
);
}
} }
return ( return (
<li><a href={this.state.url}>{icon}{this.props.children}</a></li> <li><a href={this.state.url}>{icon}{this.props.children}</a></li>

2
static/src/js/components/navbar/navbar.js
View file

@ -35,7 +35,7 @@ export default class NavBar extends React.Component {
<Dropdown title="College"> <Dropdown title="College">
<Item ident="robotics:index">Student Robotics</Item> <Item ident="robotics:index">Student Robotics</Item>
<Item href="#" icon="ion-cube">Attack on Blocks Game</Item> <Item href="#" icon="ion-cube">Attack on Blocks Game</Item>
<Item href="#">Student Server</Item> <Item href="#" icon="glyphicon-hdd">Student Server</Item>
<Item href="#" icon="ion-ios-paper">EPQ</Item> <Item href="#" icon="ion-ios-paper">EPQ</Item>
<Item href="#">Wall of Sheep</Item> <Item href="#">Wall of Sheep</Item>
</Dropdown> </Dropdown>

2
static/src/less/navbar.less
View file

@ -78,7 +78,7 @@
} }
margin: 0; margin: 0;
z-index: 10000; z-index: 10000;
i + * { i + *, .glyphicon + * {
margin-left: 5px; margin-left: 5px;
} }
& .container-fluid{ & .container-fluid{