From 7fd319a9894cf51a3778feb44c81aaac4df1f1be Mon Sep 17 00:00:00 2001
From: Kamran Ahmed <kamranahmed.se@gmail.com>
Date: Wed, 10 Apr 2024 03:36:20 +0100
Subject: [PATCH] Add private profile banner

---
 src/components/UserPublicProfile/PrivateProfileBanner.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/UserPublicProfile/PrivateProfileBanner.tsx b/src/components/UserPublicProfile/PrivateProfileBanner.tsx
index 1bcf80aab..f47cdcc81 100644
--- a/src/components/UserPublicProfile/PrivateProfileBanner.tsx
+++ b/src/components/UserPublicProfile/PrivateProfileBanner.tsx
@@ -1,4 +1,5 @@
 import type { GetPublicProfileResponse } from '../../api/user';
+import { Lock } from 'lucide-react';
 
 type PrivateProfileBannerProps = Pick<
   GetPublicProfileResponse,
@@ -10,7 +11,8 @@ export function PrivateProfileBanner(props: PrivateProfileBannerProps) {
 
   if (isOwnProfile && profileVisibility === 'private') {
     return (
-      <div className="border-b border-yellow-400 bg-yellow-100 p-2 text-center text-sm font-medium">
+      <div className="-mb-4 -mt-5 rounded-lg border border-yellow-400 bg-yellow-100 p-2 text-center text-sm font-medium">
+        <Lock className="-mt-1 mr-1.5 inline-block h-4 w-4" />
         Your profile is private. Only you can see this page.
       </div>
     );