notification blink

src/component/layout/layoutcom/UserHeader.jsx

@@ -137,7 +137,7 @@ export default function UserHeader(){
                                <a className="nav-link dropdown-toggle" href="javascript:void(0)" id="navbarDropdown3" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                     <i className="fe fe-bell"></i>
                                     <span className="notify">
-                                        {/* <span className="blink"></span> */}
+                                        <span className="blink"></span>
                                         <span className="dot"></span>
                                     </span>
                                 </a>

src/css/partials/_header.scss

@@ -1,3 +1,26 @@
+@keyframes blink {
+    0% {
+        -moz-transform: scale(0);
+        opacity: 0.0;
+    }
+    25% {
+        -moz-transform: scale(0.1);
+        opacity: 0.1;
+    }
+    50% {
+        -moz-transform: scale(0.5);
+        opacity: 0.3;
+    }
+    75% {
+        -moz-transform: scale(0.8);
+        opacity: 0.5;
+    }
+    100% {
+        -moz-transform: scale(1);
+        opacity: 0.0;
+    }
+}
+
 @-moz-keyframes blink {
     0% {
         -moz-transform: scale(0);

src/index.js

@@ -1,12 +1,12 @@
 import React from 'react';
 import ReactDOM from 'react-dom/client';
-//import './index.css';
+// import './index.css';
 import App from './App';
 import { BrowserRouter } from 'react-router-dom';
 //import reportWebVitals from './reportWebVitals';
 import 'bootstrap/dist/css/bootstrap.css';
 import 'bootstrap/dist/js/bootstrap.min.js'
-// import './custom.scss';
+
 import  './css/style.scss';