From 2c4b1271c71ba745697cb04f59074259ae732869 Mon Sep 17 00:00:00 2001 From: Julian Seidenberg Date: Thu, 29 Sep 2011 13:10:47 +1300 Subject: [PATCH] ENHANCEMENT: CSS styling of "Create Page" dialog box and adjusting dialog title to be consistent with label of button that creates it (SSO-8) --- code/controllers/CMSMain.php | 2 +- css/CMSMain.css | 27 ++++++++ scss/CMSMain.scss | 68 ++++++++++++++++++- .../Includes/CMSPagesController_Content.ss | 2 +- 4 files changed, 96 insertions(+), 3 deletions(-) diff --git a/code/controllers/CMSMain.php b/code/controllers/CMSMain.php index 6837b1f9..0ba0fb3d 100644 --- a/code/controllers/CMSMain.php +++ b/code/controllers/CMSMain.php @@ -1040,7 +1040,7 @@ JS; // TODO Should be part of the form attribute, but not possible in current form API $hintsField = new LiteralField('Hints', sprintf('', $this->SiteTreeHints())), $parentField = new TreeDropdownField("ParentID", _t('CMSMain.AddFormParentLabel', 'Parent page'), 'SiteTree'), - new OptionsetField("PageType", "", $pageTypes, 'Page') + new OptionsetField("PageType", _t('CMSMain.PageType', 'Page type'), $pageTypes, 'Page') ); $parentField->setValue(($record) ? $record->ID : null); diff --git a/css/CMSMain.css b/css/CMSMain.css index cf6b0185..196e7fc5 100644 --- a/css/CMSMain.css +++ b/css/CMSMain.css @@ -1,5 +1,32 @@ /** Style custom to the CMSMain admin interface. CMSMain extends the built in sapphire admin section styles. As much as possible we want to use those built in styles. If anything in this file can be implemented in a generic way then it should be include in the admin scss files. @package cms */ /** ------------------------------------------------------------------ Page History Section. ----------------------------------------------------------------- */ +/* line 15, ../scss/CMSMain.scss */ #cms-page-history-versions tr.loading { color: #999; } +/* line 20, ../scss/CMSMain.scss */ #cms-page-history-versions tr.loading td:hover { cursor: none; } +/* line 27, ../scss/CMSMain.scss */ #cms-page-history-versions td:hover { cursor: pointer; } + +/** ------------------------------------------------------------------ +* Add Page pop-up Section. +* ----------------------------------------------------------------- */ +/* line 38, ../scss/CMSMain.scss */ +#cms-page-add-form { background: url("../../sapphire/admin/images/textures/bg_cms_main_content.png") repeat scroll left top #f0f3f4; /* Labels for all the sections of the pop-up form */ /* Exception for a label that is inline with the selector dropdown box */ } +/* line 42, ../scss/CMSMain.scss */ +#cms-page-add-form #PageType .middleColumn { margin: 0; padding: 0; } +/* line 46, ../scss/CMSMain.scss */ +#cms-page-add-form #PageType .middleColumn .optionset li { width: 100%; } +/* line 54, ../scss/CMSMain.scss */ +#cms-page-add-form #PageType li.selected { background-color: rgba(255, 255, 153, 0.5); /*background-color: #FFFF99;*/ } +/* line 61, ../scss/CMSMain.scss */ +#cms-page-add-form .field label.left { font-size: 14px; font-weight: bold; width: 100%; float: none; color: #5f6160; } +/* line 71, ../scss/CMSMain.scss */ +#cms-page-add-form #ParentID label.left { padding: 8px 0 8px 0; float: right !important; } +/* line 77, ../scss/CMSMain.scss */ +#cms-page-add-form .Actions { float: right; margin: 0; } + +/** ------------------------------------------------------------------ +* Titlebar for pop-up dialog. +* ----------------------------------------------------------------- */ +/* line 89, ../scss/CMSMain.scss */ +.ui-dialog-titlebar.ui-widget-header { font-size: 14px; background-color: #b0bec7; padding: 8px 8px 6px 16px; border-bottom: 2px solid #8399a7; border-radius: 4px 4px 0 0; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ced7dc), color-stop(100%, #92a5b2)); background-image: -webkit-linear-gradient(#ced7dc, #92a5b2); background-image: -moz-linear-gradient(#ced7dc, #92a5b2); background-image: -o-linear-gradient(#ced7dc, #92a5b2); background-image: -ms-linear-gradient(#ced7dc, #92a5b2); background-image: linear-gradient(#ced7dc, #92a5b2); } diff --git a/scss/CMSMain.scss b/scss/CMSMain.scss index 3402d063..c3128b18 100644 --- a/scss/CMSMain.scss +++ b/scss/CMSMain.scss @@ -28,4 +28,70 @@ cursor: pointer; } } -} \ No newline at end of file +} + +/** ------------------------------------------------------------------ +* Add Page pop-up Section. +* ----------------------------------------------------------------- */ +$SectionHeaderColor: #5F6160; +$SectionHeaderFontSize: 14px; +#cms-page-add-form { + background: url("../../sapphire/admin/images/textures/bg_cms_main_content.png") repeat scroll left top #F0F3F4; + + #PageType { + .middleColumn { + margin: 0; + padding: 0; + + .optionset li { + width: 100%; + + + } + } + + li { + &.selected { + background-color: rgba(255,255,153, 0.5); /*background-color: #FFFF99;*/ + } + } + } + + /* Labels for all the sections of the pop-up form */ + .field label.left { + font-size: $SectionHeaderFontSize; + font-weight: bold; + width: 100%; + float: none; + color: $SectionHeaderColor; + } + + /* Exception for a label that is inline with the selector dropdown box */ + #ParentID { + label.left { + padding: 8px 0 8px 0; + float: right !important; + } + } + + .Actions { + float: right; + margin: 0; + } +} + +/** ------------------------------------------------------------------ +* Titlebar for pop-up dialog. +* ----------------------------------------------------------------- */ +@import "compass"; +@import "compass/css3"; +@import "compass/utilities"; +.ui-dialog-titlebar.ui-widget-header { + font-size: $SectionHeaderFontSize; + background-color: #b0bec7; + padding: 8px 8px 6px 16px; + + border-bottom: 2px solid #8399a7; + border-radius: 4px 4px 0 0; + @include background-image(linear-gradient(#ced7dc, #92a5b2)); +} diff --git a/templates/Includes/CMSPagesController_Content.ss b/templates/Includes/CMSPagesController_Content.ss index 5c2c6a39..81cae01b 100644 --- a/templates/Includes/CMSPagesController_Content.ss +++ b/templates/Includes/CMSPagesController_Content.ss @@ -41,7 +41,7 @@ $SiteTreeAsUL -
+
$AddForm