Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-24 23:48:13 -05:00
Code Issues Activity

Merge pull request #2565 from hswolff/ember-popover

Browse source 
[Ember.js] Create GhostPopover component
This commit is contained in:
Hannah Wolfe 2014-05-07 20:22:41 +01:00
commit 095b700aa8
4 changed files with 43 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
ghost/admin/assets/css/ember-hacks.css
View file

@ -19,6 +19,25 @@
transition: none;
}
/*
By default nav menu should be displayed as it's visibility is controllerd
by GhostPopover
*/
.navbar .subnav ul {
display: block;
}
/*
Styles for GhostPopoverComponent
*/
.ghost-popover {
display: none;
}
.ghost-popover.open {
display: block;
}
.fade-in {
animation: fadein 0.5s;
-moz-animation: fadein 0.5s; /* Firefox */

8
ghost/admin/components/ghost-popover.js Normal file
View file

@ -0,0 +1,8 @@
var GhostPopover = Ember.Component.extend({
classNames: 'ghost-popover',
classNameBindings: ['open'],
open: false
});
export default GhostPopover;

7
ghost/admin/controllers/application.js
View file

@ -1,5 +1,10 @@
var ApplicationController = Ember.Controller.extend({
isLoggedOut: Ember.computed.match('currentPath', /(signin|signup|forgotten|reset)/)
isLoggedOut: Ember.computed.match('currentPath', /(signin|signup|forgotten|reset)/),
actions: {
toggleMenu: function () {
this.toggleProperty('showMenu');
}
}
});
export default ApplicationController;

18
ghost/admin/templates/-navbar.hbs
View file

@ -9,20 +9,22 @@
{{activating-list-item route="settings" title="Settings" classNames="content"}}
<li id="usermenu" class="usermenu subnav">
<a href="#" class="dropdown">
<a href="" {{action 'toggleMenu'}} class="dropdown">
{{!-- @TODO: show avatar of logged in user --}}
<img class="avatar" src="/shared/img/user-image.png" alt="Avatar" />
{{!-- @TODO: show logged in user name or email --}}
<span class="name">Fake Ghost</span>
</a>
{{!-- @TODO: add functionality to allow for dropdown to work --}}
<ul class="overlay">
<li class="usermenu-profile"><a href="#">Your Profile</a></li>
<li class="divider"></li>
<li class="usermenu-help"><a href="http://ghost.org/forum/">Help / Support</a></li>
<li class="divider"></li>
<li class="usermenu-signout"><a href="#">Sign Out</a></li>
</ul>
{{#ghost-popover open=showMenu}}
<ul class="overlay">
<li class="usermenu-profile"><a href="#">Your Profile</a></li>
<li class="divider"></li>
<li class="usermenu-help"><a href="http://ghost.org/forum/">Help / Support</a></li>
<li class="divider"></li>
<li class="usermenu-signout"><a href="#">Sign Out</a></li>
</ul>
{{/ghost-popover}}
</li>
</ul>
</nav>