TryGhost/Ghost
1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2024-12-28 21:33:24 +03:00
Code Issues Projects Releases Wiki Activity

Avatar color refinements

Browse Source
This commit is contained in:
Peter Zimon 2022-07-07 12:58:52 +02:00
parent a142a86b5d
commit c542918dae
5 changed files with 7 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
apps/comments-ui/src/components/AddForm.js
View File

@ -56,7 +56,7 @@ const AddForm = (props) => {
<form onSubmit={submitForm} className="comment-form"> <form onSubmit={submitForm} className="comment-form">
<div className="w-full"> <div className="w-full">
<div className="flex mb-4 space-x-4 justify-start items-center"> <div className="flex mb-4 space-x-4 justify-start items-center">
<Avatar /> <Avatar saturation={props.avatarSaturation} />
<div> <div>
<h4 className="text-lg font-sans font-bold mb-1 tracking-tight dark:text-neutral-300">{member.name ? member.name : 'Anonymous'}</h4> <h4 className="text-lg font-sans font-bold mb-1 tracking-tight dark:text-neutral-300">{member.name ? member.name : 'Anonymous'}</h4>
<h6 className="text-[13px] text-neutral-400 font-sans">Now</h6> <h6 className="text-[13px] text-neutral-400 font-sans">Now</h6>

6
apps/comments-ui/src/components/Avatar.js
View File

@ -25,11 +25,11 @@ class Avatar extends React.Component {
return [0,0,10]; return [0,0,10];
} }
const saturation = this.props.saturation ? this.props.saturation : 50; const saturation = isNaN(this.props.saturation) ? 50 : this.props.saturation;
const hRange = [0, 360]; const hRange = [0, 360];
const lRangeTop = Math.round(saturation / (100 / 30)) + 20; const lRangeTop = Math.round(saturation / (100 / 30)) + 30;
const lRangeBottom = lRangeTop - 10; const lRangeBottom = lRangeTop - 20;
const lRange = [lRangeBottom, lRangeTop]; const lRange = [lRangeBottom, lRangeTop];
const hash = this.getHashOfString(commentMember.name); const hash = this.getHashOfString(commentMember.name);

2
apps/comments-ui/src/components/Comment.js
View File

@ -62,7 +62,7 @@ const Comment = (props) => {
} }
{isInReplyMode && {isInReplyMode &&
<div className={`ml-14 mb-10 ${!hasReplies && 'mt-10'}`}> <div className={`ml-14 mb-10 ${!hasReplies && 'mt-10'}`}>
<ReplyForm parent={comment} toggle={toggleReplyMode} /> <ReplyForm parent={comment} toggle={toggleReplyMode} avatarSaturation={props.avatarSaturation} />
</div> </div>
} }
</> </>

2
apps/comments-ui/src/components/CommentsBox.js
View File

@ -58,7 +58,7 @@ class CommentsBox extends React.Component {
{comments} {comments}
</div> </div>
<div> <div>
{ this.context.member ? <AddForm /> : <NotSignedInBox /> } { this.context.member ? <AddForm avatarSaturation={this.props.avatarSaturation} /> : <NotSignedInBox /> }
</div> </div>
</section> </section>
); );

2
apps/comments-ui/src/components/ReplyForm.js
View File

@ -59,7 +59,7 @@ const ReplyForm = (props) => {
<form onSubmit={submitForm} className="comment-form mb-4"> <form onSubmit={submitForm} className="comment-form mb-4">
<div className="w-full"> <div className="w-full">
<div className="flex mb-4 space-x-4 justify-start items-center"> <div className="flex mb-4 space-x-4 justify-start items-center">
<Avatar /> <Avatar saturation={props.avatarSaturation} />
<div> <div>
<h4 className="text-lg font-sans font-bold mb-1 tracking-tight dark:text-neutral-300">{member.name}</h4> <h4 className="text-lg font-sans font-bold mb-1 tracking-tight dark:text-neutral-300">{member.name}</h4>
<h6 className="text-[13px] text-neutral-400 font-sans">Now</h6> <h6 className="text-[13px] text-neutral-400 font-sans">Now</h6>