From b671e0e259494458b780194d86e2a8ef8ec83e48 Mon Sep 17 00:00:00 2001
From: Gigi <dergigi@pm.me>
Date: Thu, 2 Oct 2025 23:23:57 +0200
Subject: [PATCH] feat: update bookmark icons to use fa-bookmark and
 fa-user-lock

- Replace faGlobe with faBookmark for public bookmarks
- Add faUserLock icon alongside faBookmark for private bookmarks
- Import faBookmark and faUserLock from FontAwesome
- Update CSS to handle icon spacing with flexbox and gap
- Private bookmarks now show both bookmark and user-lock icons
---
 src/components/BookmarkItem.tsx | 11 +++++++++--
 src/index.css                   |  3 +++
 2 files changed, 12 insertions(+), 2 deletions(-)

diff --git a/src/components/BookmarkItem.tsx b/src/components/BookmarkItem.tsx
index fbeb8e3d..0ab34362 100644
--- a/src/components/BookmarkItem.tsx
+++ b/src/components/BookmarkItem.tsx
@@ -1,6 +1,6 @@
 import React from 'react'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { faLock, faGlobe, faCopy } from '@fortawesome/free-solid-svg-icons'
+import { faLock, faBookmark, faUserLock, faCopy } from '@fortawesome/free-solid-svg-icons'
 import { IndividualBookmark } from '../types/bookmarks'
 import { formatDate, renderParsedContent } from '../utils/bookmarkUtils'
 import { extractUrlsFromContent } from '../services/bookmarkHelpers'
@@ -28,7 +28,14 @@ export const BookmarkItem: React.FC<BookmarkItemProps> = ({ bookmark, index }) =
     <div key={`${bookmark.id}-${index}`} className={`individual-bookmark ${bookmark.isPrivate ? 'private-bookmark' : ''}`}>
       <div className="bookmark-header">
         <span className="bookmark-type">
-          <FontAwesomeIcon icon={bookmark.isPrivate ? faLock : faGlobe} className={`bookmark-visibility ${bookmark.isPrivate ? 'private' : 'public'}`} />
+          {bookmark.isPrivate ? (
+            <>
+              <FontAwesomeIcon icon={faBookmark} className="bookmark-visibility public" />
+              <FontAwesomeIcon icon={faUserLock} className="bookmark-visibility private" />
+            </>
+          ) : (
+            <FontAwesomeIcon icon={faBookmark} className="bookmark-visibility public" />
+          )}
         </span>
         <span className="bookmark-id">
           {short(bookmark.id)}
diff --git a/src/index.css b/src/index.css
index 84323f93..454d5e39 100644
--- a/src/index.css
+++ b/src/index.css
@@ -358,6 +358,9 @@ body {
   font-size: 0.8rem;
   font-weight: 500;
   text-transform: uppercase;
+  display: flex;
+  align-items: center;
+  gap: 0.25rem;
 }
 
 .bookmark-id {