Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-03-11 02:12:21 -05:00
Code Issues Activity

More dark mode refinements

Browse source
This commit is contained in:
Peter Zimon 2022-07-07 17:39:36 +02:00
parent d0b069d2bb
commit 81bb2fb441
4 changed files with 6 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -57,7 +57,7 @@ const Comment = (props) => {
<div className="ml-14 flex gap-5 items-center">
<Like comment={comment} />
{isNotPublished || !props.parent && <Reply comment={comment} toggleReply={toggleReplyMode} isReplying={isInReplyMode} />}
<h6 className="text-sm text-neutral-400 font-sans">{formatRelativeTime(comment.created_at)}</h6>
<h6 className="text-sm text-neutral-400 dark:text-[rgba(255,255,255,0.5)] font-sans">{formatRelativeTime(comment.created_at)}</h6>
<More comment={comment} toggleEdit={toggleEditMode} />
</div>
</div>

4
apps/comments-ui/src/components/Like.js
View file

@ -14,8 +14,8 @@ function Like(props) {
};
return (
<button className={`flex font-sans items-center text-sm dark:text-white ${props.comment.liked ? 'text-neutral-900' : 'text-neutral-400'}`} onClick={toggleLike}>
<LikeIcon className={`mr-[6px] stroke-neutral-400 ${props.comment.liked ? 'fill-neutral-900 stroke-neutral-900 dark:fill-white dark:stroke-white' : ''}`} />
<button className={`flex font-sans items-center text-sm ${props.comment.liked ? 'text-neutral-900 dark:text-[rgba(255,255,255,0.9)]' : 'text-neutral-400 dark:text-[rgba(255,255,255,0.5)]'}`} onClick={toggleLike}>
<LikeIcon className={`mr-[6px] ${props.comment.liked ? 'fill-neutral-900 stroke-neutral-900 dark:fill-white dark:stroke-white' : 'stroke-neutral-400 dark:stroke-[rgba(255,255,255,0.5)]'}`} />
{props.comment.likes_count}
</button>
);

2
apps/comments-ui/src/components/More.js
View file

@ -21,7 +21,7 @@ const More = (props) => {
return (
<div className="relative">
{show ? <button onClick={toggleContextMenu}><MoreIcon className='gh-comments-icon gh-comments-icon-more fill-neutral-400 dark:fill-white' /></button> : null}
{show ? <button onClick={toggleContextMenu}><MoreIcon className='gh-comments-icon gh-comments-icon-more fill-neutral-400 dark:fill-rgba(255,255,255,0.5)' /></button> : null}
{isContextMenuOpen ? <CommentContextMenu comment={comment} close={toggleContextMenu} toggleEdit={props.toggleEdit} /> : null}
</div>
);

4
apps/comments-ui/src/components/Reply.js
View file

@ -6,8 +6,8 @@ function Reply(props) {
const {member} = useContext(AppContext);
return member ?
(<button className={`flex font-sans items-center text-sm dark:text-white ${props.isReplying ? 'text-neutral-900' : 'text-neutral-400'}`} onClick={props.toggleReply}>
<ReplyIcon className={`mr-[6px] stroke-neutral-400 dark:stroke-white ${props.isReplying ? 'fill-neutral-900 stroke-neutral-900 dark:fill-white dark:stroke-white' : ''}`} />Reply
(<button className={`flex font-sans items-center text-sm ${props.isReplying ? 'text-neutral-900 dark:text-[rgba(255,255,255,0.9)]' : 'text-neutral-400 dark:text-[rgba(255,255,255,0.5)]'}`} onClick={props.toggleReply}>
<ReplyIcon className={`mr-[6px] ${props.isReplying ? 'fill-neutral-900 stroke-neutral-900 dark:fill-white dark:stroke-white' : 'stroke-neutral-400 dark:stroke-[rgba(255,255,255,0.5)]'}`} />Reply
</button>) : null;
}