From 219d728955b0e691432ff4c87c7904e58e789b6d Mon Sep 17 00:00:00 2001
From: Dessalines <happydooby@gmail.com>
Date: Wed, 4 Mar 2020 09:30:49 -0500
Subject: [PATCH] Adding icons to stickied, deleted, and locked.

---
 ui/src/components/post-listing.tsx | 29 ++++++++++++++++++++++-------
 1 file changed, 22 insertions(+), 7 deletions(-)

diff --git a/ui/src/components/post-listing.tsx b/ui/src/components/post-listing.tsx
index 193c2a549..d702d78b0 100644
--- a/ui/src/components/post-listing.tsx
+++ b/ui/src/components/post-listing.tsx
@@ -339,7 +339,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
                         title={this.state.url}
                       >
                         {new URL(this.state.url).hostname}
-                        <svg class="ml-1 icon">
+                        <svg class="ml-1 icon icon-inline">
                           <use xlinkHref="#icon-external-link"></use>
                         </svg>
                       </a>
@@ -391,18 +391,33 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
                   </small>
                 )}
                 {post.deleted && (
-                  <small className="ml-2 text-muted font-italic">
-                    {i18n.t('deleted')}
+                  <small
+                    className="unselectable pointer ml-2 text-muted font-italic"
+                    data-tippy-content={i18n.t('deleted')}
+                  >
+                    <svg class={`icon icon-inline text-danger`}>
+                      <use xlinkHref="#icon-trash"></use>
+                    </svg>
                   </small>
                 )}
                 {post.locked && (
-                  <small className="ml-2 text-muted font-italic">
-                    {i18n.t('locked')}
+                  <small
+                    className="unselectable pointer ml-2 text-muted font-italic"
+                    data-tippy-content={i18n.t('locked')}
+                  >
+                    <svg class={`icon icon-inline text-danger`}>
+                      <use xlinkHref="#icon-lock"></use>
+                    </svg>
                   </small>
                 )}
                 {post.stickied && (
-                  <small className="ml-2 text-muted font-italic">
-                    {i18n.t('stickied')}
+                  <small
+                    className="unselectable pointer ml-2 text-muted font-italic"
+                    data-tippy-content={i18n.t('stickied')}
+                  >
+                    <svg class={`icon icon-inline text-success`}>
+                      <use xlinkHref="#icon-pin"></use>
+                    </svg>
                   </small>
                 )}
                 {post.nsfw && (