rename attribute names

src/Umbraco.Web.UI.Client/src/packages/core/collection/collection.element.ts

@@ -85,7 +85,7 @@ export class UmbCollectionElement extends UmbLitElement {
 
 	render() {
 		return html`
-			<umb-body-layout no-header-background>
+			<umb-body-layout>
 				<umb-collection-toolbar slot="header"></umb-collection-toolbar>
 				<umb-router-slot id="router-slot" .routes="${this._routes}"></umb-router-slot>
 				${this._selection && this._selection.length > 0

src/Umbraco.Web.UI.Client/src/packages/core/components/body-layout/body-layout.element.ts

@@ -10,6 +10,8 @@ import {
 } from '@umbraco-cms/backoffice/external/lit';
 import { UUITextStyles } from '@umbraco-cms/backoffice/external/uui';
 
+//TODO: Add the following attributes to JSDocs: header-shadow, header-clear
+
 /**
  * @element umb-body-layout
  * @description Layout element to arrange elements in a body layout. A general layout for most views.
@@ -25,21 +27,14 @@ import { UUITextStyles } from '@umbraco-cms/backoffice/external/uui';
  */
 @customElement('umb-body-layout')
 export class UmbBodyLayoutElement extends LitElement {
-	/**
-	 * Renders a headline in the header.
-	 * @public
-	 * @type {string}
-	 * @attr {boolean} clear-header - renders the header without background and borders.
-	 * @default ''
-	 */
-
-	@query('#main') scrollContainer?: HTMLElement;
+	@query('#main')
+	private _scrollContainer?: HTMLElement;
 
 	@property()
 	public headline = '';
 
-	@property({ type: Boolean, reflect: true, attribute: 'scroll-shadow' })
-	public scrollShadow = false;
+	@property({ type: Boolean, reflect: true, attribute: 'header-shadow' })
+	public headerShadow = false;
 
 	@state()
 	private _headerSlotHasChildren = false;
@@ -62,21 +57,21 @@ export class UmbBodyLayoutElement extends LitElement {
 
 	connectedCallback(): void {
 		super.connectedCallback();
-		if (this.scrollShadow) {
+		if (this.headerShadow) {
 			requestAnimationFrame(() => {
-				this.scrollContainer?.addEventListener('scroll', this.#onScroll);
+				this._scrollContainer?.addEventListener('scroll', this.#onScroll);
 			});
 		}
 	}
 
 	disconnectedCallback(): void {
 		super.disconnectedCallback();
-		this.scrollContainer?.removeEventListener('scroll', this.#onScroll);
+		this._scrollContainer?.removeEventListener('scroll', this.#onScroll);
 	}
 
 	#onScroll = () => {
-		if (!this.scrollContainer) return;
-		this.toggleAttribute('scrolling', this.scrollContainer.scrollTop > 0);
+		if (!this._scrollContainer) return;
+		this.toggleAttribute('scrolling', this._scrollContainer.scrollTop > 0);
 	};
 
 	render() {
@@ -155,17 +150,17 @@ export class UmbBodyLayoutElement extends LitElement {
 				z-index: 1;
 			}
 
-			:host([scroll-shadow]) #header {
+			:host([header-shadow]) #header {
 				transition: box-shadow 150ms ease-in-out;
 				box-shadow: 0 -1px 0px 0px rgba(0, 0, 0, 0.8);
 			}
 
-			:host([clear-header]) #header {
+			:host([header-clear]) #header {
 				background-color: transparent;
 				border-color: transparent;
 			}
 
-			:host([scroll-shadow][scrolling]) #header {
+			:host([header-shadow][scrolling]) #header {
 				/* This should be using the uui-shadows but for now they are too drastic for this use case */
 				box-shadow: 0 1px 15px 0 rgba(0, 0, 0, 0.3);
 			}

src/Umbraco.Web.UI.Client/src/packages/documents/dashboards/redirect-management/dashboard-redirect-management.element.ts

@@ -153,7 +153,7 @@ export class UmbDashboardRedirectManagementElement extends UmbLitElement {
 
 	render() {
 		return html`
-			<umb-body-layout clear-header scroll-shadow>
+			<umb-body-layout header-clear header-shadow>
 				<div slot="header" id="header">
 					${this._trackerStatus
 						? html`<div>

src/Umbraco.Web.UI.Client/src/packages/search/examine-management-dashboard/dashboard-examine-management.element.ts

@@ -39,7 +39,7 @@ export class UmbDashboardExamineManagementElement extends UmbLitElement {
 
 	render() {
 		return html`
-			<umb-body-layout clear-header>
+			<umb-body-layout header-clear>
 				${this.#renderHeader()}
 				<div id="main">
 					<umb-router-slot

src/Umbraco.Web.UI.Client/src/packages/settings/logviewer/workspace/views/search/log-search-view.element.ts

@@ -32,7 +32,7 @@ export class UmbLogViewerSearchViewElement extends UmbLitElement {
 
 	render() {
 		return html`
-			<umb-body-layout clear-header scroll-shadow>
+			<umb-body-layout header-clear header-shadow>
 				<div id="header" slot="header">
 					<div id="levels-container">
 						<umb-log-viewer-log-level-filter-menu></umb-log-viewer-log-level-filter-menu>

src/Umbraco.Web.UI.Client/src/packages/users/users/collection/user-collection.element.ts

@@ -35,7 +35,7 @@ export class UmbUserCollectionElement extends UmbLitElement {
 
 	render() {
 		return html`
-			<umb-body-layout clear-header scroll-shadow>
+			<umb-body-layout header-clear header-shadow>
 				<umb-user-collection-header slot="header"></umb-user-collection-header>
 				<umb-router-slot id="router-slot" .routes=${this._routes}></umb-router-slot>
 				<umb-collection-selection-actions slot="footer"></umb-collection-selection-actions>