From ee1827eab06e63edd0764879397a8cdcf966f6c1 Mon Sep 17 00:00:00 2001
From: Scott Tolksdorf <scott.tolksdorf@gmail.com>
Date: Tue, 21 Mar 2017 00:09:37 -0400
Subject: [PATCH 1/2] Trying to get it working

---
 client/homebrew/navbar/issue.navitem.jsx  |  7 ++++++-
 client/homebrew/pages/newPage/newPage.jsx |  2 +-
 shared/naturalcrit/nav/nav.jsx            | 11 ++++++-----
 shared/naturalcrit/nav/nav.less           | 20 ++++++++++++++++++++
 4 files changed, 33 insertions(+), 7 deletions(-)

diff --git a/client/homebrew/navbar/issue.navitem.jsx b/client/homebrew/navbar/issue.navitem.jsx
index 3631ce71f..60adf4ed7 100644
--- a/client/homebrew/navbar/issue.navitem.jsx
+++ b/client/homebrew/navbar/issue.navitem.jsx
@@ -2,7 +2,12 @@ var React = require('react');
 var Nav = require('naturalcrit/nav/nav.jsx');
 
 module.exports = function(props){
-	return <Nav.item newTab={true} href='https://github.com/stolksdorf/homebrewery/issues' color='red' icon='fa-bug'>
+	return <Nav.item
+		{...props}
+		newTab={true}
+		href='https://github.com/stolksdorf/homebrewery/issues'
+		color='red'
+		icon='fa-bug'>
 		report issue
 	</Nav.item>
 };
