From 37e5d106d2fa9f408de2e4d301d7231685873181 Mon Sep 17 00:00:00 2001 From: micmania1 Date: Thu, 2 Jun 2016 17:11:56 +1200 Subject: [PATCH] FIX right sidebar was being forced to float left --- code/model/BlogPost.php | 22 ++++++++++------------ css/cms.css | 40 +++++++++++++++++++++++----------------- js/cms.js | 11 +++++++++++ scss/cms.scss | 16 +++++++++++++--- 4 files changed, 57 insertions(+), 32 deletions(-) diff --git a/code/model/BlogPost.php b/code/model/BlogPost.php index 9c46862..4f5abb8 100644 --- a/code/model/BlogPost.php +++ b/code/model/BlogPost.php @@ -174,9 +174,7 @@ class BlogPost extends Page Requirements::css(BLOGGER_DIR . '/css/cms.css'); Requirements::javascript(BLOGGER_DIR . '/js/cms.js'); - $self =& $this; - - $this->beforeUpdateCMSFields(function ($fields) use ($self) { + $this->beforeUpdateCMSFields(function ($fields) { $uploadField = UploadField::create('FeaturedImage', _t('BlogPost.FeaturedImage', 'Featured Image')); $uploadField->getValidator()->setAllowedExtensions(array('jpg', 'jpeg', 'png', 'gif')); @@ -207,7 +205,7 @@ class BlogPost extends Page $fields->push(HiddenField::create('MenuTitle')); $urlSegment = $fields->dataFieldByName('URLSegment'); - $urlSegment->setURLPrefix($self->Parent()->RelativeLink()); + $urlSegment->setURLPrefix($this->Parent()->RelativeLink()); $fields->removeFieldsFromTab('Root.Main', array( 'MenuTitle', @@ -217,7 +215,7 @@ class BlogPost extends Page $authorField = ListboxField::create( 'Authors', _t('BlogPost.Authors', 'Authors'), - $self->getCandidateAuthors()->map()->toArray() + $this->getCandidateAuthors()->map()->toArray() ); $authorNames = TextField::create( @@ -230,14 +228,14 @@ class BlogPost extends Page 'If some authors of this post don\'t have CMS access, enter their name(s) here. You can separate multiple names with a comma.') ); - if (!$self->canEditAuthors()) { + if (!$this->canEditAuthors()) { $authorField = $authorField->performDisabledTransformation(); $authorNames = $authorNames->performDisabledTransformation(); } $publishDate = DatetimeField::create('PublishDate', _t('BlogPost.PublishDate', 'Publish Date')); $publishDate->getDateField()->setConfig('showcalendar', true); - if (!$self->PublishDate) { + if (!$this->PublishDate) { $publishDate->setDescription(_t( 'BlogPost.PublishDate_Description', 'Will be set to "now" if published without a value.') @@ -245,7 +243,7 @@ class BlogPost extends Page } // Get categories and tags - $parent = $self->Parent(); + $parent = $this->Parent(); $categories = $parent instanceof Blog ? $parent->Categories() : BlogCategory::get(); @@ -260,17 +258,17 @@ class BlogPost extends Page 'Categories', _t('BlogPost.Categories', 'Categories'), $categories, - $self->Categories() + $this->Categories() ) - ->setCanCreate($self->canCreateCategories()) + ->setCanCreate($this->canCreateCategories()) ->setShouldLazyLoad(true), TagField::create( 'Tags', _t('BlogPost.Tags', 'Tags'), $tags, - $self->Tags() + $this->Tags() ) - ->setCanCreate($self->canCreateTags()) + ->setCanCreate($this->canCreateTags()) ->setShouldLazyLoad(true), $authorField, $authorNames diff --git a/css/cms.css b/css/cms.css index 41de718..2998d91 100755 --- a/css/cms.css +++ b/css/cms.css @@ -14,17 +14,21 @@ clear: none; float: left; } -.blog-admin-sidebar { +.has-panel .cms-content-tools.blog-admin-sidebar { width: 280px; border-right: none; border-left: 1px solid #C0C0C2; - position: absolute; + position: absolute !important; + /* overrides cms !imporant style */ right: 0px; - bottom: 0px; + top: 0; height: 100%; } - .blog-admin-sidebar .cms-panel-toggle a { - text-align: left; } - .blog-admin-sidebar ~ .blog-admin-outer { + .has-panel .cms-content-tools.blog-admin-sidebar .cms-panel-toggle a { + text-align: left; + margin: 0; } + .has-panel .cms-content-tools.blog-admin-sidebar .cms-panel-toggle.south { + border-top: 1px solid #aaaaaa; } + .has-panel .cms-content-tools.blog-admin-sidebar ~ .blog-admin-outer { width: 100%; padding-right: 280px; position: absolute; @@ -32,34 +36,36 @@ overflow-y: hidden; overflow-x: hidden; box-sizing: border-box; } - .blog-admin-sidebar ~ .blog-admin-outer > .ss-tabset { + .has-panel .cms-content-tools.blog-admin-sidebar ~ .blog-admin-outer > .ss-tabset { position: relative; overflow: auto; height: 100%; width: 100%; } - .blog-admin-sidebar ~ .blog-admin-outer > .ss-tabset #Title label { + .has-panel .cms-content-tools.blog-admin-sidebar ~ .blog-admin-outer > .ss-tabset #Title label { float: none; } - .blog-admin-sidebar ~ .blog-admin-outer > .ss-tabset #Title .middleColumn, .blog-admin-sidebar ~ .blog-admin-outer > .ss-tabset #Title input { + .has-panel .cms-content-tools.blog-admin-sidebar ~ .blog-admin-outer > .ss-tabset #Title .middleColumn, .has-panel .cms-content-tools.blog-admin-sidebar ~ .blog-admin-outer > .ss-tabset #Title input { width: 100%; max-width: 100%; margin-left: 0; } - .blog-admin-sidebar .cms-content-view > .field + .field { + .has-panel .cms-content-tools.blog-admin-sidebar .cms-content-view > .field + .field { margin-top: 10px; } - .blog-admin-sidebar .cms-content-view > .field.urlsegment .preview { + .has-panel .cms-content-tools.blog-admin-sidebar .cms-content-view > .field.urlsegment .preview { padding-top: 0; line-height: 25px; } - .blog-admin-sidebar .cms-content-view > .field.urlsegment .edit { + .has-panel .cms-content-tools.blog-admin-sidebar .cms-content-view > .field.urlsegment .edit { float: right; } - .blog-admin-sidebar .cms-content-view > .field.datetime > .middleColumn > .date { + .has-panel .cms-content-tools.blog-admin-sidebar .cms-content-view > .field.datetime > .middleColumn > .date { width: 60%; } - .blog-admin-sidebar .cms-content-view > .field.datetime > .middleColumn > .time { + .has-panel .cms-content-tools.blog-admin-sidebar .cms-content-view > .field.datetime > .middleColumn > .time { width: 36%; float: right; } - .blog-admin-sidebar .cms-content-view > .field.datetime > .middleColumn .middleColumn, .blog-admin-sidebar .cms-content-view > .field.datetime > .middleColumn input { + .has-panel .cms-content-tools.blog-admin-sidebar .cms-content-view > .field.datetime > .middleColumn .middleColumn, .has-panel .cms-content-tools.blog-admin-sidebar .cms-content-view > .field.datetime > .middleColumn input { width: 100%; } - .blog-admin-sidebar.collapsed ~ .blog-admin-outer { + .has-panel .cms-content-tools.blog-admin-sidebar.collapsed ~ .blog-admin-outer { padding-right: 41px; } - .blog-admin-sidebar.cms-content-tools .cms-panel-content { + .has-panel .cms-content-tools.blog-admin-sidebar.collapsed ~ .blog-admin-outer #Root_Main { + margin-right: 15px; } + .has-panel .cms-content-tools.blog-admin-sidebar.cms-content-tools .cms-panel-content { width: auto; } .toggle-description { diff --git a/js/cms.js b/js/cms.js index 6dbefdf..36fb506 100644 --- a/js/cms.js +++ b/js/cms.js @@ -113,6 +113,10 @@ if(!this.hasClass('collapsed') && ($(".blog-admin-outer").width() < this.getMinInnerWidth())) { this.collapsePanel(); } + + window.onresize = function() { + this.updateLayout(); + }.bind(this); }, togglePanel: function(bool, silent) { this._super(bool, silent); @@ -124,9 +128,16 @@ * @returns {undefined} */ updateLayout: function() { + $(this).css('height', '100%'); + var currentHeight = $(this).outerHeight(); + var bottomHeight = $('.cms-content-actions').eq(0).outerHeight(); + $(this).css('height', (currentHeight - bottomHeight) + "px"); + $(this).css('bottom', bottomHeight + "px"); + $('.cms-container').updateLayoutOptions({ minContentWidth: 820 + this.width() }); + } }); diff --git a/scss/cms.scss b/scss/cms.scss index 20419f6..670f2d4 100755 --- a/scss/cms.scss +++ b/scss/cms.scss @@ -21,19 +21,24 @@ float: left; } -.blog-admin-sidebar { +.has-panel .cms-content-tools.blog-admin-sidebar { width: 280px; border-right: none; border-left: 1px solid #C0C0C2; - position: absolute; + position: absolute !important; /* overrides cms !imporant style */ right: 0px; - bottom: 0px; + top: 0; height: 100%; .cms-panel-toggle a { text-align: left; + margin: 0; } + .cms-panel-toggle.south { + border-top: 1px solid #aaaaaa; + } + ~ .blog-admin-outer { width: 100%; padding-right: 280px; @@ -101,7 +106,12 @@ &.collapsed { ~ .blog-admin-outer { padding-right: 41px; + + #Root_Main { + margin-right: 15px; + } } + } &.cms-content-tools {