add profile image and fix exploreMaps bar
This commit is contained in:
parent
b4c75649ba
commit
dc60c3f3ed
8 changed files with 82 additions and 60 deletions
|
@ -16,7 +16,7 @@ Metamaps.Header = {
|
|||
changeSection: function (signedIn, section, userAvatar, userName) {
|
||||
ReactDOM.render(
|
||||
React.createElement(Metamaps.ReactComponents.Header, { signedIn: signedIn, section: section, userAvatar: userAvatar, userName: userName }),
|
||||
document.getElementById('headerMenuItems')
|
||||
document.getElementById('exploreMapsHeader')
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -16,6 +16,9 @@
|
|||
width: 96%;
|
||||
padding: 0 2%;
|
||||
}
|
||||
.homeWrapper.homeText {
|
||||
margin-top: 80px;
|
||||
}
|
||||
.homeTitle {
|
||||
text-align: left;
|
||||
}
|
||||
|
@ -37,7 +40,20 @@
|
|||
}
|
||||
|
||||
#yield {
|
||||
margin-top: 50px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.new_session, .new_user, .edit_user, .login, .forgotPassword {
|
||||
position: relative;
|
||||
top: auto;
|
||||
left: auto;
|
||||
width: 78%;
|
||||
padding: 16px 10%;
|
||||
margin: 50px auto 0 auto;
|
||||
}
|
||||
|
||||
.centerGreyForm input[type="text"], .centerGreyForm input[type="email"], .centerGreyForm input[type="password"] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.wrapper div.mapInfoBox {
|
||||
|
@ -94,4 +110,15 @@
|
|||
|
||||
#mobile_menu li {
|
||||
padding: 10px;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
li.mobileMenuUser {
|
||||
border-bottom: 1px solid #BBB;
|
||||
}
|
||||
|
||||
.mobileMenuUser img {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: 10px;
|
||||
}
|
|
@ -13,8 +13,9 @@
|
|||
<% end %>
|
||||
<% if current_user %>
|
||||
<!-- we should add a page where they can create a new map -->
|
||||
<li>
|
||||
Signed in as: <%= current_user.name %>
|
||||
<li class="mobileMenuUser">
|
||||
<%= image_tag current_user.image.url(:sixtyfour), :size => "32x32" %>
|
||||
<span><%= current_user.name %></span>
|
||||
</li>
|
||||
<li>
|
||||
<%= link_to "My Maps", explore_mine_path %>
|
||||
|
|
|
@ -45,12 +45,7 @@
|
|||
<%= render :partial => 'layouts/lowermapelements' %>
|
||||
|
||||
<div id="exploreMaps"></div>
|
||||
<div id="exploreMapsHeader">
|
||||
<div className="exploreMapsBar exploreElement">
|
||||
<div id="headerMenuItems" className="exploreMapsMenu">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="exploreMapsHeader"></div>
|
||||
<div id="infovis"></div>
|
||||
<%= render :partial => 'layouts/mobilemenu' %>
|
||||
<div id="instructions">
|
||||
|
|
|
@ -33,14 +33,7 @@
|
|||
<% end %>
|
||||
<%= render :partial => 'layouts/lowermapelements' %>
|
||||
|
||||
<div id="exploreMapsHeader">
|
||||
<div className="exploreMapsBar exploreElement">
|
||||
<div className="exploreMapsMenu">
|
||||
<div id="headerMenuItems" className="exploreMapsCenter">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="exploreMapsHeader"></div>
|
||||
<div id="loading"></div>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -14,7 +14,8 @@
|
|||
#
|
||||
#%>
|
||||
|
||||
<% content_for :title, @topic.name + " | Metamaps" %>
|
||||
<% content_for :title, @topic.name + " | Metamaps" %>
|
||||
<% content_for :mobile_title, @topic.name %>
|
||||
<script>
|
||||
Metamaps.currentSection = "topic";
|
||||
Metamaps.currentPage = <%= @topic.id.to_s %>;
|
||||
|
|
|
@ -52,5 +52,6 @@
|
|||
</div>
|
||||
<div id="accountPageLoading"></div>
|
||||
<%= form.submit "Update", class: "update", onclick: "Metamaps.Account.showLoading()" %>
|
||||
<div class="clearfloat"></div>
|
||||
<% end %>
|
||||
</div>
|
||||
|
|
|
@ -33,48 +33,52 @@ class Header extends Component {
|
|||
const apps = section == "registered" || section == "authorized"
|
||||
|
||||
return (
|
||||
<div className="exploreMapsCenter">
|
||||
<MapLink show={signedIn && explore}
|
||||
href="/explore/mine"
|
||||
linkClass={activeClass("my")}
|
||||
text="My Maps"
|
||||
/>
|
||||
<MapLink show={signedIn && explore}
|
||||
href="/explore/shared"
|
||||
linkClass={activeClass("shared")}
|
||||
text="Shared With Me"
|
||||
/>
|
||||
<MapLink show={explore}
|
||||
href={signedIn ? "/" : "/explore/active"}
|
||||
linkClass={activeClass("active")}
|
||||
text="Recently Active"
|
||||
/>
|
||||
<MapLink show={!signedIn && explore}
|
||||
href="/explore/featured"
|
||||
linkClass={activeClass("featured")}
|
||||
text="Featured Maps"
|
||||
/>
|
||||
|
||||
{mapper ? (
|
||||
<div className='exploreMapsButton active mapperButton'>
|
||||
<img className='exploreMapperImage' width='24' height='24' src={this.props.userAvatar} />
|
||||
<div className='exploreMapperName'>{this.props.userName}’s Maps</div>
|
||||
<div className='clearfloat'></div>
|
||||
<div className="exploreMapsBar exploreElement">
|
||||
<div className="exploreMapsMenu">
|
||||
<div className="exploreMapsCenter">
|
||||
<MapLink show={signedIn && explore}
|
||||
href="/explore/mine"
|
||||
linkClass={activeClass("my")}
|
||||
text="My Maps"
|
||||
/>
|
||||
<MapLink show={signedIn && explore}
|
||||
href="/explore/shared"
|
||||
linkClass={activeClass("shared")}
|
||||
text="Shared With Me"
|
||||
/>
|
||||
<MapLink show={explore}
|
||||
href={signedIn ? "/" : "/explore/active"}
|
||||
linkClass={activeClass("active")}
|
||||
text="Recently Active"
|
||||
/>
|
||||
<MapLink show={!signedIn && explore}
|
||||
href="/explore/featured"
|
||||
linkClass={activeClass("featured")}
|
||||
text="Featured Maps"
|
||||
/>
|
||||
|
||||
{mapper ? (
|
||||
<div className='exploreMapsButton active mapperButton'>
|
||||
<img className='exploreMapperImage' width='24' height='24' src={this.props.userAvatar} />
|
||||
<div className='exploreMapperName'>{this.props.userName}’s Maps</div>
|
||||
<div className='clearfloat'></div>
|
||||
</div>
|
||||
) : null }
|
||||
|
||||
<MapLink show={apps}
|
||||
href="/oauth/applications"
|
||||
linkClass={"activeMaps exploreMapsButton" + (section == "registered" ? " active" : "")}
|
||||
data-bypass="true"
|
||||
text="Registered Apps"
|
||||
/>
|
||||
<MapLink show={apps}
|
||||
href="/oauth/applications"
|
||||
linkClass={"activeMaps exploreMapsButton" + (section == "authorized" ? " active" : "")}
|
||||
data-bypass="true"
|
||||
text="Authorized Apps"
|
||||
/>
|
||||
</div>
|
||||
) : null }
|
||||
|
||||
<MapLink show={apps}
|
||||
href="/oauth/applications"
|
||||
linkClass={"activeMaps exploreMapsButton" + (section == "registered" ? " active" : "")}
|
||||
data-bypass="true"
|
||||
text="Registered Apps"
|
||||
/>
|
||||
<MapLink show={apps}
|
||||
href="/oauth/applications"
|
||||
linkClass={"activeMaps exploreMapsButton" + (section == "authorized" ? " active" : "")}
|
||||
data-bypass="true"
|
||||
text="Authorized Apps"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue