{"id":23175820,"url":"https://github.com/blakegearin/github-custom-global-navigation","last_synced_at":"2025-07-15T05:47:29.463Z","repository":{"id":204592249,"uuid":"707967132","full_name":"blakegearin/github-custom-global-navigation","owner":"blakegearin","description":"Userscript for customizing GitHub's global navigation","archived":false,"fork":false,"pushed_at":"2024-12-04T09:22:35.000Z","size":654,"stargazers_count":20,"open_issues_count":3,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2024-12-04T10:27:50.039Z","etag":null,"topics":["github","global-navigation","userscript"],"latest_commit_sha":null,"homepage":"","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/blakegearin.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":"CONTRIBUTING.md","funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2023-10-21T05:50:42.000Z","updated_at":"2024-12-04T09:22:15.000Z","dependencies_parsed_at":null,"dependency_job_id":"81c8bbb6-4c10-46d5-855a-fd0c84f08d39","html_url":"https://github.com/blakegearin/github-custom-global-navigation","commit_stats":null,"previous_names":["blakegearin/github-custom-global-navigation"],"tags_count":13,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blakegearin%2Fgithub-custom-global-navigation","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blakegearin%2Fgithub-custom-global-navigation/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blakegearin%2Fgithub-custom-global-navigation/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/blakegearin%2Fgithub-custom-global-navigation/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/blakegearin","download_url":"https://codeload.github.com/blakegearin/github-custom-global-navigation/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":230225637,"owners_count":18193014,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["github","global-navigation","userscript"],"created_at":"2024-12-18T06:09:41.321Z","updated_at":"2025-07-15T05:47:29.450Z","avatar_url":"https://github.com/blakegearin.png","language":"HTML","readme":"\u003cp align=\"center\"\u003e\n  \u003cimg\n    height=\"30%\"\n    width=\"30%\"\n    src=\"img/white_logo.svg#gh-dark-mode-only\"\n    alt=\"GitHub Custom Global Navigation logo\"\n    title=\"GitHub Custom Global Navigation logo\"\n  /\u003e\n  \u003cimg\n    height=\"30%\"\n    width=\"30%\"\n    src=\"img/black_logo.svg#gh-light-mode-only\"\n    alt=\"GitHub Custom Global Navigation logo\"\n    title=\"GitHub Custom Global Navigation logo\"\n  /\u003e\n\u003c/p\u003e\n\n# GitHub Custom Global Navigation\n\n![Dynamic JSON Badge](https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fgreasyfork.org%2Fscripts%2F478687-github-custom-global-navigation.json\u0026query=total_installs\u0026suffix=%20installs\u0026label=greasy%20fork\u0026color=%23670000\u0026link=https%3A%2F%2Fgreasyfork.org%2Fen%2Fscripts%2F478687-github-custom-global-navigation)\n![Dynamic JSON Badge](https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fopenuserjs.org%2Fmeta%2Fblakegearin%2FGitHub_Custom_Global_Navigation.meta.json\u0026query=%24.OpenUserJS.installs%5B0%5D.value\u0026suffix=%20installs\u0026label=openuserjs\u0026color=%23202d3b\u0026link=https%3A%2F%2Fopenuserjs.org%2Fscripts%2Fblakegearin%2FGitHub_Custom_Global_Navigation)\n[![MIT](https://img.shields.io/badge/license-MIT-blue)](LICENSE)\n\nThis is a [userscript](https://openuserjs.org/about/Userscript-Beginners-HOWTO) to customize the global navigation of GitHub.\n\n## Usage\n\n1. Install a userscript manager like [Tampermonkey](https://www.tampermonkey.net), [Violentmonkey](https://violentmonkey.github.io), or [Greasemonkey](https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/)\n1. Go to [GreasyFork](https://greasyfork.org/en/scripts/478687-github-custom-global-navigation) or [OpenUserJS](https://openuserjs.org/scripts/blakegearin/GitHub_Custom_Global_Navigation)\n1. Click the install button\n1. The userscript will open in your userscript manager where you can install it\n1. Once installed, click your avatar in the top right to open the sidebar\n1. \"Customize global navigation\" will be listed underneath the regular \"Settings\" option\n\n   \u003cimg\n    height=\"40%\"\n    width=\"40%\"\n    src=\"img/menu_option.png\"\n    alt=\"menu option for 'Customize global navigation'\"\n    title=\"menu option for 'Customize global navigation'\"\n   /\u003e\n\n## Documentation\n\n### Configurations\n\nThere are two (2) preset configurations that are actively maintained and supported.\n\n#### Happy Medium\n\nThis previews some the best features and aims to deliver a [happy medium](https://dictionary.cambridge.org/dictionary/english/happy-medium) between the old and new styles without compromising on accessibility. It relies more on Github's CSS variables in hopes of adapting to their changes.\n\n![light header](img/happy_medium_light.png)\n\n![dark header](img/happy_medium_dark.png)\n\n#### Old School\n\nThis aims to deliver an experience as close to the style  March 2023 as reasonably possible without compromising on accessibility. Where applicable, it uses hardcoded values instead of CSS variables to prevent side effects from GitHub's changes.\n\n![light header](img/old_school_light.png)\n\n![dark header](img/old_school_dark.png)\n\n### Accessability\n\nAccessibility is important. GitHub [agrees](https://accessibility.github.com).\n\nThis userscript should not make GitHub less accessible. However, this userscript doesn't go _out of its way_ to improve accessability on existing elements, and elements added try to be consistent with existing ones.\n\nIf you have an accessibility concern with the userscript's operations or additions, please create a new issue.\n\n### Responsive Design\n\nGitHub's new design is responsive, hiding and condensing more elements as screen width decreases. There are breakpoints at `1011px` and `768px`.\n\nBecause this userscript is highly customizable, it's complex to make every possible variant similarly responsive. However, the default configurations can be regularly tested during development. It's also worth noting userscripts are not popularly run on tablets or phones.\n\nWith these considerations in mind, this is the support priority order of screen widths:\n\n1. `1011px` - `1920px` (e.g. laptops)\n1. `1920px` and up (e.g. external monitors)\n1. `1011px` and below (e.g. tablets, phones)\n\n### Theming\n\nAs of the time of writing, GitHub supports four (4) light and an equal number of dark themes.\n\nThis userscript does not have first-class support for sub-themes, but can tell light or dark preference either from GitHub (`data-color-mode`) or falling back to browser-level (`data-color-mode`), which typically matches the OS-level.\n\n### Archiving\n\nPart of the challenge of maintaining the Old School configuration is finding enough archival resources to make it accurate. To help maintain this project and in the spirit of aiding future developers, the HTML of the main `header` tag and `repository-container-header` will be archived periodically. These elements will also be archived in a post-script state for each supported configuration.\n\nThe following pages are the archival targets:\n\n- [GitHub home](https://github.com/)\n- [Example repository](https://github.com/ruby/debug)\n\n### Maintenance\n\nThis was built with long-term maintenance in mind.\n\n- Keeping selectors neatly sorted and in one place\n- Minimizing DOM traversal\n- Adding unique IDs to relevant HTML elements that don't have good selectors\n- Logging errors cleanly\n\n## Background\n\nIn April 2023, GitHub released a public beta for a redesigned global navigation and asked for [feedback](https://github.com/orgs/community/discussions/52083).\n\nIn October 2023, GitHub initiated a [public rollout](https://github.blog/changelog/2023-10-17-redesigned-navigation-now-available-to-all-users/) and removed the opt-out from [Release preview](https://docs.github.com/en/get-started/using-github/exploring-early-access-releases-with-feature-preview).\n\n## Credit\n\n- Colors, icons, and element properties for theming were collected from a variety of sources\n  - [Internet Archive](https://archive.org) ([donate](https://archive.org/donate))\n  - [GitHub](https://github.com/)\n  - [Gist](https://gist.github.com/)\n  - [YouTube](https://www.youtube.com) \u003csup\u003e\u003ca href=\"https://www.youtube.com/watch?v=ULsLaA__Xe8\"\u003e[1]\u003c/a\u003e\u003c/sup\u003e\u003csup\u003e\u003ca href=\"https://www.youtube.com/watch?v=v_1iqtOnUMg\"\u003e[2]\u003c/a\u003e\u003c/sup\u003e\u003csup\u003e\u003ca href=\"https://youtu.be/jG4Vs81kMlc\"\u003e[3]\u003c/a\u003e\u003c/sup\u003e\n\n  - If you have video sources that show Old School user navigation around the website (or better yet, some HTML), please contribute to [this thread](https://github.com/blakegearin/github-custom-global-navigation/issues/1)\n\n- Menu\n\n  - Dependency: [GM_config](https://github.com/sizzlemctwizzle/GM_config)\n\n- Archiving\n\n  - Formatter: [Web Formatter](https://webformatter.com/html)\n\n- Logo\n\n  - Silhouette: [Mohamed Hassan](https://pixabay.com/vectors/silhouette-octopus-vector-graphic-3313481/)\n\n  - Optimization: [SVGOMG](https://svgomg.net)\n\n## Disclaimer\n\nNot affiliated with Microsoft Corporation, GitHub, Inc., or any of their affiliations.\n\n## Related Projects\n\nMiss the old design of Slack too? Check out my userscript: [Old School Slack](https://github.com/blakegearin/old-school-slack#readme)\n\nWant to customize the favicon for different GitHub tabs? I'm working on a solution for that too: [Favicon Packs](https://github.com/blakegearin/favicon-packs#readme)\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblakegearin%2Fgithub-custom-global-navigation","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fblakegearin%2Fgithub-custom-global-navigation","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fblakegearin%2Fgithub-custom-global-navigation/lists"}