Rietveld Code Review Tool
Help | Bug tracker | Discussion group | Source code

Unified Diff: static/scss/components/_browser-select.scss

Issue 29598558: Issue 5980 - Use correct browser logos for browser select on help.eyeo.com (Closed) Base URL: https://hg.adblockplus.org/help.eyeo.com
Patch Set: Odd opacity styles Created Nov. 5, 2017, 6:25 p.m.
Use n/p to move between diff chunks; N/P to move between comments.
Jump to:
View side-by-side diff with in-line comments
Download patch
« static/img/svg/ios.svg ('K') | « static/img/svg/yandexbrowser.svg ('k') | no next file » | no next file with comments »
Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
Index: static/scss/components/_browser-select.scss
===================================================================
--- a/static/scss/components/_browser-select.scss
+++ b/static/scss/components/_browser-select.scss
@@ -32,8 +32,30 @@
width: 100%;
max-width: 300px;
}
#browser-select li
{
cursor: pointer;
}
+
+#browser-select .pre-icon
+{
+ opacity: 0.5;
+
+ /* Firefox 10+, Firefox on Android */
+ filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
+
+ /* IE 6-9 */
+ filter: gray;
+
+ /* Modern browsers */
+ filter: grayscale(100%);
+}
+
+#browser-select .custom-select-selected .pre-icon,
+#browser-select .custom-select-option:hover .pre-icon,
+#browser-select .custom-select-option:focus .pre-icon
+{
+ opacity: 1;
+ filter: none;
+}
« static/img/svg/ios.svg ('K') | « static/img/svg/yandexbrowser.svg ('k') | no next file » | no next file with comments »

Powered by Google App Engine
This is Rietveld