GitHub - single-column repository page with important info on the top

Pulls Readme above files list and reorganizes repository root page moving sidebar content foremost.

当前为 2023-12-12 提交的版本,查看 最新版本

您需要先安装一个扩展,例如 篡改猴Greasemonkey暴力猴,之后才能安装此脚本。

You will need to install an extension such as Tampermonkey to install this script.

您需要先安装一个扩展,例如 篡改猴暴力猴,之后才能安装此脚本。

您需要先安装一个扩展,例如 篡改猴Userscripts ,之后才能安装此脚本。

您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。

您需要先安装用户脚本管理器扩展后才能安装此脚本。

(我已经安装了用户脚本管理器,让我安装!)

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展,比如 Stylus,才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

您需要先安装一款用户样式管理器扩展后才能安装此样式。

(我已经安装了用户样式管理器,让我安装!)

/* ==UserStyle==
@name           GitHub - single-column repository page with important info on the top
@namespace      myfonj
@version        1.12.0
@description    Pulls Readme above files list and reorganizes repository root page moving sidebar content foremost.
@author         myf
@license        CC0
==/UserStyle== */
@-moz-document domain("github.com") {
 /*
  https://userstyles.world/style/5069/github-repository-page-in-single-column-with-important-info-on-the-top
  https://greasyfork.org/en/scripts/406729/versions/new
 Changelog
  1.12.0 (2023-12-12) - rushed hotfix for new main content structure, readme is back up. Ton of dead code remains.
  1.11.1 (2023-11-15) - restore compacting stuff under tags (license, CoC, ... icons) after structure change (new wrapper)
  1.11.0 (2023-09-25) - Hide redundant ☆ / 👁 / 🜉 + counts under tags.
  1.10.0 (2023-09-25) - Hide "No releases published" / "No packages published" boxes
  1.9.4 (2023-09-20) - prevent links under tags wrapping between words
  1.9.3 (2023-09-07) - wider "About" box, narrower rest, icons-(+ counts)-only footer
  1.9.2 (2023-08-15) - max-width for header
  1.9.1 (2023-07-13) - fix superfluous line break in resources (`include-fragment`)
  1.9.0 (2023-06-22) - readme pulled to top even on subpages; requires modern Chromium or Firefox with `layout.css.has-selector.enabled` pref
  1.8.4 (2023-03-03) - hopefuly applied even for "turbopages"
  1.8.3 (2022-08-11) - just name and info changes
 */
 /* just for categorization */
 /* … and this little photo zoom */
 .Popover .avatar-user {
  min-width: 240px;
  min-height: 240px;
  /* image-rendering: crisp-edges */
 }
 /* … and pulling the readme at code pages deeper */
 main div:has(> #readme) {
  /* wohohoo, new era of usestyling just arrived. */
  order: -1; 
 }
}
@-moz-document regexp("^https?://github.com/(?!password_reset|settings)([^#?/]+)/([^#?/]+)/?([#?].*)?$") {
 /*
 examples
 https://github.com/mmulet/code-relay
  few contributors, many columns
 https://github.com/mozilla/readability
  used by ..
 https://github.com/GoogleChromeLabs/dark-mode-toggle
  many tags, much everything
 https://github.com/WebReflection/sqlite-worker
  five columns
 https://github.com/rilwis/bamboo
  fork, just two columns
 https://github.com/mozilla/standards-positions
  no about, no tags
 https://github.com/mcmilk/7-Zip-zstd/
  sponsor
 https://github.com/mdn/mdn-minimalist
  no readme TOC
 
 `.repository-content` class is actually unreliable, since it is not present for ajaxified turbonavigations
 using `#repository-container-header + *` instead
 that `*` seems like
<turbo-frame id="repo-content-turbo-frame" target="_top" data-turbo-action="advance" class="">
      <div id="repo-content-pjax-container" class="repository-content ">
 */
 /* header block nentred
 */
 .AppHeader > * {
  max-width: 1280px;
  margin: auto;
 }
 /* unify main max width and centering of the main blocks
 */
 main > div {
  max-width: none !important;
  max-width: 80rem !important;
  max-width: 90rem !important;
  margin-left: auto;
  margin-right: auto;
 }
 /* Header row with name, description for mobile, tabs, etc */
 main > div:first-child {
  display: flex;
  flex-direction: column;
  background-color: transparent !important;
  padding-top: 0 !important;
 }
 /* "Tabs" (Code , PRs, Actions, ... ) pull above main heading */
 main > div:first-child > nav {
  order: -1;
  margin-bottom: 1rem;
 }
 /* main "columns" wrapper (files | sidebar) - convert to reversed rows */
 #repository-container-header + * .Layout {
  display: flex !important;
  flex-direction: column-reverse !important;
 }
 /* Files, Sidebar - now rows*/
 #repository-container-header + * .Layout > div {
  width: auto;
 }
 /*
  main column - wrapper of:
  - file navigation (branches, tags left, goto, file right)
  - files (moved to bottom, except for 1. "row" with latest commit positioned to file navigation)
  - readme (moved under file navigation)
 */
 #repository-container-header + * .Layout > .Layout-main {
  position: relative;
  display: flex;
  flex-direction: column;
 }
 #repository-container-header + * .Layout > .Layout-main > .file-navigation {
  order: -2;
 }
 /*
 Readme - move before files files
 there are two kinds of readme blocks:
 - "fancy" readme-toc component with kebab menu of headings (introduced around 2021-03-26)
   - see e.g. https://github.com/SerenityOS/serenity
 - "normal" div#readme
   - see e.g. https://github.com/mozilla/readability
 */
 #repository-container-header + * .Layout > .Layout-main > readme-toc,
 #repository-container-header + * .Layout > .Layout-main > #readme {
  order: -1;
 }
 /* sticky "README.md" heading / TOC box make simple button */
 #repository-container-header + * .Layout > .Layout-main > readme-toc > #readme > :first-child {
  display: inline-flex !important;
  border: none !important;
  background-color: transparent !important
  /**/
 }
 /* "readme.md" label/link heading after TOC button: hide */
 #repository-container-header + * .Layout > .Layout-main > readme-toc > #readme > :first-child h2 {
  display: none;
 }
 /* actual readme box: push up into place freed by heading / TOC box */
 #repository-container-header + * .Layout > .Layout-main > readme-toc > #readme > :last-child{
  margin-top: -3rem
 }
 /* readme - line length limit (originnaly 1012px through .container-lg) */
 #repository-container-header + * .Layout > .Layout-main > readme-toc > #readme article.markdown-body.entry-content {
  max-width: 80ch;
 }
 /*
 sidebar - now top content
 for god's sake, THIS div should be MAIN and should be near H1 or something
 not suffocated at the end of the document in sidebar
 */
 #repository-container-header + * .Layout > .Layout-sidebar > div {
  display: flex;
  flex-direction: row;
  /* let's try without
  flex-wrap: wrap;
  now */
  padding-bottom: 1rem;
 }
 /* all main flex items (about .. languages)*/
 #repository-container-header + * .Layout > .Layout-sidebar > div > * {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 0;
  border-left: 1px solid var(--color-border-secondary);
  border-left: none;
  padding-left: .5rem; 
  padding-right: .5rem; 
  padding-bottom: 1rem;
 }
 /*
  first "about" cell
 */
 #repository-container-header + * .Layout > .Layout-sidebar > div:first-child > div:first-child {
  flex-basis: 50ch;
  flex-grow: 2;
  max-width: 80ch;
  border-left: none;
  padding-left: 0;
 }
 /* 📖 Readme ⚖️ License : condense, icons-(+ counts)-only footer */
 /* those h3 are .sr-only, preceding divs and `include-fragment` */
 #repository-container-header + * .Layout > .Layout-sidebar > div:first-child > div:first-child > div h3 ~ * {
  display: inline;
  font-size: 0;
  line-height: 1rem;
  
  & strong,
  & a[href$="/LICENSE"],
  & a:not(:has(svg)){
   font-size: 1rem;
   white-space: nowrap !important;
  }
  &:has(svg)::after {
   content: '\A0';
   font-size: 1rem;
  }
  /* 
   Hide redundant ☆ / 👁 / 🜉 + counts under tags.
   They are present in the header already, and better.
  */
  &:has(
   a[href$="/stargazers"],
   a[href$="/watchers"],
   a[href$="/forks"]
  ) {
   display: none !important
  }
 }
 /* unnecessary 🔗 link icon, may cause wrap, hide */
 #repository-container-header + * .Layout > .Layout-sidebar > div:first-child > div:first-child  .octicon-link {
  display: none; 
 }
 /* last "(programming) languages" cell */
 #repository-container-header + * .Layout > .Layout-sidebar > div:first-child > div:last-child {
  /*
  flex-shrink: 100;
  flex-grow: 0;
  /* let's try without limiting */
 }
 /* Contributors "grid" min three in rows (to not get a two or single row skyscraper) */
 #repository-container-header + * .Layout > .Layout-sidebar > div:first-child  h2 + ul {
  min-width: 8rem !important;
 }
 /* no border nor paddings */
 #repository-container-header + * .Layout > .Layout-sidebar > div > div > div {
  border: none;
  padding: 0;
 }
 /* headings  */
 #repository-container-header + * .Layout > .Layout-sidebar > div > div > div > h2 ,
 #repository-container-header + * .Layout > .Layout-sidebar > div > div > div > h2 > a {
  white-space: nowrap !important;
 }
 /* tags in about cell - restack and dim */
 #repository-container-header + * .Layout > .Layout-sidebar > div:first-child > div .f6:not(:hover) {
  opacity: 0.5;
 }
 #repository-container-header + * .Layout > .Layout-sidebar > div:first-child > div .f6 {
  display: flex;
  flex-wrap: wrap;
 }
 #repository-container-header + * .Layout > .Layout-sidebar > div:first-child  > div .f6 > * {
  flex-grow: 1;
  text-align: center;
 }
 /* "used by 108" - make 8 avatars wrap */
 .hx_flex-avatar-stack {
  flex-wrap: wrap;
  max-width: 10rem;
  padding-right: .8rem;
 }
 /* allowing wrap of counter under "used by" avatars */
 #repository-container-header + * .Layout > .Layout-sidebar > div:first-child  > div .d-flex.flex-items-center {
  flex-wrap: wrap;
 }
 /*
 un-truncating everything to allow wrapping of long (esp. in "releases" cell
 affects "releases", but whatever
 */
 #repository-container-header + * .Layout > .Layout-sidebar > div > * * {
  white-space: normal !important;
 }
 /* un-flexing latest release */
 #repository-container-header + * .Layout > .Layout-sidebar > div > * .Link--primary.d-flex * { display: block !important}

 /* superfluous link icon in "sponsor this project" */
 #repository-container-header + * .Layout > .Layout-sidebar > div > * [style="min-width:32px;height:32px;"] {
  display: none !important;
 }
 /* environments "active" tag below text */
 #repository-container-header + * .Layout > .Layout-sidebar > div > * h2 + .list-style-none li .Label {
  display: block; 
 }

