안녕하세요 
float-kit의 .popup-menu 스타일이 usercard 전용 스타일을 오버라이드하는 것 같습니다. 이로 인해 Message, Chat 등 버튼 스타일에 충돌이 발생합니다. .fk-d-menu에 popup-menu 클래스가 추가되면서 이런 문제가 생기는 것입니다.
또한 popup-menu의 배경, 테두리, 그림자도 함께 표시됩니다.
관련된 커밋일 가능성이 높습니다: UX: improve btn-transparent styling - Pull Request #24666 - discourse/discourse - GitHub
감사합니다 
popup-menu 클래스를 제거하면 이 문제가 해결됩니다. 빠른 해결책으로는 usercard에서 popup-menu를 오버라이드하는 것입니다.
.popup-menu[data-identifier=card]로 타겟팅할 수 있습니다.
이처럼 하면 user card 스타일을 복구할 수 있습니다
@mixin usercard-btn($btn-bg, $btn-color, $btn-bg-hover, $btn-color-hover) {
background: var(--#{$btn-bg});
.d-icon {
color: var(--#{$btn-color});
margin-right: 0.45em;
}
.discourse-no-touch & {
&:focus,
&:hover {
background-color: var(--#{$btn-bg-hover});
color: var(--#{$btn-color-hover});
.d-icon {
color: var(--#{$btn-color-hover});
}
}
}
.discourse-touch & {
&:focus,
&:hover {
color: var(--#{$btn-color});
.d-icon {
color: var(--#{$btn-color});
}
}
}
}
.popup-menu[data-identifier="card"] {
background: none;
border: none;
.mobile-view & {
z-index: z("max");
}
box-shadow: none;
ul {
li {
border-bottom: none;
}
}
.btn {
justify-content: center;
padding: 0.5em 0.65em;
border-radius: var(--d-button-border-radius);
margin-bottom: 5px;
.d-icon {
align-self: unset;
margin-top: unset
}
&.btn-primary {
@include usercard-btn(
tertiary,
secondary,
tertiary-hover,
secondary
);
}
&:not(.btn-primary) {
@include usercard-btn(
primary-low,
primary,
primary-medium,
secondary
);
}
}
}
