mirror of
https://github.com/scratchfoundation/scratch-www.git
synced 2024-11-23 15:47:53 -05:00
Add align
prop to SubNavigation
component
This commit is contained in:
parent
00c7dc9257
commit
025958fc24
2 changed files with 27 additions and 2 deletions
|
@ -9,10 +9,21 @@ require('./subnavigation.scss');
|
||||||
*/
|
*/
|
||||||
var SubNavigation = React.createClass({
|
var SubNavigation = React.createClass({
|
||||||
type: 'SubNavigation',
|
type: 'SubNavigation',
|
||||||
|
getDefaultProps: function () {
|
||||||
|
return {
|
||||||
|
align: 'middle'
|
||||||
|
};
|
||||||
|
},
|
||||||
render: function () {
|
render: function () {
|
||||||
var classes = classNames(
|
var classes = classNames(
|
||||||
|
[
|
||||||
'sub-nav',
|
'sub-nav',
|
||||||
this.props.className
|
this.props.className
|
||||||
|
],
|
||||||
|
{
|
||||||
|
'sub-nav-align-left': this.props.align === 'left',
|
||||||
|
'sub-nav-align-right': this.props.align === 'right'
|
||||||
|
}
|
||||||
);
|
);
|
||||||
return (
|
return (
|
||||||
<div className={classes}>
|
<div className={classes}>
|
||||||
|
|
|
@ -53,4 +53,18 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
&.sub-nav-align-left {
|
||||||
|
justify-content: flex-start;
|
||||||
|
|
||||||
|
li {
|
||||||
|
&:first-child {
|
||||||
|
margin-left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.sub-nav-align-right {
|
||||||
|
justify-content: flex-end;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue