diff --git a/src/components/user_card/user_card.scss b/src/components/user_card/user_card.scss index f96d6dff7..e76f2973d 100644 --- a/src/components/user_card/user_card.scss +++ b/src/components/user_card/user_card.scss @@ -67,7 +67,7 @@ width: calc(100% + 2.4em); margin-left: -1.2em; margin-right: -1.2em; - margin-top: -1.2em; + margin-top: -3.2em; margin-bottom: -4.5em; aspect-ratio: 3; padding: 0; @@ -149,6 +149,7 @@ position: relative; margin: 0.6em; margin-bottom: 0; + text-align: right; .user-identity { min-width: 0; @@ -180,13 +181,12 @@ } .other-actions { - position: absolute; - top: 0; - right: 0; - display: grid; + position: relative; + display: inline-grid; grid-auto-flow: column; grid-gap: 0.6em; font-size: 110%; + z-index: 2; a, button, div { text-align: center; @@ -350,8 +350,9 @@ .user-interactions { position: relative; display: grid; - grid-template-columns: repeat(auto-fill, minmax(17%, min-content)); + grid-template-columns: repeat(auto-fit, minmax(7.5em, 20%)); grid-gap: 0.6em; + max-width: 98vw; .popover-trigger-button, .moderation-tools-button { width: 100%; diff --git a/src/components/user_card/user_card.vue b/src/components/user_card/user_card.vue index 6ff579b73..8656c6620 100644 --- a/src/components/user_card/user_card.vue +++ b/src/components/user_card/user_card.vue @@ -5,11 +5,6 @@ >
-