Change action sizes. Add better tippy updating.

diff --git a/ui/src/components/comment-node.tsx b/ui/src/components/comment-node.tsx
index 3db87aa5856563c4e6821ac285e062fd72b48d58..4d95073c1272e6f57b1163d4a1000683778d7cea 100644 (file)
--- a/ui/src/components/comment-node.tsx
+++ b/ui/src/components/comment-node.tsx
@@ -103,8 +103,16 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
     this.handleCommentDownvote = this.handleCommentDownvote.bind(this);
   }
 
-  componentDidUpdate() {
-    setupTippy();
+  componentDidUpdate(prevProps: CommentNodeProps) {
+    let prevComment = prevProps.node.comment;
+    let comment = this.props.node.comment;
+    if (
+      prevComment.saved !== comment.saved ||
+      prevComment.deleted !== comment.deleted ||
+      prevComment.read !== comment.read
+    ) {
+      setupTippy();
+    }
   }
 
   componentWillReceiveProps(nextProps: CommentNodeProps) {
@@ -256,7 +264,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
                   dangerouslySetInnerHTML={mdToHtml(this.commentUnlessRemoved)}
                 />
               )}
-              <ul class="list-inline mb-1 text-muted font-weight-bold h6">
+              <ul class="list-inline mb-1 text-muted font-weight-bold h5">
                 {this.props.markable && (
                   <li className="list-inline-item-action">
                     <span
@@ -1110,5 +1118,6 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
   handleShowAdvanced(i: CommentNode) {
     i.state.showAdvanced = !i.state.showAdvanced;
     i.setState(i.state);
+    setupTippy();
   }
 }

diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx
index 6e285ee9f2041aeda0b600e4208fe149a3041fab..97d319d81125727d91fde6631a850b512a226aaa 100644 (file)
--- a/ui/src/components/post-listing.tsx
+++ b/ui/src/components/post-listing.tsx
@@ -102,8 +102,17 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
     }
   }
 
-  componentDidUpdate() {
-    setupTippy();
+  componentDidUpdate(prevProps: PostListingProps) {
+    let prevPost = prevProps.post;
+    let post = this.props.post;
+    if (
+      prevPost.saved !== post.saved ||
+      prevPost.deleted !== post.deleted ||
+      prevPost.locked !== post.locked ||
+      prevPost.stickied !== post.stickied
+    ) {
+      setupTippy();
+    }
   }
 
   componentWillReceiveProps(nextProps: PostListingProps) {
@@ -492,7 +501,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
                   </>
                 )}
               </ul>
-              <ul class="list-inline mb-1 text-muted h6 font-weight-bold">
+              <ul class="list-inline mb-1 text-muted h5 font-weight-bold">
                 {UserService.Instance.user && (
                   <>
                     {this.props.showBody && (
@@ -1305,5 +1314,6 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
   handleShowAdvanced(i: PostListing) {
     i.state.showAdvanced = !i.state.showAdvanced;
     i.setState(i.state);
+    setupTippy();
   }
 }