Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[MS] Updated HomePage layout #9446

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
+203 −145
Open

[MS] Updated HomePage layout #9446

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions client/src/assets/images/background/blob-shape.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
14 changes: 14 additions & 0 deletions client/src/assets/images/background/shapes-circles.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
6 changes: 5 additions & 1 deletion client/src/locales/en-US.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,11 @@
"expiredOrganization": "This organization has expired."
},
"HomePage": {
"sidebar": {
"tagline": "Keep control over your data confidentiality"
},
"topbar": {
"welcome": "Glad to see you back,",
"backToList": "Return to organizations",
"backToLogin": "Return to login",
"settings": "Settings",
Expand All @@ -126,7 +130,7 @@
"newVersionAvailable": "New update available"
},
"organizationList": {
"title": "Your organizations",
"title": "Access your organizations",
"sortOrderAsc": "Ascending",
"sortOrderDesc": "Descending",
"sortByOrganization": "Organization name",
Expand Down
6 changes: 5 additions & 1 deletion client/src/locales/fr-FR.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,11 @@
"expiredOrganization": "Cette organisation a expiré."
},
"HomePage": {
"sidebar": {
"tagline": "Gardez le contrôle sur la confidentialité de vos données"
},
"topbar": {
"welcome": "Ravi de vous revoir,",
"backToList": "Retour aux organisations",
"backToLogin": "Retour à la connexion",
"settings": "Paramètres",
Expand All @@ -126,7 +130,7 @@
"newVersionAvailable": "Nouvelle version disponible"
},
"organizationList": {
"title": "Vos organisations",
"title": "Accéder à vos organisations",
"sortOrderAsc": "Croissant",
"sortOrderDesc": "Décroissant",
"sortByOrganization": "Nom de l'organisation",
Expand Down
2 changes: 1 addition & 1 deletion client/src/views/client-area/ClientAreaLoginPage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -66,7 +66,7 @@ function getCurrentSectionClass(): string {
display: flex;
max-width: 48rem;
max-height: 32rem;
margin: auto;
margin: 2rem auto;
}

.saas-login-container {
Expand Down
4 changes: 2 additions & 2 deletions client/src/views/devices/ImportRecoveryDevicePage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -271,7 +271,7 @@ async function onLoginClick(): Promise<void> {
width: 60vw;
max-width: var(--parsec-max-forgotten-pwd-width);
display: flex;
margin: auto;
margin: 2rem auto;
flex-direction: column;
align-items: center;
gap: 2rem;
Expand All @@ -280,7 +280,7 @@ async function onLoginClick(): Promise<void> {

.recovery-header {
&__title {
color: var(--parsec-color-light-secondary-white);
color: var(--parsec-color-light-secondary-text);
}
}

Expand Down
38 changes: 24 additions & 14 deletions client/src/views/home/HomePage.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@
<ion-page>
<ion-content :fullscreen="true">
<div id="page">
<!-- sidebar -->
<home-page-sidebar />
<!-- organization list -->
<!-- organization -->
<div
Expand Down Expand Up @@ -95,6 +97,7 @@ import ImportRecoveryDevicePage from '@/views/devices/ImportRecoveryDevicePage.v
import CreateOrganizationModal from '@/views/organizations/creation/CreateOrganizationModal.vue';
import DeviceJoinOrganizationModal from '@/views/home/DeviceJoinOrganizationModal.vue';
import HomePageHeader from '@/views/home/HomePageHeader.vue';
import HomePageSidebar from '@/views/home/HomePageSidebar.vue';
import LoginPage from '@/views/home/LoginPage.vue';
import OrganizationListPage from '@/views/home/OrganizationListPage.vue';
import UserJoinOrganizationModal from '@/views/home/UserJoinOrganizationModal.vue';
Expand Down Expand Up @@ -547,29 +550,36 @@ function getBackButtonTitle(): string {
height: 100vh;
display: flex;
overflow: hidden;
padding: 0 2rem;
align-items: self-start;
background: var(--parsec-color-light-secondary-inversed-contrast);
z-index: -10;
background: var(--parsec-color-light-gradient);

&::before {
content: '';
position: absolute;
z-index: -2;
top: 0;
right: 0;
width: 100vw;
height: 100vh;
background: url('@/assets/images/background/homepage-rectangle.svg') repeat center;
background-size: cover;
}

.content {
width: 100%;
height: 100%;
display: flex;
gap: 2rem;
flex-direction: column;
position: relative;
max-width: var(--parsec-max-content-width);
padding: 6.26rem 5rem 0;

&::after {
content: '';
position: absolute;
height: 100%;
width: 100%;
max-width: 317px;
max-height: 326px;
bottom: 0;
right: 0;
background-image: url('@/assets/images/background/blob-shape.svg');
background-size: contain;
background-repeat: no-repeat;
background-position: top center;
opacity: 0.5;
filter: blur(250px);
}
}
}
</style>
Loading
Loading