RageStudio/comty
1
0
Fork 0
mirror of https://github.com/ragestudio/comty.git synced 2025-06-09 18:44:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

display private post indicator

Browse Source
This commit is contained in:
SrGooglo 2025-03-21 18:38:44 +00:00
parent 31e27f83aa
commit 16952789ec
2 changed files with 135 additions and 115 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

64
packages/app/src/components/PostCard/components/header/index.jsx
View File

@ -15,60 +15,62 @@ const PostCardHeader = (props) => {
app.navigation.goToAccount(props.postData.user?.username) app.navigation.goToAccount(props.postData.user?.username)
} }
return <div className="post-header" onDoubleClick={props.onDoubleClick}> return (
{ <div className="post-header" onDoubleClick={props.onDoubleClick}>
!props.disableReplyTag && props.postData.reply_to && <div {!props.disableReplyTag && props.postData.reply_to && (
className="post-header-replied_to" <div className="post-header-replied_to">
>
<div className="post-header-replied_to-label"> <div className="post-header-replied_to-label">
<Icons.FiRepeat /> <Icons.FiRepeat />
<span> <span>Replied to</span>
Replied to
</span>
</div> </div>
<PostReplieView <PostReplieView data={props.postData.reply_to_data} />
data={props.postData.reply_to_data}
/>
</div> </div>
} )}
<div className="post-header-user"> <div className="post-header-user">
<div className="post-header-user-avatar"> <div className="post-header-user-avatar">
<Image <Image alt="Avatar" src={props.postData.user?.avatar} />
alt="Avatar"
src={props.postData.user?.avatar}
/>
</div> </div>
<div className="post-header-user-info"> <div className="post-header-user-info">
<div className="post-header-user-info-label">
<div className="post-header-user-info-label-left">
<h1 onClick={goToProfile}> <h1 onClick={goToProfile}>
{ {props.postData.user?.public_name ??
props.postData.user?.public_name ?? `@${props.postData.user?.username}` `@${props.postData.user?.username}`}
}
{ {props.postData.user?.verified && (
props.postData.user?.verified && <Icons.verifiedBadge /> <Icons.verifiedBadge id="verified-badge" />
} )}
{
props.postData.flags?.includes("nsfw") && <Tag
color="volcano"
>
NSFW
</Tag>
}
</h1> </h1>
</div>
<div className="post-header-user-info-label-right">
{props.postData.visibility === "private" && (
<span>
<Icons.FiEyeOff /> Private
</span>
)}
{props.postData.flags?.includes("nsfw") && (
<Tag color="volcano">NSFW</Tag>
)}
</div>
</div>
<span className="post-header-user-info-timeago"> <span className="post-header-user-info-timeago">
<TimeAgo <TimeAgo
time={props.postData.timestamp ?? props.postData.created_at} time={
props.postData.timestamp ??
props.postData.created_at
}
/> />
</span> </span>
</div> </div>
</div> </div>
</div> </div>
)
} }
export default PostCardHeader export default PostCardHeader

32
packages/app/src/components/PostCard/components/header/index.less
View File

@ -36,11 +36,6 @@
margin-right: 10px; margin-right: 10px;
} }
svg {
fill: var(--app-color);
margin-left: 6px;
}
.post-header-user-avatar { .post-header-user-avatar {
width: 40px; width: 40px;
height: 40px; height: 40px;
@ -55,13 +50,23 @@
} }
.post-header-user-info { .post-header-user-info {
display: inline-flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: flex-start; align-items: flex-start;
width: fit-content; width: 100%;
.post-header-user-info-label {
display: inline-flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
width: 100%;
.post-header-user-info-label-left {
h1 { h1 {
margin: 0 0 4px 0; margin: 0 0 4px 0;
@ -75,6 +80,19 @@
color: var(--background-color-contrast); color: var(--background-color-contrast);
} }
#verified-badge {
fill: var(--app-color) !important;
}
}
.post-header-user-info-label-right {
display: flex;
flex-direction: row;
gap: 8px;
}
}
.post-header-user-info-timeago { .post-header-user-info-timeago {
font-weight: 400; font-weight: 400;
font-size: 0.7rem; font-size: 0.7rem;