diff options
author | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2024-09-17 23:35:54 +0200 |
---|---|---|
committer | John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com> | 2024-09-18 00:15:19 +0200 |
commit | b24e02e5df5c1825060be295d21eaa6001c3cd17 (patch) | |
tree | bbf05746d4b1764463738ceb24a1374530ec6047 /core/src | |
parent | 26abc86eca7cf6ae95f20e1dc180774d11892aab (diff) | |
download | nextcloud-server-b24e02e5df5c1825060be295d21eaa6001c3cd17.tar.gz nextcloud-server-b24e02e5df5c1825060be295d21eaa6001c3cd17.zip |
fix(core): profile design and pronouns supportfieat/profile-pronounces
Signed-off-by: John Molakvoæ (skjnldsv) <skjnldsv@protonmail.com>
Diffstat (limited to 'core/src')
-rw-r--r-- | core/src/views/Profile.vue | 25 |
1 files changed, 19 insertions, 6 deletions
diff --git a/core/src/views/Profile.vue b/core/src/views/Profile.vue index 1df8fce6606..661e9a7fa0b 100644 --- a/core/src/views/Profile.vue +++ b/core/src/views/Profile.vue @@ -11,7 +11,8 @@ <div class="profile__header__container__placeholder" /> <div class="profile__header__container__displayname"> <h2>{{ displayname || userId }}</h2> - <span v-if="pronouns" class="profile__header__container__pronouns">· {{ pronouns }}</span> + <span v-if="pronouns">·</span> + <span v-if="pronouns" class="profile__header__container__pronouns">{{ pronouns }}</span> <NcButton v-if="isCurrentUser" type="primary" :href="settingsUrl"> @@ -270,6 +271,7 @@ $content-max-width: 640px; overflow-y: auto; &__header { + display: flex; position: sticky; height: 190px; top: -40px; @@ -281,7 +283,8 @@ $content-max-width: 640px; align-self: flex-end; width: 100%; max-width: $profile-max-width; - margin: 0 auto; + margin: 8px auto; + row-gap: 8px; display: grid; grid-template-rows: max-content max-content; grid-template-columns: 240px 1fr; @@ -295,13 +298,18 @@ $content-max-width: 640px; padding-inline: 16px; // same as the status text button, see NcButton width: $content-max-width; height: 45px; - margin-block: 100px 0; + margin-block: 125px 0; display: flex; align-items: center; gap: 18px; h2 { font-size: 30px; + margin: 0; + } + + span { + font-size: 20px; } } } @@ -405,13 +413,13 @@ $content-max-width: 640px; &__container { grid-template-columns: unset; + margin-bottom: 110px; &__displayname { - margin: 80px 20px 0px!important; - height: 1em; + margin: 80px 20px 0px 0px!important; width: unset; - display: unset; text-align: center; + padding-inline: 12px; } &__edit-button { @@ -428,6 +436,11 @@ $content-max-width: 640px; &__content { display: block; + + .avatar { + // Overlap avatar to top header + margin-top: -110px !important; + } } &__blocks { |