From 6329e274ab7d7b8a79307fac29569bb5a78dcff5 Mon Sep 17 00:00:00 2001
From: wmwragg <wm.wragg@gmail.com>
Date: Thu, 28 Jul 2016 14:20:24 +0100
Subject: [PATCH] Extra polish to get styling looking like the design

---
 .../views/context_menus/NotificationStateContextMenu.js   | 8 ++++----
 .../views/context_menus/NotificationStateContextMenu.css  | 3 ++-
 src/skins/vector/img/icon-context-mute-mentions.svg       | 8 ++++----
 src/skins/vector/img/icon-context-mute-off-copy.svg       | 2 +-
 src/skins/vector/img/icon-context-mute-off.svg            | 4 ++--
 src/skins/vector/img/icon-context-mute.svg                | 4 ++--
 6 files changed, 15 insertions(+), 14 deletions(-)

diff --git a/src/components/views/context_menus/NotificationStateContextMenu.js b/src/components/views/context_menus/NotificationStateContextMenu.js
index 2de02112..869145aa 100644
--- a/src/components/views/context_menus/NotificationStateContextMenu.js
+++ b/src/components/views/context_menus/NotificationStateContextMenu.js
@@ -116,21 +116,21 @@ module.exports = React.createClass({
                     <img src="img/notif-slider.svg" width="20" height="107" />
                 </div>
                 <div className={ alertMeClasses } onClick={this._onClickAlertMe} >
-                    <img className="mx_NotificationStateContextMenu_icon" src="img/icon-context-mute-off-copy.svg" width="20" height="12" />
+                    <img className="mx_NotificationStateContextMenu_icon" src="img/icon-context-mute-off-copy.svg" width="16" height="12" />
                     Alert me
                 </div>
                 <div className={ allNotifsClasses } onClick={this._onClickAllNotifs} >
                     <img className="mx_NotificationStateContextMenu_activeIcon" src="img/notif-active.svg" width="12" height="12" />
-                    <img className="mx_NotificationStateContextMenu_icon" src="img/icon-context-mute-off.svg" width="20" height="12" />
+                    <img className="mx_NotificationStateContextMenu_icon" src="img/icon-context-mute-off.svg" width="16" height="12" />
                     All notifications
                 </div>
                 <div className={ mentionsClasses } onClick={this._onClickMentions} >
-                    <img className="mx_NotificationStateContextMenu_icon" src="img/icon-context-mute-mentions.svg" width="20" height="12" />
+                    <img className="mx_NotificationStateContextMenu_icon" src="img/icon-context-mute-mentions.svg" width="16" height="12" />
                     Mentions only
                 </div>
                 <div className={ muteNotifsClasses } onClick={this._onClickMute} >
                     <img className="mx_NotificationStateContextMenu_activeIcon" src="img/notif-active.svg" width="12" height="12" />
-                    <img className="mx_NotificationStateContextMenu_icon" src="img/icon-context-mute.svg" width="20" height="12" />
+                    <img className="mx_NotificationStateContextMenu_icon" src="img/icon-context-mute.svg" width="16" height="12" />
                     Mute
                 </div>
             </div>
diff --git a/src/skins/vector/css/vector-web/views/context_menus/NotificationStateContextMenu.css b/src/skins/vector/css/vector-web/views/context_menus/NotificationStateContextMenu.css
index d92355e3..1a186178 100644
--- a/src/skins/vector/css/vector-web/views/context_menus/NotificationStateContextMenu.css
+++ b/src/skins/vector/css/vector-web/views/context_menus/NotificationStateContextMenu.css
@@ -41,7 +41,8 @@ limitations under the License.
 }
 
 .mx_NotificationStateContextMenu_icon {
-    padding-right: 2px;
+    padding-right: 4px;
+    padding-left: 4px;
 }
 
 .mx_NotificationStateContextMenu_activeIcon {
diff --git a/src/skins/vector/img/icon-context-mute-mentions.svg b/src/skins/vector/img/icon-context-mute-mentions.svg
index 46d5022e..3693b7a8 100644
--- a/src/skins/vector/img/icon-context-mute-mentions.svg
+++ b/src/skins/vector/img/icon-context-mute-mentions.svg
@@ -1,10 +1,10 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="15" height="12" viewBox="0, 0, 15, 12">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="16" height="12" viewBox="0, 0, 16, 12">
   <g id="Screens-revised" opacity="0.2">
-    <g id="icon_context_mute_mentions">
-      <path d="M1,4 L3.661,4 L7,1 L7,11 L3.672,8 L1,8 z" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" id="path-1"/>
-      <path d="M13,4.5 C13,5.328 12.328,6 11.5,6 C10.672,6 10,5.328 10,4.5 C10,3.672 10.672,3 11.5,3 C12.328,3 13,3.672 13,4.5 z" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" id="path-3"/>
+    <g>
+      <path d="M7.142,0.009 C7.687,0.152 7.921,0.47 8,1 L8,11 C8,11.866 6.974,12.323 6.33,11.743 L3.288,9 L1,9 C0.448,9 0,8.552 0,8 L0,4 C0,3.448 0.448,3 1,3 L3.278,3 L6.332,0.256 C6.744,-0.016 6.487,0.101 7.142,0.009 z M7,1 L3.661,4 L1,4 L1,8 L3.672,8 L7,11 L7,1 z" fill="#000000" id="path-1"/>
+      <path d="M13,3.928 C13,4.757 12.328,5.428 11.5,5.428 C10.672,5.428 10,4.757 10,3.928 C10,3.1 10.672,2.428 11.5,2.428 C12.328,2.428 13,3.1 13,3.928 z" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" id="path-3"/>
       <path d="M14,9.5 C14,6.84 12.881,6 11.5,6 C10.119,6 9,6.884 9,9.5 L14,9.5 z" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" id="path-5"/>
     </g>
   </g>
diff --git a/src/skins/vector/img/icon-context-mute-off-copy.svg b/src/skins/vector/img/icon-context-mute-off-copy.svg
index f62eaa97..861f2975 100644
--- a/src/skins/vector/img/icon-context-mute-off-copy.svg
+++ b/src/skins/vector/img/icon-context-mute-off-copy.svg
@@ -2,7 +2,7 @@
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="16" height="12" viewBox="0, 0, 16, 12">
   <g id="Screens-revised" opacity="0.2">
-    <path d="M1,4 L3.661,4 L7,1 L7,11 L3.672,8 L1,8 z" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" id="path-1"/>
+    <path d="M7.142,0.009 C7.687,0.152 7.921,0.47 8,1 L8,11 C8,11.866 6.974,12.323 6.33,11.743 L3.288,9 L1,9 C0.448,9 0,8.552 0,8 L0,4 C0,3.448 0.448,3 1,3 L3.278,3 L6.332,0.256 C6.744,-0.016 6.487,0.101 7.142,0.009 z M7,1 L3.661,4 L1,4 L1,8 L3.672,8 L7,11 L7,1 z" fill="#000000" id="path-1"/>
     <path d="M9.878,7.667 C10.82,7.667 11.584,6.92 11.584,6 C11.584,5.08 10.82,4.333 9.878,4.333" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" id="Oval-50"/>
     <path d="M10.055,9.333 C11.939,9.333 13.466,7.841 13.466,6 C13.466,4.159 11.939,2.667 10.055,2.667" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" id="Oval-50-Copy"/>
     <path d="M10.055,11 C12.881,11 15.172,8.761 15.172,6 C15.172,3.239 12.881,1 10.055,1" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" id="Oval-50-Copy-2"/>
diff --git a/src/skins/vector/img/icon-context-mute-off.svg b/src/skins/vector/img/icon-context-mute-off.svg
index c30ed85b..d801823b 100644
--- a/src/skins/vector/img/icon-context-mute-off.svg
+++ b/src/skins/vector/img/icon-context-mute-off.svg
@@ -1,8 +1,8 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="15" height="12" viewBox="0, 0, 15, 12">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="16" height="12" viewBox="0, 0, 16, 12">
   <g id="Screens-revised" opacity="0.2">
-    <path d="M1,4 L3.661,4 L7,1 L7,11 L3.672,8 L1,8 z" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" id="path-1"/>
+    <path d="M7.142,0.009 C7.687,0.152 7.921,0.47 8,1 L8,11 C8,11.866 6.974,12.323 6.33,11.743 L3.288,9 L1,9 C0.448,9 0,8.552 0,8 L0,4 C0,3.448 0.448,3 1,3 L3.278,3 L6.332,0.256 C6.744,-0.016 6.487,0.101 7.142,0.009 z M7,1 L3.661,4 L1,4 L1,8 L3.672,8 L7,11 L7,1 z" fill="#000000" id="path-1"/>
     <path d="M10,8 C11.105,8 12,7.105 12,6 C12,4.895 11.105,4 10,4" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" id="Oval-50"/>
     <path d="M10.207,10 C12.416,10 14.207,8.209 14.207,6 C14.207,3.791 12.416,2 10.207,2" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" id="Oval-50-Copy"/>
   </g>
diff --git a/src/skins/vector/img/icon-context-mute.svg b/src/skins/vector/img/icon-context-mute.svg
index 71c5035a..f53b868a 100644
--- a/src/skins/vector/img/icon-context-mute.svg
+++ b/src/skins/vector/img/icon-context-mute.svg
@@ -1,8 +1,8 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="14" height="12" viewBox="0, 0, 14, 12">
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0" y="0" width="16" height="12" viewBox="0, 0, 16, 12">
   <g id="Screens-revised" opacity="0.2">
-    <path d="M1,4 L3.661,4 L7,1 L7,11 L3.672,8 L1,8 z" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" stroke-linejoin="round" id="path-1"/>
+    <path d="M7.142,0.009 C7.687,0.152 7.921,0.47 8,1 L8,11 C8,11.866 6.974,12.323 6.33,11.743 L3.288,9 L1,9 C0.448,9 0,8.552 0,8 L0,4 C0,3.448 0.448,3 1,3 L3.278,3 L6.332,0.256 C6.744,-0.016 6.487,0.101 7.142,0.009 z M7,1 L3.661,4 L1,4 L1,8 L3.672,8 L7,11 L7,1 z" fill="#000000" id="path-1"/>
     <path d="M12.55,4.45 L9.722,7.278" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" id="Line-Copy-2"/>
     <path d="M12.55,7.278 L9.722,4.45" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-linecap="round" id="Line-Copy-5"/>
   </g>