-
-
-
@@ -133,16 +123,24 @@ export default {
UserAvatar
},
setup() {
+ const router = useRouter();
const { signOut } = useAuth();
const { currentSpace } = useSpaces();
const { user } = useUser();
+ const { isOpen, close, toggle } = useToggle();
+
const {
isOpen: showLanguageSelector,
open: openLanguageSelector,
close: closeLanguageSelector
} = useToggle();
+ const goToProfile = () => {
+ close();
+ router.push({ name: routeNames.userProfile });
+ };
+
const bimdataConnectProfileUrl =
ENV.VUE_APP_URL_BIMDATACONNECT + "/profile/";
const documentationUrl = ENV.VUE_APP_URL_DOCUMENTATION;
@@ -155,15 +153,19 @@ export default {
documentationUrl,
marketPlaceUrl,
isSubscriptionEnabled: IS_SUBSCRIPTION_ENABLED,
+ isOpen,
routeNames,
showLanguageSelector,
space: currentSpace,
user,
userIframeProfile,
// Methods
+ close,
+ toggle,
+ goToProfile,
closeLanguageSelector,
openLanguageSelector,
- router: useRouter(),
+ router,
fullName,
signOut
};
diff --git a/src/components/specific/app/app-sidebar/AppSidebar.scss b/src/components/specific/app/app-sidebar/AppSidebar.scss
new file mode 100644
index 000000000..e421cf61d
--- /dev/null
+++ b/src/components/specific/app/app-sidebar/AppSidebar.scss
@@ -0,0 +1,46 @@
+.app-sidebar {
+ flex-shrink: 0;
+ height: 100%;
+ padding: var(--spacing-unit);
+
+ &__rail {
+ position: relative;
+ z-index: 100;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: calc(var(--spacing-unit) * 2);
+ width: 56px;
+ height: 100%;
+ padding: calc(var(--spacing-unit) * 2) 0;
+ border-radius: 13px;
+ background-color: var(--color-white);
+ box-shadow: var(--box-shadow);
+ }
+
+ &__logo {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ height: 34px;
+ margin-bottom: var(--spacing-unit);
+ }
+
+ &__logo-mark {
+ width: auto;
+ height: 26px;
+ }
+
+ &__nav {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: var(--spacing-unit);
+ }
+
+ &__bottom {
+ margin-top: auto;
+ display: flex;
+ justify-content: center;
+ }
+}
diff --git a/src/components/specific/app/app-sidebar/AppSidebar.vue b/src/components/specific/app/app-sidebar/AppSidebar.vue
new file mode 100644
index 000000000..b7fa56861
--- /dev/null
+++ b/src/components/specific/app/app-sidebar/AppSidebar.vue
@@ -0,0 +1,104 @@
+
+
+
+
+
+
+
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/app/go-back-button/GoBackButton.vue b/src/components/specific/app/go-back-button/GoBackButton.vue
index a4740779a..5e40aa823 100644
--- a/src/components/specific/app/go-back-button/GoBackButton.vue
+++ b/src/components/specific/app/go-back-button/GoBackButton.vue
@@ -1,16 +1,6 @@
-
-
+
+ {{ title }}
+ {{ text }}
+
+
+
+
+
+
+
+
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..fb7c77b51 100644
--- a/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.scss
+++ b/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.scss
@@ -1,18 +1,33 @@
.dashboard-project-list {
- 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;
+
+ :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);
+ }
- :not(.isCarousel) {
- padding-left: var(--spacing-unit);
+ &:hover {
+ text-decoration: underline;
}
}
&__content {
display: flex;
- gap: 20px;
+ flex-wrap: nowrap;
+ justify-content: flex-start;
+ gap: var(--spacing-unit);
}
}
diff --git a/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.vue b/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.vue
index fb6e254ec..fee11cadc 100644
--- a/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.vue
+++ b/src/components/specific/dashboard/dashboard-project-list/DashboardProjectList.vue
@@ -1,56 +1,76 @@
-
+
+
+
+
+
+
+
+
diff --git a/src/components/specific/models/model-location/ModelLocation.css b/src/components/specific/models/model-location/ModelLocation.css
index 3e3c6abbe..55476eef2 100644
--- a/src/components/specific/models/model-location/ModelLocation.css
+++ b/src/components/specific/models/model-location/ModelLocation.css
@@ -13,8 +13,8 @@
.model-location__map__edit-btn {
position: absolute;
z-index: 1;
- top: 0;
- right: 0;
+ top: var(--spacing-unit);
+ right: var(--spacing-unit);
}
}
diff --git a/src/components/specific/models/model-location/ModelLocation.vue b/src/components/specific/models/model-location/ModelLocation.vue
index 4227fa3e9..09ba3e6b5 100644
--- a/src/components/specific/models/model-location/ModelLocation.vue
+++ b/src/components/specific/models/model-location/ModelLocation.vue
@@ -24,8 +24,9 @@
width="36px"
height="36px"
fill
- square
+ radius
icon
+ color="white"
@click="openLocationForm"
>
- {{ $t("DashboardProjectList.title") }}
+
+ {{ $t("DashboardProjectList.title") }}
+
+
-
diff --git a/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.scss b/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.scss
index e85fca083..5e9a1df8c 100644
--- a/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.scss
+++ b/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.scss
@@ -1,18 +1,33 @@
.dashboard-space-list {
- 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;
+
+ :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);
+ }
- :not(.isCarousel) {
- padding-left: var(--spacing-unit);
+ &:hover {
+ text-decoration: underline;
}
}
-
+
&__content {
display: flex;
- gap: 20px;
+ flex-wrap: nowrap;
+ justify-content: flex-start;
+ gap: var(--spacing-unit);
}
}
diff --git a/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.vue b/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.vue
index 2453bc78e..6fa1b603c 100644
--- a/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.vue
+++ b/src/components/specific/dashboard/dashboard-space-list/DashboardSpaceList.vue
@@ -1,57 +1,91 @@
+
-
-
+
+ {{ $t("DashboardSpaceList.title") }}
+
+
diff --git a/src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTile.scss b/src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTile.scss
deleted file mode 100644
index ae15b3251..000000000
--- a/src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTile.scss
+++ /dev/null
@@ -1,28 +0,0 @@
-.dashboard-welcome-tile {
- display: grid;
- grid-template-rows: 2fr 1fr;
- grid-template-columns: 80px auto;
- grid-template-areas:
- "logo title"
- "logo message";
- gap: var(--spacing-unit);
- margin: 0 calc(var(--spacing-unit) / 2);
- color: var(--color-primary);
-
- &__logo {
- grid-area: logo;
- justify-self: center;
- align-self: center;
- }
-
- &__title {
- grid-area: title;
- align-self: end;
- font-size: 34px;
- font-weight: bold;
- }
-
- &__message {
- grid-area: message;
- }
-}
diff --git a/src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTile.vue b/src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTile.vue
deleted file mode 100644
index c6c4c557a..000000000
--- a/src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTile.vue
+++ /dev/null
@@ -1,35 +0,0 @@
-
-
- {{ $t("DashboardSpaceList.title") }}
-
-
+
-
-
-
-
-
-
-
diff --git a/src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTileImage.vue b/src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTileImage.vue
deleted file mode 100644
index 0ac787fc4..000000000
--- a/src/components/specific/dashboard/dashboard-welcome-tile/DashboardWelcomeTileImage.vue
+++ /dev/null
@@ -1,44 +0,0 @@
-
-
-
diff --git a/src/components/specific/models/model-location-card/ModelLocationCard.scss b/src/components/specific/models/model-location-card/ModelLocationCard.scss
new file mode 100644
index 000000000..a2506c52a
--- /dev/null
+++ b/src/components/specific/models/model-location-card/ModelLocationCard.scss
@@ -0,0 +1,33 @@
+.model-location-card {
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ border-radius: 20px;
+ background-color: var(--color-white);
+ overflow: hidden;
+
+ &__header {
+ display: flex;
+ align-items: center;
+ gap: calc(var(--spacing-unit) / 2);
+ height: 50px;
+ padding: 0 calc(var(--spacing-unit) * 2);
+ color: var(--color-primary);
+ font-size: 14px;
+ font-weight: 500;
+
+ &__title {
+ line-height: 1;
+ }
+ }
+
+ &__body {
+ position: relative;
+ flex: 1 1 auto;
+ min-height: 0;
+
+ :deep(.model-location) {
+ height: 100%;
+ }
+ }
+}
diff --git a/src/components/specific/models/model-location-card/ModelLocationCard.vue b/src/components/specific/models/model-location-card/ModelLocationCard.vue
new file mode 100644
index 000000000..3400e29a1
--- /dev/null
+++ b/src/components/specific/models/model-location-card/ModelLocationCard.vue
@@ -0,0 +1,36 @@
+
+
+
+
-
- "
},
"DashboardProjectList": {
- "title": "Recente projecten"
+ "title": "Alle recente projecten bekijken"
},
"DashboardSpaceList": {
- "title": "Recente ruimtes"
+ "title": "Alle recente ruimtes bekijken"
},
"DashboardWelcomeTile": {
"title": "Dashboard",
@@ -143,6 +151,7 @@
"view3dUnavailable": "De 3D-weergave is niet beschikbaar, probeer de bèta"
},
"ModelLocation": {
+ "title": "Locatie & Voetafdruk",
"emptyLocationMessage": "Geen locatiegegevens beschikbaar",
"addLocationButtonText": "Invullen"
},
@@ -176,7 +185,8 @@
"inputPlaceholder": "Naam van uw samenvoeging"
},
"ModelsOverview": {
- "title": "Overzicht projectmodellen"
+ "title": "Immersieve 3D-modellering",
+ "selectPreviewButton": "Voorbeeld kiezen"
},
"ModelsOverviewOnboarding": {
"text": "Upload uw eerste model",
@@ -374,7 +384,15 @@
"projectsTileBottomText": "Projecten bekeken",
"subscriptionsTileTitle": "Facturering en facturen",
"subscriptionsTileText": "Vind hier al je rekeningen en de laatste betalingsinformatie.",
- "subscriptionsTileBottomText": "Abonnementen beheren"
+ "subscriptionsTileBottomText": "Abonnementen beheren",
+ "welcome": "Hoi {name}, het is goed je weer te zien!",
+ "spacesTileLabel": "actieve ruimtes",
+ "spacesTileButton": "Alle ruimtes bekijken",
+ "projectsTileLabel": "actieve projecten",
+ "projectsTileButton": "Alle projecten bekijken",
+ "createSpaceTitle": "Maak uw nieuwe ruimte",
+ "createSpaceText": "Organiseer uw projecten en werk samen met uw team in een nieuwe ruimte.",
+ "createSpaceButton": "Ruimte maken"
},
"Subscribe": {
"title": "Je abonnement kiezen",
@@ -530,6 +548,13 @@
"selectedOrga": "Factureringsaccount:",
"selectedSpace": "Geselecteerde ruimte:"
},
+ "ProjectStorageInfo": {
+ "title": "Opslag",
+ "usage": "{used} / {total}",
+ "currentProject": "Dit project",
+ "otherProjects": "Andere projecten"
+ },
+
"SpaceSizeInfo": {
"subscribePlatformButton": "Upgrade naar pro-abonnement",
"usage": "{gebruikt} gebruikt van {totaal}"
diff --git a/src/i18n/lang/no.json b/src/i18n/lang/no.json
index 610a8e9d8..2e658af2d 100644
--- a/src/i18n/lang/no.json
+++ b/src/i18n/lang/no.json
@@ -1,4 +1,12 @@
{
+ "AppSidebar": {
+ "home": "Hjem",
+ "spaces": "Områder",
+ "projects": "Prosjekter",
+ "invitations": "Invitasjoner",
+ "favorites": "Favoritter",
+ "subscription": "Abonnement"
+ },
"OidcCallbackError": {
"message": "En feil oppsto under autentiseringen...",
"retryButtonText": ""
@@ -38,10 +46,10 @@
"placeholder": "< Ingen prosjekt >"
},
"DashboardProjectList": {
- "title": "Nylige prosjekter"
+ "title": "Se alle nylige prosjekter"
},
"DashboardSpaceList": {
- "title": "Nylige rom"
+ "title": "Se alle nylige områder"
},
"DashboardWelcomeTile": {
"title": "Dashbord",
@@ -143,6 +151,7 @@
"view3dUnavailable": "3D-visningen er ikke tilgjengelig, prøv betaen"
},
"ModelLocation": {
+ "title": "Plassering & Fotavtrykk",
"emptyLocationMessage": "Ingen plasseringsdata tilgjengelig",
"addLocationButtonText": "Fyll ut"
},
@@ -176,7 +185,8 @@
"inputPlaceholder": "Navn på sammenslåingen"
},
"ModelsOverview": {
- "title": "Oversikt over prosjektmodeller"
+ "title": "Immersiv 3D-modellering",
+ "selectPreviewButton": "Velg forhåndsvisning"
},
"ModelsOverviewOnboarding": {
"text": "Last opp den første modellen din",
@@ -374,7 +384,15 @@
"projectsTileBottomText": "Se prosjekter",
"subscriptionsTileTitle": "Fakturahåndtering",
"subscriptionsTileText": "Finn alle dine fakturaer og informasjon om dine siste betalinger her.",
- "subscriptionsTileBottomText": "Administrer abonnementer"
+ "subscriptionsTileBottomText": "Administrer abonnementer",
+ "welcome": "Hei, {name}, fint å se deg igjen!",
+ "spacesTileLabel": "aktive områder",
+ "spacesTileButton": "Se alle områder",
+ "projectsTileLabel": "aktive prosjekter",
+ "projectsTileButton": "Se alle prosjekter",
+ "createSpaceTitle": "Opprett ditt nye område",
+ "createSpaceText": "Organiser prosjektene dine og samarbeid med teamet ditt i et nytt område.",
+ "createSpaceButton": "Opprett område"
},
"Subscribe": {
"title": "Velg din plan",
@@ -530,6 +548,13 @@
"selectedOrga": "Faktureringskonto:",
"selectedSpace": "Valgt område:"
},
+ "ProjectStorageInfo": {
+ "title": "Lagring",
+ "usage": "{used} / {total}",
+ "currentProject": "Dette prosjektet",
+ "otherProjects": "Andre prosjekter"
+ },
+
"SpaceSizeInfo": {
"subscribePlatformButton": "Oppgrader til pro-abonnement",
"usage": "{used} benyttet av {total}"
diff --git a/src/styles/layout.scss b/src/styles/layout.scss
index a089be762..36438d57f 100644
--- a/src/styles/layout.scss
+++ b/src/styles/layout.scss
@@ -1,12 +1,34 @@
.app-layout {
+ display: flex;
width: 100%;
height: 100vh;
background-color: var(--platform-background);
+ &__main {
+ position: relative;
+ flex: 1;
+ min-width: 0;
+ height: 100%;
+ }
+
+ &__header-action {
+ position: absolute;
+ z-index: 90;
+ top: calc(var(--spacing-unit) * 2);
+ left: calc(var(--spacing-unit) * 2);
+ display: flex;
+ align-items: center;
+ height: var(--platform-header-height);
+ padding: 0 var(--spacing-unit);
+ border-radius: 13px;
+ background-color: var(--color-white);
+ box-shadow: var(--box-shadow);
+ }
+
&__view-container {
position: relative;
- height: calc(100% - var(--platform-header-height));
- padding: calc(var(--spacing-unit) * 7 / 2);
+ height: 100%;
+ padding: calc(var(--spacing-unit) * 4 / 2);
overflow-y: auto;
&.loading {
@@ -17,10 +39,10 @@
&__overlay {
position: absolute;
z-index: 1000;
- top: var(--platform-header-height);
+ top: 0;
left: 0;
width: 100%;
- height: calc(100% - var(--platform-header-height));
+ height: 100%;
background-color: var(--platform-background);
display: flex;
diff --git a/src/views/dashboard/Dashboard.scss b/src/views/dashboard/Dashboard.scss
index 2cec13a49..19c060360 100644
--- a/src/views/dashboard/Dashboard.scss
+++ b/src/views/dashboard/Dashboard.scss
@@ -1,81 +1,71 @@
@use "/src/styles/mixins.scss";
.dashboard {
- --tile-width: 300px; // miminum tile width
- --tile-height: 240px;
+ --tile-width: 300px; // minimum tile width
+ // Minimum width to hold exactly 3 cards with a small gap between them.
+ --spaces-min-width: calc(215px * 3 + var(--spacing-unit) * 2);
+ --projects-min-width: calc(320px * 3 + var(--spacing-unit) * 2);
- &__head {
+ display: flex;
+ flex-direction: column;
+ min-height: 100%;
+ gap: calc(var(--spacing-unit) * 3);
+
+ &__welcome {
+ margin: 0;
+ color: var(--color-primary);
+ font-size: 2rem;
+ font-weight: bold;
+ }
+
+ &__tiles {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(var(--tile-width), 1fr));
- grid-template-rows: repeat(auto-fit, var(--tile-height));
gap: calc(var(--spacing-unit) * 2);
- .app-link > .dashboard-button-tile {
+ .app-link {
height: 100%;
}
}
&__body {
- margin: calc(var(--spacing-unit) * 3) 0;
+ flex: 1;
display: flex;
+ flex-wrap: wrap;
+ align-items: flex-start;
gap: calc(var(--spacing-unit) * 2);
- &__left {
- flex-grow: 1;
- }
+ &__section {
+ min-width: 0;
- &__right {
- padding-top: calc(var(--spacing-unit) * 4.5);
- padding-bottom: calc(var(--spacing-unit) * 2);
- }
+ // Proportional flex-grow (215*3 : 320*3) so section widths follow their content ratio.
+ // Right edge of the projects section aligns with the right edge of the tiles above.
+ &--spaces {
+ flex: 645 1 0;
+ min-width: min(100%, var(--spaces-min-width));
+ }
- &__down {
- display: flex;
- gap: calc(var(--spacing-unit) * 2);
+ &--projects {
+ flex: 960 1 0;
+ min-width: min(100%, var(--projects-min-width));
+ }
}
}
- .isSubscribeHorizontal {
- flex-direction: column;
- }
}
@include mixins.media-breakpoint-down(xxl) {
.dashboard {
- --tile-height: 200px;
-
- &__head {
+ &__tiles {
grid-template-columns: repeat(2, minmax(var(--tile-width), 1fr));
}
}
}
-@include mixins.media-breakpoint-down(xl) {
- .dashboard {
- &__body {
- flex-direction: column-reverse;
-
- &__right {
- padding: var(--spacing-unit) 0;
- }
- }
- }
-}
-
@include mixins.media-breakpoint-down(lg) {
.dashboard {
- &__head {
+ &__tiles {
grid-template-columns: 1fr;
-
- &:deep() {
- .dashboard-info-tile {
- height: var(--tile-height);
- }
-
- .app-link > .dashboard-button-tile {
- height: var(--tile-height);
- }
- }
}
}
}
diff --git a/src/views/dashboard/Dashboard.vue b/src/views/dashboard/Dashboard.vue
index 82f98020d..ab156c347 100644
--- a/src/views/dashboard/Dashboard.vue
+++ b/src/views/dashboard/Dashboard.vue
@@ -1,122 +1,121 @@
-
-
-
+
+
+
+
+
-
-
+
diff --git a/src/components/specific/users/user-role-badge/UserRoleBadge.scss b/src/components/specific/users/user-role-badge/UserRoleBadge.scss
index 42e7e809b..05d4f2b9c 100644
--- a/src/components/specific/users/user-role-badge/UserRoleBadge.scss
+++ b/src/components/specific/users/user-role-badge/UserRoleBadge.scss
@@ -1,28 +1,33 @@
.user-role-badge {
- border-radius: 4px;
- padding: 2px 6px;
+ height: 20px;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ padding: 3px 10px;
+ border-radius: 6px;
font-size: 12px;
font-weight: normal;
+ line-height: 1;
+ white-space: nowrap;
&--space-admin {
- background-color: var(--color-primary);
- color: var(--color-white);
- }
- &--space-user {
- background-color: #a375ff;
- color: var(--color-white);
- }
- &--project-admin {
background-color: var(--color-secondary);
color: var(--color-primary);
}
+
+ &--space-user,
&--project-user {
- background-color: var(--color-success);
+ background-color: #b4e5cc;
+ color: var(--color-primary);
+ }
+
+ &--project-admin {
+ background-color: var(--color-primary);
color: var(--color-white);
}
&--guest {
- background-color: var(--color-granite-light);
- color: var(--color-white);
+ background-color: var(--color-silver);
+ color: var(--color-primary);
}
}
diff --git a/src/i18n/lang/de.json b/src/i18n/lang/de.json
index d12b95fb7..a8da34b1e 100644
--- a/src/i18n/lang/de.json
+++ b/src/i18n/lang/de.json
@@ -1,4 +1,12 @@
{
+ "AppSidebar": {
+ "home": "Startseite",
+ "spaces": "Bereiche",
+ "projects": "Projekte",
+ "invitations": "Einladungen",
+ "favorites": "Favoriten",
+ "subscription": "Abonnement"
+ },
"OidcCallbackError": {
"message": "Bei der Authentifizierung ist ein Fehler aufgetreten...",
"retryButtonText": "Nochmals versuchen"
@@ -109,10 +117,10 @@
"placeholder": "( Kein Projekt )"
},
"DashboardProjectList": {
- "title": "Neueste Projekte"
+ "title": "Alle aktuellen Projekte anzeigen"
},
"DashboardSpaceList": {
- "title": "Neueste Bereiche"
+ "title": "Alle aktuellen Räume anzeigen"
},
"DashboardWelcomeTile": {
"title": "Dashboard",
@@ -226,6 +234,7 @@
"view3dUnavailable": "Die 3D-Ansicht ist nicht verfügbar, probieren Sie die Beta"
},
"ModelLocation": {
+ "title": "Standort & Grundfläche",
"emptyLocationMessage": "Keine Ortungsdaten verfügbar",
"addLocationButtonText": "Nachfragen"
},
@@ -260,7 +269,8 @@
"inputPlaceholder": "Name Ihrer IFC-Zusammenführung"
},
"ModelsOverview": {
- "title": "Projektübersicht"
+ "title": "Immersive 3D-Modellierung",
+ "selectPreviewButton": "Vorschau auswählen"
},
"ModelsOverviewOnboarding": {
"text": "Ihr erstes Modell hochladen",
@@ -457,7 +467,15 @@
"projectsTileBottomText": "Meine Projekte",
"subscriptionsTileTitle": "Abonnements",
"subscriptionsTileText": "Hier finden Sie alle Ihre Rechnungen und Ihre aktuellen Zahlungsinformationen.",
- "subscriptionsTileBottomText": "Meine Abonnements verwalten"
+ "subscriptionsTileBottomText": "Meine Abonnements verwalten",
+ "welcome": "Guten Tag {name}, schön, Sie wiederzusehen!",
+ "spacesTileLabel": "aktive Räume",
+ "spacesTileButton": "Alle Räume anzeigen",
+ "projectsTileLabel": "aktive Projekte",
+ "projectsTileButton": "Alle Projekte anzeigen",
+ "createSpaceTitle": "Erstellen Sie Ihren neuen Raum",
+ "createSpaceText": "Organisieren Sie Ihre Projekte und arbeiten Sie mit Ihrem Team in einem neuen Raum zusammen.",
+ "createSpaceButton": "Raum erstellen"
},
"Subscribe": {
"title": "Wählen Sie Ihr Abonnement",
@@ -613,6 +631,13 @@
"selectedOrga": "Ausgewählte Organisation:",
"selectedSpace": "Ausgewählter Raum:"
},
+ "ProjectStorageInfo": {
+ "title": "Speicher",
+ "usage": "{used} / {total}",
+ "currentProject": "Dieses Projekt",
+ "otherProjects": "Andere Projekte"
+ },
+
"SpaceSizeInfo": {
"subscribePlatformButton": "Zur Pro-Plattform wechseln",
"usage": "{used} verwendet auf {total}"
diff --git a/src/i18n/lang/en.json b/src/i18n/lang/en.json
index 34c903bab..e9ea2f215 100644
--- a/src/i18n/lang/en.json
+++ b/src/i18n/lang/en.json
@@ -1,4 +1,12 @@
{
+ "AppSidebar": {
+ "home": "Home",
+ "spaces": "Spaces",
+ "projects": "Projects",
+ "invitations": "Invitations",
+ "favorites": "Favorites",
+ "subscription": "Subscription"
+ },
"OidcCallbackError": {
"message": "An error occured during authentication...",
"retryButtonText": "Try Again"
@@ -177,10 +185,10 @@
"placeholder": "( No project )"
},
"DashboardProjectList": {
- "title": "Recent projects"
+ "title": "View all recent projects"
},
"DashboardSpaceList": {
- "title": "Recent spaces"
+ "title": "View all recent spaces"
},
"DashboardWelcomeTile": {
"title": "Dashboard",
@@ -296,6 +304,7 @@
"view3dUnavailable": "The 3D view is not available, try the beta"
},
"ModelLocation": {
+ "title": "Location & Footprint",
"emptyLocationMessage": "No location data available",
"addLocationButtonText": "Fill in"
},
@@ -330,7 +339,8 @@
"inputPlaceholder": "Name of your merge"
},
"ModelsOverview": {
- "title": "Project Models Overview"
+ "title": "Immersive 3D Modeling",
+ "selectPreviewButton": "Select preview"
},
"ModelsOverviewOnboarding": {
"text": "Upload your first model",
@@ -527,7 +537,15 @@
"projectsTileBottomText": "View projects",
"subscriptionsTileTitle": "Billing & Invoices",
"subscriptionsTileText": "Find all your invoices and your latest payment information here.",
- "subscriptionsTileBottomText": "Manage subscriptions"
+ "subscriptionsTileBottomText": "Manage subscriptions",
+ "welcome": "Hi {name}, it's great to see you again !",
+ "spacesTileLabel": "active spaces",
+ "spacesTileButton": "View all spaces",
+ "projectsTileLabel": "active projects",
+ "projectsTileButton": "View all projects",
+ "createSpaceTitle": "Create your new space",
+ "createSpaceText": "Organize your projects and collaborate with your team in a new space.",
+ "createSpaceButton": "Create a space"
},
"Subscribe": {
"title": "Choose your plan",
@@ -683,6 +701,13 @@
"selectedOrga": "Billing account:",
"selectedSpace": "Selected space:"
},
+ "ProjectStorageInfo": {
+ "title": "Storage",
+ "usage": "{used} / {total}",
+ "currentProject": "This project",
+ "otherProjects": "Other projects"
+ },
+
"SpaceSizeInfo": {
"subscribePlatformButton": "Upgrade to pro subscription",
"usage": "{used} used out of {total}"
diff --git a/src/i18n/lang/es.json b/src/i18n/lang/es.json
index a17dc7201..534e7f4b8 100644
--- a/src/i18n/lang/es.json
+++ b/src/i18n/lang/es.json
@@ -1,4 +1,12 @@
{
+ "AppSidebar": {
+ "home": "Inicio",
+ "spaces": "Espacios",
+ "projects": "Proyectos",
+ "invitations": "Invitaciones",
+ "favorites": "Favoritos",
+ "subscription": "Suscripción"
+ },
"OidcCallbackError": {
"message": "Ha ocurrido un error de autenticación...",
"retryButtonText": "Intente de nuevo"
@@ -109,10 +117,10 @@
"placeholder": "( Sin proyectos )"
},
"DashboardProjectList": {
- "title": "Proyectos recientes"
+ "title": "Ver todos los proyectos recientes"
},
"DashboardSpaceList": {
- "title": "Espacios recientes"
+ "title": "Ver todos los espacios recientes"
},
"DashboardWelcomeTile": {
"title": "Dashboard",
@@ -226,6 +234,7 @@
"view3dUnavailable": "La vista 3D no está disponible, pruebe la beta"
},
"ModelLocation": {
+ "title": "Ubicación y Huella",
"emptyLocationMessage": "Datos de seguimiento no disponibles",
"addLocationButtonText": "Infórmese"
},
@@ -260,7 +269,8 @@
"inputPlaceholder": "Nombre de vuestra fusión del IFC"
},
"ModelsOverview": {
- "title": "Visión del proyecto"
+ "title": "Modelado 3D Inmersivo",
+ "selectPreviewButton": "Elegir vista previa"
},
"ModelsOverviewOnboarding": {
"text": "Transferir vuestro primer modelo",
@@ -457,7 +467,15 @@
"projectsTileBottomText": "Mis proyectos",
"subscriptionsTileTitle": "Suscripciones",
"subscriptionsTileText": "Acceda a todas sus facturas y la última información de pago aquí.",
- "subscriptionsTileBottomText": "Administrar mis suscripciones"
+ "subscriptionsTileBottomText": "Administrar mis suscripciones",
+ "welcome": "Hola {name}, me alegro verte de nuevo !",
+ "spacesTileLabel": "espacios activados",
+ "spacesTileButton": "Ver todos los espacios",
+ "projectsTileLabel": "proyectos activados",
+ "projectsTileButton": "Ver todos los proyectos",
+ "createSpaceTitle": "Cree su nuevo espacio",
+ "createSpaceText": "Organice sus proyectos y colabore con su equipo en un nuevo espacio.",
+ "createSpaceButton": "Crear un espacio"
},
"Subscribe": {
"title": "Elija su suscripción",
@@ -613,6 +631,13 @@
"selectedOrga": "Cuenta de facturación:",
"selectedSpace": "Espacio seleccionado:"
},
+ "ProjectStorageInfo": {
+ "title": "Almacenamiento",
+ "usage": "{used} / {total}",
+ "currentProject": "Este proyecto",
+ "otherProjects": "Otros proyectos"
+ },
+
"SpaceSizeInfo": {
"subscribePlatformButton": "Pasar a la plataforma pro",
"usage": "{used} utilizado en {total}"
diff --git a/src/i18n/lang/fr.json b/src/i18n/lang/fr.json
index b4ee5221d..567ef3926 100644
--- a/src/i18n/lang/fr.json
+++ b/src/i18n/lang/fr.json
@@ -1,4 +1,12 @@
{
+ "AppSidebar": {
+ "home": "Accueil",
+ "spaces": "Espaces",
+ "projects": "Projets",
+ "invitations": "Invitations",
+ "favorites": "Favoris",
+ "subscription": "Abonnement"
+ },
"t": {
"add": "Ajouter",
"amount": "Montant",
@@ -248,10 +256,10 @@
"placeholder": "( Aucun projet )"
},
"DashboardProjectList": {
- "title": "Projets récents"
+ "title": "Voir tous les projets récents"
},
"DashboardSpaceList": {
- "title": "Espaces récents"
+ "title": "Voir tous les espaces récents"
},
"DashboardWelcomeTile": {
"title": "Dashboard",
@@ -405,6 +413,7 @@
"view3dUnavailable": "La vue 3D n'est pas disponible, essayez la bêta"
},
"ModelLocation": {
+ "title": "Localisation & Emprise",
"emptyLocationMessage": "Aucune données de localisation disponible",
"addLocationButtonText": "Renseigner"
},
@@ -440,7 +449,8 @@
"inputPlaceholder": "Nom de votre fusion d'IFC"
},
"ModelsOverview": {
- "title": "Aperçu du projet"
+ "title": "Modélisation 3D Immersive",
+ "selectPreviewButton": "Choisir la prévisualisation"
},
"ModelsOverviewOnboarding": {
"text": "Téléverser votre premier modèle",
@@ -631,17 +641,25 @@
"documentCreateError": "Impossible de télécharger ce document"
},
"ProjectStatusBadge": {
- "new": "NOUVEAU",
- "active": "ACTIF",
- "inactive": "INACTIF",
- "paused": "PAUSE"
+ "new": "nouveau",
+ "active": "actif",
+ "inactive": "inactif",
+ "paused": "pause"
},
"Dashboard": {
"spacesTileBottomText": "Mes espaces",
"projectsTileBottomText": "Mes projets",
"subscriptionsTileTitle": "Abonnements",
"subscriptionsTileText": "Retrouvez toutes vos factures et vos dernières informations de paiement ici.",
- "subscriptionsTileBottomText": "Gérer mes abonnements"
+ "subscriptionsTileBottomText": "Gérer mes abonnements",
+ "welcome": "Bonjour {name}, content de vous revoir !",
+ "spacesTileLabel": "espaces activés",
+ "spacesTileButton": "Voir tous les espaces",
+ "projectsTileLabel": "projets activés",
+ "projectsTileButton": "Voir tous les projets",
+ "createSpaceTitle": "Créez votre nouvel espace",
+ "createSpaceText": "Organisez vos projets et collaborez avec votre équipe dans un nouvel espace.",
+ "createSpaceButton": "Créer un espace"
},
"Subscribe": {
"title": "Choisissez votre abonnement",
@@ -797,6 +815,13 @@
"selectedOrga": "Compte de facturation:",
"selectedSpace": "Espace sélectionné:"
},
+ "ProjectStorageInfo": {
+ "title": "Stockage",
+ "usage": "{used} / {total}",
+ "currentProject": "Ce projet",
+ "otherProjects": "Autres projets"
+ },
+
"SpaceSizeInfo": {
"subscribePlatformButton": "Upgrade",
"usage": "{used} utilisé sur {total}"
diff --git a/src/i18n/lang/it.json b/src/i18n/lang/it.json
index ac654b924..4cf20eee8 100644
--- a/src/i18n/lang/it.json
+++ b/src/i18n/lang/it.json
@@ -1,4 +1,12 @@
{
+ "AppSidebar": {
+ "home": "Home",
+ "spaces": "Spazi",
+ "projects": "Progetti",
+ "invitations": "Inviti",
+ "favorites": "Preferiti",
+ "subscription": "Abbonamento"
+ },
"OidcCallbackError": {
"message": "Si è verificato un errore durante l'autenticazione...",
"retryButtonText": "Riprova"
@@ -42,10 +50,10 @@
"placeholder": "< Nessun progetto >"
},
"DashboardProjectList": {
- "title": "Progetti recenti"
+ "title": "Vedi tutti i progetti recenti"
},
"DashboardSpaceList": {
- "title": "Spazi recenti"
+ "title": "Vedi tutti gli spazi recenti"
},
"DashboardWelcomeTile": {
"title": "Dashboard",
@@ -147,6 +155,7 @@
"view3dUnavailable": "La vista 3D non è disponibile, prova la beta"
},
"ModelLocation": {
+ "title": "Localizzazione ed Impronta",
"emptyLocationMessage": "Nessun dato di localizzazione disponibile",
"addLocationButtonText": "Riempi"
},
@@ -180,7 +189,8 @@
"inputPlaceholder": "Nome della tua unione"
},
"ModelsOverview": {
- "title": "Panoramica dei modelli di progetto"
+ "title": "Modellazione 3D Immersiva",
+ "selectPreviewButton": "Scegli anteprima"
},
"ModelsOverviewOnboarding": {
"text": "Carica il tuo primo modello",
@@ -378,7 +388,15 @@
"projectsTileBottomText": "Vedi i progetti",
"subscriptionsTileTitle": "Fatturazione",
"subscriptionsTileText": "Qui trovi tutte le tue fatture e i tuoi ultimi dati di pagamento.",
- "subscriptionsTileBottomText": "Gestisci gli abbonamenti"
+ "subscriptionsTileBottomText": "Gestisci gli abbonamenti",
+ "welcome": "Ciao {name}, è un piacere rivederti!",
+ "spacesTileLabel": "spazi attivi",
+ "spacesTileButton": "Vedi tutti gli spazi",
+ "projectsTileLabel": "progetti attivi",
+ "projectsTileButton": "Vedi tutti i progetti",
+ "createSpaceTitle": "Crea il tuo nuovo spazio",
+ "createSpaceText": "Organizza i tuoi progetti e collabora con il tuo team in un nuovo spazio.",
+ "createSpaceButton": "Crea uno spazio"
},
"Subscribe": {
"title": "Scegli il tuo piano",
@@ -534,6 +552,13 @@
"selectedOrga": "Conto di fatturazione:",
"selectedSpace": "Spazio selezionato:"
},
+ "ProjectStorageInfo": {
+ "title": "Archiviazione",
+ "usage": "{used} / {total}",
+ "currentProject": "Questo progetto",
+ "otherProjects": "Altri progetti"
+ },
+
"SpaceSizeInfo": {
"subscribePlatformButton": "Passa alla piattaforma pro",
"usage": "{used} usato su {total}"
diff --git a/src/i18n/lang/nl.json b/src/i18n/lang/nl.json
index 8680aa46c..e1ecf8b53 100644
--- a/src/i18n/lang/nl.json
+++ b/src/i18n/lang/nl.json
@@ -1,4 +1,12 @@
{
+ "AppSidebar": {
+ "home": "Home",
+ "spaces": "Ruimtes",
+ "projects": "Projecten",
+ "invitations": "Uitnodigingen",
+ "favorites": "Favorieten",
+ "subscription": "Abonnement"
+ },
"OidcCallbackError": {
"message": "Er heeft zich een fout voorgedaan bij de authenticatie",
"retryButtonText": ""
@@ -38,10 +46,10 @@
"placeholder": "
-
+
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 @@
-
+
diff --git a/src/components/specific/models/models-overview/ModelsOverview.scss b/src/components/specific/models/models-overview/ModelsOverview.scss
index 325d7692a..e6f4486ed 100644
--- a/src/components/specific/models/models-overview/ModelsOverview.scss
+++ b/src/components/specific/models/models-overview/ModelsOverview.scss
@@ -1,25 +1,117 @@
-@use "/src/styles/mixins.scss";
-
.models-overview {
- overflow: visible;
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ padding: 9px;
+ border-radius: 20px;
+ background-color: var(--color-white);
+
+ &__header {
+ margin-bottom: 6px;
+ display: flex;
+ align-items: center;
+ gap: calc(var(--spacing-unit) / 2);
+ color: var(--color-primary);
+ font-size: 14px;
+ font-weight: 500;
+
+ &__title {
+ line-height: 1;
+ flex: 0 0 auto;
+ }
+
+ &__meta {
+ display: inline-flex;
+ align-items: center;
+ gap: calc(var(--spacing-unit) / 2);
+ margin-left: auto;
+ }
+
+ &__index {
+ color: var(--color-granite-light);
+ font-size: 13px;
+ font-weight: 500;
+ }
+
+ &__menu {
+ position: relative;
+
+ :deep(.bimdata-menu) {
+ position: absolute;
+ top: calc(100% + var(--spacing-unit) / 2);
+ right: 0;
+ z-index: 10;
+ min-width: 160px;
+ }
+ }
+ }
- @include mixins.block-card($padding: calc(var(--spacing-unit) * 2));
+ &__preview {
+ position: relative;
+ flex: 1 1 auto;
+ min-height: 0;
+ padding: calc(var(--spacing-unit) * 2);
+ border-radius: 16px;
+ background-color: var(--color-silver-light);
+ overflow: hidden;
+ display: flex;
+ align-items: center;
+ justify-content: center;
- &.bimdata-card {
- &:deep() > .bimdata-card__content {
+ &__open {
+ position: absolute;
+ z-index: 2;
+ top: calc(var(--spacing-unit) * 3 / 2);
+ left: calc(var(--spacing-unit) * 3 / 2);
+ }
+
+ &__viewer {
+ max-width: 100%;
+ max-height: 100%;
+ }
+
+ &__placeholder {
display: flex;
align-items: center;
- gap: 12px;
+ justify-content: center;
+ color: var(--color-granite-light);
+ }
+
+ &__type-icon {
+ position: absolute;
+ z-index: 1;
+ bottom: calc(var(--spacing-unit) * 3 / 2);
+ right: calc(var(--spacing-unit) * 3 / 2);
}
}
-}
-@include mixins.media-breakpoint-down(lg) {
- .models-overview {
- &.bimdata-card {
- &:deep() > .bimdata-card__content .models-card {
- flex-grow: 1;
- }
+ &__footer {
+ margin-top: 6px;
+ display: flex;
+ align-items: center;
+ gap: calc(var(--spacing-unit) / 2);
+ padding: 0 calc(var(--spacing-unit) / 2);
+ font-size: 12px;
+ color: var(--color-granite-light);
+
+ &__name {
+ flex: 1 1 auto;
+ min-width: 0;
+ }
+ }
+
+ &__empty {
+ flex: 1 1 auto;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ margin-top: calc(var(--spacing-unit) * 3 / 2);
+ border-radius: 16px;
+ background-color: var(--color-silver-light);
+
+ :deep(.models-overview-onboarding) {
+ width: 100%;
+ height: 100%;
}
}
}
diff --git a/src/components/specific/models/models-overview/ModelsOverview.vue b/src/components/specific/models/models-overview/ModelsOverview.vue
index b6def9a87..48fc9e04e 100644
--- a/src/components/specific/models/models-overview/ModelsOverview.vue
+++ b/src/components/specific/models/models-overview/ModelsOverview.vue
@@ -1,77 +1,229 @@
-
-
-
-
+
+
+
+
+
+
diff --git a/src/components/specific/projects/project-card/ProjectCard.css b/src/components/specific/projects/project-card/ProjectCard.css
index 8857dc29d..e91a86024 100644
--- a/src/components/specific/projects/project-card/ProjectCard.css
+++ b/src/components/specific/projects/project-card/ProjectCard.css
@@ -6,11 +6,13 @@
height: var(--card-height);
.bimdata-card {
+ padding: 6px;
position: relative;
width: 100%;
height: 100%;
overflow: visible;
transition-duration: 0.35s;
+ box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.07);
.project-card__action-bar {
position: absolute;
@@ -25,6 +27,8 @@
z-index: 1;
width: 4px;
height: var(--card-height);
+ border-top-left-radius: 13px;
+ border-bottom-left-radius: 13px;
}
.project-card__left-stripe--new {
background-color: var(--color-primary);
@@ -46,21 +50,16 @@
left: calc(var(--card-width) - 66px);
}
- .project-status-badge {
- position: absolute;
- z-index: 1;
- top: calc(var(--card-content-height) - var(--spacing-unit) - 24px);
- left: calc(var(--spacing-unit) + 4px);
- }
-
&:deep() {
.bimdata-card__content {
height: var(--card-content-height);
padding: 0;
overflow: hidden;
+ border-radius: 13px;
}
.bimdata-card__footer {
+ position: relative;
height: calc(100% - var(--card-content-height));
padding: 0;
display: flex;
@@ -86,6 +85,7 @@
min-width: var(--card-width);
width: var(--card-width);
height: var(--card-height);
+ border-radius: 13px;
box-shadow: var(--box-shadow);
background-color: var(--color-silver-light);
diff --git a/src/components/specific/projects/project-card/ProjectCard.vars.css b/src/components/specific/projects/project-card/ProjectCard.vars.css
index a2e9f0d8a..1966563c7 100644
--- a/src/components/specific/projects/project-card/ProjectCard.vars.css
+++ b/src/components/specific/projects/project-card/ProjectCard.vars.css
@@ -3,7 +3,7 @@
.project-card-placeholder,
.project-creation-card {
--card-width: 320px;
- --card-height: 261px;
+ --card-height: 275px;
--card-content-height: 205px;
--card-background: var(--color-silver-light);
}
diff --git a/src/components/specific/projects/project-card/ProjectCard.vue b/src/components/specific/projects/project-card/ProjectCard.vue
index 8528ac7c8..861971c70 100644
--- a/src/components/specific/projects/project-card/ProjectCard.vue
+++ b/src/components/specific/projects/project-card/ProjectCard.vue
@@ -12,19 +12,17 @@
data-guide="dashboard-project"
:data-guide-param="project.id"
:data-guide-click="
- isSpaceAdmin(project.cloud) && displayedModels.length > 0
- ? 'dashboard-project'
- : ''
+ isSpaceAdmin(project.cloud) && displayedModels.length > 0 ? 'dashboard-project' : ''
"
:to="{
name: routeNames.projectBoard,
params: {
spaceID: project.cloud.id,
- projectID: project.id
- }
+ projectID: project.id,
+ },
}"
>
-
+
-->
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-
+
+
@@ -28,12 +28,23 @@
{{ projectsCount[space.id] }}
+
-
@@ -103,12 +96,11 @@ import SpaceCardUpdateForm from "../space-card-update-form/SpaceCardUpdateForm.v
const props = defineProps({
space: {
type: Object,
- required: true
- }
+ required: true,
+ },
});
-const { isSpaceAdmin, isFavoriteSpace, addFavoriteSpace, removeFavoriteSpace } =
- useUser();
+const { isSpaceAdmin, isFavoriteSpace, addFavoriteSpace, removeFavoriteSpace } = useUser();
const { removeSpaceImage } = useSpaces();
const loading = ref(false);
@@ -122,16 +114,8 @@ const toggleFavorite = async () => {
}
};
-const {
- isOpen: showUpdateForm,
- open: openUpdateForm,
- close: closeUpdateForm
-} = useToggle();
-const {
- isOpen: showDeleteGuard,
- open: openDeleteGuard,
- close: closeDeleteGuard
-} = useToggle();
+const { isOpen: showUpdateForm, open: openUpdateForm, close: closeUpdateForm } = useToggle();
+const { isOpen: showDeleteGuard, open: openDeleteGuard, close: closeDeleteGuard } = useToggle();
const reset = () => {
closeUpdateForm();
diff --git a/src/components/specific/spaces/space-card/space-card-image/SpaceCardImage.vue b/src/components/specific/spaces/space-card/space-card-image/SpaceCardImage.vue
index d6bce2a70..79d308bc6 100644
--- a/src/components/specific/spaces/space-card/space-card-image/SpaceCardImage.vue
+++ b/src/components/specific/spaces/space-card/space-card-image/SpaceCardImage.vue
@@ -1,10 +1,5 @@
+
{{ $t("t.cancel") }}
{{ $t("InvitationForm.submitButtonText") }}
@@ -60,8 +60,8 @@ export default {
},
error: {
type: String,
- default: ""
- }
+ default: "",
+ },
},
emits: ["cancel", "submit"],
setup(props, { emit }) {
@@ -84,16 +84,16 @@ export default {
role.value = roleOptions.value[0];
},
- { immediate: true }
+ { immediate: true },
);
const errorMessage = ref("");
watch(
() => props.error,
- msg => {
+ (msg) => {
errorMessage.value = msg;
},
- { immediate: true }
+ { immediate: true },
);
const reset = () => {
diff --git a/src/components/specific/users/project-users-manager/ProjectUsersManager.scss b/src/components/specific/users/project-users-manager/ProjectUsersManager.scss
index c5c3f810a..23cce2087 100644
--- a/src/components/specific/users/project-users-manager/ProjectUsersManager.scss
+++ b/src/components/specific/users/project-users-manager/ProjectUsersManager.scss
@@ -1,63 +1,67 @@
-@use "/src/styles/mixins.scss";
-
.project-users-manager {
- @include mixins.block-card;
+ display: flex;
+ flex-direction: column;
+ border-radius: 20px;
+ background-color: var(--color-white);
+ overflow: hidden;
- &__manager {
- height: 100%;
- box-shadow: none;
+ &__header {
+ display: flex;
+ align-items: center;
+ gap: calc(var(--spacing-unit) / 2);
+ height: 64px;
+ padding: 0 calc(var(--spacing-unit) * 2);
+ color: var(--color-primary);
+ font-size: 16px;
+ font-weight: bold;
- &:deep() {
- .bimdata-card__brand {
- display: flex;
- gap: calc(var(--spacing-unit) / 2);
- padding: 0 calc(var(--spacing-unit) / 2);
+ &__title {
+ line-height: 1;
+ }
- &--left {
- margin-right: auto;
- }
- }
+ &__count {
+ color: var(--color-granite-light);
+ font-weight: 400;
+ }
- .bimdata-card__content {
- height: calc(100% - 32px);
- padding: 0;
- }
+ &__actions {
+ display: flex;
+ align-items: center;
+ gap: calc(var(--spacing-unit) / 2);
+ margin-left: auto;
+ }
+ }
+
+ &__list-container {
+ flex: 1 1 auto;
+ min-height: 0;
+ overflow-x: hidden;
+ overflow-y: auto;
- .project-users-manager__list-container {
- width: 100%;
- height: 100%;
- padding-bottom: calc(var(--spacing-unit) / 2);
- overflow-x: hidden;
- overflow-y: auto;
+ .bimdata-search-bar {
+ min-width: calc(100% - var(--spacing-unit) * 2);
+ margin: var(--spacing-unit);
+ font-size: 1rem;
+ background-color: var(--color-silver-light);
- .bimdata-search-bar {
- min-width: calc(100% - var(--spacing-unit) * 2);
- margin: var(--spacing-unit);
- font-size: 1rem;
- background-color: var(--color-silver-light);
- &.focus {
- background-color: var(--color-white);
- }
- }
+ &.focus {
+ background-color: var(--color-white);
+ }
+ }
- .invitation-form {
- padding: var(--spacing-unit);
- padding-top: calc(var(--spacing-unit) * 2);
- }
+ .invitation-form {
+ padding: var(--spacing-unit);
+ }
- .invitation-card {
- padding: 0 calc(var(--spacing-unit) / 2);
- border-bottom: 1px solid var(--color-silver-light);
- }
+ .invitation-card {
+ padding: 0 calc(var(--spacing-unit) * 2);
+ border-bottom: 1px solid var(--color-silver-light);
+ }
- .user-card {
- padding: 0 calc(var(--spacing-unit) / 2);
- margin-bottom: calc(var(--spacing-unit) / 4);
- border-bottom: 1px solid var(--color-silver-light);
- &:hover {
- background-color: var(--color-silver-light);
- }
- }
+ .user-card {
+ padding: 0 var(--spacing-unit);
+ &:hover {
+ background-color: var(--color-silver-light);
}
}
}
diff --git a/src/components/specific/users/project-users-manager/ProjectUsersManager.vue b/src/components/specific/users/project-users-manager/ProjectUsersManager.vue
index 19aa5805b..139b7ac63 100644
--- a/src/components/specific/users/project-users-manager/ProjectUsersManager.vue
+++ b/src/components/specific/users/project-users-manager/ProjectUsersManager.vue
@@ -1,72 +1,66 @@
-
-
-
-
-
-
-
-
-
-
-
-
+
diff --git a/src/components/specific/users/user-card/UserCard.scss b/src/components/specific/users/user-card/UserCard.scss
index 7ac5ec8f6..56cb27f2c 100644
--- a/src/components/specific/users/user-card/UserCard.scss
+++ b/src/components/specific/users/user-card/UserCard.scss
@@ -1,7 +1,7 @@
.user-card {
position: relative;
- min-height: 64px;
- height: 64px;
+ min-height: 60px;
+ height: 60px;
font-size: 1rem;
color: var(--color-primary);
@@ -16,20 +16,17 @@
&__content {
display: flex;
align-items: center;
+ gap: calc(var(--spacing-unit) * 3 / 2);
width: 100%;
height: 100%;
&__info {
- flex-grow: 1;
- padding: 0 var(--spacing-unit);
+ flex: 1 1 auto;
+ min-width: 0;
line-height: 18px;
&__name {
font-weight: bold;
-
- .user-role-badge {
- margin-left: var(--spacing-unit);
- }
}
&__email {
@@ -37,5 +34,47 @@
color: var(--color-granite-light);
}
}
+
+ &__aside {
+ display: flex;
+ align-items: center;
+ gap: calc(var(--spacing-unit) / 2);
+ flex: 0 0 auto;
+ }
+
+ &__badge {
+ flex: 0 0 auto;
+ }
+
+ // Reserve a fixed slot for the kebab menu so every badge shares the same
+ // right edge, whether the current user has admin actions or not.
+ &__menu-slot {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex: 0 0 32px;
+ width: 32px;
+ height: 32px;
+ .user-card__content__menu {
+ &:deep(.bimdata-btn.ghost.quaternary) {
+ .icon-fill.icon-fill--white.dark {
+ fill: var(--color-granite);
+ }
+ }
+ }
+ }
+
+ // Kebab menu appears only when the user hovers on the card.
+ &__menu {
+ opacity: 0;
+ pointer-events: none;
+ transition: opacity 0.15s ease;
+ }
+ }
+
+ &:hover .user-card__content__menu,
+ &:focus-within .user-card__content__menu {
+ opacity: 1;
+ pointer-events: auto;
}
}
diff --git a/src/components/specific/users/user-card/UserCard.vue b/src/components/specific/users/user-card/UserCard.vue
index 9c5aaf8ae..279d241b3 100644
--- a/src/components/specific/users/user-card/UserCard.vue
+++ b/src/components/specific/users/user-card/UserCard.vue
@@ -35,21 +35,36 @@
maxWidth="220px"
:text="fullName(user) + (isSelf(user) ? ` (${$t('UserCard.self')})` : '')"
/>
+<<<<<<< HEAD
-
-
![]()
-
-
-
+
+
+
+
+
+
-
-
+
+
+
+
+
+
+
+
-
+
+
{{ user.email }}
+
-
-
-
-
- {{ $t("t.spaces") }}
+
+
+
+
-
-
- {{ $t("t.projects") }}
+
+
+
-
-
-
- {{ $t("Dashboard.subscriptionsTileTitle") }}
-
-
- {{ $t("Dashboard.subscriptionsTileText") }}
-
-
- {{ $t("Dashboard.subscriptionsTileBottomText") }}
-
-
-
+
+
+
+
-
-
-
-
-
+
-
-
+
+
@@ -122,28 +126,37 @@
/>
-
+ {{ $t("Dashboard.welcome", { name: user.firstname }) }} +
+ +
-
-
diff --git a/src/views/project-board/ProjectBoard.scss b/src/views/project-board/ProjectBoard.scss
index d39ec70ef..58f7987a3 100644
--- a/src/views/project-board/ProjectBoard.scss
+++ b/src/views/project-board/ProjectBoard.scss
@@ -1,6 +1,7 @@
.project-board {
display: grid;
- grid-template-rows: 32px calc(100% - 32px);
+ grid-template-rows: auto 1fr;
+ gap: calc(var(--spacing-unit) * 2);
min-height: 100%;
&__banner {
@@ -15,20 +16,111 @@
}
&__header {
+ // Let the header adapt: left/right shrink to their content, center stays centered.
+ &:deep(.view-header__slot) {
+ width: auto;
+ }
+ &:deep(.view-header__slot--left) {
+ flex: 0 0 auto;
+ }
+ &:deep(.view-header__slot--center) {
+ flex: 1 1 auto;
+ }
+ &:deep(.view-header__slot--right) {
+ flex: 0 0 auto;
+ }
+
&__actions {
display: flex;
align-items: center;
gap: var(--spacing-unit);
}
- &:deep() {
- .bimdata-tabs__container__tab.active {
- background-color: rgba(47, 55, 74, 0.1);
+
+ &__storage {
+ // Slightly wider than a single button so the progress bar is readable.
+ width: 260px;
+ }
+
+ // Datapack shortcut: yellow circular icon-only button (see Figma).
+ &__datapack {
+ width: 40px;
+ min-width: 40px;
+ height: 40px;
+ }
+ }
+
+ &__pill {
+ display: inline-flex;
+ align-items: center;
+ height: 40px;
+ padding: 0 var(--spacing-unit);
+ border-radius: 50px;
+ background-color: rgba(255, 255, 255, 1);
+
+ &--tabs {
+ gap: 0;
+ padding: 0;
+ overflow: hidden;
+ }
+ }
+
+ &__breadcrumb {
+ display: inline-flex;
+ align-items: center;
+ height: 40px;
+ color: var(--color-primary);
+
+ // Turn the "back" button into an icon-only circular white button with a shadow.
+ :deep(.go-back-button) {
+ width: 40px;
+ min-width: 40px;
+ height: 40px;
+ padding: 0;
+ border-radius: 50%;
+ background-color: var(--color-white);
+ box-shadow: var(--box-shadow);
+
+ // Hide the "Back" text label — keep the arrow icon only.
+ & > span {
+ display: none;
}
- .bimdata-tabs__container__tab:hover {
- background-color: rgba(47, 55, 74, 0.03);
+ .go-back-button__icon {
+ margin: 0;
}
}
+ }
+
+ &__tab {
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ gap: calc(var(--spacing-unit) / 2);
+ height: 100%;
+ min-width: 120px;
+ padding: 0 calc(var(--spacing-unit) * 2);
+ border: none;
+ border-radius: 50px;
+ background-color: transparent;
+ color: var(--color-granite-light);
+ font-family: inherit;
+ font-size: 13px;
+ line-height: 1;
+ cursor: pointer;
+ transition:
+ background-color 0.2s ease,
+ color 0.2s ease;
+
+ &:hover:not(.project-board__tab--active) {
+ background-color: var(--color-primary-lighter);
+ color: var(--color-primary);
+ }
+
+ &--active {
+ background-color: var(--color-silver-light);
+ color: var(--color-primary);
+ font-weight: bold;
+ }
.beta-badge {
height: 18px;
@@ -43,6 +135,6 @@
}
&__body {
- padding: calc(var(--spacing-unit) * 2) 0 0;
+ min-height: 0;
}
}
diff --git a/src/views/project-board/ProjectBoard.vue b/src/views/project-board/ProjectBoard.vue
index 24529bd07..f1b0115be 100644
--- a/src/views/project-board/ProjectBoard.vue
+++ b/src/views/project-board/ProjectBoard.vue
@@ -3,38 +3,46 @@
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
-
+
+
+
@@ -59,6 +67,8 @@ import { useSession } from "../../composables/session.js";
import { useAppSidePanel } from "../../components/specific/app/app-side-panel/app-side-panel.js";
import { IS_SUBSCRIPTION_ENABLED } from "../../config/subscription.js";
import { DEFAULT_PROJECT_VIEW } from "../../config/projects.js";
+import routeNames from "../../router/route-names.js";
+import { useFiles } from "../../state/files.js";
import { useProjects } from "../../state/projects.js";
import { useSpaces } from "../../state/spaces.js";
import { useUser } from "../../state/user.js";
@@ -66,11 +76,12 @@ import { isFullTotal } from "../../utils/spaces.js";
// Components
import AppBreadcrumb from "../../components/specific/app/app-breadcrumb/AppBreadcrumb.vue";
+import AppLink from "../../components/specific/app/app-link/AppLink.vue";
import AppModalContent from "../../components/specific/app/app-modal/AppModalContent.vue";
import AppSlot from "../../components/specific/app/app-slot/AppSlot.js";
import GoBackButton from "../../components/specific/app/go-back-button/GoBackButton.vue";
import ViewHeader from "../../components/specific/app/view-header/ViewHeader.vue";
-import SpaceSizeInfo from "../../components/specific/subscriptions/space-size-info/SpaceSizeInfo.vue";
+import ProjectStorageInfo from "../../components/specific/subscriptions/project-storage-info/ProjectStorageInfo.vue";
import SubscriptionStatusBanner from "../../components/specific/subscriptions/subscription-status-banner/SubscriptionStatusBanner.vue";
import ProjectBcf from "./project-bcf/ProjectBcf.vue";
@@ -101,13 +112,14 @@ const tabsDef = [
export default {
components: {
AppBreadcrumb,
+ AppLink,
AppModalContent,
AppSlot,
GoBackButton,
ProjectBcf,
ProjectFiles,
ProjectOverview,
- SpaceSizeInfo,
+ ProjectStorageInfo,
SubscriptionStatusBanner,
ViewHeader,
},
@@ -116,6 +128,7 @@ export default {
const { isUserOrga, isSpaceAdmin } = useUser();
const { currentSpace, spaceSubInfo, isFreeSpace } = useSpaces();
const { currentProject, loadProjectUsers, loadProjectInvitations } = useProjects();
+ const { projectFileStructure } = useFiles();
const { projectView } = useSession();
const { closeSidePanel } = useAppSidePanel();
@@ -155,14 +168,54 @@ export default {
}
}, 10000);
+ const showStorageInfo = computed(
+ () =>
+ IS_SUBSCRIPTION_ENABLED &&
+ isSpaceAdmin(currentSpace.value) &&
+ currentTab.value.id !== "bcf",
+ );
+
+ // Same conditions as SpaceSizeInfo Datapack/Subscribe button, kept aligned
+ // with the existing subscription business rules.
+ const showDatapackButton = computed(
+ () =>
+ showStorageInfo.value &&
+ spaceSubInfo.value?.isPlatformSubscription &&
+ spaceSubInfo.value?.isOrganizationMember &&
+ !spaceSubInfo.value?.isCustomSubscription,
+ );
+
+ const datapackRoute = computed(() => ({
+ name: spaceSubInfo.value?.isPlatformPro
+ ? routeNames.subscriptionDatapack
+ : routeNames.subscriptionPro,
+ query: { space: currentSpace.value?.id },
+ }));
+
+ // Sum sizes of all files in the current project's file structure to display the
+ // "this project" segment of the storage widget.
+ const sumFileSizes = (node) => {
+ if (!node) return 0;
+ let total = Number(node.size) || 0;
+ for (const child of node.children || []) {
+ total += sumFileSizes(child);
+ }
+ return total;
+ };
+ const currentProjectSize = computed(() => sumFileSizes(projectFileStructure.value));
+
return {
// References
+ currentProjectSize,
currentTab,
currentView,
IS_SUBSCRIPTION_ENABLED,
space: currentSpace,
spaceSubInfo,
tabs: tabsDef,
+ showStorageInfo,
+ showDatapackButton,
+ datapackRoute,
// Methods
changeView,
isSpaceAdmin,
diff --git a/src/views/project-board/project-overview/ProjectOverview.scss b/src/views/project-board/project-overview/ProjectOverview.scss
index edf2259da..3e4796183 100644
--- a/src/views/project-board/project-overview/ProjectOverview.scss
+++ b/src/views/project-board/project-overview/ProjectOverview.scss
@@ -1,37 +1,42 @@
+@use "/src/styles/mixins.scss";
+
.project-overview {
display: flex;
- flex-wrap: wrap;
+ flex-direction: column;
gap: calc(var(--spacing-unit) * 2);
&__tooltip-upload {
- font-size: calc(var(--font-size) / 1.2)
+ font-size: calc(var(--font-size) / 1.2);
+ }
+
+ &__row {
+ display: grid;
+ // Figma ratios: 415 (preview) / 770 (map) / 550 (users) → approx 23 / 42 / 30
+ grid-template-columns: 23fr 42fr 30fr;
+ gap: calc(var(--spacing-unit) * 2);
}
&__block {
+ min-width: 0;
+
&--upload {
width: 100%;
}
- &--overview {
- flex-grow: 1;
- height: 480px;
- background-color: var(--color-white);
- }
-
+ &--overview,
+ &--location,
&--users {
- width: 560px;
- height: 480px;
- background-color: var(--color-white);
+ height: 432px;
}
&--models {
- width: calc(100vw - var(--spacing-unit) * 7);
+ width: 100%;
height: 540px;
- background-color: var(--color-white);
}
}
.models-overview,
+ .model-location-card,
.models-manager,
.project-users-manager {
width: 100%;
@@ -39,15 +44,29 @@
}
}
-@media only screen and (max-width: 1600px) {
+@include mixins.media-breakpoint-down(xxl) {
.project-overview {
+ &__row {
+ grid-template-columns: 1fr 1fr;
+ }
+
&__block {
- &--overview {
- width: 100%;
+ &--users {
+ grid-column: 1 / span 2;
}
+ }
+ }
+}
+@include mixins.media-breakpoint-down(lg) {
+ .project-overview {
+ &__row {
+ grid-template-columns: 1fr;
+ }
+
+ &__block {
&--users {
- width: 100%;
+ grid-column: 1;
}
}
}
diff --git a/src/views/project-board/project-overview/ProjectOverview.vue b/src/views/project-board/project-overview/ProjectOverview.vue
index da12a4c56..431b29853 100644
--- a/src/views/project-board/project-overview/ProjectOverview.vue
+++ b/src/views/project-board/project-overview/ProjectOverview.vue
@@ -1,16 +1,6 @@
-
-
-
+
+
+
+
+
-
-
-
+
-
+
+
+
+
+
+
+
+
+
{
+ currentModel.value = model;
+ };
+
const reloadData = debounce(async () => {
await Promise.all([
loadSpaceSubInfo(currentSpace.value),
@@ -326,6 +348,7 @@ export default {
allowedExtensions: UPLOADABLE_EXTENSIONS,
checkedActivity,
checkedDaysActivity,
+ currentModel,
invitations: projectInvitations,
models: projectModels,
modelsPreview,
@@ -356,6 +379,7 @@ export default {
isProjectAdmin,
isUserOrga,
notifyForbiddenUpload,
+ onModelChange,
openFileUploader,
openSubscriptionModal,
openNotificationsSettings,