\ No newline at end of file
diff --git a/client/homebrew/pages/newPage/newPage.jsx b/client/homebrew/pages/newPage/newPage.jsx
index 9d7c028e0..2560c8bc0 100644
--- a/client/homebrew/pages/newPage/newPage.jsx
+++ b/client/homebrew/pages/newPage/newPage.jsx
@@ -47,7 +47,7 @@ const NewPage = React.createClass({
 					<Nav.item color='purple' icon='fa-file-pdf-o' onClick={Actions.localPrint}>
 						get PDF
 					</Nav.item>
-					<Items.Issue />
+					<Items.Issue collaspe={true} />
 					<Items.Account />
 				</Nav.section>
 			</Navbar>
diff --git a/shared/naturalcrit/nav/nav.jsx b/shared/naturalcrit/nav/nav.jsx
index 6439548b3..0f7ce49ed 100644
--- a/shared/naturalcrit/nav/nav.jsx
+++ b/shared/naturalcrit/nav/nav.jsx
@@ -38,28 +38,29 @@ var Nav = {
 				href : null,
 				newTab : false,
 				onClick : function(){},
-				color : null
+				color : null,
+				collaspe : false
 			};
 		},
 		handleClick : function(){
 			this.props.onClick();
 		},
 		render : function(){
-			var classes = cx('navItem', this.props.color, this.props.className);
+			var classes = cx('navItem', this.props.color, this.props.className, {collaspe : this.props.collaspe});
 
 			var icon;
 			if(this.props.icon) icon = <i className={'fa ' + this.props.icon} />;
 
-			const props = _.omit(this.props, ['newTab']);
+			const props = _.omit(this.props, ['newTab', 'collaspe']);
 
 			if(this.props.href){
 				return <a {...props} className={classes} target={this.props.newTab ? '_blank' : '_self'} >
-					{this.props.children}
+					<span>{this.props.children}</span>
 					{icon}
 				</a>
 			}else{
 				return <div {...props} className={classes} onClick={this.handleClick} >
-					{this.props.children}
+					<span>{this.props.children}</span>
 					{icon}
 				</div>
 			}
diff --git a/shared/naturalcrit/nav/nav.less b/shared/naturalcrit/nav/nav.less
index 94ce5ca7c..de26c0149 100644
--- a/shared/naturalcrit/nav/nav.less
+++ b/shared/naturalcrit/nav/nav.less
@@ -49,10 +49,30 @@ nav{
 		color            : white;
 		text-decoration  : none;
 		text-transform   : uppercase;
+		display: inline-block;
 		i{
 			margin-left : 5px;
 			font-size   : 13px;
 		}
+		&.collaspe{
+			//width : 60px;
+			overflow: hidden;
+			background-color: red;
+			span{
+				white-space: nowrap;
+				width : 0%;
+				display: inline-block;
+				overflow: hidden;
+				visibility: hidden;
+			}
+			&:hover{
+				span{
+					visibility: visible;
+					width : auto;
+				}
+			}
+		}
+
 		&.tealLight:hover{ background-color : @tealLight };
 		&.teal:hover{ background-color : @teal };
 		&.greenLight:hover{ background-color : @greenLight };

From 1946a50ce0a78bf8b35ea80831e5a94bebdaae1b Mon Sep 17 00:00:00 2001
From: Scott Tolksdorf <scott.tolksdorf@gmail.com>
Date: Tue, 21 Mar 2017 00:15:24 -0400
Subject: [PATCH 2/2] Converted a few nav items over

---
 client/homebrew/navbar/patreon.navitem.jsx  |  1 +
 client/homebrew/pages/homePage/homePage.jsx |  8 +++---
 shared/naturalcrit/nav/nav.less             | 28 ++++++++++++---------
 3 files changed, 21 insertions(+), 16 deletions(-)

diff --git a/client/homebrew/navbar/patreon.navitem.jsx b/client/homebrew/navbar/patreon.navitem.jsx
index a7a53d34e..36a51d12a 100644
--- a/client/homebrew/navbar/patreon.navitem.jsx
+++ b/client/homebrew/navbar/patreon.navitem.jsx
@@ -3,6 +3,7 @@ var Nav = require('naturalcrit/nav/nav.jsx');
 
 module.exports = function(props){
 	return <Nav.item
+		{...props}
 		className='patreon'
 		newTab={true}
 		href='https://www.patreon.com/stolksdorf'
diff --git a/client/homebrew/pages/homePage/homePage.jsx b/client/homebrew/pages/homePage/homePage.jsx
index 9f4dac30c..08039f46d 100644
--- a/client/homebrew/pages/homePage/homePage.jsx
+++ b/client/homebrew/pages/homePage/homePage.jsx
@@ -24,10 +24,10 @@ const HomePage = React.createClass({
 	renderNavbar : function(){
 		return <Navbar>
 			<Nav.section>
-				<PatreonNavItem />
-				<IssueNavItem />
-				<Nav.item newTab={true} href='/changelog' color='purple' icon='fa-file-text-o'>
-					Changelog
+				<PatreonNavItem collaspe={true} />
+				<IssueNavItem collaspe={true} />
+				<Nav.item newTab={true} href='/changelog' color='purple' icon='fa-star' collaspe={true}>
+					What's new
 				</Nav.item>
 				<RecentNavItem.both />
 				<AccountNavItem />
diff --git a/shared/naturalcrit/nav/nav.less b/shared/naturalcrit/nav/nav.less
index de26c0149..72d3027ad 100644
--- a/shared/naturalcrit/nav/nav.less
+++ b/shared/naturalcrit/nav/nav.less
@@ -1,3 +1,4 @@
+
 nav{
 	background-color : #333;
 	.navContent{
@@ -41,6 +42,7 @@ nav{
 	}
 	.navItem{
 		.animate(background-color);
+		display          : inline-block;
 		padding          : 8px 12px;
 		cursor           : pointer;
 		background-color : #333;
@@ -49,30 +51,32 @@ nav{
 		color            : white;
 		text-decoration  : none;
 		text-transform   : uppercase;
-		display: inline-block;
 		i{
 			margin-left : 5px;
 			font-size   : 13px;
 		}
 		&.collaspe{
-			//width : 60px;
-			overflow: hidden;
-			background-color: red;
+			overflow : hidden;
+			i{
+				margin-left : 0px;
+			}
 			span{
-				white-space: nowrap;
-				width : 0%;
-				display: inline-block;
-				overflow: hidden;
-				visibility: hidden;
+				display     : inline-block;
+				visibility  : hidden;
+				overflow    : hidden;
+				width       : 0px;
+				white-space : nowrap;
 			}
 			&:hover{
 				span{
-					visibility: visible;
-					width : auto;
+					visibility : visible;
+					width      : auto;
+				}
+				i{
+					margin-left : 5px;
 				}
 			}
 		}
-
 		&.tealLight:hover{ background-color : @tealLight };
 		&.teal:hover{ background-color : @teal };
 		&.greenLight:hover{ background-color : @greenLight };