213 lines
12 KiB
Handlebars
213 lines
12 KiB
Handlebars
<header class="gh-nav-menu">
|
|
<div class="gh-nav-menu-details">
|
|
<div class="gh-nav-menu-icon" style={{this.iconStyle}}></div>
|
|
<div class="gh-nav-menu-details-blog">{{this.config.blogTitle}}</div>
|
|
</div>
|
|
<div class="gh-nav-menu-search">
|
|
<button class="gh-nav-btn-search" {{action "toggleSearchModal"}} title="Search site (Ctrl/⌘ + K)"><span>{{svg-jar "search" class="w4 h4 fill-midgrey"}}</span></button>
|
|
</div>
|
|
</header>
|
|
|
|
{{#if this.showSearchModal}}
|
|
<GhFullscreenModal @modal="search"
|
|
@close={{action "toggleSearchModal"}}
|
|
@modifier="action wide" />
|
|
{{/if}}
|
|
|
|
<section class="gh-nav-body">
|
|
<div class="gh-nav-top">
|
|
<ul class="gh-nav-list gh-nav-main">
|
|
<li class="relative">
|
|
<span {{action "transitionToOrRefreshSite" on="click"}}>
|
|
<LinkTo @route="site" data-test-nav="site" @current-when={{this.isOnSite}} @preventDefault={{false}}>
|
|
{{svg-jar "house"}} View site
|
|
</LinkTo>
|
|
</span>
|
|
<a href="{{this.config.blogUrl}}/" class="gh-secondary-action" title="Open site in new tab" target="_blank">
|
|
<span>{{svg-jar "expand"}}</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<ul class="gh-nav-list gh-nav-manage">
|
|
<li class="gh-nav-list-h">Manage</li>
|
|
<li class="gh-nav-list-new relative">
|
|
<GhLinkToCustomViewsIndex @route="posts" @query={{reset-query-params "posts"}} data-test-nav="posts">{{svg-jar "posts"}}Posts</GhLinkToCustomViewsIndex>
|
|
<LinkTo @route="editor.new" @model="post" @classNames="gh-secondary-action gh-nav-new-post" @alt="New post" @title="New post" data-test-nav="new-story"><span>{{svg-jar "add-stroke"}}</span></LinkTo>
|
|
{{#if this.customViews.forPosts}}
|
|
<button type="button" class="absolute left-3 top-2 z-9999 flex items-center pl2 h4 gh-nav-button-expand {{if this.navigation.settings.expanded.posts "expanded"}}" {{on "click" (fn this.navigation.toggleExpansion "posts")}} aria-label="{{if this.navigation.settings.expanded.posts "Collapse custom post types" "Expand custom post types"}}">
|
|
{{svg-jar (if this.navigation.settings.expanded.posts "arrow-down-stroke" "arrow-right-stroke")}}
|
|
</button>
|
|
{{#liquid-if this.navigation.settings.expanded.posts}}
|
|
<ul class="gh-nav-view-list">
|
|
{{#each this.customViews.forPosts as |view|}}
|
|
<li>
|
|
<LinkTo @route="posts" @query={{reset-query-params "posts" view.filter}} data-test-nav-custom="{{view.route}}-{{view.name}}" title="{{view.name}}">
|
|
{{!-- <div class="dib w4 h4 mr2 bg-{{view.color}} br-100"></div> --}}
|
|
<span class="flex items-center svg-{{view.color}}">
|
|
{{#if view.icon}}
|
|
{{svg-jar (or view.icon "post")}}
|
|
{{else}}
|
|
<span class="circle"></span>
|
|
{{/if}}
|
|
</span>
|
|
<span class="gh-nav-viewname">{{view.name}}</span>
|
|
</LinkTo>
|
|
</li>
|
|
{{/each}}
|
|
</ul>
|
|
{{/liquid-if}}
|
|
{{/if}}
|
|
</li>
|
|
<li>
|
|
{{!-- clicking the Content link whilst on the content screen should reset the filter --}}
|
|
{{#if (eq this.router.currentRouteName "pages")}}
|
|
<LinkTo @route="pages" @query={{reset-query-params "pages"}} @classNames="active" data-test-nav="pages">{{svg-jar "page"}}Pages</LinkTo>
|
|
{{else}}
|
|
<LinkTo @route="pages" data-test-nav="pages">{{svg-jar "page"}}Pages</LinkTo>
|
|
{{/if}}
|
|
</li>
|
|
{{#if this.showTagsNavigation}}
|
|
<li><LinkTo @route="tags" data-test-nav="tags">{{svg-jar "tag"}}Tags</LinkTo></li>
|
|
{{/if}}
|
|
{{#if (and this.feature.members (gh-user-can-admin this.session.user))}}
|
|
<li>
|
|
{{#if (eq this.router.currentRouteName "members.index")}}
|
|
<LinkTo @route="members" @current-when="members member" @query={{reset-query-params "members.index"}} data-test-nav="members">{{svg-jar "members"}}Members</LinkTo>
|
|
{{else}}
|
|
<LinkTo @route="members" @current-when="members member" data-test-nav="members">{{svg-jar "members"}}Members</LinkTo>
|
|
{{/if}}
|
|
</li>
|
|
{{/if}}
|
|
<li><LinkTo @route="staff" data-test-nav="staff">{{svg-jar "staff"}}Staff</LinkTo></li>
|
|
</ul>
|
|
{{#if (gh-user-can-admin this.session.user)}}
|
|
<ul class="gh-nav-list gh-nav-settings">
|
|
<li class="gh-nav-list-h">Settings</li>
|
|
<li><LinkTo @route="settings.general" data-test-nav="settings">{{svg-jar "settings"}}General</LinkTo></li>
|
|
<li><LinkTo @route="settings.design" data-test-nav="design">{{svg-jar "paintbrush"}}Design</LinkTo></li>
|
|
<li><LinkTo @route="settings.code-injection" data-test-nav="code-injection">{{svg-jar "brackets"}}Code injection</LinkTo></li>
|
|
<li><LinkTo @route="settings.integrations" @current-when={{this.isIntegrationRoute}} data-test-nav="integrations">{{svg-jar "modules"}}Integrations</LinkTo></li>
|
|
<li class="relative">
|
|
<button class="gh-secondary-action" title="Toggle Night shift" {{action (toggle "nightShift" this.feature)}}>
|
|
<span>{{svg-jar "nightshift"}}</span>
|
|
</button>
|
|
<LinkTo @route="settings.labs" data-test-nav="labs">{{svg-jar "labs"}}Labs</LinkTo>
|
|
</li>
|
|
{{#if this.showBilling}}
|
|
<li class="relative">
|
|
<a href="javascript:void(0)" {{action "toggleBillingModal"}} data-test-nav="billing">
|
|
{{svg-jar "credit-card"}} View billing
|
|
</a>
|
|
</li>
|
|
<li class="relative gh-nav-pro">
|
|
<GhBillingUpdateButton />
|
|
</li>
|
|
{{/if}}
|
|
</ul>
|
|
{{/if}}
|
|
|
|
{{#if this.showMenuExtension}}
|
|
<ul class="gh-nav-list gh-nav-settings">
|
|
{{#if this.config.clientExtensions.menu.title}}
|
|
<li class="gh-nav-list-h">{{this.config.clientExtensions.menu.title}}</li>
|
|
{{/if}}
|
|
{{#each this.config.clientExtensions.menu.items as |menuItem| }}
|
|
<li>
|
|
<a href="{{menuItem.href}}" target="_blank">{{svg-jar menuItem.icon}}{{menuItem.text}}</a>
|
|
</li>
|
|
{{/each}}
|
|
</ul>
|
|
{{/if}}
|
|
|
|
{{#if this.showScriptExtension}}
|
|
{{{this.config.clientExtensions.script.container}}}
|
|
<script src="{{this.config.clientExtensions.script.src}}"></script>
|
|
{{/if}}
|
|
</div>
|
|
<div class="gh-nav-bottom">
|
|
<GhBasicDropdown @horizontalPosition="left" @verticalPosition="above" @calculatePosition={{this.userDropdownPosition}} as |dropdown|>
|
|
<dropdown.Trigger class="flex items-center outline-0 pointer space-between pa2 pl4 pr3 mt3 mb6">
|
|
<div class="flex-auto flex items-center">
|
|
<div class="gh-user-avatar relative" style={{background-image-style this.session.user.profileImageUrl}}>
|
|
{{#if this.whatsNew.hasNew}}<span class="absolute dib bg-blue ba b--white br-100 gh-whats-new-badge-account"></span>{{/if}}
|
|
</div>
|
|
<div class="flex flex-column items-start justify-center">
|
|
<span class="gh-user-name {{if this.session.user.name "mb1"}}" title="{{this.session.user.name}}">{{this.session.user.name}}</span>
|
|
<span class="gh-user-email" title="{{this.session.user.email}}">{{this.session.user.email}}</span>
|
|
</div>
|
|
</div>
|
|
{{svg-jar "arrow-down" class="w3 mr1 fill-darkgrey"}}
|
|
</dropdown.Trigger>
|
|
|
|
<dropdown.Content class="gh-nav-menu-dropdown">
|
|
<ul class="dropdown-menu dropdown-triangle-top" role="menu" {{action dropdown.actions.close on="click" preventDefault=false}}>
|
|
<li role="presentation">
|
|
<LinkTo @route="about" @classNames="dropdown-item" @role="menuitem" @tabindex="-1" data-test-nav="about">
|
|
{{svg-jar "store"}} About Ghost
|
|
</LinkTo>
|
|
</li>
|
|
<li role="presentation">
|
|
<button class="dropdown-item" role="menuitem" tabindex="-1" {{on "click" this.whatsNew.showModal}}>
|
|
{{svg-jar "gift"}} What's new?
|
|
{{#if this.whatsNew.hasNew}}
|
|
<div class="flex-grow-1 flex justify-end"><span class="dib w2 h2 top-0 right-0 bg-blue br-100"></span></div>
|
|
{{/if}}
|
|
</button>
|
|
</li>
|
|
<li class="divider" role="separator"></li>
|
|
<li role="presentation">
|
|
<LinkTo @route="staff.user" @model={{this.session.user.slug}} @classNames="dropdown-item" @role="menuitem" @tabindex="-1" data-test-nav="user-profile">
|
|
{{svg-jar "user-circle"}} Your Profile
|
|
</LinkTo>
|
|
</li>
|
|
<li role="presentation">
|
|
<a class="dropdown-item" role="menuitem" tabindex="-1" href="https://ghost.org/docs/" target="_blank">
|
|
{{svg-jar "ambulance"}} Support Center
|
|
</a>
|
|
</li>
|
|
<li role="presentation">
|
|
<a class="dropdown-item" role="menuitem" tabindex="-1" target="_blank"
|
|
href="https://twitter.com/intent/tweet?text=%40Ghost+Hi%21+Can+you+help+me+with+&related=Ghost"
|
|
onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;"
|
|
>
|
|
{{svg-jar "twitter"}} Tweet @Ghost!
|
|
</a>
|
|
</li>
|
|
<li role="presentation">
|
|
<a class="dropdown-item" role="menuitem" tabindex="-1" href="https://ghost.org/help/topic/setting-up/" target="_blank">
|
|
{{svg-jar "book-open"}} How to Use Ghost
|
|
</a>
|
|
</li>
|
|
<li class="divider" role="separator"></li>
|
|
|
|
{{#if this.showDropdownExtension}}
|
|
{{#each this.config.clientExtensions.dropdown.items as |menuItem| }}
|
|
{{#if menuItem.divider}}
|
|
<li class="divider" role="separator"></li>
|
|
{{else}}
|
|
<li role="presentation">
|
|
<a href="{{menuItem.href}}" target="_blank" class="dropdown-item {{menuItem.classes}}" role="menuitem" tabindex="-1">
|
|
{{svg-jar menuItem.icon}} {{menuItem.text}}
|
|
</a>
|
|
</li>
|
|
{{/if}}
|
|
{{/each}}
|
|
{{/if}}
|
|
|
|
<li role="presentation">
|
|
<LinkTo @route="signout" @classNames="dropdown-item user-menu-signout" @role="menuitem" @tabindex="-1">
|
|
{{svg-jar "signout"}} Sign Out
|
|
</LinkTo>
|
|
</li>
|
|
</ul>
|
|
</dropdown.Content>
|
|
</GhBasicDropdown>
|
|
</div>
|
|
</section>
|
|
|
|
<GhTourItem @throbberId="getting-started"
|
|
@target=".gh-nav-main"
|
|
@throbberAttachment="middle right"
|
|
@popoverTriangleClass="left-top"
|
|
@throbberOffset="0px 0px"
|
|
/> |