Fix several features that depended on specific classes /3 (#4121)

refined-github · Apr 2, 2021 · 787336c · 787336c
1 parent 6c1f22c
commit 787336c
Show file tree

Hide file tree

Showing 18 changed files with 27 additions and 24 deletions.
diff --git a/source/features/center-reactions-popup.css b/source/features/center-reactions-popup.css
@@ -55,5 +55,5 @@ td.js-line-comments:last-child .timeline-comment-actions .add-reaction-popover::
 /* Keep colored button when reaction popup is open */
 .dropdown-details[open] .timeline-comment-action {
 	opacity: 100%;
-	color: #4078c0;
+	color: var(--color-mktg-btn-bg, #4078c0); /* GHE */
 }
diff --git a/source/features/clean-conversation-headers.css b/source/features/clean-conversation-headers.css
@@ -1,7 +1,7 @@
 :root .rgh-clean-conversation-headers-non-default-branch {
-	background-color: #0366d6;
+	background-color: var(--color-state-hover-primary-bg, #0366d6); /* GHE */
 }
 
 .rgh-clean-conversation-headers-non-default-branch a {
-	color: #fff;
+	color: var(--color-state-hover-primary-text, #fff); /* GHE */
 }
diff --git a/source/features/clean-footer.css b/source/features/clean-footer.css
@@ -16,5 +16,5 @@ body > .footer > div > ul:first-of-type li:first-of-type { /* The `© 2017 GitHu
 
 body > .footer li a,
 body > .footer li .btn-link {
-	color: #666;
+	color: var(--color-text-disabled, #666); /* GHE */
 }
diff --git a/source/features/clean-mergeability-box.css b/source/features/clean-mergeability-box.css
@@ -16,7 +16,8 @@
 	font-weight: 600;
 }
 
-.mergeability-details .js-details-container .text-red + .status-meta {
+.mergeability-details .js-details-container .text-red + .status-meta, /* GHE */
+.mergeability-details .js-details-container .color-text-danger + .status-meta {
 	color: var(--github-red);
 }
 

diff --git a/source/features/clean-repo-sidebar.tsx b/source/features/clean-repo-sidebar.tsx
@@ -45,7 +45,7 @@ async function cleanReleases(): Promise<void> {
 	}
 
 	// Align latest tag icon with the icons of other meta links
-	const tagIcon = select('.octicon-tag:not(.text-green)', releasesSection)!;
+	const tagIcon = select('.octicon-tag:not(:is(.text-green, .color-text-success))', releasesSection)!;
 	if (tagIcon) {
 		tagIcon.classList.add('mr-2');
 		// Remove whitespace node

diff --git a/source/features/deep-reblame.css b/source/features/deep-reblame.css
@@ -1,7 +1,9 @@
 button.rgh-deep-reblame .octicon-versions {
-	color: #e40de48c;
+	color: var(--color-scale-pink-5, #e40de4); /* GHE */
+	opacity: 70%;
 }
 
 .rgh-deep-reblame:hover .octicon-versions {
-	color: #8000808c;
+	color: var(--color-scale-pink-7, #800080); /* GHE */
+	opacity: 70%;
 }
diff --git a/source/features/extend-diff-expander.css b/source/features/extend-diff-expander.css
@@ -1,8 +1,8 @@
 /* Hovering the line will highlight the first direction button, unless you hover the buttons directly */
 .js-expandable-line:hover .blob-num:not(:hover) .directional-expander:first-child,
 .js-expandable-line:hover .blob-num:not(:hover) + .blob-code {
-	border-color: #0366d6;
-	color: #fff;
-	background: #0366d6;
+	color: var(--color-state-hover-primary-text, #fff); /* GHE */
+	background: var(--color-state-hover-primary-bg, #0366d6); /* GHE */
+	border-color: var(--color-state-hover-primary-border, #0366d6); /* GHE */
 	cursor: pointer;
 }
diff --git a/source/features/extend-status-labels.css b/source/features/extend-status-labels.css
@@ -4,5 +4,5 @@
 }
 
 .gh-header-meta .State :is(a, code) {
-	color: #fff !important;
+	color: var(--color-btn-primary-text, #fff) !important; /* GHE */
 }
diff --git a/source/features/hide-useless-comments.css b/source/features/hide-useless-comments.css
@@ -1,7 +1,7 @@
 .rgh-useless-comments-note {
 	margin: 15px 0 10px 60px;
 	font-size: 12px;
-	color: #586069;
+	color: var(--color-text-secondary, #586069); /* GHE */
 }
 
 .rgh-hidden-comment .timeline-comment {

diff --git a/source/features/highest-rated-comment.tsx b/source/features/highest-rated-comment.tsx
@@ -51,7 +51,7 @@ function highlightBestComment(bestComment: Element): void {
 	select('.unminimized-comment', bestComment)!.classList.add('rgh-highest-rated-comment');
 	select('.unminimized-comment .timeline-comment-header-text', bestComment)!.before(
 		<span
-			className="d-flex flex-items-center text-green mr-1 tooltipped tooltipped-n"
+			className="d-flex flex-items-center text-green color-text-success mr-1 tooltipped tooltipped-n"
 			aria-label="This comment has the most positive reactions on this issue."
 		>
 			<CheckIcon/>

diff --git a/source/features/highlight-deleted-and-added-files-in-diffs.tsx b/source/features/highlight-deleted-and-added-files-in-diffs.tsx
@@ -43,9 +43,9 @@ async function init(): Promise<void | false> {
 			const icon = sourceIcon.cloneNode(true);
 			const action = icon.getAttribute('title')!;
 			if (action === 'added') {
-				icon.classList.add('text-green');
+				icon.classList.add('text-green', 'color-text-success');
 			} else if (action === 'removed') {
-				icon.classList.add('text-red');
+				icon.classList.add('text-red', 'color-text-danger');
 			} else {
 				return;
 			}

diff --git a/source/features/mark-merge-commits-in-list.css b/source/features/mark-merge-commits-in-list.css
@@ -3,6 +3,6 @@
 }
 
 .rgh-merge-commit .octicon-git-pull-request {
-	color: #4078c0;
+	color: var(--color-icon-info, #4078c0); /* GHE */
 	width: 20px;
 }
diff --git a/source/features/pr-commit-lines-changed.tsx b/source/features/pr-commit-lines-changed.tsx
@@ -31,8 +31,8 @@ async function init(): Promise<void> {
 	const diffstat = await elementReady('.diffstat', {waitForChildren: false});
 	diffstat!.replaceWith(
 		<span className="ml-2 diffstat tooltipped tooltipped-s" aria-label={tooltip}>
-			<span className="text-green">+{additions}</span>{' '}
-			<span className="text-red">−{deletions}</span>{' '}
+			<span className="text-green color-text-success">+{additions}</span>{' '}
+			<span className="text-red color-text-danger">−{deletions}</span>{' '}
 			<span className="diffstat-block-neutral"/>
 			<span className="diffstat-block-neutral"/>
 			<span className="diffstat-block-neutral"/>

diff --git a/source/features/table-input.css b/source/features/table-input.css
@@ -19,5 +19,5 @@
 
 .rgh-table-input:hover .selected div {
 	border-color: #79b8ff;
-	background-color: var(--color-diff-blob-hunk-num-bg, #dbedff);
+	background-color: var(--color-diff-blob-hunk-num-bg, #dbedff); /* GHE */
 }
diff --git a/source/features/useful-not-found-page.tsx b/source/features/useful-not-found-page.tsx
@@ -18,7 +18,7 @@ async function is404(url: string): Promise<boolean> {
 }
 
 function getStrikeThrough(text: string): HTMLElement {
-	return <del style={{color: '#6a737d'}}>{text}</del>;
+	return <del className="color-text-tertiary">{text}</del>; /* GHE */
 }
 
 async function checkAnchor(anchor: HTMLAnchorElement): Promise<void> {

diff --git a/source/features/wait-for-build.css b/source/features/wait-for-build.css
@@ -1,5 +1,5 @@
 /* Visibly disable merge fields during submission */
 [name='commit_message'][disabled],
 [name='commit_title'][disabled] {
-	color: #808080;
+	color: var(--color-text-disabled, #808080); /* GHE */
 }
diff --git a/source/options-storage.ts b/source/options-storage.ts
@@ -17,7 +17,7 @@ const defaults = Object.assign({
 	logging: false
 }, Object.fromEntries(__features__.map(id => [`feature:${id}`, true])));
 
-// TODO[2021-10-01]: Drop classes `muted-link`, `link-gray`, `link-gray-dark`, `text-gray`, `text-gray-light` and `text-gray-dark` #4021
+// TODO[2021-10-01]: Drop classes `muted-link`, `link-gray`, `link-gray-dark`, `text-gray`, `text-gray-light`, `text-gray-dark`, `text-green`, `text-red` #4021
 const migrations = [
 	featureWasRenamed('pr-easy-toggle-files', 'easy-toggle-files'), // Merged in December
 	featureWasRenamed('cleanup-repo-filelist-actions', 'clean-repo-filelist-actions'), // Merged in February

diff --git a/source/refined-github.css b/source/refined-github.css
@@ -72,7 +72,7 @@
 
 /* Lighten deletions in Markdown */
 .markdown-body del {
-	color: #6a737d;
+	color: var(--color-text-tertiary, #6a737d); /* GHE */
 }
 
 /* Expand PR merge status list to fit all items */