diff --git a/packages/client/src/pages/user/home.vue b/packages/client/src/pages/user/home.vue
index 5de9b28d67..277d5f5ef9 100644
--- a/packages/client/src/pages/user/home.vue
+++ b/packages/client/src/pages/user/home.vue
@@ -134,20 +134,19 @@
@@ -490,29 +489,6 @@ onUnmounted(() => {
border-radius: 6px;
}
- > .actions {
- position: absolute;
- top: 12px;
- right: 12px;
- padding: 8px;
- border-radius: 24px;
-
- > .menu {
- vertical-align: bottom;
- height: 31px;
- width: 31px;
- color: #fff;
- text-shadow: 0 0 8px var(--shadow);
- font-size: 16px;
- }
-
- > .koudoku {
- margin-left: 4px;
- width: 31px;
- vertical-align: bottom;
- }
- }
-
> .title {
position: absolute;
bottom: 0;
@@ -581,22 +557,23 @@ onUnmounted(() => {
> .actions {
position: absolute;
- top: 12px;
+ top: 6px;
right: 12px;
padding: 8px;
border-radius: 24px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
> .menu {
- vertical-align: bottom;
height: 31px;
width: 31px;
color: --fg;
font-size: 16px;
}
- > .koudoku {
- margin-left: 4px;
- vertical-align: bottom;
+ > :deep(.follow-button) {
+ margin-left: 8px;
}
}
@@ -797,6 +774,13 @@ onUnmounted(() => {
> .title {
display: block;
+ border-bottom: 0;
+ padding-bottom: 0;
+ > .bottom {
+ > .username {
+ margin-right: 0;
+ }
+ }
}
> .avatar {
@@ -822,15 +806,19 @@ onUnmounted(() => {
}
> .description {
- top: -55px;
+ top: 0;
position: relative;
}
> .follow-container {
overflow: visible !important;
+ display: flex;
+ justify-content: center;
+ height: auto;
+ border-bottom: 1px solid var(--divider);
+ padding-bottom: 5px;
> .actions {
- top: -110px;
- right: 0px;
+ position: static;
}
}
}
diff --git a/packages/client/src/style.scss b/packages/client/src/style.scss
index 4b914c4085..10b5914896 100644
--- a/packages/client/src/style.scss
+++ b/packages/client/src/style.scss
@@ -212,6 +212,11 @@ hr {
opacity: 0.5;
cursor: default;
}
+
+ > i:only-child {
+ display: block;
+ margin: auto;
+ }
}
._buttonPrimary {