Centralize icons

Signed off by: Pierre Gordon <pierregordon@protonmail.com>

core/css/icons.scss

@@ -516,6 +516,44 @@ img, object, video, button, textarea, input, select, div[contenteditable=true] {
 	background-image: url('../img/places/picture.svg?v=1');
 }
 
+/* CLIENTS ------------------------------------------------------------------- */
+
+.icon-client-android {
+	background-image: url('../img/clients/android.svg?v=1');
+}
+
+.icon-client-apple {
+	background-image: url('../img/clients/apple.svg?v=1');
+}
+
+.icon-client-chrome {
+	background-image: url('../img/clients/chrome.svg?v=1');
+}
+
+.icon-client-edge {
+	background-image: url('../img/clients/edge.svg?v=1');
+}
+
+.icon-client-firefox {
+	background-image: url('../img/clients/firefox.svg?v=1');
+}
+
+.icon-client-ie {
+	background-image: url('../img/clients/ie.svg?v=1');
+}
+
+.icon-client-ipad {
+	background-image: url('../img/clients/ipad.svg?v=1');
+}
+
+.icon-client-iphone {
+	background-image: url('../img/clients/iphone.svg?v=1');
+}
+
+.icon-client-safari {
+	background-image: url('../img/clients/safari.svg?v=1');
+}
+
 /* APP CATEGORIES ------------------------------------------------------------------- */
 .icon-category-installed {
 	background-image: url('../img/actions/user.svg?v=1');

settings/css/settings.scss

@@ -340,7 +340,7 @@ table.nostyle {
 		&.client {
 			@extend %icon;
 
-			img {
+			div {
 				opacity: 0.57;
 				width: inherit;
 			}

settings/img/clients/globe.svg

@@ -1 +0,0 @@
-<?xml version="1.0" ?><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" viewBox="0 0 16 16" enable-background="new 0 0 50 50"><defs id="defs19" /><rect style="fill:none;stroke-width:0.31999999" y="0" x="0" id="rect2" width="16" height="16" /><circle style="fill:none;stroke:#000000;stroke-width:0.63999999;stroke-linecap:round;stroke-miterlimit:10" id="circle4" stroke-miterlimit="10" r="7.6799998" cy="8" cx="8" /><ellipse style="fill:none;stroke:#000000;stroke-width:0.63999999;stroke-linecap:round;stroke-miterlimit:10" id="ellipse6" stroke-miterlimit="10" ry="7.6799998" rx="3.8399999" cy="8" cx="8" /><path style="fill:none;stroke:#000000;stroke-width:0.63999999;stroke-miterlimit:10" id="path8" stroke-miterlimit="10" d="M 2.0368,12.94016 C 3.44512,12.07328 5.59328,11.52 8,11.52 c 2.37376,0 4.49568,0.53824 5.90432,1.384" /><path style="fill:none;stroke:#000000;stroke-width:0.63999999;stroke-miterlimit:10" id="path10" stroke-miterlimit="10" d="M 13.9632,3.06016 C 12.55488,3.92672 10.40672,4.48 8,4.48 5.62656,4.48 3.50432,3.94176 2.09568,3.096" /><line style="fill:none;stroke:#000000;stroke-width:0.63999999;stroke-miterlimit:10" id="line12" y2="8" y1="8" x2="15.68" x1="0.31999999" stroke-miterlimit="10" /><line style="fill:none;stroke:#000000;stroke-width:0.63999999;stroke-miterlimit:10" id="line14" y2="15.68" y1="0.31999969" x2="8" x1="8" stroke-miterlimit="10" /></svg>

settings/js/authtoken_view.js

@@ -28,7 +28,7 @@
 	var TEMPLATE_TOKEN =
 		'<tr data-id="{{id}}">'
 		+ '<td class="client">'
-		+ '<img src="{{icon}}" />'
+		+ '<div class="{{icon}}" />'
 		+ '</td>'
 		+ '<td class="has-tooltip" title="{{title}}">'
 		+ '<span class="token-name">{{name}}</span>'
@@ -150,19 +150,19 @@
 			};
 
 			var iconMap = {
-				ie: 'ie.svg',
-				edge: 'edge.svg',
-				firefox: 'firefox.svg',
-				chrome: 'chrome.svg',
-				safari: 'apple.svg',
-				androidChrome: 'chrome.svg',
-				iphone: 'iphone.svg',
-				ipad: 'ipad.svg',
-				iosClient: 'apple.svg',
-				androidClient: 'android.svg',
-				davDroid: 'android.svg',
-				webPirate: 'globe.svg',
-				sailfishBrowser: 'globe.svg'
+				ie: 'icon-client-ie',
+				edge: 'icon-client-edge',
+				firefox: 'icon-client-firefox',
+				chrome: 'icon-client-chrome',
+				safari: 'icon-client-safari',
+				androidChrome: 'icon-client-chrome',
+				iphone: 'icon-client-iphone',
+				ipad: 'icon-client-ipad',
+				iosClient: 'icon-client-apple',
+				androidClient: 'icon-client-android',
+				davDroid: 'icon-client-android',
+				webPirate: 'icon-link',
+				sailfishBrowser: 'icon-link'
 			};
 
 			if (matches) {
@@ -184,7 +184,7 @@
 					// update title - for easier view
 					viewData.title = viewData.name;
 
-					viewData.icon = '/settings/img/clients/' + iconMap[client];
+					viewData.icon = iconMap[client];
 				}
 			}
 			if (viewData.current) {