From 4fb6e70bb84657c0c775a1746f2a448342947d1d Mon Sep 17 00:00:00 2001 From: Saophalkun Ponlu Date: Tue, 20 Jun 2017 12:25:24 +1200 Subject: [PATCH] Visual updates to page view toggle --- client/dist/styles/bundle.css | 2 +- client/src/styles/legacy/_CMSMain.scss | 24 +++++++++++++++ .../Controllers/Includes/CMSMain_Filter.ss | 4 +++ .../CMS/Controllers/Includes/CMSMain_Tools.ss | 3 +- .../Includes/CMSMain_ViewControls.ss | 30 +++++++++---------- .../Includes/CMSPagesController_Content.ss | 2 +- .../CMSPagesController_ContentToolActions.ss | 5 +++- 7 files changed, 49 insertions(+), 21 deletions(-) create mode 100644 templates/SilverStripe/CMS/Controllers/Includes/CMSMain_Filter.ss diff --git a/client/dist/styles/bundle.css b/client/dist/styles/bundle.css index 3f3402b9..6c2f5163 100644 --- a/client/dist/styles/bundle.css +++ b/client/dist/styles/bundle.css @@ -1 +1 @@ -#cms-page-history-versions tr.loading{color:#999}#cms-page-history-versions tr.loading td:hover{cursor:none}#cms-page-history-versions td:hover{cursor:pointer}.CMSPageHistoryController{overflow:hidden}.CMSPageHistoryController ins{background-color:#dfd;padding:2px;text-decoration:none}.CMSPageHistoryController del{background-color:#fdd;padding:2px;color:#f44}.CMSPageHistoryController .htmleditorfield.readonly img{max-width:100%;height:auto}.CMSPageHistoryController .cms-content-tools.collapsed{overflow:hidden}#cms-content-listview .cms-tree-expand-trigger,#cms-content-treeview .cms-tree-expand-trigger{display:none}.cms-content-tools #cms-content-treeview .cms-content-toolbar{border-bottom:none;-webkit-box-shadow:none;box-shadow:none;margin-bottom:0}.cms-content-tools #cms-content-treeview .cms-tree-expand-trigger{display:block;float:left;margin:0 0 2px}.cms-content-tools #cms-content-treeview .cms-tree-expand-trigger span.ui-button-text{padding-right:8px}.cms-content-tools #cms-content-treeview .cms-tree .badge{display:none}.cms-content-tools #cms-content-treeview .cms-tree .jstree-clicked>.text>.badge,.cms-content-tools #cms-content-treeview .cms-tree a:hover>.text>.badge{display:inline-block}.field.urlsegment.loading{background:url(data:image/gif;base64,R0lGODlhEAAQAPQAAP///wpakvj6+z9+qYivyg9dlC5yotfk7KvG2R9om3umxGubveXt8py80sjZ5k+IsFyRtgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAAFUCAgjmRpnqUwFGwhKoRgqq2YFMaRGjWA8AbZiIBbjQQ8AmmFUJEQhQGJhaKOrCksgEla+KIkYvC6SJKQOISoNSYdeIk1ayA8ExTyeR3F749CACH5BAkKAAAALAAAAAAQABAAAAVoICCKR9KMaCoaxeCoqEAkRX3AwMHWxQIIjJSAZWgUEgzBwCBAEQpMwIDwY1FHgwJCtOW2UDWYIDyqNVVkUbYr6CK+o2eUMKgWrqKhj0FrEM8jQQALPFA3MAc8CQSAMA5ZBjgqDQmHIyEAIfkECQoAAAAsAAAAABAAEAAABWAgII4j85Ao2hRIKgrEUBQJLaSHMe8zgQo6Q8sxS7RIhILhBkgumCTZsXkACBC+0cwF2GoLLoFXREDcDlkAojBICRaFLDCOQtQKjmsQSubtDFU/NXcDBHwkaw1cKQ8MiyEAIfkECQoAAAAsAAAAABAAEAAABVIgII5kaZ6AIJQCMRTFQKiDQx4GrBfGa4uCnAEhQuRgPwCBtwK+kCNFgjh6QlFYgGO7baJ2CxIioSDpwqNggWCGDVVGphly3BkOpXDrKfNm/4AhACH5BAkKAAAALAAAAAAQABAAAAVgICCOZGmeqEAMRTEQwskYbV0Yx7kYSIzQhtgoBxCKBDQCIOcoLBimRiFhSABYU5gIgW01pLUBYkRItAYAqrlhYiwKjiWAcDMWY8QjsCf4DewiBzQ2N1AmKlgvgCiMjSQhACH5BAkKAAAALAAAAAAQABAAAAVfICCOZGmeqEgUxUAIpkA0AMKyxkEiSZEIsJqhYAg+boUFSTAkiBiNHks3sg1ILAfBiS10gyqCg0UaFBCkwy3RYKiIYMAC+RAxiQgYsJdAjw5DN2gILzEEZgVcKYuMJiEAOwAAAAAAAAAAAA==) no-repeat 162px 8px}.field.urlsegment .URL-link{padding-top:8px;display:inline-block}.field.urlsegment input.text{width:250px;float:left}.field.urlsegment .cancel,.field.urlsegment .edit,.field.urlsegment .update,.field.urlsegment input.text{margin-right:8px}.field.urlsegment .help{margin-left:0}.field.urlsegment .edit-holder{display:none}.field.urlsegment .edit-holder .form__field-description{clear:both}#Form_EditForm #Title .update{margin-left:7px} \ No newline at end of file +#cms-page-history-versions tr.loading{color:#999}#cms-page-history-versions tr.loading td:hover{cursor:none}#cms-page-history-versions td:hover{cursor:pointer}.CMSPageHistoryController{overflow:hidden}.CMSPageHistoryController ins{background-color:#dfd;padding:2px;text-decoration:none}.CMSPageHistoryController del{background-color:#fdd;padding:2px;color:#f44}.CMSPageHistoryController .htmleditorfield.readonly img{max-width:100%;height:auto}.CMSPageHistoryController .cms-content-tools.collapsed{overflow:hidden}#cms-content-listview .cms-tree-expand-trigger,#cms-content-treeview .cms-tree-expand-trigger{display:none}.cms-content-tools #cms-content-treeview .cms-content-toolbar{border-bottom:none;-webkit-box-shadow:none;box-shadow:none;margin-bottom:0}.cms-content-tools #cms-content-treeview .cms-tree-expand-trigger{display:block;float:left;margin:0 0 2px}.cms-content-tools #cms-content-treeview .cms-tree-expand-trigger span.ui-button-text{padding-right:8px}.cms-content-tools #cms-content-treeview .cms-tree .badge{display:none}.cms-content-tools #cms-content-treeview .cms-tree .jstree-clicked>.text>.badge,.cms-content-tools #cms-content-treeview .cms-tree a:hover>.text>.badge{display:inline-block}.cms-content-toolbar .view-controls{margin-top:0}.cms-content-toolbar .view-controls .page-view-link{display:none;margin-right:-5px}.cms-content-toolbar .view-controls.view-controls--listview .font-icon-tree,.cms-content-toolbar .view-controls.view-controls--treeview .font-icon-list{display:inline-block}.field.urlsegment.loading{background:url(data:image/gif;base64,R0lGODlhEAAQAPQAAP///wpakvj6+z9+qYivyg9dlC5yotfk7KvG2R9om3umxGubveXt8py80sjZ5k+IsFyRtgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH/C05FVFNDQVBFMi4wAwEAAAAh/hpDcmVhdGVkIHdpdGggYWpheGxvYWQuaW5mbwAh+QQJCgAAACwAAAAAEAAQAAAFUCAgjmRpnqUwFGwhKoRgqq2YFMaRGjWA8AbZiIBbjQQ8AmmFUJEQhQGJhaKOrCksgEla+KIkYvC6SJKQOISoNSYdeIk1ayA8ExTyeR3F749CACH5BAkKAAAALAAAAAAQABAAAAVoICCKR9KMaCoaxeCoqEAkRX3AwMHWxQIIjJSAZWgUEgzBwCBAEQpMwIDwY1FHgwJCtOW2UDWYIDyqNVVkUbYr6CK+o2eUMKgWrqKhj0FrEM8jQQALPFA3MAc8CQSAMA5ZBjgqDQmHIyEAIfkECQoAAAAsAAAAABAAEAAABWAgII4j85Ao2hRIKgrEUBQJLaSHMe8zgQo6Q8sxS7RIhILhBkgumCTZsXkACBC+0cwF2GoLLoFXREDcDlkAojBICRaFLDCOQtQKjmsQSubtDFU/NXcDBHwkaw1cKQ8MiyEAIfkECQoAAAAsAAAAABAAEAAABVIgII5kaZ6AIJQCMRTFQKiDQx4GrBfGa4uCnAEhQuRgPwCBtwK+kCNFgjh6QlFYgGO7baJ2CxIioSDpwqNggWCGDVVGphly3BkOpXDrKfNm/4AhACH5BAkKAAAALAAAAAAQABAAAAVgICCOZGmeqEAMRTEQwskYbV0Yx7kYSIzQhtgoBxCKBDQCIOcoLBimRiFhSABYU5gIgW01pLUBYkRItAYAqrlhYiwKjiWAcDMWY8QjsCf4DewiBzQ2N1AmKlgvgCiMjSQhACH5BAkKAAAALAAAAAAQABAAAAVfICCOZGmeqEgUxUAIpkA0AMKyxkEiSZEIsJqhYAg+boUFSTAkiBiNHks3sg1ILAfBiS10gyqCg0UaFBCkwy3RYKiIYMAC+RAxiQgYsJdAjw5DN2gILzEEZgVcKYuMJiEAOwAAAAAAAAAAAA==) no-repeat 162px 8px}.field.urlsegment .URL-link{padding-top:8px;display:inline-block}.field.urlsegment input.text{width:250px;float:left}.field.urlsegment .cancel,.field.urlsegment .edit,.field.urlsegment .update,.field.urlsegment input.text{margin-right:8px}.field.urlsegment .help{margin-left:0}.field.urlsegment .edit-holder{display:none}.field.urlsegment .edit-holder .form__field-description{clear:both}#Form_EditForm #Title .update{margin-left:7px} \ No newline at end of file diff --git a/client/src/styles/legacy/_CMSMain.scss b/client/src/styles/legacy/_CMSMain.scss index b965cfa6..00cd186c 100644 --- a/client/src/styles/legacy/_CMSMain.scss +++ b/client/src/styles/legacy/_CMSMain.scss @@ -101,6 +101,30 @@ } } +/* ------------------------------------------------------------------- + * Sitetree tool bar + * ----------------------------------------------------------------- */ +.cms-content-toolbar { + + .view-controls { + margin-top: 0; + + .page-view-link { + display: none; + margin-right: -5px; + } + + &.view-controls--treeview .font-icon-list { + display: inline-block; + } + + &.view-controls--listview .font-icon-tree { + display: inline-block; + } + } + +} + /** ------------------------------------------------------------------ * URLSegment field * ----------------------------------------------------------------- */ diff --git a/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_Filter.ss b/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_Filter.ss new file mode 100644 index 00000000..8f1018db --- /dev/null +++ b/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_Filter.ss @@ -0,0 +1,4 @@ +
+ +
+ diff --git a/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_Tools.ss b/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_Tools.ss index 085f88f8..a0ddcd0b 100644 --- a/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_Tools.ss +++ b/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_Tools.ss @@ -2,10 +2,9 @@
- <% include SilverStripe\\Admin\\CMSSectionIcon %> {$MenuCurrentItem.Title}
- <% include SilverStripe\\CMS\\Controllers\\CMSMain_ViewControls PJAXTarget='Content' %> + <% include SilverStripe\\CMS\\Controllers\\CMSMain_Filter %>
diff --git a/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_ViewControls.ss b/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_ViewControls.ss index 8d895eac..03e3420a 100644 --- a/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_ViewControls.ss +++ b/templates/SilverStripe/CMS/Controllers/Includes/CMSMain_ViewControls.ss @@ -1,17 +1,15 @@ -
- -
- <%-- Change to data-pjax-target="Content-PageList" to enable in-edit listview --%> - -
+
+ <%-- Change to data-pjax-target="Content-PageList" to enable in-edit listview --%> + +
diff --git a/templates/SilverStripe/CMS/Controllers/Includes/CMSPagesController_Content.ss b/templates/SilverStripe/CMS/Controllers/Includes/CMSPagesController_Content.ss index dbef1fe9..1a3cbe4c 100644 --- a/templates/SilverStripe/CMS/Controllers/Includes/CMSPagesController_Content.ss +++ b/templates/SilverStripe/CMS/Controllers/Includes/CMSPagesController_Content.ss @@ -3,7 +3,7 @@
<% include SilverStripe\\Admin\\CMSBreadcrumbs %> - <% include SilverStripe\\CMS\\Controllers\\CMSMain_ViewControls PJAXTarget='Content-PageList' %> + <% include SilverStripe\\CMS\\Controllers\\CMSMain_Filter %>
diff --git a/templates/SilverStripe/CMS/Controllers/Includes/CMSPagesController_ContentToolActions.ss b/templates/SilverStripe/CMS/Controllers/Includes/CMSPagesController_ContentToolActions.ss index dd72713b..e20d6afe 100644 --- a/templates/SilverStripe/CMS/Controllers/Includes/CMSPagesController_ContentToolActions.ss +++ b/templates/SilverStripe/CMS/Controllers/Includes/CMSPagesController_ContentToolActions.ss @@ -3,12 +3,15 @@ <% _t('SilverStripe\CMS\Controllers\CMSMain.AddNewButton', 'Add new') %> <% if $View == 'Tree' %> - <% end_if %> + + <% include SilverStripe\\CMS\\Controllers\\CMSMain_ViewControls PJAXTarget='Content-PageList' %>
+
<% if $View == 'Tree' %>