LukiBeg
/
Nexus-InglineSystems
mirror of https://github.com/Lukibeg/Nexus-InglineSystems.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

feat: Adiciona e altera determinados estilos.

This commit is contained in:
lukibeg 2025-11-01 23:10:50 -03:00
parent 5bbbd78557
commit 9024fc4439
1 changed files with 59 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

67
resources/css/app.css
View File

@ -25,29 +25,81 @@ @layer components {
/* Header - Navbar */ /* Header - Navbar */
.nav-bar { .nav-bar {
@apply flex flex-nowrap justify-center items-center mx-auto px-4 sm:px-6 lg:px-8 h-10 w-screen; @apply flex flex-nowrap justify-center items-center mx-auto px-4 sm:px-6 lg:px-8 h-10;
@apply relative;
/* Colors */ /* Colors */
@apply bg-white text-black; @apply bg-white text-black;
/* Border */ /* Border */
@apply border-b border-white shadow-md shadow-blue-400; @apply border-b border-white shadow-md shadow-blue-400;
} }
.nav-bar a:hover, .nav-bar>.navbar-items>a:hover,
.nav-bar a { .nav-bar>.navbar-items>a {
@apply transition-all duration-300 transform hover:scale-105; @apply transition-all duration-300 transform hover:scale-105;
@apply mr-7; @apply mr-7;
@apply hover:border hover:shadow-md shadow-blue-400 border-blue-300 rounded-md p-1 transition-all duration-250 transform hover:scale-105; @apply hover:border hover:shadow-md shadow-blue-400 border-blue-300 rounded-md p-1 transition-all duration-250 transform hover:scale-105;
} }
.nav-bar-logo { .nav-bar-logo {
@apply absolute left-0;
/* Garantir que o container da logo seja posicionado corretamente */
max-width: 8%;
/* Garante que a largura não ultrapasse 100% */ /* Garante que a largura não ultrapasse 100% */
@apply rounded-md max-w-25 mr-10;
height: auto; height: auto;
/* Altura proporcional à largura */ /* Altura proporcional à largura */
} }
.navbar-items {
@apply flex flex-nowrap justify-center items-center px-4 sm:px-6 lg:px-8 h-10;
}
.profile-menu {
@apply absolute right-5;
}
.profile-list-items {
/* 1. Posicionamento (Correto) */
@apply absolute top-full right-0 ml-4;
@apply block w-full;
/* Adicionei mt-2 para descolar do ícone */
/* 2. Largura Fixa (Mais limpo) */
@apply w-56;
/* 3. Estilos do Contêiner (Profissional) */
@apply bg-white p-2 rounded-md shadow-xl;
/* Sombra mais forte */
@apply border border-gray-200;
/* 4. Divisórias Sutis entre os <li> */
@apply divide-y divide-gray-100;
}
.profile-link {
/* Você pode aplicar isso direto no <a> */
/* 1. FAZ O LINK PREENCHER O <li> */
@apply block w-full;
}
.profile-items {
/* 1. Limpeza (Classes antigas removidas) */
/* 2. Espaçamento Interno (Respiro) */
@apply px-4 py-2;
/* 3. Estilos de Texto */
@apply text-sm text-gray-700;
/* 4. Interatividade */
@apply hover:bg-blue-100 cursor-pointer;
/* 5. Transição Suave */
@apply transition-colors duration-150 ease-in-out;
/* 6. Cantos do Hover */
@apply rounded-md;
}
.nav-bar-logo img { .nav-bar-logo img {
@apply w-full; @apply w-full;
/* Largura 100% para se ajustar ao container */ /* Largura 100% para se ajustar ao container */
@ -55,8 +107,7 @@ @layer components {
/* Mantém a proporção original da imagem */ /* Mantém a proporção original da imagem */
} }
.nav-bar>form>button { .nav-bar>.navbar-items>form>button {
@apply mr-7;
@apply hover:border hover:shadow-md hover:scale-105 hover:cursor-pointer shadow-blue-400 border-blue-300 rounded-md p-1 transition-all duration-250 transform; @apply hover:border hover:shadow-md hover:scale-105 hover:cursor-pointer shadow-blue-400 border-blue-300 rounded-md p-1 transition-all duration-250 transform;
} }