User:Thiemo Kreuz (WMDE)/userContent.css

From Meta, a Wikimedia project coordination wiki

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/**
 * This custom stylesheet aims to make Gerrit easier to use, by removing cruft, enlarging relevant
 * click regions, and adjusting margins and paddings to avoid overflowing on medium-size laptop
 * screens.
 *
 * To activate these styles in Firefox, find or create your local
 * ~/.mozilla/firefox/*.default/chrome/userContent.css and paste the contents of this file.
 *
 * @license CC0-1.0
 * @author Thiemo Kreuz
 * @see http://superuser.com/a/319322
 */
@-moz-document domain(gerrit.wikimedia.org) {
	/* Make my own name less prominent, everywhere */
	a[title*="thiemo.kreuz@wikimedia.de"],
	a[href*="thiemo.kreuz%2540wikimedia.de"],
	a[title*="thiemo.maettig@wikimedia.de"],
	a[href*="thiemo.maettig%2540wikimedia.de"] {
		color: #000 !important;
		opacity: 0.3;
	}

	/* Enforce scrollbar to avoid content jumping to the left when expanding comments and such */
	html {
		overflow-y: scroll;
	}

	/* Remove logo and background image in the top left corner */
	body,
	.wm-gerrit-heading {
		background: none !important;
	}
	/* Move top menus to the left where the logo was */
	#gerrit_topmenu {
		left: 0 !important;
		margin-right: 0 !important;
	}

	/* Hide "powered by" in the bottom right corner */
	#gerrit_btmmenu .gwt-InlineHTML:first-child,
	#gerrit_btmmenu .gwt-InlineLabel:nth-child(2) {
		display: none;
	}

	/* Make the headlines of long search query results readable again */
	table.screenHeader td:first-child,
	table.screenHeader td + td + td {
		display: none;
	}
	.screenHeader {
		border-spacing: 0;
		font-size: 15px !important;
		line-height: 1.1;
		margin: 0 0 0.3em !important;
		white-space: normal !important;
		word-wrap: break-word;
	}

	/* Limit width of the "owner" and "updated" table columns */
	.changeTable .cOWNER,
	.changeTable .cOWNER + td,
	.changeTable .cOWNER + td + td,
	.changeTable .cOWNER + .dataCellHidden + td,
	.changeTable .cOWNER + .dataCellHidden + td + td,
	.changeTable .cLastUpdate {
		max-width: 8em;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
	}
	/* Limit width of the "project" and "branch" table columns */
	.changeTable .cOWNER + td,
	.changeTable .cOWNER + td + td,
	.changeTable .cOWNER + .dataCellHidden + td,
	.changeTable .cOWNER + .dataCellHidden + td + td {
		max-width: 18em;
	}
	.changeTable .cOWNER + td,
	.changeTable .cOWNER + .dataCellHidden + td {
		direction: rtl;
	}
	.changeTable .cOWNER + .dataCellHidden + td + td {
		opacity: 0.3;
	}

	/* The size of a change is nothing to be scared of, remove judging colors */
	.changeTable .changeSize,
	/* Same style for the size column for each file */
	.com-google-gerrit-client-change-FileTable-FileTableCss-inserted,
	.com-google-gerrit-client-change-FileTable-FileTableCss-deleted {
		background: #ddd !important;
		box-shadow: inset 0 0 1px #000;
	}
	.com-google-gerrit-client-change-FileTable-FileTableCss-deleted {
		background: #faa !important;
	}
	.com-google-gerrit-client-change-FileTable-FileTableCss-deltaColumn2 {
		opacity: 0.6;
	}
	/* Hide the column with the combined "changed lines" count */
	td.com-google-gerrit-client-change-FileTable-FileTableCss-deltaColumn1 {
		display: none;
	}
	/* Instead show the individual numbers of added and removed lines */
	td.com-google-gerrit-client-change-FileTable-FileTableCss-deltaColumn2[title]::after {
		content: "\A0"attr(title);
		display: inline-block;
		width: 0;
	}

	/* Limit the column containing the reviewers to not span the whole screen, and the icons getting lost on the far right */
	.com-google-gerrit-client-change-ChangeScreen_BinderImpl_GenCss_style-infoColumn {
		max-width: 60em;
		width: auto !important;
	}

	/* Maximum width for "author" and "committer" below the commit message, avoids jumping content */
	.com-google-gerrit-client-change-CommitBox_BinderImpl_GenCss_style-userPanel {
		max-width: 23em;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	/* Avoids jumping content when clicking the "commit", "parent" and change IDs */
	.com-google-gerrit-client-change-CommitBox_BinderImpl_GenCss_style-clippy input,
	/* Avoids jumping content when adding reviewers */
	.com-google-gerrit-client-change-Reviewers_BinderImpl_GenCss_style-suggestBox {
		max-width: 20em;
	}

	/* Dim abandoned changes */
	.com-google-gerrit-client-change-RelatedChanges-RelatedChangesCss-strikedSubject,
	.com-google-gerrit-client-change-RelatedChanges-RelatedChangesCss-strikedSubject + * {
		opacity: 0.3;
	}
	.com-google-gerrit-client-change-RelatedChanges-RelatedChangesCss-strikedSubject a {
		color: #000 !important;
	}

	/* Much more vertical whitespace between comments */
	.com-google-gerrit-client-change-Message_BinderImpl_GenCss_style-header {
		padding-top: 0.8em;
	}
	.com-google-gerrit-client-change-Message_BinderImpl_GenCss_style-summary,
	.com-google-gerrit-client-change-Message_BinderImpl_GenCss_style-date {
		margin-top: 0.8em;
	}
	.com-google-gerrit-client-change-Message_BinderImpl_GenCss_style-messageBox {
		padding-bottom: 0.8em !important;
		padding-top: 0 !important;
	}
	/* Remove all vertical whitespace inside of comments */
	.com-google-gerrit-client-change-Message_BinderImpl_GenCss_style-contents p,
	.com-google-gerrit-client-change-Message_BinderImpl_GenCss_style-contents ul,
	.ci_comment_test_name {
		margin-bottom: 0;
		margin-top: 0;
		padding-bottom: 0 !important;
	}

	/* Add a little safe zone around the top navigation bar buttons to avoid misclicking */
	.com-google-gerrit-client-diff-Header_BinderImpl_GenCss_style-header {
		margin-bottom: 4px;
		margin-top: 4px;
	}
	/* Background for the prev/top/next navigation bar */
	.com-google-gerrit-client-diff-Header_BinderImpl_GenCss_style-navigation {
		background-image: linear-gradient(#fff, #ccc, #fff);
		text-shadow: 0 0 1px #fff;
	}
	/* Much bigger click regions for the prev/next buttons */
	.com-google-gerrit-client-diff-CommentBox-Style-goPrev,
	.com-google-gerrit-client-diff-CommentBox-Style-goPrev:visited,
	.com-google-gerrit-client-diff-CommentBox-Style-goUp,
	.com-google-gerrit-client-diff-CommentBox-Style-goNext,
	.com-google-gerrit-client-diff-CommentBox-Style-goNext:visited {
		background-color: #4d90fe !important;
		border-radius: 2px;
		box-shadow: inset 0 0 1px #000;
		color: rgba( 100%, 100%, 100%, 0.6 ) !important;
		font-size: 8pt;
		font-weight: bold;
		padding: 0 2px;
		text-shadow: none;
	}
	.com-google-gerrit-client-diff-CommentBox-Style-goPrev:hover,
	.com-google-gerrit-client-diff-CommentBox-Style-goUp:hover,
	.com-google-gerrit-client-diff-CommentBox-Style-goNext:hover {
		background-color: #0654ac !important;
		color: rgba( 100%, 100%, 100%, 0.8 ) !important;
	}
	.com-google-gerrit-client-diff-CommentBox-Style-goPrev:active,
	.com-google-gerrit-client-diff-CommentBox-Style-goUp:active,
	.com-google-gerrit-client-diff-CommentBox-Style-goNext:active {
		box-shadow: inset 0 1px 4px #000;
	}
	.com-google-gerrit-client-diff-CommentBox-Style-goPrev,
	.com-google-gerrit-client-diff-CommentBox-Style-goNext {
		width: auto !important;
	}
	.com-google-gerrit-client-diff-CommentBox-Style-goPrev:after,
	.com-google-gerrit-client-diff-CommentBox-Style-goNext:after {
		content: attr(title);
		display: inline-block;
		text-overflow: ellipsis;
		white-space: nowrap;
		width: 204px;
	}
	.com-google-gerrit-client-diff-CommentBox-Style-goPrev:after {
		padding-left: 18px;
	}
	.com-google-gerrit-client-diff-CommentBox-Style-goUp {
		background-position: center !important;
		padding: 0 30px;
	}
	.com-google-gerrit-client-diff-CommentBox-Style-goNext {
		background-position: right !important;
		padding-right: 18px;
		text-align: right;
	}

	/* Much larger font size for the code */
	.CodeMirror-code {
		font-size: 12px;
	}
	/* Remove the misaligned orange vertical line */
	.net-codemirror-lib-CodeMirror-Style-margin {
		display: none;
	}
}