Backoffice Preview: Adds notice that the site is not real (#20864)

feat: adds notice to the static backoffice site explaining to the reader that the content is not real

src/Umbraco.Web.UI.Client/src/mocks/data/umbraco-news.data.ts

@@ -4,46 +4,49 @@ export const umbNewsData: NewsDashboardResponseModel = {
 	items: [
 		{
 			priority: 'High',
-			header: 'News High 1',
+			header: 'Welcome to the Umbraco Backoffice Preview!',
+			body: `
+				<p>Explore the latest features and improvements in our new backoffice experience. We value your feedback to help us shape the future of Umbraco.</p>
+				<strong>Note:</strong> This is a preview version of the Umbraco Backoffice, it is not a real Umbraco instance.
+			`,
+			buttonText: 'Read more about Umbraco CMS',
+			imageUrl: '',
+			imageAltText: '',
+			url: 'https://umbraco.com/products/umbraco-cms/',
+		},
+		{
+			priority: 'Medium',
+			header: 'News high 1',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
-			buttonText: 'Button text',
+			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/rxphk1dd/dashboard-11.jpg',
+			imageUrl: 'https://loremflickr.com/366/206',
-			imageAltText: 'Test',
+			imageAltText: '',
 			url: 'https://umbraco.com',
 		},
 		{
-			priority: 'High',
+			priority: 'Medium',
 			header: 'News high 2',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
 			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/ezujjyhj/dashboard-12.jpg',
+			imageUrl: 'https://loremflickr.com/366/206',
 			imageAltText: '',
 			url: 'https://umbraco.com',
 		},
 		{
-			priority: 'High',
+			priority: 'Medium',
 			header: 'News high 3',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
 			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/ezujjyhj/dashboard-12.jpg',
+			imageUrl: 'https://loremflickr.com/366/206',
 			imageAltText: '',
 			url: 'https://umbraco.com',
 		},
 		{
-			priority: 'High',
+			priority: 'Medium',
 			header: 'News high 4',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
 			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/ezujjyhj/dashboard-12.jpg',
+			imageUrl: 'https://loremflickr.com/1280/720',
-			imageAltText: '',
-			url: 'https://umbraco.com',
-		},
-		{
-			priority: 'High',
-			header: 'News high 5',
-			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
-			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/ezujjyhj/dashboard-12.jpg',
 			imageAltText: '',
 			url: 'https://umbraco.com',
 		},
@@ -62,7 +65,7 @@ export const umbNewsData: NewsDashboardResponseModel = {
 			header: 'Normal 1',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
 			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/403pgsxa/stability-without-complexity.webp',
+			imageUrl: '',
 			imageAltText: '',
 			url: 'https://umbraco.com',
 		},
@@ -71,7 +74,7 @@ export const umbNewsData: NewsDashboardResponseModel = {
 			header: 'Normal 2',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
 			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/403pgsxa/stability-without-complexity.webp',
+			imageUrl: '',
 			imageAltText: '',
 			url: 'https://umbraco.com',
 		},
@@ -80,7 +83,7 @@ export const umbNewsData: NewsDashboardResponseModel = {
 			header: 'Normal 3',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
 			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/403pgsxa/stability-without-complexity.webp',
+			imageUrl: '',
 			imageAltText: '',
 			url: 'https://umbraco.com',
 		},
@@ -89,7 +92,7 @@ export const umbNewsData: NewsDashboardResponseModel = {
 			header: 'Normal 4',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
 			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/403pgsxa/stability-without-complexity.webp',
+			imageUrl: '',
 			imageAltText: '',
 			url: 'https://umbraco.com',
 		},
@@ -98,7 +101,7 @@ export const umbNewsData: NewsDashboardResponseModel = {
 			header: 'Normal 5',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
 			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/403pgsxa/stability-without-complexity.webp',
+			imageUrl: '',
 			imageAltText: '',
 			url: 'https://umbraco.com',
 		},
@@ -107,7 +110,7 @@ export const umbNewsData: NewsDashboardResponseModel = {
 			header: 'Normal 6',
 			body: '<p>Lorem ipsum <b>dolor sit amet</b>, consectetur adipiscing elit. Sed urna dui, convallis in porta sed, tempor non mauris. Aliquam placerat sed nulla a varius. Maecenas elementum tempus luctus. Nulla eu magna turpis. Nunc vel sodales urna. Donec ac ipsum sed ex egestas interdum. Aliquam pellentesque tellus id felis tempor gravida.</p>',
 			buttonText: 'See more',
-			imageUrl: 'https://umbraco-dashboard-news.euwest01.umbraco.io/media/403pgsxa/stability-without-complexity.webp',
+			imageUrl: '',
 			imageAltText: '',
 			url: 'https://umbraco.com',
 		},