From c3cb1721362485c3a54c37b376cb9bcb6ade5996 Mon Sep 17 00:00:00 2001 From: Gaelle Date: Tue, 7 Jul 2026 09:51:37 +0200 Subject: [PATCH] redesign dasboard page --- package-lock.json | 130 ++++++++--- package.json | 2 +- src/AppLayout.vue | 44 ++-- .../app/app-header-menu/AppHeaderMenu.scss | 143 ++++++------ .../app/app-header-menu/AppHeaderMenu.vue | 216 +++++++++--------- .../specific/app/app-sidebar/AppSidebar.scss | 46 ++++ .../specific/app/app-sidebar/AppSidebar.vue | 104 +++++++++ .../app-sidebar-item/AppSidebarItem.scss | 51 +++++ .../app-sidebar-item/AppSidebarItem.vue | 59 +++++ .../DashboardActionTile.scss | 60 +++++ .../DashboardActionTile.vue | 56 +++++ .../DashboardButtonTile.scss | 68 ++++-- .../DashboardButtonTile.vue | 20 +- .../DashboardProjectList.scss | 22 +- .../DashboardProjectList.vue | 33 +-- .../DashboardSpaceList.scss | 25 +- .../DashboardSpaceList.vue | 35 ++- .../DashboardWelcomeTile.scss | 28 --- .../DashboardWelcomeTile.vue | 35 --- .../DashboardWelcomeTileImage.vue | 44 ---- .../projects/project-card/ProjectCard.css | 13 +- .../project-card/ProjectCard.vars.css | 2 +- .../projects/project-card/ProjectCard.vue | 74 +++--- .../ProjectStatusBadge.scss | 6 +- .../specific/spaces/space-card/SpaceCard.css | 8 + .../specific/spaces/space-card/SpaceCard.vue | 27 ++- .../SpaceCardActionMenu.vue | 42 ++-- .../space-card-image/SpaceCardImage.vue | 17 +- src/i18n/lang/de.json | 22 +- src/i18n/lang/en.json | 22 +- src/i18n/lang/es.json | 22 +- src/i18n/lang/fr.json | 30 ++- src/i18n/lang/it.json | 22 +- src/i18n/lang/nl.json | 22 +- src/i18n/lang/no.json | 22 +- src/styles/layout.scss | 28 ++- src/views/dashboard/Dashboard.scss | 64 ++---- src/views/dashboard/Dashboard.vue | 145 ++++++------ 38 files changed, 1181 insertions(+), 628 deletions(-) create mode 100644 src/components/specific/app/app-sidebar/AppSidebar.scss create mode 100644 src/components/specific/app/app-sidebar/AppSidebar.vue create mode 100644 src/components/specific/app/app-sidebar/app-sidebar-item/AppSidebarItem.scss create mode 100644 src/components/specific/app/app-sidebar/app-sidebar-item/AppSidebarItem.vue create mode 100644 src/components/specific/dashboard/dashboard-action-tile/DashboardActionTile.scss create mode 100644 src/components/specific/dashboard/dashboard-action-tile/DashboardActionTile.vue delete mode 100644 src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTile.scss delete mode 100644 src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTile.vue delete mode 100644 src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTileImage.vue diff --git a/package-lock.json b/package-lock.json index 900c4aa9f..46f7185a9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -10,7 +10,7 @@ "dependencies": { "@bimdata/bcf-components": "6.7.7", "@bimdata/components": "1.10.1", - "@bimdata/design-system": "2.4.2", + "@bimdata/design-system": "3.0.0-beta.46", "@bimdata/typescript-fetch-api-client": "10.44.2", "@bimdata/viewer": "2.18.0-beta.3", "@paddle/paddle-js": "^1.6.4", @@ -4438,9 +4438,9 @@ } }, "node_modules/@bimdata/design-system": { - "version": "2.4.2", - "resolved": "https://registry.npmjs.org/@bimdata/design-system/-/design-system-2.4.2.tgz", - "integrity": "sha512-pldzXuZEL4oUzjxnd0+AVlM551yDag4mXJCehKAvfScdhq4bt1Iks17ux1yk4Ppt+dFJTb2EO0vYBuipaBRq9Q==" + "version": "3.0.0-beta.46", + "resolved": "https://registry.npmjs.org/@bimdata/design-system/-/design-system-3.0.0-beta.46.tgz", + "integrity": "sha512-UXAetWmapDj3mLDMEaF+/jN+efC/Yu1ZDpCGTq8u5RSq5ZVAmzwhoHv7HDoqLnHhiiWS784e/s6hCPJumBjdcQ==" }, "node_modules/@bimdata/typescript-fetch-api-client": { "version": "10.44.2", @@ -4456,7 +4456,7 @@ "version": "2.12.0", "resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-2.12.0.tgz", "integrity": "sha512-B/XlCaFIP8LOwzo+bz5uFzATYokcwCKQcghqnlfwSmM5eX/qTkvDBnDPs+gXtX/RyjxJ4DRikECcPJbyALA8FA==", - "devOptional": true, + "dev": true, "license": "(Apache-2.0 AND BSD-3-Clause)" }, "node_modules/@colors/colors": { @@ -4524,6 +4524,7 @@ "version": "1.10.0", "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.10.0.tgz", "integrity": "sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -4535,6 +4536,7 @@ "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "dev": true, "license": "0BSD", "optional": true }, @@ -4542,6 +4544,7 @@ "version": "1.10.0", "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.10.0.tgz", "integrity": "sha512-ewvYlk86xUoGI0zQRNq/mC+16R1QeDlKQy21Ki3oSYXNgLb45GV1P6A0M+/s6nyCuNDqe5VpaY84BzXGwVbwFA==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -4552,6 +4555,7 @@ "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "dev": true, "license": "0BSD", "optional": true }, @@ -4559,6 +4563,7 @@ "version": "1.2.1", "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.1.tgz", "integrity": "sha512-uTII7OYF+/Mes/MrcIOYp5yOtSMLBWSIoLPpcgwipoiKbli6k322tcoFsxoIIxPDqW01SQGAgko4EzZi2BNv2w==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -4569,6 +4574,7 @@ "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "dev": true, "license": "0BSD", "optional": true }, @@ -5433,6 +5439,7 @@ "version": "1.1.6", "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.1.6.tgz", "integrity": "sha512-ZLv/JdUfkvOy9eCnnBaGfiO+XimbjebAeO+MRQqD/B+FR1tnRN0tpKSJHRbE8sFfS6aqsXZ67TQjfwfsxULVbg==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -5625,6 +5632,7 @@ "version": "2.5.6", "resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.6.tgz", "integrity": "sha512-tmmZ3lQxAe/k/+rNnXQRawJ4NjxO2hqiOLTHvWchtGZULp4RyFeh6aU4XdOYBFe2KE1oShQTv4AblOs2iOrNnQ==", + "dev": true, "hasInstallScript": true, "license": "MIT", "optional": true, @@ -5664,6 +5672,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5684,6 +5693,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5704,6 +5714,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5724,6 +5735,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5744,6 +5756,7 @@ "cpu": [ "arm" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5764,6 +5777,7 @@ "cpu": [ "arm" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5784,6 +5798,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5804,6 +5819,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5824,6 +5840,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5844,6 +5861,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5864,6 +5882,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5884,6 +5903,7 @@ "cpu": [ "ia32" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5904,6 +5924,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -5993,6 +6014,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6009,6 +6031,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6025,6 +6048,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6041,6 +6065,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6057,6 +6082,7 @@ "cpu": [ "arm" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6073,9 +6099,7 @@ "cpu": [ "arm64" ], - "libc": [ - "glibc" - ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6092,9 +6116,7 @@ "cpu": [ "arm64" ], - "libc": [ - "musl" - ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6111,9 +6133,7 @@ "cpu": [ "ppc64" ], - "libc": [ - "glibc" - ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6130,9 +6150,7 @@ "cpu": [ "s390x" ], - "libc": [ - "glibc" - ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6149,9 +6167,7 @@ "cpu": [ "x64" ], - "libc": [ - "glibc" - ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6168,9 +6184,7 @@ "cpu": [ "x64" ], - "libc": [ - "musl" - ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6187,6 +6201,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6203,6 +6218,7 @@ "cpu": [ "wasm32" ], + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -6218,6 +6234,7 @@ "version": "1.11.1", "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.11.1.tgz", "integrity": "sha512-RSvbQmHzdKzNsLYa/wHrbc3KN4sYLKAdPZxqiM2HATqv/SBk2/ENSHpvXGaLOMcsAyz0poEGqkmmKYG3OWiJEQ==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -6229,6 +6246,7 @@ "version": "1.11.1", "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.11.1.tgz", "integrity": "sha512-vgj7R3y3Wgx24IQaGPA/R6YFXLHVMOZ0uVEyIQPaWs+rd1AzfEMXlAC22FYwO1XkKR6NPsq7mUandH8oIRdZFw==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -6239,6 +6257,7 @@ "version": "1.2.2", "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.2.tgz", "integrity": "sha512-c95qOXkHdydNKhscBTebqEC1CVAZpyqOfVfBzQ1qgzyl3gfeldUjIggDbIZgDKsHLgnsM+igH7TJ/eAasaVuMA==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -6249,6 +6268,7 @@ "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "dev": true, "license": "0BSD", "optional": true }, @@ -6259,6 +6279,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6275,6 +6296,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -6945,6 +6967,7 @@ "version": "0.10.3", "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.3.tgz", "integrity": "sha512-F3fo1MYrRJYL3zER0OUOmkutjr1Vp23m7OsSgp7nq4SP6OqX6C/56XFIPAl5bt3zaBRjmW7SGz3u/6LwFpYcOg==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -6955,6 +6978,7 @@ "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", + "dev": true, "license": "0BSD", "optional": true }, @@ -7074,7 +7098,7 @@ "version": "25.9.1", "resolved": "https://registry.npmjs.org/@types/node/-/node-25.9.1.tgz", "integrity": "sha512-xfrlY7UD5rMJk3ZVJP8BNzS28J36YJg+xp+LPXV1TdWxr8uMH5A860QNxYDGQe/ylDSgjxE52Q9VnO7p75tJxg==", - "devOptional": true, + "dev": true, "license": "MIT", "dependencies": { "undici-types": ">=7.24.0 <7.24.7" @@ -8884,7 +8908,7 @@ "version": "0.5.2", "resolved": "https://registry.npmjs.org/colorjs.io/-/colorjs.io-0.5.2.tgz", "integrity": "sha512-twmVoizEW7ylZSN32OgKdXRmo1qg+wT5/6C3xu5b9QsWzSFAhHLn2xd8ro0diCsKfCj1RdaTP/nrcW+vAoQPIw==", - "devOptional": true, + "dev": true, "license": "MIT" }, "node_modules/colors": { @@ -10565,6 +10589,7 @@ "version": "2.3.3", "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz", "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==", + "dev": true, "hasInstallScript": true, "license": "MIT", "optional": true, @@ -10854,7 +10879,7 @@ "version": "4.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", - "devOptional": true, + "dev": true, "license": "MIT", "engines": { "node": ">=8" @@ -11066,7 +11091,7 @@ "version": "5.1.5", "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz", "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==", - "devOptional": true, + "dev": true, "license": "MIT" }, "node_modules/import-fresh": { @@ -11214,7 +11239,7 @@ "version": "2.1.1", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==", - "devOptional": true, + "dev": true, "license": "MIT", "engines": { "node": ">=0.10.0" @@ -11250,7 +11275,7 @@ "version": "4.0.3", "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz", "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==", - "devOptional": true, + "dev": true, "license": "MIT", "dependencies": { "is-extglob": "^2.1.1" @@ -12563,6 +12588,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12583,6 +12609,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12603,6 +12630,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12623,6 +12651,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12643,6 +12672,7 @@ "cpu": [ "arm" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12663,6 +12693,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12683,6 +12714,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12703,6 +12735,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12723,6 +12756,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12743,6 +12777,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -12763,6 +12798,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MPL-2.0", "optional": true, "os": [ @@ -13616,6 +13652,7 @@ "version": "7.1.1", "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-7.1.1.tgz", "integrity": "sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==", + "dev": true, "license": "MIT", "optional": true }, @@ -16857,7 +16894,7 @@ "version": "7.8.2", "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz", "integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==", - "devOptional": true, + "dev": true, "license": "Apache-2.0", "dependencies": { "tslib": "^2.1.0" @@ -16867,7 +16904,7 @@ "version": "2.8.1", "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz", "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==", - "devOptional": true, + "dev": true, "license": "0BSD" }, "node_modules/safe-buffer": { @@ -16902,6 +16939,7 @@ "version": "1.100.0", "resolved": "https://registry.npmjs.org/sass/-/sass-1.100.0.tgz", "integrity": "sha512-B5j0rYMlinhhOo9tjQebMVVn0TfyXAF+wB3b2ggZUuJ/is/Y+7+JGjirAMxHZ9Z3hIP98NPfamlAkBHa1lAaXQ==", + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -16923,7 +16961,7 @@ "version": "1.100.0", "resolved": "https://registry.npmjs.org/sass-embedded/-/sass-embedded-1.100.0.tgz", "integrity": "sha512-Ut8wlQSk19tm7jMK6mz6cF1+e+E7tUnW2tM02zQDPnOTcVbV8qCQG8UWxZkkNlY50+hV3hqP24OOkUlMz8xBpw==", - "devOptional": true, + "dev": true, "license": "MIT", "dependencies": { "@bufbuild/protobuf": "^2.5.0", @@ -16971,6 +17009,7 @@ "!riscv64", "!x64" ], + "dev": true, "license": "MIT", "optional": true, "dependencies": { @@ -16984,6 +17023,7 @@ "cpu": [ "arm" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17000,6 +17040,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17016,6 +17057,7 @@ "cpu": [ "riscv64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17032,6 +17074,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17048,6 +17091,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17064,6 +17108,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17080,6 +17125,7 @@ "cpu": [ "arm" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17096,6 +17142,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17112,6 +17159,7 @@ "cpu": [ "arm" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17128,6 +17176,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17144,6 +17193,7 @@ "cpu": [ "riscv64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17160,6 +17210,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17176,6 +17227,7 @@ "cpu": [ "riscv64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17192,6 +17244,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17205,6 +17258,7 @@ "version": "1.100.0", "resolved": "https://registry.npmjs.org/sass-embedded-unknown-all/-/sass-embedded-unknown-all-1.100.0.tgz", "integrity": "sha512-c+naBgWId4MIpToXcI0DgqetjdAkwTTAxFAuOaBz7HUXLdyG1oZRrEvSsbe41nEdQOKH0vgofVFCeSQgoXOG9A==", + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17224,6 +17278,7 @@ "cpu": [ "arm64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17240,6 +17295,7 @@ "cpu": [ "x64" ], + "dev": true, "license": "MIT", "optional": true, "os": [ @@ -17253,7 +17309,7 @@ "version": "8.1.1", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz", "integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==", - "devOptional": true, + "dev": true, "license": "MIT", "dependencies": { "has-flag": "^4.0.0" @@ -18373,7 +18429,7 @@ "version": "1.0.2", "resolved": "https://registry.npmjs.org/sync-child-process/-/sync-child-process-1.0.2.tgz", "integrity": "sha512-8lD+t2KrrScJ/7KXCSyfhT3/hRq78rC0wBFqNJXv3mZyn6hW2ypM05JmlSvtqRbeq6jqA94oHbxAr2vYsJ8vDA==", - "devOptional": true, + "dev": true, "license": "MIT", "dependencies": { "sync-message-port": "^1.0.0" @@ -18386,7 +18442,7 @@ "version": "1.2.0", "resolved": "https://registry.npmjs.org/sync-message-port/-/sync-message-port-1.2.0.tgz", "integrity": "sha512-gAQ9qrUN/UCypHtGFbbe7Rc/f9bzO88IwrG8TDo/aMKAApKyD6E3W4Cm0EfhfBb6Z6SKt59tTCTfD+n1xmAvMg==", - "devOptional": true, + "dev": true, "license": "MIT", "engines": { "node": ">=16.0.0" @@ -18843,7 +18899,7 @@ "version": "7.24.6", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.24.6.tgz", "integrity": "sha512-WRNW+sJgj5OBN4/0JpHFqtqzhpbnV0GuB+OozA9gCL7a993SmU+1JBZCzLNxYsbMfIeDL+lTsphD5jN5N+n0zg==", - "devOptional": true, + "dev": true, "license": "MIT" }, "node_modules/unicode-canonical-property-names-ecmascript": { @@ -19112,7 +19168,7 @@ "version": "6.0.0", "resolved": "https://registry.npmjs.org/varint/-/varint-6.0.0.tgz", "integrity": "sha512-cXEIW6cfr15lFv563k4GuVuW/fiwjknytD37jIOLSdSWuOI6WnO/oKwmP2FQTU2l01LP8/M5TSAJpzUaGe3uWg==", - "devOptional": true, + "dev": true, "license": "MIT" }, "node_modules/verror": { diff --git a/package.json b/package.json index fe2aec3e9..97214ab90 100644 --- a/package.json +++ b/package.json @@ -15,7 +15,7 @@ "dependencies": { "@bimdata/bcf-components": "6.7.7", "@bimdata/components": "1.10.1", - "@bimdata/design-system": "2.4.2", + "@bimdata/design-system": "3.0.0-beta.46", "@bimdata/typescript-fetch-api-client": "10.44.2", "@bimdata/viewer": "2.18.0-beta.3", "@paddle/paddle-js": "^1.6.4", diff --git a/src/AppLayout.vue b/src/AppLayout.vue index 20b671b1e..3d95027bf 100644 --- a/src/AppLayout.vue +++ b/src/AppLayout.vue @@ -14,24 +14,29 @@ - -
- -
- -
- + +
+
+ +
+
+
- + +
+ +
+ +
+ + diff --git a/src/components/specific/app/app-sidebar/app-sidebar-item/AppSidebarItem.scss b/src/components/specific/app/app-sidebar/app-sidebar-item/AppSidebarItem.scss new file mode 100644 index 000000000..2812983ed --- /dev/null +++ b/src/components/specific/app/app-sidebar/app-sidebar-item/AppSidebarItem.scss @@ -0,0 +1,51 @@ +.app-sidebar-item { + display: flex; + justify-content: center; + + &__target { + display: flex; + justify-content: center; + align-items: center; + width: 40px; + height: 40px; + padding: 0; + border: none; + border-radius: 10px; + background-color: transparent; + color: var(--color-granite-light); + cursor: pointer; + text-decoration: none; + transition: + background-color 0.2s ease, + color 0.2s ease; + + &:hover { + background-color: var(--color-tertiary-lightest, #f7f7f7); + color: var(--color-primary); + } + + &.router-link-active { + background-color: var(--color-primary); + color: var(--color-white); + } + } + + &__icon { + position: relative; + display: flex; + justify-content: center; + align-items: center; + line-height: 0; + } + + &__notif { + position: absolute; + top: -4px; + right: -4px; + width: 7px; + height: 7px; + border-radius: 50%; + border: 1px solid var(--color-white); + background-color: var(--color-high); + } +} diff --git a/src/components/specific/app/app-sidebar/app-sidebar-item/AppSidebarItem.vue b/src/components/specific/app/app-sidebar/app-sidebar-item/AppSidebarItem.vue new file mode 100644 index 000000000..120e5b7b0 --- /dev/null +++ b/src/components/specific/app/app-sidebar/app-sidebar-item/AppSidebarItem.vue @@ -0,0 +1,59 @@ + + + + + diff --git a/src/components/specific/dashboard/dashboard-action-tile/DashboardActionTile.scss b/src/components/specific/dashboard/dashboard-action-tile/DashboardActionTile.scss new file mode 100644 index 000000000..f3f935e13 --- /dev/null +++ b/src/components/specific/dashboard/dashboard-action-tile/DashboardActionTile.scss @@ -0,0 +1,60 @@ +.dashboard-action-tile { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + gap: calc(var(--spacing-unit) * 2); + width: 100%; + height: 100%; + min-height: 260px; + padding: calc(var(--spacing-unit) * 3); + border: none; + border-radius: 20px; + background-color: var(--color-white); + box-shadow: var(--box-shadow); + color: var(--color-primary); + text-align: center; + font-family: inherit; + text-decoration: none; + + cursor: pointer; + transition-duration: 0.35s; + &:hover { + transform: translateY(-2px); + } + + &__title { + font-size: 22px; + font-weight: 500; + color: var(--color-primary); + } + + &__text { + max-width: 340px; + font-size: 16px; + line-height: 24px; + color: var(--color-granite-light); + } + + &__action { + display: flex; + align-items: center; + gap: var(--spacing-unit); + + &__icon { + display: flex; + align-items: center; + justify-content: center; + width: 45px; + height: 45px; + border-radius: 50%; + background-color: var(--color-primary); + color: var(--color-white); + } + + &__label { + font-size: 14px; + color: var(--color-primary); + } + } +} diff --git a/src/components/specific/dashboard/dashboard-action-tile/DashboardActionTile.vue b/src/components/specific/dashboard/dashboard-action-tile/DashboardActionTile.vue new file mode 100644 index 000000000..3ade9db8e --- /dev/null +++ b/src/components/specific/dashboard/dashboard-action-tile/DashboardActionTile.vue @@ -0,0 +1,56 @@ + + + + + diff --git a/src/components/specific/dashboard/dashboard-button-tile/DashboardButtonTile.scss b/src/components/specific/dashboard/dashboard-button-tile/DashboardButtonTile.scss index ca2b0e0bb..546e5bc8c 100644 --- a/src/components/specific/dashboard/dashboard-button-tile/DashboardButtonTile.scss +++ b/src/components/specific/dashboard/dashboard-button-tile/DashboardButtonTile.scss @@ -1,41 +1,75 @@ .dashboard-button-tile { - padding: calc(var(--spacing-unit) * 2); + --tile-accent: var(--color-primary); + --tile-button-bg: var(--color-primary); + --tile-button-color: var(--color-white); + display: flex; flex-direction: column; + align-items: center; + justify-content: center; gap: calc(var(--spacing-unit) * 2); - border-radius: var(--spacing-unit); - box-shadow: var(--box-shadow); + height: 100%; + min-height: 260px; + padding: calc(var(--spacing-unit) * 3); + border-radius: 20px; background-color: var(--color-white); cursor: pointer; transition-duration: 0.35s; &:hover { - transform: scale(1.02); + transform: translateY(-2px); } - &__title { - font-size: 1.5rem; + &__icon { + display: flex; + align-items: center; + justify-content: center; + width: 70px; + height: 70px; + border-radius: 50%; + background-color: var(--color-white); + color: var(--tile-accent); + } + + &__count { + font-size: 60px; font-weight: bold; + line-height: 1; + color: var(--tile-accent); } - &__content { - flex-grow: 1; + &__label { + margin-top: calc(var(--spacing-unit) * -1); + font-size: 16px; + font-weight: bold; + color: var(--tile-accent); } - &__bottom-text { + &__button { display: flex; align-items: center; - font-size: 13px; - text-transform: uppercase; + justify-content: center; + width: 225px; + max-width: 100%; + height: 50px; + border-radius: 50px; + background-color: var(--tile-button-bg); + color: var(--tile-button-color); + font-size: 16px; } - &.primary { - background-color: var(--color-primary); - color: var(--color-white); + &.spaces { + --tile-accent: #205dbd; + --tile-button-bg: #205dbd; + --tile-button-color: var(--color-white); + background-color: #dee7f5; } - &.secondary { - background-color: var(--color-secondary); - color: var(--color-primary); + &.projects { + --tile-accent: var(--color-secondary); + --tile-button-bg: var(--color-secondary); + --tile-button-color: var(--color-primary); + background-color: #fef6df; } } + diff --git a/src/components/specific/dashboard/dashboard-button-tile/DashboardButtonTile.vue b/src/components/specific/dashboard/dashboard-button-tile/DashboardButtonTile.vue index 5b8aa9814..2eb5892af 100644 --- a/src/components/specific/dashboard/dashboard-button-tile/DashboardButtonTile.vue +++ b/src/components/specific/dashboard/dashboard-button-tile/DashboardButtonTile.vue @@ -1,14 +1,16 @@ @@ -19,6 +21,10 @@ export default { color: { type: String, default: "" + }, + buttonText: { + type: String, + default: "" } } }; diff --git a/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.scss b/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.scss index fda4f7c53..4eb57d78a 100644 --- a/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.scss +++ b/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.scss @@ -2,17 +2,33 @@ padding: var(--spacing-unit); &__title { - margin-bottom: var(--spacing-unit); + display: inline-flex; + align-items: center; + gap: var(--spacing-unit); + margin-bottom: calc(var(--spacing-unit) * 2); + color: var(--color-primary); font-size: 1.2rem; font-weight: bold; + text-decoration: none; - :not(.isCarousel) { - padding-left: var(--spacing-unit); + :deep(.bimdata-icon) { + display: flex; + align-items: center; + justify-content: center; + width: 26px; + height: 26px; + border-radius: 50%; + background-color: var(--color-tertiary-lightest, #f7f7f7); + } + + &:hover { + text-decoration: underline; } } &__content { display: flex; + flex-wrap: wrap; gap: 20px; } } diff --git a/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.vue b/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.vue index fb6e254ec..7dad8ada3 100644 --- a/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.vue +++ b/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.vue @@ -1,39 +1,43 @@ diff --git a/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.scss b/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.scss index e85fca083..b2dd20deb 100644 --- a/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.scss +++ b/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.scss @@ -2,17 +2,34 @@ padding: var(--spacing-unit); &__title { - margin-bottom: var(--spacing-unit); + display: inline-flex; + align-items: center; + gap: var(--spacing-unit); + margin-bottom: calc(var(--spacing-unit) * 2); + color: var(--color-primary); font-size: 1.2rem; font-weight: bold; + text-decoration: none; - :not(.isCarousel) { - padding-left: var(--spacing-unit); + :deep(.bimdata-icon) { + display: flex; + align-items: center; + justify-content: center; + width: 26px; + height: 26px; + border-radius: 50%; + background-color: var(--color-tertiary-lightest, #f7f7f7); + } + + &:hover { + text-decoration: underline; } } - + &__content { display: flex; + flex-wrap: wrap; gap: 20px; } } + diff --git a/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.vue b/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.vue index 2453bc78e..fc3982cb0 100644 --- a/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.vue +++ b/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.vue @@ -1,12 +1,18 @@ diff --git a/src/components/specific/spaces/space-card/space-card-action-menu/SpaceCardActionMenu.vue b/src/components/specific/spaces/space-card/space-card-action-menu/SpaceCardActionMenu.vue index 042a623c8..49824c7e2 100644 --- a/src/components/specific/spaces/space-card/space-card-action-menu/SpaceCardActionMenu.vue +++ b/src/components/specific/spaces/space-card/space-card-action-menu/SpaceCardActionMenu.vue @@ -1,15 +1,14 @@