diff --git a/src/components/settings_modal/tabs/appearance_tab.vue b/src/components/settings_modal/tabs/appearance_tab.vue index 2a58e1104..f0ccf71f3 100644 --- a/src/components/settings_modal/tabs/appearance_tab.vue +++ b/src/components/settings_modal/tabs/appearance_tab.vue @@ -263,6 +263,11 @@ {{ $t('settings.hide_wallpaper') }} +
  • + + {{ $t('settings.compact_profiles') }} + +
  • diff --git a/src/components/user_card/user_card.js b/src/components/user_card/user_card.js index adc061f02..41b6d315d 100644 --- a/src/components/user_card/user_card.js +++ b/src/components/user_card/user_card.js @@ -114,6 +114,12 @@ export default { type: Boolean, default: false, }, + // Disable forced 3:1 aspect ratio + compact: { + required: false, + type: Boolean, + default: false, + } }, components: { DialogModal, diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss index a821b4af1..93a9ed2e7 100644 --- a/src/components/user_card/user_card.scss +++ b/src/components/user_card/user_card.scss @@ -165,12 +165,15 @@ .user-identity { position: relative; - aspect-ratio: 3; min-height: 6em; display: flex; align-items: flex-end; container: user-card / inline-size; + &:not(.-compact) { + aspect-ratio: 3; + } + > * { min-width: 0; } diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue index 053c09f0a..1120b86c3 100644 --- a/src/components/user_card/user_card.vue +++ b/src/components/user_card/user_card.vue @@ -2,7 +2,10 @@