Revert "Replace desktop watchstar icon with mobile skin one"

Based on the discussion on T56307, this change is controversial
and not necessarily wanted. In summary:

* Green star looks out of place with blue Vector (Edokter, Esanders, Trevor)
* Clashes with WikiLove heart icon (Edokter)
* Flat design doesn't fit with Vector's gradient style (Rillke)
* Green means constructive in MediaWiki UI, however clicking the
  green star removes a page from your watchlist (Krinkle)

This reverts commit 56825d209e.

Change-Id: I46f75a0eb83f9643fc0b51befe02aad4a84efc4e

components/watchstar.less

@@ -22,8 +22,17 @@
 #ca-watch.icon a {
 	.background-image-svg('images/watch-icon.svg', 'images/watch-icon.png');
 }
+#ca-unwatch.icon a:hover,
+#ca-unwatch.icon a:focus {
+	.background-image-svg('images/unwatch-icon-hl.svg', 'images/unwatch-icon-hl.png');
+}
+#ca-watch.icon a:hover,
+#ca-watch.icon a:focus {
+	.background-image-svg('images/watch-icon-hl.svg', 'images/watch-icon-hl.png');
+}
 #ca-unwatch.icon a.loading,
 #ca-watch.icon a.loading {
+	.background-image-svg('images/watch-icon-loading.svg', 'images/watch-icon-loading.png');
 	.rotation(700ms);
 	/* Suppress the hilarious rotating focus outline on Firefox */
 	outline: none;

images/unwatch-icon-hl.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><defs><linearGradient id="a"><stop offset="0" stop-color="#c2edff"/><stop offset=".5" stop-color="#68bdff"/><stop offset="1" stop-color="#fff"/></linearGradient><linearGradient x1="13.47" y1="14.363" x2="4.596" y2="3.397" id="b" xlink:href="#a" gradientUnits="userSpaceOnUse"/></defs><path d="M8.103 1.146l2.175 4.408 4.864.707-3.52 3.431.831 4.845-4.351-2.287-4.351 2.287.831-4.845-3.52-3.431 4.864-.707z" fill="url(#b)" stroke="#c8b250" stroke-width="0.9999199999999999"/></svg>

images/unwatch-icon.svg

@@ -1,24 +1 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   xmlns:dc="http://purl.org/dc/elements/1.1/"
-   xmlns:cc="http://creativecommons.org/ns#"
-   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-   xmlns:svg="http://www.w3.org/2000/svg"
-   xmlns="http://www.w3.org/2000/svg"
-   version="1.1"
-   width="16"
-   height="16"
-   viewBox="0 0 16 16"
-   id="Layer_1"
-   xml:space="preserve"><metadata
-     id="metadata11"><rdf:RDF><cc:Work
-         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
-           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
-     id="defs9" /><g
-     transform="matrix(0.50724409,0,0,0.50724409,-1.65435e-7,0.39133865)"
-     id="g3"><polygon
-       points="20.646,9.875 31.543,11.458 23.656,19.145 25.518,29.996 15.771,24.873 6.024,30 7.886,19.145 0,11.459 10.898,9.876 15.771,0 "
-       id="polygon5"
-       style="fill:#00af89" /></g></svg>
+<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16" height="16"><defs><linearGradient id="a"><stop offset="0" stop-color="#c2edff"/><stop offset=".5" stop-color="#68bdff"/><stop offset="1" stop-color="#fff"/></linearGradient><linearGradient x1="13.47" y1="14.363" x2="4.596" y2="3.397" id="b" xlink:href="#a" gradientUnits="userSpaceOnUse"/></defs><path d="M8.103 1.146l2.175 4.408 4.864.707-3.52 3.431.831 4.845-4.351-2.287-4.351 2.287.831-4.845-3.52-3.431 4.864-.707z" fill="url(#b)" stroke="#7cb5d1" stroke-width="0.9999199999999999"/></svg>

images/watch-icon-hl.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M8.103 1.146l2.175 4.408 4.864.707-3.52 3.431.831 4.845-4.351-2.287-4.351 2.287.831-4.845-3.52-3.431 4.864-.707z" fill="#fff" stroke="#c8b250" stroke-width="0.9999199999999999"/></svg>

images/watch-icon-loading.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M8.103 1.146l2.175 4.408 4.864.707-3.52 3.431.831 4.845-4.351-2.287-4.351 2.287.831-4.845-3.52-3.431 4.864-.707z" fill="#fff" stroke="#d1d1d1" stroke-width="0.9999199999999999"/></svg>

images/watch-icon.svg

@@ -1,22 +1 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!-- Created with Inkscape (http://www.inkscape.org/) -->
-
-<svg
-   xmlns:dc="http://purl.org/dc/elements/1.1/"
-   xmlns:cc="http://creativecommons.org/ns#"
-   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
-   xmlns:svg="http://www.w3.org/2000/svg"
-   xmlns="http://www.w3.org/2000/svg"
-   version="1.1"
-   width="16"
-   height="16"
-   viewBox="0 0 16 16"
-   id="Layer_1"
-   xml:space="preserve"><metadata
-     id="metadata9"><rdf:RDF><cc:Work
-         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
-           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
-     id="defs7" /><path
-     d="m 7.999493,3.57443 1.2092315,2.44992 0.3276693,0.66396 0.7329442,0.10601 2.703526,0.3931 -1.956379,1.90718 -0.530053,0.51636 0.124778,0.73091 0.461577,2.69287 L 8.6543243,11.76363 7.9989857,11.4177 7.3436471,11.76363 4.925184,13.03474 5.3867615,10.34035 5.5115396,9.61096 4.9819935,9.0946 3.0266295,7.18691 5.7291404,6.79483 6.4620849,6.6878 6.7897542,6.02536 7.999493,3.57443 m 0,-3.18285 L 5.5272636,5.40147 0,6.20492 3.9994929,10.10246 3.0550343,15.60842 7.9989857,13.00888 12.943444,15.60842 12.000508,10.10246 16,6.2039 10.471722,5.40096 7.999493,0.39158 l 0,0 z"
-     id="path3"
-     style="fill:#6d6e70" /></svg>
+<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path d="M8.103 1.146l2.175 4.408 4.864.707-3.52 3.431.831 4.845-4.351-2.287-4.351 2.287.831-4.845-3.52-3.431 4.864-.707z" fill="#fff" stroke="#7cb5d1" stroke-width="0.9999199999999999"/></svg>