💄(app-desk) integrate design 404 page

Introduce a first draft of 404 page based on Johann's design. Please
refer to the Figma file for more info. This page is tested through
tests e2e. It closes the issue #112

src/frontend/apps/e2e/__tests__/app-desk/404.spec.ts

@@ -0,0 +1,29 @@
+import { expect, test } from '@playwright/test';
+
+import { keyCloakSignIn } from './common';
+
+test.beforeEach(async ({ page, browserName }) => {
+  await page.goto('/');
+  await keyCloakSignIn(page, browserName);
+  await page.goto('unknown-page404');
+});
+
+test.describe('404', () => {
+  test('Checks all the elements are visible', async ({ page }) => {
+    await expect(page.getByLabel('Image 404')).toBeVisible();
+    await expect(page.getByText('Ouch')).toBeVisible();
+    await expect(
+      page.getByText(
+        'It seems that the page you are looking for does not exist or cannot be displayed correctly.',
+      ),
+    ).toBeVisible();
+    await expect(page.getByText('Back to home page')).toBeVisible();
+  });
+
+  test('checks go back to home page redirects to home page', async ({
+    page,
+  }) => {
+    await page.getByText('Back to home page').click();
+    await expect(page).toHaveURL('/');
+  });
+});

src/frontend/apps/e2e/__tests__/app-desk/teams-create.spec.ts

@@ -116,7 +116,11 @@ test.describe('Teams Create', () => {
 
   test('checks 404 on teams/[id] page', async ({ page }) => {
     await page.goto('/teams/some-unknown-team');
-    await expect(page.getByText('404 - Page not found')).toBeVisible({
+    await expect(
+      page.getByText(
+        'It seems that the page you are looking for does not exist or cannot be displayed correctly.',
+      ),
+    ).toBeVisible({
       timeout: 15000,
     });
   });