☰

GitHub - single column with important info on the top

Right sidebar at repository page with description and other becomes top row, quite like it used to be before 2020 redesign

当前为 2020-10-15 提交的版本，查看 最新版本。

  1. /* ==UserStyle==
  2. @name           GitHub - single column with important info on the top
  3. @namespace      myfonj
  4. @version        1.1.1
  5. @description    Right sidebar at repository page with description and other becomes top row, quite like it used to be before 2020 redesign
  6. @author         myf
  7. ==/UserStyle== */
  8. @-moz-document regexp("^https?://github.com/([^#?/]*?)/([^#?/]*?)/?([#?].*)?$") {
  9. 	/*
  10. 	GitHub - single column with important info on the top
  11. 	https://greasyfork.org/en/scripts/406729/versions/new
  12. 	*/
  13. 	/* unify main max width and centering */
  14. 	main[id] > div {
  15. 		max-width: none !important;
  16. 		max-width: 80rem !important;
  17. 		margin-left: auto;
  18. 		margin-right: auto;
  19. 	}
  20. 	/* */
  21. 	main > div:first-child {
  22. 		display: flex;
  23. 		flex-direction: column;
  24. 		background-color: transparent !important;
  25. 		padding-top: 0 !important;
  26. 	}
  27. 	main > div:first-child > nav {
  28. 		order: -1;
  29. 		margin-bottom: 1em;
  30. 	}
  31. 	/*
  32. 	§1
  33. 	mobile-only description under main repository identifier (heading) above columns wrapper
  34. 	it is duplicated in the second column for large displays, which we will hide later
  35. 	*/
  36. 	main > div > div + div:not(#\0) {
  37. 		display: flex !important;
  38. 		flex-wrap: wrap;
  39. 	}
  40. 	/* actual description at own "line" (THIS IS IT) */
  41. 	main > div > div + div:not(#\0) > p:first-child {
  42. 		flex-basis: 100%
  43. 	}
  44. 	main > div > div + div:not(#\0) > * {
  45. 		margin-right: 1em;
  46. 	}
  47. 	/* baseline align */
  48. 	main > div > div + div:not(#\0) > p:first-child + *.d-flex {
  49. 		display: block !important;
  50. 	}
  51. 	/* star / watch (duped at desktop header) */
  52. 	main > div > div + div:not(#\0) > :last-child {
  53. 		display: none !important;
  54. 	}
  55. 	/*
  56. 	.repository-content
  57. 	= main > div:last-child > div.repository-content
  58. 	"main table"
  59. 	= .repository-content > div > div:first-child
  60. 	"info sidebar"
  61. 	= .repository-content > div > div:last-child > div
  62. 	*/
  63. 	/* main rows-made-columns wrapper */
  64. 	.repository-content > div {
  65. 		flex-direction: column-reverse !important;
  66. 	}
  67. 	/* now columns */
  68. 	.repository-content > div > div {
  69. 		width: auto;
  70. 	}
  71. 	/*
  72. 	for god's sake, THIS div should be MAIN and should be near H1 or something
  73. 	not suffocated at the end of the document in sidebar
  74. 	*/
  75. 	.repository-content > div > div:last-child > div {
  76. 		display: flex;
  77. 		flex-direction: row;
  78. 		flex-wrap: wrap;
  79. 		padding-bottom: 1rem;
  80. 	}
  81. 	.repository-content > div > div:last-child > div > * {
  82. 		flex-grow: 1;
  83. 		flex-shrink: 1;
  84. 	}
  85. 	/* no border nor paddings */
  86. 	.repository-content > div > div:last-child > div > div > div {
  87. 		border: none;
  88. 		padding-top: 0;
  89. 		padding-right: 1rem;
  90. 		padding-bottom: 1rem;
  91. 	}
  92. 	/*
  93. 	"about" cell
  94. 	actually, there is this content near H1, but it is shown only for mobile
  95. 	at this point it is shown (see §1), so let's hide what is already visible in there
  96. 	*/
  97. 	/*
  98. 	- description - dupe from header
  99. 	*/
  100. 	.repository-content > div > div:last-child > div > *:first-child p {
  101. 		display: none;
  102. 	}
  103. 	/*
  104. 	- license - dupe from header
  105. 	*/
  106. 	.repository-content > div > div:last-child > div > *:first-child [href$="/blob/master/LICENSE.txt"] {
  107. 		display: none;
  108. 	}
  109. 	/*
  110. 	- external link - dupe frome header
  111. 	*/
  112. 	.repository-content > div > div:last-child > div > div:first-child > div p + div svg.octicon-link,
  113. 	.repository-content > div > div:last-child > div > div:first-child > div p + div svg.octicon-link + span {
  114. 		display: none;
  115. 	}
  116. 	/*
  117. 	- "About" heading is quite redundant in there
  118. 	not hidden, but cropped and pulling adjacent content up 
  119. 	*/
  120. 	.repository-content > div > div:last-child > div > div:first-child > div > h2 {
  121. 		height: 0px !important;
  122. 		overflow: hidden;
  123. 		margin-bottom: -2em !important;
  124. 	}
  125. 	/* tags */
  126. 	.repository-content > div > div:last-child > div > div:first-child > div .f6 {
  127. 		display: flex;
  128. 		flex-wrap: wrap;
  129. 		max-width: 17rem;
  130. 	}
  131. 	.repository-content > div > div:last-child > div > div:first-child > div .f6 > * {
  132. 		flex-grow: 1;
  133. 		text-align: center;
  134. 	}
  135. 	.repository-content > div > div:last-child > div > div:first-child > div .f6:not(:hover) {
  136. 		opacity: 0.5;
  137. 	}
  138. 	/* contributors cell  */
  139. 	.repository-content > div > div:last-child > div > div > div > ul.list-style-none.d-flex {
  140. 		/* no change yet */
  141. 	}
  142. 	/* last column with lng meter */
  143. 	.repository-content > div > div:last-child > div > div:last-child {
  144. 		/* no change  yet */
  145. 	}
  146. 	/* languages as list */
  147. 	/* (without meter) */
  148. 	/* * OFF for now /
  149. 	.repository-content > div > div:last-child > div > div:last-child .Progress {
  150. 		display: none;
  151. 	}
  152. 	.repository-content > div > div:last-child > div > div:last-child ul.list-style-none li.d-inline {
  153. 		display: block !important;
  154. 	}
  155. 	/* */
  156. }