refactor navbar setting button

packages/app/src/components/Navbar/GrowiNavbar.tsx

@@ -33,7 +33,7 @@ const NavbarRight: FC<NavbarRightProps> = memo((props: NavbarRightProps) => {
   if (currentUser == null) {
     return (
       <>
-        <li className="grw-personal-dropdown nav-item dropdown dropdown-toggle dropdown-toggle-no-caret">
+        <li className="grw-personal-dropdown nav-item nav-link dropdown">
           <GuestDropdown />
         </li>
         <li id="login-user" className="nav-item"><a className="nav-link" href="/login">Login</a></li>

packages/app/src/components/Navbar/GuestDropdown.tsx

@@ -26,11 +26,12 @@ const GuestDropdown = (): JSX.Element => {
   );
 
   return (
+
     <>
       {/* setting button */}
-      <a className="px-md-3 nav-link waves-effect waves-light" data-toggle="dropdown">
+      <button className="dropdown-toggle bg-transparent border-0 nav-link" type="button" data-toggle="dropdown" aria-haspopup="true">
         <i className="material-icons">settings</i>
-      </a>
+      </button>
 
       {/* dropdown */}
       <div className="dropdown-menu dropdown-menu-right">