From ed8ba3ddcf78369056f469d0ef163441a251ec00 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Niels=20Lyngs=C3=B8?= <nsl@umbraco.dk>
Date: Wed, 10 Apr 2019 13:40:06 +0200
Subject: [PATCH] changed inline-styling into a appearance property

---
 .../editor/subheader/umbeditorsubheader.directive.js          | 3 +++
 .../components/editor/subheader/umb-editor-sub-header.less    | 4 ++++
 .../components/editor/subheader/umb-editor-sub-header.html    | 2 +-
 .../src/views/propertyeditors/grid/grid.html                  | 2 +-
 4 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/subheader/umbeditorsubheader.directive.js b/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/subheader/umbeditorsubheader.directive.js
index 241bcc26ea..95a1416498 100644
--- a/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/subheader/umbeditorsubheader.directive.js
+++ b/src/Umbraco.Web.UI.Client/src/common/directives/components/editor/subheader/umbeditorsubheader.directive.js
@@ -47,6 +47,9 @@ The sub header is sticky and will follow along down the page when scrolling.
          transclude: true,
          restrict: 'E',
          replace: true,
+         scope: {
+             "appearance": "@?"
+         },
          templateUrl: 'views/components/editor/subheader/umb-editor-sub-header.html'
       };
 
diff --git a/src/Umbraco.Web.UI.Client/src/less/components/editor/subheader/umb-editor-sub-header.less b/src/Umbraco.Web.UI.Client/src/less/components/editor/subheader/umb-editor-sub-header.less
index 2e599252bb..515efdfa00 100644
--- a/src/Umbraco.Web.UI.Client/src/less/components/editor/subheader/umb-editor-sub-header.less
+++ b/src/Umbraco.Web.UI.Client/src/less/components/editor/subheader/umb-editor-sub-header.less
@@ -19,6 +19,10 @@
         background: @brownGrayLight;
     }
 }
+.umb-editor-sub-header--white {
+    background-color: white;
+    border-color: white;
+}
 
 .umb-editor-sub-header.--state-selection {
     padding-left: 10px;
diff --git a/src/Umbraco.Web.UI.Client/src/views/components/editor/subheader/umb-editor-sub-header.html b/src/Umbraco.Web.UI.Client/src/views/components/editor/subheader/umb-editor-sub-header.html
index 5a8e38c47c..c385223baf 100644
--- a/src/Umbraco.Web.UI.Client/src/views/components/editor/subheader/umb-editor-sub-header.html
+++ b/src/Umbraco.Web.UI.Client/src/views/components/editor/subheader/umb-editor-sub-header.html
@@ -1,5 +1,5 @@
 <div
-   class="umb-editor-sub-header"
+   class="umb-editor-sub-header umb-editor-sub-header--{{appearance}}"
    umb-sticky-bar
    scrollable-container=".umb-editor-container"
    ng-transclude>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
index ca22e052a7..3afeeef27d 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
@@ -1,6 +1,6 @@
 <div ng-controller="Umbraco.PropertyEditors.GridController" class="umb-grid umb-property-editor clearfix" id="umb-grid">
 
-    <umb-editor-sub-header ng-if="showReorderButton()" style="background-color: white; border-color: white;">
+    <umb-editor-sub-header ng-if="showReorderButton()" appearance="white">
 
         <umb-editor-sub-header-content-right>
             <umb-button