mirror of
https://github.com/TryGhost/Ghost.git
synced 2025-03-11 02:12:21 -05:00
Move unrelated editor cover code to the right place
Closes #4106 Moved the `.editor-close` styles to `post-settings-menu.scss`
This commit is contained in:
Paul Adam Davis
parent
9ec4b35163
commit
a32e5a7135
21 changed files with 278 additions and 254 deletions
|
|
@ -19,7 +19,8 @@
|
|||
width: 16px;
|
||||
}
|
||||
|
||||
body.right-outlet-expanded & {
|
||||
// This selector ends up being `body.settings-menu-expanded .global-nav`
|
||||
body.settings-menu-expanded & {
|
||||
transform: translate3d(-350px, 0px, 0px);
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -12,7 +12,9 @@
|
|||
z-index: 980;
|
||||
width: 300px;
|
||||
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
body.right-outlet-expanded & {
|
||||
|
||||
// This selector ends up being `body.settings-menu-expanded .notifications`
|
||||
body.settings-menu-expanded & {
|
||||
transform: translate3d(350px, 0px, 0px);
|
||||
}
|
||||
}
|
||||
|
|
@ -24,7 +26,9 @@
|
|||
right: 0;
|
||||
z-index: 9999;
|
||||
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
body.right-outlet-expanded & {
|
||||
|
||||
// This selector ends up being `body.settings-menu-expanded .notifications`
|
||||
body.settings-menu-expanded & {
|
||||
transform: translate3d(100%, 0px, 0px);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
171
core/client/assets/sass/components/settings-menu.scss
Normal file
171
core/client/assets/sass/components/settings-menu.scss
Normal file
|
|
@ -0,0 +1,171 @@
|
|||
//
|
||||
// Settings Menu
|
||||
// --------------------------------------------------
|
||||
|
||||
|
||||
// Wrapper
|
||||
.settings-menu-container {
|
||||
background: $lightestgrey;
|
||||
width: 100%;
|
||||
max-width: 350px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
transform: translate3d(60px, 0px, 0px);
|
||||
|
||||
// This selector ends up being `body.settings-menu-expanded .settings-menu-container`
|
||||
body.settings-menu-expanded & {
|
||||
transform: translate3d(0, 0px, 0px);
|
||||
}
|
||||
.settings-menu-pane {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
transform: translate3d(0, 0px, 0px);
|
||||
opacity: 1;
|
||||
overflow: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
|
||||
@media (min-width: 901px) {
|
||||
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
}
|
||||
|
||||
&.settings-menu-pane-out-left {
|
||||
transform: translate3d(-100%, 0px, 0px);
|
||||
}
|
||||
&.settings-menu-pane-out-right {
|
||||
transform: translate3d(100%, 0px, 0px);
|
||||
}
|
||||
&.settings-menu-pane-in {
|
||||
transform: translate3d(0, 0px, 0px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Header
|
||||
.settings-menu-header {
|
||||
position: relative;
|
||||
padding: 19px 24px;
|
||||
|
||||
h4 {
|
||||
font-weight: normal;
|
||||
font-size: 1.6rem;
|
||||
line-height: 1.375;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.close {
|
||||
right: 0;
|
||||
|
||||
&:before {
|
||||
right: 22px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.settings-menu-header.subview {
|
||||
|
||||
h4 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.back {
|
||||
left: 0;
|
||||
|
||||
&:before {
|
||||
left: 19px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.settings-menu-header-action {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 7px;
|
||||
width: 45px;
|
||||
padding: 0;
|
||||
|
||||
&:before {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
color: $midbrown;
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
||||
&:before {
|
||||
color: $midgrey;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Content
|
||||
.settings-menu-content {
|
||||
padding: 0 24px 24px;
|
||||
|
||||
.image-uploader {
|
||||
padding-top: 35px;
|
||||
padding-bottom: 35px;
|
||||
margin: 0 0 1.6rem 0;
|
||||
|
||||
input {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
textarea {
|
||||
height: 108px;
|
||||
}
|
||||
|
||||
.nav-list {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
|
||||
.pre-image-uploader {
|
||||
width: auto;
|
||||
min-height: 50px;
|
||||
max-height: 250px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.word-count {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
}//.settings-menu-content
|
||||
|
||||
|
||||
//
|
||||
// Content Cover
|
||||
// --------------------------------------------------
|
||||
// A transparent div that goes over the content, used
|
||||
// to listen for clicks to close the right outlet
|
||||
|
||||
body.settings-menu-expanded {
|
||||
|
||||
.content-cover {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 600;
|
||||
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
transform: translate3d(-350px, 0px, 0px); // Not off the screen, to give a parallax effect
|
||||
}//.editor-cover
|
||||
|
||||
}//body.settings-menu-expanded
|
||||
|
|
@ -30,11 +30,13 @@
|
|||
transition: transform 0.4s cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
}
|
||||
|
||||
// This selector ends up being `body.settings-menu-expanded .viewport`
|
||||
body.global-nav-expanded & {
|
||||
transform: translate3d(260px, 0px, 0px);
|
||||
}
|
||||
|
||||
body.right-outlet-expanded & {
|
||||
// This selector ends up being `body.settings-menu-expanded .viewport`
|
||||
body.settings-menu-expanded & {
|
||||
@media (max-width: 350px) {
|
||||
transform: translate3d(-100%, 0px, 0px);
|
||||
}
|
||||
|
|
@ -54,47 +56,6 @@
|
|||
}
|
||||
}
|
||||
|
||||
.right-outlet {
|
||||
background: $lightestgrey;
|
||||
width: 100%;
|
||||
max-width: 350px;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
overflow: hidden;
|
||||
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
transform: translate3d(60px, 0px, 0px);
|
||||
body.right-outlet-expanded & {
|
||||
transform: translate3d(0, 0px, 0px);
|
||||
}
|
||||
.outlet-pane {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
transform: translate3d(0, 0px, 0px);
|
||||
opacity: 1;
|
||||
|
||||
overflow: auto;
|
||||
-webkit-overflow-scrolling: touch;
|
||||
|
||||
@media (min-width: 901px) {
|
||||
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
}
|
||||
|
||||
&.outlet-pane-out-left {
|
||||
transform: translate3d(-100%, 0px, 0px);
|
||||
}
|
||||
&.outlet-pane-out-right {
|
||||
transform: translate3d(100%, 0px, 0px);
|
||||
}
|
||||
&.outlet-pane-in {
|
||||
transform: translate3d(0, 0px, 0px);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// The header bar - visible below 900px
|
||||
|
|
|
|||
|
|
@ -673,25 +673,6 @@ body.zen {
|
|||
text-align: right;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Post Settings Menu
|
||||
// --------------------------------------------------
|
||||
|
||||
body.right-outlet-expanded {
|
||||
|
||||
.editor-cover {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 600;
|
||||
transition: transform $side-outlet-transition-duration cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
transform: translate3d(-350px, 0px, 0px); // Not off the screen, to give a parallax effect
|
||||
}//.editor-cover
|
||||
}//body.right-outlet-expanded
|
||||
|
||||
.post-settings {
|
||||
@include icon($i-settings, 14px);
|
||||
display: inline-block;
|
||||
|
|
@ -718,6 +699,40 @@ body.zen {
|
|||
} // .post-settings-menu
|
||||
|
||||
|
||||
//
|
||||
// Post Settings Menu eta Data
|
||||
// --------------------------------------------------
|
||||
|
||||
// These styles are copied from Google.com
|
||||
.seo-preview {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
|
||||
.seo-preview-title {
|
||||
font-size: 1.8rem;
|
||||
line-height: 2.16rem;
|
||||
color: #1E0FBE;
|
||||
text-overflow: ellipses;
|
||||
-webkit-text-overflow: ellipsis;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.seo-preview-link {
|
||||
margin: 1px 0 2px 0;
|
||||
font-size: 1.3rem;
|
||||
line-height: 1.6rem;
|
||||
color: #006621;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.seo-preview-description {
|
||||
font-size: 1.3rem;
|
||||
line-height: 1.4;
|
||||
color: #545454;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Markdown Help Modal
|
||||
// --------------------------------------------------
|
||||
|
|
|
|||
|
|
@ -1,127 +0,0 @@
|
|||
//
|
||||
// Post Settings Menu
|
||||
// --------------------------------------------------
|
||||
|
||||
// Wrapper
|
||||
.post-settings-menu {}
|
||||
|
||||
// Header
|
||||
.post-settings-header {
|
||||
position: relative;
|
||||
padding: 19px 24px;
|
||||
h4 {
|
||||
font-weight: normal;
|
||||
font-size: 1.6rem;
|
||||
line-height: 1.375;
|
||||
margin: 0;
|
||||
}
|
||||
.close {
|
||||
right: 0;
|
||||
&:before {
|
||||
right: 22px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post-settings-header.subview {
|
||||
h4 {
|
||||
text-align: center;
|
||||
}
|
||||
.back {
|
||||
left: 0;
|
||||
&:before {
|
||||
left: 19px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.post-settings-header-action {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 7px;
|
||||
width: 45px;
|
||||
padding: 0;
|
||||
&:before {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
color: $midbrown;
|
||||
font-size: 2rem;
|
||||
}
|
||||
&:hover {
|
||||
&:before {
|
||||
color: $midgrey;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Content
|
||||
.post-settings-content {
|
||||
padding: 0 24px 24px;
|
||||
|
||||
.image-uploader {
|
||||
padding-top: 35px;
|
||||
padding-bottom: 35px;
|
||||
margin: 0 0 1.6rem 0;
|
||||
|
||||
input {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.form-group {
|
||||
// margin-bottom: 1.5rem;
|
||||
} // .form-group
|
||||
|
||||
textarea {
|
||||
height: 108px;
|
||||
}
|
||||
|
||||
.nav-list {
|
||||
margin-top: 3rem;
|
||||
}
|
||||
|
||||
.pre-image-uploader {
|
||||
width: auto;
|
||||
min-height: 50px;
|
||||
max-height: 250px;
|
||||
}
|
||||
|
||||
.word-count {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Meta Data
|
||||
// --------------------------------------------------
|
||||
|
||||
// These styles are copied from Google.com
|
||||
.seo-preview {
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
|
||||
.seo-preview-title {
|
||||
font-size: 1.8rem;
|
||||
line-height: 2.16rem;
|
||||
color: #1E0FBE;
|
||||
text-overflow: ellipses;
|
||||
-webkit-text-overflow: ellipsis;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.seo-preview-link {
|
||||
margin: 1px 0 2px 0;
|
||||
font-size: 1.3rem;
|
||||
line-height: 1.6rem;
|
||||
color: #006621;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
||||
.seo-preview-description {
|
||||
font-size: 1.3rem;
|
||||
line-height: 1.4;
|
||||
color: #545454;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
|
|
@ -9,8 +9,8 @@
|
|||
// Sidebar
|
||||
// --------------------------------------------------
|
||||
|
||||
// Main settings-menu styles, apply to every item
|
||||
.settings-menu {
|
||||
// Settings navigation
|
||||
.settings-nav {
|
||||
width: 25%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
|
|
@ -129,7 +129,7 @@
|
|||
|
||||
} // li
|
||||
|
||||
} // .settings-menu
|
||||
} // .settings-nav
|
||||
|
||||
|
||||
//
|
||||
|
|
|
|||
|
|
@ -44,6 +44,7 @@
|
|||
@import "components/pagination";
|
||||
@import "components/badges";
|
||||
@import "components/popovers";
|
||||
@import "components/settings-menu";
|
||||
|
||||
|
||||
//
|
||||
|
|
@ -55,7 +56,6 @@
|
|||
@import "layouts/auth";
|
||||
@import "layouts/content";
|
||||
@import "layouts/editor";
|
||||
@import "layouts/post-settings-menu";
|
||||
@import "layouts/settings";
|
||||
@import "layouts/users";
|
||||
@import "layouts/user";
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ var ApplicationController = Ember.Controller.extend({
|
|||
|
||||
topNotificationCount: 0,
|
||||
showGlobalMobileNav: false,
|
||||
showRightOutlet: false,
|
||||
showSettingsMenu: false,
|
||||
|
||||
actions: {
|
||||
topNotificationChange: function (count) {
|
||||
|
|
|
|||
|
|
@ -9,9 +9,9 @@ var PostSettingsMenuController = Ember.ObjectController.extend({
|
|||
|
||||
lastPromise: null,
|
||||
|
||||
isViewingSubview: Ember.computed('controllers.application.showRightOutlet', function (key, value) {
|
||||
isViewingSubview: Ember.computed('controllers.application.showSettingsMenu', function (key, value) {
|
||||
// Not viewing a subview if we can't even see the PSM
|
||||
if (!this.get('controllers.application.showRightOutlet')) {
|
||||
if (!this.get('controllers.application.showSettingsMenu')) {
|
||||
return false;
|
||||
}
|
||||
if (arguments.length > 1) {
|
||||
|
|
|
|||
|
|
@ -31,11 +31,11 @@ var ApplicationRoute = Ember.Route.extend(SimpleAuth.ApplicationRouteMixin, Shor
|
|||
this.toggleProperty('controller.showGlobalMobileNav');
|
||||
},
|
||||
|
||||
toggleRightOutlet: function () {
|
||||
this.toggleProperty('controller.showRightOutlet');
|
||||
toggleSettingsMenu: function () {
|
||||
this.toggleProperty('controller.showSettingsMenu');
|
||||
},
|
||||
closeRightOutlet: function () {
|
||||
this.set('controller.showRightOutlet', false);
|
||||
closeSettingsMenu: function () {
|
||||
this.set('controller.showSettingsMenu', false);
|
||||
},
|
||||
|
||||
closePopups: function () {
|
||||
|
|
@ -43,7 +43,7 @@ var ApplicationRoute = Ember.Route.extend(SimpleAuth.ApplicationRouteMixin, Shor
|
|||
this.get('notifications').closeAll();
|
||||
|
||||
// Close right outlet if open
|
||||
this.send('closeRightOutlet');
|
||||
this.send('closeSettingsMenu');
|
||||
|
||||
this.send('closeModal');
|
||||
},
|
||||
|
|
|
|||
|
|
@ -77,7 +77,7 @@ var EditorEditRoute = Ember.Route.extend(SimpleAuth.AuthenticatedRouteMixin, bas
|
|||
isDeleted = model.get('isDeleted'),
|
||||
modelIsDirty = model.get('isDirty');
|
||||
|
||||
this.send('closeRightOutlet');
|
||||
this.send('closeSettingsMenu');
|
||||
|
||||
// when `isDeleted && isSaving`, model is in-flight, being saved
|
||||
// to the server. when `isDeleted && !isSaving && !modelIsDirty`,
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@ var EditorNewRoute = Ember.Route.extend(SimpleAuth.AuthenticatedRouteMixin, base
|
|||
isDeleted = model.get('isDeleted'),
|
||||
modelIsDirty = model.get('isDirty');
|
||||
|
||||
this.send('closeRightOutlet');
|
||||
this.send('closeSettingsMenu');
|
||||
|
||||
// when `isDeleted && isSaving`, model is in-flight, being saved
|
||||
// to the server. when `isDeleted && !isSaving && !modelIsDirty`,
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
{{render 'post-tags-input'}}
|
||||
|
||||
<div class="publish-bar-actions">
|
||||
<button type="button" class='post-settings' {{action "toggleRightOutlet"}}></button>
|
||||
<button type="button" class='post-settings' {{action "toggleSettingsMenu"}}></button>
|
||||
{{view "editor-save-button" id="entry-actions" classNameBindings="isNew:unsaved"}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,12 +1,12 @@
|
|||
<div class="editor-cover" {{action "closeRightOutlet"}}></div>
|
||||
{{#gh-tabs-manager selected="showSubview" id="entry-controls" class="right-outlet"}}
|
||||
<div id="entry-controls" class="right-outlet">
|
||||
<div {{bind-attr class="isViewingSubview:outlet-pane-out-left:outlet-pane-in :post-settings-menu :outlet-pane"}}>
|
||||
<div class="post-settings-header">
|
||||
<div class="content-cover" {{action "closeSettingsMenu"}}></div>
|
||||
{{#gh-tabs-manager selected="showSubview" id="entry-controls" class="settings-menu-container"}}
|
||||
<div id="entry-controls">
|
||||
<div {{bind-attr class="isViewingSubview:settings-menu-pane-out-left:settings-menu-pane-in :settings-menu :settings-menu-pane"}}>
|
||||
<div class="settings-menu-header">
|
||||
<h4>Post Settings</h4>
|
||||
<button class="close icon-x post-settings-header-action" {{action "closeRightOutlet"}}><span class="hidden">Close</span></button>
|
||||
<button class="close icon-x settings-menu-header-action" {{action "closeSettingsMenu"}}><span class="hidden">Close</span></button>
|
||||
</div>
|
||||
<div class="post-settings-content">
|
||||
<div class="settings-menu-content">
|
||||
{{gh-uploader uploaded="setCoverImage" canceled="clearCoverImage" image=image tagName="section"}}
|
||||
<form>
|
||||
<div class="form-group">
|
||||
|
|
@ -62,19 +62,19 @@
|
|||
<p>Feature this post</p>
|
||||
</label>
|
||||
</div>
|
||||
|
||||
|
||||
</form>
|
||||
</div><!-- .post-settings-content -->
|
||||
</div><!-- .post-settings-menu -->
|
||||
<div {{bind-attr class="isViewingSubview:outlet-pane-in:outlet-pane-out-right :post-settings-menu :outlet-pane"}}>
|
||||
</div>{{! .settings-menu-content }}
|
||||
</div>{{! .post-settings-menu }}
|
||||
|
||||
<div {{bind-attr class="isViewingSubview:settings-menu-pane-in:settings-menu-pane-out-right :settings-menu :settings-menu-pane"}}>
|
||||
{{#gh-tab-pane}}
|
||||
<div class="post-settings-header subview">
|
||||
<button {{action "closeSubview"}} class="back icon-chevron-left post-settings-header-action"><span class="hidden">Back</span></button>
|
||||
<div class="settings-menu-header subview">
|
||||
<button {{action "closeSubview"}} class="back icon-chevron-left settings-menu-header-action"><span class="hidden">Back</span></button>
|
||||
<h4>Meta Data</h4>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="post-settings-content">
|
||||
<div class="settings-menu-content">
|
||||
<form>
|
||||
<div class="form-group">
|
||||
<label for="meta-title">Meta Title</label>
|
||||
|
|
@ -95,9 +95,8 @@
|
|||
<div class="seo-preview-link">{{seoURL}}</div>
|
||||
<div class="seo-preview-description">{{seoDescription}}</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>{{! .settings-menu-content }}
|
||||
{{/gh-tab-pane}}
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,18 +4,18 @@
|
|||
</header>
|
||||
|
||||
<div class="page-content">
|
||||
<nav class="settings-menu js-settings-menu">
|
||||
<nav class="settings-nav js-settings-menu">
|
||||
<ul>
|
||||
{{#unless session.user.isAuthor}}
|
||||
{{#unless session.user.isEditor}}
|
||||
{{gh-activating-list-item route="settings.general" title="General" classNames="settings-menu-general icon-settings"}}
|
||||
{{gh-activating-list-item route="settings.general" title="General" classNames="settings-nav-general icon-settings"}}
|
||||
{{/unless}}
|
||||
|
||||
{{gh-activating-list-item route="settings.users" title="Users" classNames="settings-menu-users icon-users"}}
|
||||
{{gh-activating-list-item route="settings.users" title="Users" classNames="settings-nav-users icon-users"}}
|
||||
|
||||
{{/unless}}
|
||||
|
||||
{{gh-activating-list-item route="settings.about" title="About" classNames="settings-menu-about icon-pacman"}}
|
||||
{{gh-activating-list-item route="settings.about" title="About" classNames="settings-nav-about icon-pacman"}}
|
||||
</ul>
|
||||
</nav>
|
||||
|
||||
|
|
|
|||
|
|
@ -57,9 +57,9 @@ var ApplicationView = Ember.View.extend({
|
|||
}.on('willDestroyElement'),
|
||||
|
||||
|
||||
toggleRightOutletBodyClass: function () {
|
||||
$('body').toggleClass('right-outlet-expanded', this.get('controller.showRightOutlet'));
|
||||
}.observes('controller.showRightOutlet')
|
||||
toggleSettingsMenuBodyClass: function () {
|
||||
$('body').toggleClass('settings-menu-expanded', this.get('controller.showSettingsMenu'));
|
||||
}.observes('controller.showSettingsMenu')
|
||||
});
|
||||
|
||||
export default ApplicationView;
|
||||
|
|
|
|||
|
|
@ -82,12 +82,12 @@ screens = {
|
|||
},
|
||||
'settings.general': {
|
||||
url: 'ghost/settings/general',
|
||||
selector: '.settings-menu-general.active'
|
||||
selector: '.settings-nav-general.active'
|
||||
},
|
||||
'settings.users': {
|
||||
url: 'ghost/settings/users',
|
||||
linkSelector: '.settings-menu-users a',
|
||||
selector: '.settings-menu-users.active'
|
||||
linkSelector: '.settings-nav-users a',
|
||||
selector: '.settings-nav-users.active'
|
||||
},
|
||||
'settings.users.user': {
|
||||
url: 'ghost/settings/users/test',
|
||||
|
|
|
|||
|
|
@ -645,7 +645,7 @@ CasperTest.begin('Title input is set correctly after using the Post-Settings-Men
|
|||
casper.thenClick('.post-settings');
|
||||
|
||||
casper.then(function () {
|
||||
this.fillSelectors('.post-settings-menu form', {
|
||||
this.fillSelectors('.settings-menu form', {
|
||||
'#url': 'changed-slug'
|
||||
}, false);
|
||||
|
||||
|
|
@ -692,7 +692,7 @@ CasperTest.begin('Editor content is set correctly after using the Post-Settings-
|
|||
casper.thenClick('.post-settings');
|
||||
|
||||
casper.then(function () {
|
||||
this.fillSelectors('.post-settings-menu form', {
|
||||
this.fillSelectors('.settings-menu form', {
|
||||
'#url': 'changed-slug-after-update'
|
||||
}, false);
|
||||
|
||||
|
|
|
|||
|
|
@ -11,10 +11,10 @@ CasperTest.begin('Post settings menu', 10, function suite(test) {
|
|||
|
||||
casper.then(function () {
|
||||
test.assertExists('.post-settings', 'icon toggle should exist');
|
||||
test.assertExists('.post-settings-menu', 'popup menu should be rendered at startup');
|
||||
test.assertExists('.post-settings-menu #url', 'url field exists');
|
||||
test.assertExists('.post-settings-menu .post-setting-date', 'publication date field exists');
|
||||
test.assertExists('.post-settings-menu .post-setting-static-page', 'static page checkbox field exists');
|
||||
test.assertExists('.settings-menu', 'popup menu should be rendered at startup');
|
||||
test.assertExists('.settings-menu #url', 'url field exists');
|
||||
test.assertExists('.settings-menu .post-setting-date', 'publication date field exists');
|
||||
test.assertExists('.settings-menu .post-setting-static-page', 'static page checkbox field exists');
|
||||
});
|
||||
|
||||
// Enter a title and save draft so converting to/from static post
|
||||
|
|
@ -36,7 +36,7 @@ CasperTest.begin('Post settings menu', 10, function suite(test) {
|
|||
|
||||
casper.thenClick('.post-settings');
|
||||
|
||||
casper.waitForOpaque('.post-settings-menu', function onSuccess() {
|
||||
casper.waitForOpaque('.settings-menu', function onSuccess() {
|
||||
test.assert(true, 'post settings menu should be visible after clicking post-settings icon');
|
||||
});
|
||||
});
|
||||
|
|
@ -59,7 +59,7 @@ CasperTest.begin('Post url can be changed', 4, function suite(test) {
|
|||
|
||||
// Test change permalink
|
||||
casper.then(function () {
|
||||
this.fillSelectors('.post-settings-menu form', {
|
||||
this.fillSelectors('.settings-menu form', {
|
||||
'#url': 'new-url'
|
||||
}, false);
|
||||
|
||||
|
|
@ -97,7 +97,7 @@ CasperTest.begin('Post published date can be changed', 4, function suite(test) {
|
|||
|
||||
// Test change published date
|
||||
casper.then(function () {
|
||||
this.fillSelectors('.post-settings-menu form', {
|
||||
this.fillSelectors('.settings-menu form', {
|
||||
'.post-setting-date': '22 May 14 @ 23:39'
|
||||
}, false);
|
||||
|
||||
|
|
@ -173,7 +173,7 @@ CasperTest.begin('Post url input is reset from all whitespace back to original v
|
|||
|
||||
// Test change permalink
|
||||
casper.then(function () {
|
||||
this.fillSelectors('.post-settings-menu form', {
|
||||
this.fillSelectors('.settings-menu form', {
|
||||
'#url': ' '
|
||||
}, false);
|
||||
|
||||
|
|
|
|||
|
|
@ -16,9 +16,9 @@ CasperTest.begin('Settings screen is correct', 15, function suite(test) {
|
|||
|
||||
casper.then(function testViews() {
|
||||
test.assertExists('.settings', 'Settings main view is present');
|
||||
test.assertExists('.settings-menu', 'Settings menu is present');
|
||||
test.assertExists('.settings-menu-general a', 'General link is present');
|
||||
test.assertExists('.settings-menu-users a', 'Users link is present');
|
||||
test.assertExists('.settings-nav', 'Settings menu is present');
|
||||
test.assertExists('.settings-nav-general a', 'General link is present');
|
||||
test.assertExists('.settings-nav-users a', 'Users link is present');
|
||||
test.assertNotExists('.settings-menu-apps a', 'Apps link is present');
|
||||
test.assertExists('.settings', 'Settings main view is present');
|
||||
test.assertExists('.settings-content', 'Settings content view is present');
|
||||
|
|
@ -27,18 +27,18 @@ CasperTest.begin('Settings screen is correct', 15, function suite(test) {
|
|||
});
|
||||
|
||||
casper.then(function testSwitchingTabs() {
|
||||
casper.thenClick('.settings-menu-users a');
|
||||
casper.thenClick('.settings-nav-users a');
|
||||
casper.waitForSelector(usersTabDetector, function then() {
|
||||
// assert that the right menu item is active
|
||||
test.assertExists('.settings-menu-users.active a', 'Users link is active');
|
||||
test.assertDoesntExist('.settings-menu-general.active a', 'General link is not active');
|
||||
test.assertExists('.settings-nav-users.active a', 'Users link is active');
|
||||
test.assertDoesntExist('.settings-nav-general.active a', 'General link is not active');
|
||||
}, casper.failOnTimeout(test, 'waitForSelector `usersTabDetector` timed out'));
|
||||
|
||||
casper.thenClick('.settings-menu-general a');
|
||||
casper.thenClick('.settings-nav-general a');
|
||||
casper.waitForSelector(generalTabDetector, function then() {
|
||||
// assert that the right menu item is active
|
||||
test.assertExists('.settings-menu-general.active a', 'General link is active');
|
||||
test.assertDoesntExist('.settings-menu-users.active a', 'User link is not active');
|
||||
test.assertExists('.settings-nav-general.active a', 'General link is active');
|
||||
test.assertDoesntExist('.settings-nav-users.active a', 'User link is not active');
|
||||
}, casper.failOnTimeout(test, 'waitForSelector `generalTabDetector` timed out'));
|
||||
});
|
||||
});
|
||||
|
|
@ -237,11 +237,11 @@ CasperTest.begin('Can save settings', 7, function suite(test) {
|
|||
test.assert(true, 'Got success notification');
|
||||
}, casper.failOnTimeout(test, 'No success notification :('));
|
||||
|
||||
casper.thenClick('.settings-menu-general a').then(function testTransitionToGeneral() {
|
||||
casper.thenClick('.settings-nav-general a').then(function testTransitionToGeneral() {
|
||||
casper.waitForSelector(generalTabDetector, function then() {
|
||||
casper.on('resource.requested', handleSettingsRequest);
|
||||
test.assertEval(function testGeneralIsActive() {
|
||||
return document.querySelector('.settings-menu-general').classList.contains('active');
|
||||
return document.querySelector('.settings-nav-general').classList.contains('active');
|
||||
}, 'general tab is marked active');
|
||||
},
|
||||
casper.failOnTimeout(test, 'waitForSelector `usersTabDetector` timed out'));
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue