From a4e6a72ca2b099d2926996b98f8e6b6cbbec9547 Mon Sep 17 00:00:00 2001
From: Henry Jameson <me@hjkos.com>
Date: Tue, 5 Aug 2025 14:10:07 +0300
Subject: [PATCH] fix banner overflowing

---
 src/components/user_card/user_card.scss      | 7 ++++---
 src/components/user_panel/user_panel.vue     | 2 ++
 src/components/user_popover/user_popover.vue | 7 +++++--
 src/components/user_profile/user_profile.vue | 4 ++++
 4 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss
index 150a15d5b..d15303fde 100644
--- a/src/components/user_card/user_card.scss
+++ b/src/components/user_card/user_card.scss
@@ -1,6 +1,7 @@
 .user-card {
   position: relative;
   z-index: 1;
+  overflow: hidden;
 
   // editing headers
   h4 {
@@ -161,9 +162,10 @@
 
 .user-info {
   position: relative;
-  margin: 0.6em;
-  margin-bottom: 0;
   text-align: left;
+  display: flex;
+  flex-direction: column;
+  gap: 1em;
 
   .user-identity {
     position: relative;
@@ -171,7 +173,6 @@
     min-height: 6em;
     display: flex;
     align-items: flex-end;
-    margin-bottom: 1em;
     container: user-card / inline-size;
 
     > * {
diff --git a/src/components/user_panel/user_panel.vue b/src/components/user_panel/user_panel.vue
index 7ac4d429c..783770dda 100644
--- a/src/components/user_panel/user_panel.vue
+++ b/src/components/user_panel/user_panel.vue
@@ -29,6 +29,8 @@
   }
 
   .user-info {
+    margin: 0.6em;
+
     .Avatar {
       width: 5em;
       width: calc(min(5em, 20cqw));
diff --git a/src/components/user_popover/user_popover.vue b/src/components/user_popover/user_popover.vue
index 9bff355e9..10850ef70 100644
--- a/src/components/user_popover/user_popover.vue
+++ b/src/components/user_popover/user_popover.vue
@@ -27,7 +27,11 @@
 /* popover styles load on-demand, so we need to override */
 /* stylelint-disable block-no-empty */
 .user-popover {
-  margin-bottom: 0.6em;
+  margin: 0;
+
+  .user-info {
+    margin: 1.2em;
+  }
 
   .user-identity {
     aspect-ratio: unset;
@@ -40,7 +44,6 @@
 
   &.popover {
     overflow: hidden;
-    padding: 0.6em;
   }
 }
 /* stylelint-enable block-no-empty */
diff --git a/src/components/user_profile/user_profile.vue b/src/components/user_profile/user_profile.vue
index 749b828b8..03042f2ab 100644
--- a/src/components/user_profile/user_profile.vue
+++ b/src/components/user_profile/user_profile.vue
@@ -140,6 +140,10 @@
     align-items: center;
     padding: 2em;
   }
+
+  .user-info {
+    margin: 0.6em;
+  }
 }
 
 .user-profile-placeholder {