From d4c87152e48470fffe1dd19a0a20fc99e25c1f4f Mon Sep 17 00:00:00 2001
From: shtjrgus010 <shtjrgus010@naver.com>
Date: Thu, 8 Feb 2024 13:07:00 +0900
Subject: [PATCH] #6.13 navigation Bar part Three

---
 css/components/nav-bar.css | 16 +++++++++++++++-
 friends.html               |  2 ++
 2 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/css/components/nav-bar.css b/css/components/nav-bar.css
index 617a0ee..af40fe4 100644
--- a/css/components/nav-bar.css
+++ b/css/components/nav-bar.css
@@ -13,5 +13,19 @@
     padding: 20px 40px;
 }
 .nav__link{
+    position: relative;
     color: #2e363e;
-}
\ No newline at end of file
+}
+.nav__notification{
+    background-color: tomato;
+    display: flex;
+    width: 30px;
+    height: 30px;
+    border-radius: 10px;
+    justify-content: center;
+    align-items: center;
+    color: white;
+    position: absolute;
+    left: 15px;
+    bottom: 15px;
+}
diff --git a/friends.html b/friends.html
index 6a9a654..88d9af9 100644
--- a/friends.html
+++ b/friends.html
@@ -32,11 +32,13 @@
             </li>
             <li class="nav__btn">
                 <a class="nav__link" href="#">
+                    <span class="nav__notification">1</span>
                     <i class="fa-regular fa-comment fa-2x"></i>
                 </a>
             </li>
             <li class="nav__btn">
                 <a class="nav__link" href="#">
+                    
                     <i class="fa-solid fa-magnifying-glass fa-2x"></i>
                 </a>
             </li>