Add notification icon in header (no error)

P3/header.php

@@ -37,18 +37,55 @@
         <ul class="nav navbar-nav navbar-right">
           <li class="dropdown">
             <a href="#" data-toggle="dropdown" class="dropdown-toggle">
-              <i class="icon-bdg_search text14"></i>              
+              <i class="icon-bdg_alert text14"></i>
+              <span class="visible-xs-inline">Notifikasi</span>
+              <span class="badge badge-sm up bg-danger pull-right-xs">2</span>
             </a>
             <!-- dropdown -->
-             <div class="search_wrapper pull-right w-xl animated fadeIn">
-              <form action="">
-                <i class="pull-left glyphicon glyphicon-search"></i>
-                  <input type="text" class="pull-left" placeholder="Type Here">
-                <a href="#" class="remove-search"><i class="pull-right icon-bdg_cross"></i></a>
-              </form>
+            <div class="dropdown-menu w-xl animated fadeIn">
+              <div class="panel bg-white">
+                <div class="panel-heading b-light bg-light">
+                  <strong>Kamu Punya <span>2</span> Notifikasi</strong>
+                </div>
+                <div class="list-group">
+                  <a href class="list-group-item">
+                    <span class="pull-left m-r thumb-sm">
+                      <img src="img/01.jpg" alt="..." class="img-circle">
+                    </span>
+                    <span class="clear block m-b-none">
+                      Pembangunan Taman daerah Bandung Barat<br>
+                      <small class="text-muted">10 minutes ago</small>
+                    </span>
+                  </a>
+                  <a href class="list-group-item">
+                    <span class="clear block m-b-none">
+                      Revitalisasi Sungai Cikapundung<br>
+                      <small class="text-muted">1 hour ago</small>
+                    </span>
+                  </a>
+                </div>
+                <div class="panel-footer text-sm">
+                  <a href class="pull-right"><i class="icon-bdg_setting3"></i></a>
+                  <a href="#notes" data-toggle="class:show animated fadeInRight">Lihat Semua Notifikasi</a>
+                </div>
+              </div>
             </div>
             <!-- / dropdown -->
           </li>
+            <li class="dropdown">
+                <a href="#" data-toggle="dropdown" class="dropdown-toggle">
+                  <i class="icon-bdg_search text14"></i>              
+                </a>
+                <!-- dropdown -->
+                 <div class="search_wrapper pull-right w-xl animated fadeIn">
+                  <form action="">
+                    <i class="pull-left glyphicon glyphicon-search"></i>
+                      <input type="text" class="pull-left" placeholder="Type Here">
+                    <a href="#" class="remove-search"><i class="pull-right icon-bdg_cross"></i></a>
+                  </form>
+                </div>
+                <!-- / dropdown -->
+            </li>
           <li class="dropdown">
             <a href="#" data-toggle="dropdown" class="bg-blue profile-header dropdown-toggle clear" data-toggle="dropdown">
               <span class="thumb-sm avatar pull-left m-t-n-sm m-b-n-sm m-r-sm">