From 08b1171ae7d6f08a1cdc0983ea3f26a89fa31e1d Mon Sep 17 00:00:00 2001 From: Christopher Joe Date: Mon, 17 Oct 2016 16:09:04 +1300 Subject: [PATCH] Adjust CSS for top toolbar split for Pages section --- admin/client/dist/styles/bundle.css | 35 ++++++------------- admin/client/src/legacy/LeftAndMain.js | 9 ++--- admin/client/src/styles/legacy/_style.scss | 35 +++++++------------ .../Admin/Includes/CMSBreadcrumbs.ss | 2 +- 4 files changed, 29 insertions(+), 52 deletions(-) diff --git a/admin/client/dist/styles/bundle.css b/admin/client/dist/styles/bundle.css index ec5b2419e..c26dc3f34 100644 --- a/admin/client/dist/styles/bundle.css +++ b/admin/client/dist/styles/bundle.css @@ -9403,7 +9403,6 @@ body.cms{ .cms-content-header .cms-content-header-info .section-icon{ opacity:.2; - margin-right:4px; background-repeat:no-repeat; } @@ -9444,8 +9443,6 @@ body.cms{ .has-panel .cms-content-header.north.collapsed .cms-content-header-info{ width:60px; text-align:center; - padding-left:8px; - padding-right:8px; } .has-panel .cms-content-header.north.collapsed .section-label,.has-panel .cms-content-header.north.collapsed .view-controls{ @@ -9457,19 +9454,7 @@ body.cms{ } .has-panel .cms-content-header-info{ - position:absolute; - top:0; - left:0; - bottom:1px; - width:300px; padding-bottom:8px; - padding-left:16px; - padding-right:16px; - box-shadow:1px 0 0 0 #ced3d9; -} - -.has-panel .cms-content-header-nav{ - margin-left:300px; } .has-panel .section-heading{ @@ -9478,7 +9463,8 @@ body.cms{ } .has-panel .section-icon{ - vertical-align:middle; + vertical-align:top; + margin-top:3px; } .has-panel .section-label{ @@ -10174,12 +10160,20 @@ body.cms{ .cms-content-tools{ background:#f6f7f8; width:300px; - z-index:70; box-shadow:1px 0 0 0 #ced3d9; z-index:1000; position:relative; } +.cms-content-tools.collapsed .cms-content-header{ + padding-left:0; + padding-right:0; +} + +.cms-content-tools .cms-content-header-info{ + float:none; +} + .cms-content-tools .cms-panel-header{ clear:both; margin:10px 0 7px; @@ -10196,13 +10190,6 @@ body.cms{ margin-right:5px; } -.cms-content-tools .cms-content-header{ - background-color:#748d9d; - background-image:-webkit-gradient(linear,left top,left bottom,from(#b0bec7),to(#748d9d)); - background-image:-webkit-linear-gradient(#b0bec7,#748d9d); - background-image:linear-gradient(#b0bec7,#748d9d); -} - .cms-content-tools .cms-content-header h2{ text-shadow:#5c7382 -1px -1px 0; width:176px; diff --git a/admin/client/src/legacy/LeftAndMain.js b/admin/client/src/legacy/LeftAndMain.js index 0d66510bc..b70d6ab59 100644 --- a/admin/client/src/legacy/LeftAndMain.js +++ b/admin/client/src/legacy/LeftAndMain.js @@ -732,10 +732,11 @@ $.entwine('ss', function($) { this.setRedrawSuppression(true); try { // Replace each fragment individually - $.each(newFragments, function(newFragment, html) { - var contentEl = $('[data-pjax-fragment]').filter(function() { - return $.inArray(newFragment, $(this).data('pjaxFragment').split(' ')) != -1; - }), newContentEl = $(html); + $.each(newFragments, function (newFragment, html) { + var contentEl = $('[data-pjax-fragment]').filter(function () { + return $.inArray(newFragment, $(this).data('pjaxFragment').split(' ')) != -1; + }), + newContentEl = $(html); // Add to result collection if(newContentEls) newContentEls.add(newContentEl); diff --git a/admin/client/src/styles/legacy/_style.scss b/admin/client/src/styles/legacy/_style.scss index a1d7947e3..be2603428 100644 --- a/admin/client/src/styles/legacy/_style.scss +++ b/admin/client/src/styles/legacy/_style.scss @@ -126,7 +126,6 @@ body.cms { .section-icon { opacity: 0.2; - margin-right: 4px; background-repeat: no-repeat; } @@ -179,8 +178,6 @@ body.cms { .cms-content-header-info { width: 60px; text-align: center; - padding-left: 8px; - padding-right: 8px; } .view-controls, @@ -195,19 +192,7 @@ body.cms { } .cms-content-header-info { - position: absolute; - top: 0; - left: 0; - bottom: 1px; - width: $cms-panel-sm; padding-bottom: $grid-y; - padding-left: $grid-x * 2; - padding-right: $grid-x*2; - box-shadow: 1px 0 0 0 $border-color-dark; - } - - .cms-content-header-nav { - margin-left: $cms-panel-sm; } .section-heading { @@ -216,7 +201,8 @@ body.cms { } .section-icon { - vertical-align: middle; + vertical-align: top; + margin-top: 3px; } .section-label { @@ -1062,11 +1048,19 @@ body.cms { .cms-content-tools { background: $tab-panel-texture-color; width: $cms-panel-sm; - z-index: 70; box-shadow: 1px 0 0 0 $border-color-dark; z-index: 1000; position: relative; + &.collapsed .cms-content-header { + padding-left: 0; + padding-right: 0; + } + + .cms-content-header-info { + float: none; + } + .cms-panel-header { clear: both; margin: 10px 0 $grid-y - 1; @@ -1083,16 +1077,11 @@ body.cms { } } - .cms-content-header { - background-color: darken($color-widget-bg, 40%); - background-image: linear-gradient(darken($color-widget-bg, 20%), darken($color-widget-bg, 40%)); - - h2 { + .cms-content-header h2 { text-shadow: darken($color-widget-bg, 50%) -1px -1px 0; width: $grid-x * 22 /* 24 - (padding on each side + margin) */; color: lighten($color-widget-bg, 60%); @include hide-text-overflow(); - } } h3,h4,h5 { diff --git a/admin/templates/SilverStripe/Admin/Includes/CMSBreadcrumbs.ss b/admin/templates/SilverStripe/Admin/Includes/CMSBreadcrumbs.ss index 2c8f51b40..743ee536f 100644 --- a/admin/templates/SilverStripe/Admin/Includes/CMSBreadcrumbs.ss +++ b/admin/templates/SilverStripe/Admin/Includes/CMSBreadcrumbs.ss @@ -1,4 +1,4 @@ -
+

<% loop $Breadcrumbs %> <% if $Last %>