MediaWiki:Vector-2022.css: Difference between revisions

← Older edit Newer edit →

@@ Line 2,320: / Line 2,320: @@
-/* --- FIX DEFINITIVO: CABEÇALHO EM LINHA ÚNICA --- */
+/* --- AJUSTE FINO: ÍCONES PRÓXIMOS E EM LINHA --- */
 @media screen and (max-width: 720px) {
-     /* 1. Força o cabeçalho a não quebrar linha e reduz a altura */
+     /* 1. Remove o "empurrão" dos containers */
-     .mw-header {
+    .vector-header-end,
+     .mw-header-end,
+    #p-search {
+        flex: 0 1 auto !important;
+        width: auto !important;
+        min-width: 0 !important;
+    }
+    /* 2. Aproxima os ícones (Lupa, Ferramentas, User) */
+    .vector-header-end {
          display: flex !important;
-         flex-wrap: nowrap !important;
+         justify-content: flex-end !important;
-        align-items: center !important;
+         gap: 4px !important; /* Reduzido de 12px para 4px para ficarem colados */
-         height: 50px !important;
+         margin-left: auto !important;
-         padding: 0 8px !important;
      }
-     /* 2. Reduz o logo para ganhar espaço horizontal */
+     /* 3. Garante que o botão de pesquisa não tem margens extras */
+    .search-toggle {
+        padding: 0 4px !important;
+        margin: 0 !important;
+    }
+    /* 4. Reduz o logo só mais um pouco para dar "ar" aos ícones */
      .mw-header .mw-logo-icon {
-         width: 80px !important; /* Logo mais pequeno na vertical para caber tudo */
+         width: 75px !important;
-        height: auto !important;
+         max-height: 20px !important;
-         max-height: 22px !important;
      }
-     /* 3. Esconde qualquer texto de utilizador (como "WikiManagement" ou "Log in") */
+     /* 5. Esconde o texto do Login/User de forma absoluta */
-    /* Mantém apenas o ícone visual */
      .vector-user-links-main .mw-list-item span:not(.vector-icon),
-     #pt-login span,
+     .vector-user-links-main .cdx-button__label {
-    #pt-createaccount span {
          display: none !important;
-    }
-    /* 4. Garante que os ícones da direita fiquem alinhados e visíveis */
-    .vector-header-end {
-        display: flex !important;
-        flex: 1 !important;
-        justify-content: flex-end !important;
-        gap: 12px !important;
-        min-width: 100px !important;
-    }
-    /* 5. Ajusta o botão de login para mostrar o ícone se ele estiver escondido */
-    #pt-login {
-        display: inline-flex !important;
      }
 }