🐛 corrigindo problema no nvbar drop down, add tamanho nome, definindo…

… expressões regulares
GreenGen72 · Jun 4, 2024 · 263bf96 · 263bf96
1 parent a00ae2e
commit 263bf96
Showing 1 changed file with 6 additions and 6 deletions.
diff --git a/src/components/navbar/Navbar.tsx b/src/components/navbar/Navbar.tsx
@@ -63,27 +63,27 @@ function Navbar() {
           </button>
         </div>
         <div className="flex gap-2 px-4 w-1/3 justify-end items-center">
-          <div className="dropdown dropdown-hover  hover:bg-secondary rounded-se-2xl rounded-ss-2xl">
+          <div className="dropdown dropdown-hover w-auto   hover:bg-secondary rounded-se-2xl rounded-ss-2xl">
             <div
               tabIndex={0}
               role="button"
               className="btn m-1 flex px-4 gap-2 hover:bg-transparent rounded-full bg-transparent border-transparent hover:border-transparent"
             >
               <Avatar foto={usuario.foto} bordercolour="white" size="small" />
             <ul className="grid justify-items-start">
-              <li className="text-sm text-white font-light">Olá, </li><li className="text-sm text-white font-bold">{usuario.nome.split(" ")[0]}!</li>
+              <li className="text-sm text-white font-light">Olá, </li><li className="text-sm text-white font-bold">{usuario.nome.split(" ")[0].length > 24 ? usuario.nome.replace(/(.{24})..+/, "$1...") : usuario.nome.split(" ")[0]}!</li>
             </ul>
             </div>
             <ul
               tabIndex={0}
               className="dropdown-content z-[1] menu  p-0 gap-4 bg-black rounded-b-box w-full box-border"
             >
-              <li className="w-full justify hover:bg-secondary">
+              <li className=" hover:bg-secondary">
                 <Link
                   to="/perfil"
-                  className="flex justify-end gap-2 w-full px-4 py-2 box-border h-14"
+                  className="flex w-auto justify-end gap-2 px-1.5 py-2 box-border h-14"
                 >
-                  <span>Meu perfil</span>
+                  <p>Meu perfil</p>
                   <img
                     className="w-6"
                     src={userIconNBDB}
@@ -95,7 +95,7 @@ function Navbar() {
                 <Link
                   to=""
                   onClick={logout}
-                  className="flex justify-end gap-2 w-full px-4 py-2  box-border h-14 "
+                  className="flex justify-end gap-2 w-full px-1.5 py-2  box-border h-14 "
                 >
                   <span>Sair</span>
                   <img className="w-6" src={exitIconNB} alt="Ícone de saída" />