/*
§ Hide "No releases published" / "No packages published" boxes.
*/
#repository-container-header + * .Layout > .Layout-sidebar > div > div.BorderGrid-row:has(
 > .BorderGrid-cell:only-child
 > h2:first-child /* :has( a[href$="/releases"]) */
 + div.text-small.color-fg-muted:last-child
) {
 display: none;
}



 /*
  last commit & "commits" link
  normally above files table, moving into file navigation
 */
 #repository-container-header + * .Layout > .Layout-main > *:not([id]) > .Box-header {
  position: absolute !important;
  padding: 0; 
  top: .33rem;
  border: none;
  left: 16rem; /* space for branch selector, branches, tags */
  right: 21rem; /* space for Go to file, Add file, Code/clone */
  background-color: transparent !important;
  z-index: 90; /* for "..." unfolding */
 }
 /* unnecesary non-TOC "readme.md" heading box */
 #repository-container-header + * .Layout > .Layout-main > [id="readme"] > .Box-header:first-child { display: none !important; }
 /* hide hash */
 #repository-container-header + * .Layout > .Layout-main .Box-header .text-mono {
  display: none !important
 }
 /* reverse order so commit count ends up beside tag count */
 #repository-container-header + * .Layout > .Layout-main .Box-header  > div > :last-child {
  order: -1;
  padding-right: 1rem;
 }
  /* hide "commits" text (lave icon) (more space for last commit msg) */
 #repository-container-header + * .Layout > .Layout-main .Box-header  > div > :last-child .color-text-secondary {
  display: none !important;
 }
 /* hide "branches" and "tags" text (lave icons) (more space for last commit msg) */
 .file-navigation .color-text-tertiary{
  display: none;
 }
/*
 hide word "commits", "tags", "branches" after counts 
*/
svg[aria-hidden="true"]:first-child + strong:not(:hover) + span:last-child {
  font-size: 0;

}
svg[aria-hidden="true"]:first-child + span:last-child:not(:hover) > strong:first-child + span:last-child {
  font-size: 0;
}

/*
 (just trying) see wide tables without scrolling them
*/ 
.markdown-body table {
 overflow: visible;
}


/**
2023-12-11
new structure, totally turdy
rushed hotfix
readme first
**/
[data-selector="repos-split-pane-content"]{
 margin: 0;
 & div:has(>div>h2#folders-and-files) {
  order: 1;
 }
}

/* END */
}