☰

Gitlab navigation buttons

Add back the buttons on the navigation bar that have been hidden in the hamburger menu in GitLab 14. Modified from https://greatest.deepsurf.us/en/scripts/428343-gitlab-navigation-buttons

  1. // ==UserScript==
  2. // @name                Gitlab navigation buttons
  3. // @description         Add back the buttons on the navigation bar that have been hidden in the hamburger menu in GitLab 14. Modified from https://greatest.deepsurf.us/en/scripts/428343-gitlab-navigation-buttons
  4. // @author              v1rgul
  5. // @namespace           v1rgul
  6.  
  7. // @grant               none
  8. // @run-at              document-end
  9. // @include             *://gitlab.com/*
  10. // @include             *://gitlab.*.*/*
  11. // @include             *://git.*.*/*
  12.  
  13. // @date                2021-07-21
  14. // @version             1.0.0
  15. // @require             https://cdn.staticfile.org/jquery/1.12.2/jquery.min.js
  16. // ==/UserScript==
  17.  
  18.  
  19. (function () {
  20.     'use strict';
  21.  
  22.     const nav = document.querySelector('div.title-container');
  23.     const html = `
  24.     <div class="gl-display-none gl-sm-display-block">
  25.       <ul class="nav navbar-sub-nav">
  26.         <!--
  27.         <li class="nav-item"><a href="/dashboard/projects" class="" >
  28.           <span class="gl-button-text"><span class="gl-display-flex">
  29.               <svg role="img" aria-hidden="true" class="gl-icon s16 gl-mr-2!"><use href="/assets/icons-1b2dadc4c3d49797908ba67b8f10da5d63dd15d859bde28d66fb60bbb97a4dd5.svg#project"></use></svg>
  30.               Projects
  31.           </span></span>
  32.         </a></li>
  33.         -->
  34.         <li class="nav-item"><a href="/dashboard/projects" class="" >
  35.           <span class="gl-button-text"><span class="gl-display-flex">
  36.               <svg class="gl-icon s16 gl-mr-2!" data-testid="star-icon"><use xlink:href="/assets/icons-1b2dadc4c3d49797908ba67b8f10da5d63dd15d859bde28d66fb60bbb97a4dd5.svg#star"></use></svg>
  37.               Starred Projects
  38.           </span></span>
  39.         </a></li>
  40.         <li class="nav-item"><a href="/dashboard/groups" class="" >
  41.           <span class="gl-button-text"><span class="gl-display-flex">
  42.               <svg role="img" aria-hidden="true" class="gl-icon s16 gl-mr-2!"><use href="/assets/icons-1b2dadc4c3d49797908ba67b8f10da5d63dd15d859bde28d66fb60bbb97a4dd5.svg#group"></use></svg>
  43.               Groups
  44.           </span></span>
  45.         </a></li>
  46.         <!--
  47.         <li class="nav-item"><a href="/dashboard/milestones" class="" >
  48.           <span class="gl-button-text"><span class="gl-display-flex">
  49.               <svg role="img" aria-hidden="true" class="gl-icon s16 gl-mr-2!"><use href="/assets/icons-1b2dadc4c3d49797908ba67b8f10da5d63dd15d859bde28d66fb60bbb97a4dd5.svg#clock"></use></svg>
  50.               Milestones
  51.           </span></span>
  52.         </a></li>
  53.         <li class="nav-item"><a href="/dashboard/snippets" class="" >
  54.           <span class="gl-button-text"><span class="gl-display-flex">
  55.               <svg role="img" aria-hidden="true" class="gl-icon s16 gl-mr-2!"><use href="/assets/icons-1b2dadc4c3d49797908ba67b8f10da5d63dd15d859bde28d66fb60bbb97a4dd5.svg#snippet"></use></svg>
  56.               Snippets
  57.           </span></span>
  58.         </a></li>
  59.         <li class="nav-item"><a href="/dashboard/activity" class="" >
  60.           <span class="gl-button-text"><span class="gl-display-flex">
  61.               <svg role="img" aria-hidden="true" class="gl-icon s16 gl-mr-2!"><use href="/assets/icons-1b2dadc4c3d49797908ba67b8f10da5d63dd15d859bde28d66fb60bbb97a4dd5.svg#history"></use></svg>
  62.               Activity
  63.           </span></span>
  64.         </a></li>
  65.         -->
  66.         <!-- btn top-nav-menu-item gl-display-block gl-w-full btn-default btn-md gl-button btn-default-tertiary qa-admin-area-link -->
  67.         <li class="nav-item"><a href="/admin" class="" >
  68.           <span class="gl-button-text"><span class="gl-display-flex">
  69.               <svg role="img" aria-hidden="true" class="gl-icon s16 gl-mr-2!"><use href="/assets/icons-1b2dadc4c3d49797908ba67b8f10da5d63dd15d859bde28d66fb60bbb97a4dd5.svg#admin"></use></svg>
  70.               Admin
  71.           </span></span>
  72.         </a></li>
  73.       </ul>
  74.     </div>`
  75.     $(nav).append(html);
  76. })();