From d075b6f45c8a5a53c9c1860804d6c57daf69b76b Mon Sep 17 00:00:00 2001
From: Volker E <volker.e@wikimedia.org>
Date: Thu, 24 Aug 2017 16:19:20 -0700
Subject: [PATCH] widgets: Replace outdated colors with WikimediaUI palette
 ones

Replacing outdated colors in core widgets with WikimediaUI color
palette ones. Also increasing contrast in one case ensuring
WCAG 2.0 level AA conformance.

Bug: T172850
Change-Id: Ic7cf0842275529372cdfbfddad4eb63fec4847ce
---
 .../mw.widgets.MediaResultWidget.css           | 11 ++++++++---
 .../mw.widgets.StashedFileWidget.less          | 18 +++++++++---------
 .../mw.widgets.TitleWidget.less                |  4 ++--
 3 files changed, 19 insertions(+), 14 deletions(-)

diff --git a/resources/src/mediawiki.widgets/MediaSearch/mw.widgets.MediaResultWidget.css b/resources/src/mediawiki.widgets/MediaSearch/mw.widgets.MediaResultWidget.css
index 2a47fa2d37..e0c3d5e982 100644
--- a/resources/src/mediawiki.widgets/MediaSearch/mw.widgets.MediaResultWidget.css
+++ b/resources/src/mediawiki.widgets/MediaSearch/mw.widgets.MediaResultWidget.css
@@ -16,7 +16,7 @@
 }
 
 .mw-widget-mediaResultWidget-error {
-	background-color: #f3f3f3;
+	background-color: #f8f9fa;
 }
 
 .mw-widget-mediaResultWidget-thumbnail {
@@ -43,12 +43,17 @@
 	bottom: 0;
 	left: 0;
 	right: 0;
-	box-shadow: inset 0 0 0 1px #ccc;
+	box-shadow: inset 0 0 0 1px #c8ccd1;
 }
 
 .mw-widget-mediaResultWidget.oo-ui-optionWidget-highlighted,
 .mw-widget-mediaResultWidget.oo-ui-optionWidget-selected {
-	box-shadow: 0 0 0.3em #a7dcff, 0 0 0 #fff;
+	box-shadow: 0 0 2px #36c;
+}
+
+.mw-widget-mediaResultWidget.oo-ui-optionWidget-highlighted .mw-widget-mediaResultWidget-overlay,
+.mw-widget-mediaResultWidget.oo-ui-optionWidget-selected .mw-widget-mediaResultWidget-overlay {
+	box-shadow: inset 0 0 0 1px #36c;
 }
 
 .mw-widget-mediaResultWidget-error .mw-widget-mediaResultWidget-thumbnail {
diff --git a/resources/src/mediawiki.widgets/mw.widgets.StashedFileWidget.less b/resources/src/mediawiki.widgets/mw.widgets.StashedFileWidget.less
index 4a59dae2b4..3d59f67f80 100644
--- a/resources/src/mediawiki.widgets/mw.widgets.StashedFileWidget.less
+++ b/resources/src/mediawiki.widgets/mw.widgets.StashedFileWidget.less
@@ -23,7 +23,7 @@
 .mw-widgets-stashedFileWidget-info {
 	height: 2.4em;
 	background-color: #fff;
-	border: 1px solid #ccc;
+	border: 1px solid #c8ccd1;
 	border-radius: 2px;
 	width: 100%;
 	display: table-cell;
@@ -49,7 +49,7 @@
 			float: left;
 		}
 		> .mw-widgets-stashedFileWidget-fileType {
-			color: #888;
+			color: #72777d;
 			float: right;
 		}
 	}
@@ -77,14 +77,14 @@
 
 	&.oo-ui-widget-disabled {
 		.mw-widgets-stashedFileWidget-info {
-			color: #ccc;
+			background-color: #eaecf0;
+			color: #72777d;
+			border-color: #c8ccd1;
 			text-shadow: 0 1px 1px #fff;
-			border-color: #ddd;
-			background-color: #f3f3f3;
 
 			> .oo-ui-iconElement-icon,
 			> .oo-ui-indicatorElement-indicator {
-				opacity: 0.2;
+				opacity: 0.15;
 			}
 		}
 	}
@@ -96,7 +96,7 @@
 	text-align: left;
 	padding: 0;
 	background-color: #fff;
-	border: 1px solid #ccc;
+	border: 1px solid #c8ccd1;
 	margin-bottom: 0.5em;
 	vertical-align: middle;
 	overflow: hidden;
@@ -115,7 +115,7 @@
 
 		> .mw-widgets-stashedFileWidget-noThumbnail-icon {
 			opacity: 0.4;
-			background-color: #ccc;
+			background-color: #c8ccd1;
 			height: 5.5em;
 			width: 5.5em;
 		}
@@ -157,7 +157,7 @@
 	}
 
 	.mw-widgets-stashedFileWidget-label {
-		color: #ccc;
+		color: #c8ccd1;
 		right: 0.5em;
 	}
 
diff --git a/resources/src/mediawiki.widgets/mw.widgets.TitleWidget.less b/resources/src/mediawiki.widgets/mw.widgets.TitleWidget.less
index bbffe28920..c47cc60d44 100644
--- a/resources/src/mediawiki.widgets/mw.widgets.TitleWidget.less
+++ b/resources/src/mediawiki.widgets/mw.widgets.TitleWidget.less
@@ -10,7 +10,7 @@
 		line-height: normal;
 
 		&-description {
-			color: #888;
+			color: #72777d;
 		}
 	}
 
@@ -37,7 +37,7 @@
 					height: 3.75em;
 					left: 0;
 					&:not( .mw-widget-titleOptionWidget-hasImage ) {
-						background-color: #ccc;
+						background-color: #c8ccd1;
 						opacity: 0.4;
 					}
 					&.mw-widget-titleOptionWidget-hasImage {
-- 
2.20.1