From 10078d1b652a89bf73ca50694b5c9b29c3b75249 Mon Sep 17 00:00:00 2001
From: Pau Giner <pau.giner@gmail.com>
Date: Mon, 18 Feb 2013 15:21:21 +0100
Subject: [PATCH] SVG versions of icons

SVG assets added and CSS adjusments made to make use fo SVG for compatible browsers.

Change-Id: Ib04b7bd72b528fc0c8159362f03f2a9828342aa4
---
 resources/css/ext.uls.css                  |   4 +-
 resources/css/ext.uls.displaysettings.css  |  13 +-
 resources/css/ext.uls.inputsettings.css    |  17 +-
 resources/css/ext.uls.languagesettings.css |   4 +
 resources/images/cog.svg                   | 331 +++++++++++++++++++++
 resources/images/display.svg               |  23 ++
 resources/images/input.svg                 |  23 ++
 7 files changed, 397 insertions(+), 18 deletions(-)
 create mode 100644 resources/images/cog.svg
 create mode 100644 resources/images/display.svg
 create mode 100644 resources/images/input.svg

diff --git a/resources/css/ext.uls.css b/resources/css/ext.uls.css
index 564f147e..35b51d75 100644
--- a/resources/css/ext.uls.css
+++ b/resources/css/ext.uls.css
@@ -11,7 +11,7 @@ div#settings-block {
 	background: -ms-linear-gradient(top, #FBFBFB, #F0F0F0);
 	background: -o-linear-gradient(top, #FBFBFB, #F0F0F0);
 	background: linear-gradient(#FBFBFB, #F0F0F0);
-	padding-left: 4px;
+	padding-left: 10px;
 	line-height: 1.2em;
 	-webkit-border-radius: 0 0 5px 5px;
 	-moz-border-radius: 0 0 5px 5px;
@@ -25,7 +25,7 @@ div#settings-block {
 #settings-block div.display-settings-block,
 #settings-block div.input-settings-block {
 	display: inline-block;
-	margin: 8px;
+	margin: 8px 15px;
 	color: #565656;
 }
 
diff --git a/resources/css/ext.uls.displaysettings.css b/resources/css/ext.uls.displaysettings.css
index 5cb82e38..61841654 100644
--- a/resources/css/ext.uls.displaysettings.css
+++ b/resources/css/ext.uls.displaysettings.css
@@ -1,15 +1,12 @@
 div.display-settings-block {
 	/* @embed */
-	background: transparent url('../images/display.png') no-repeat;
+	background: transparent url('../images/display.png') left top no-repeat;
+	background-image: -webkit-linear-gradient(transparent, transparent), url('../images/display.svg');
+	background-image: -moz-linear-gradient(transparent, transparent), url('../images/display.svg');
+	background-image: linear-gradient(transparent, transparent), url('../images/display.svg');
 	background-size: 20px auto;
-	/* This is only few pixels off from the below */
-	background-position: 4.5% 0;
-	/* Does not work for RTL
-	background-position-x: 15px;
-	background-position-y: 5px;
-	*/
 	color: #252525;
-	padding-left: 32px;
+	padding-left: 26px;
 	cursor: pointer;
 }
 
diff --git a/resources/css/ext.uls.inputsettings.css b/resources/css/ext.uls.inputsettings.css
index 09e0d9bf..83a33f96 100644
--- a/resources/css/ext.uls.inputsettings.css
+++ b/resources/css/ext.uls.inputsettings.css
@@ -1,15 +1,12 @@
 div.input-settings-block {
 	/* @embed */
-	background: transparent url('../images/input.png') no-repeat;
+	background: transparent url('../images/input.png') left top no-repeat;
+	background-image: -webkit-linear-gradient(transparent, transparent), url('../images/input.svg');
+	background-image: -moz-linear-gradient(transparent, transparent), url('../images/input.svg');
+	background-image: linear-gradient(transparent, transparent), url('../images/input.svg');
 	background-size: 20px auto;
-	/* This is only few pixels off from the below */
-	background-position: 4.5% 0;
-	/* Does not work for RTL
-	background-position-x: 15px;
-	background-position-y: 5px;
-	*/
 	color: #252525;
-	padding-left: 32px;
+	padding-left: 26px;
 	cursor: pointer;
 }
 
@@ -37,6 +34,10 @@ div.input-settings-block {
 .uls-ime-more-settings-link {
 	/* @embed */
 	background: transparent url('../images/cog-16x16-ltr.png') right center no-repeat;
+	background-image: -webkit-linear-gradient(transparent, transparent), url('../images/cog.svg');
+	background-image: -moz-linear-gradient(transparent, transparent), url('../images/cog.svg');
+	background-image: linear-gradient(transparent, transparent), url('../images/cog.svg');
+	background-size: 20px auto;
 	background-color: #f0f0f0;
 	border-radius: 0 0 5px 5px;
 	border-top: 1px solid #ddd;
diff --git a/resources/css/ext.uls.languagesettings.css b/resources/css/ext.uls.languagesettings.css
index 170be0f5..6a60da6a 100644
--- a/resources/css/ext.uls.languagesettings.css
+++ b/resources/css/ext.uls.languagesettings.css
@@ -1,5 +1,9 @@
 #uls-current-language-nav { /* @embed */
 	background: url('../images/cog-16x16-ltr.png') no-repeat scroll right top transparent;
+	background-image: -webkit-linear-gradient(transparent, transparent), url('../images/cog.svg');
+	background-image: -moz-linear-gradient(transparent, transparent), url('../images/cog.svg');
+	background-image: linear-gradient(transparent, transparent), url('../images/cog.svg');
+
 	cursor: pointer;
 }
 
diff --git a/resources/images/cog.svg b/resources/images/cog.svg
new file mode 100644
index 00000000..bf8dafce
--- /dev/null
+++ b/resources/images/cog.svg
@@ -0,0 +1,331 @@
+<?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="42"
+   height="31.999998"
+   viewBox="0 0 42 31.999998"
+   id="Layer_1"
+   xml:space="preserve"><metadata
+   id="metadata7"><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="defs5"><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend-5"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132-1"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM-00"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329-2"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend-07"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132-31"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM-0"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329-94"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend-6"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132-8"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM-8"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329-91"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><clipPath
+     id="clipPath3169-2"><rect
+       width="748.77557"
+       height="428.80975"
+       x="48.992397"
+       y="105.34417"
+       id="rect3171-7"
+       style="fill:#f5f5f4;fill-opacity:1;stroke:#888a85;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" /></clipPath><clipPath
+     id="clipPath22-7"><path
+       d="M 0,792 1224,792 1224,0 0,0 0,792 z"
+       id="path24-2" /></clipPath><clipPath
+     id="clipPath6483-7"><rect
+       width="548"
+       height="280"
+       x="67.578148"
+       y="187.65627"
+       id="rect6485-5"
+       style="fill:#ffffff;fill-opacity:1;stroke:none" /></clipPath><clipPath
+     id="clipPath10152"><rect
+       width="718.58722"
+       height="140.17392"
+       x="-37.134048"
+       y="754.14667"
+       id="rect10154"
+       style="fill:#555753;fill-opacity:1;stroke:#555753;stroke-width:1.83322382;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" /></clipPath><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend-0"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132-982"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM-2"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329-95"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend-2"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132-98"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM-5"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329-1"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend-75"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132-9"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM-466"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329-32"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="marker32938"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path32940"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="marker32934"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path32936"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend-7"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132-2"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM-46"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329-9"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend-3"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132-3"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM-42"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329-3"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend-9"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132-4"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM-4"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329-8"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><clipPath
+     id="clipPath6483-5"><rect
+       width="548"
+       height="280"
+       x="67.578148"
+       y="187.65627"
+       id="rect6485-2"
+       style="fill:#ffffff;fill-opacity:1;stroke:none" /></clipPath><clipPath
+     id="clipPath6483-1-7-3-0"><rect
+       width="548"
+       height="280"
+       x="67.578148"
+       y="187.65627"
+       id="rect6485-6-4-5-6"
+       style="fill:#ffffff;fill-opacity:1;stroke:none" /></clipPath><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Lend-0"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="matrix(-1.1,0,0,-1.1,-1.1,0)"
+       id="path45126-6"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><clipPath
+     id="clipPath6483-1-7-3-9"><rect
+       width="548"
+       height="280"
+       x="67.578148"
+       y="187.65627"
+       id="rect6485-6-4-5-8"
+       style="fill:#ffffff;fill-opacity:1;stroke:none" /></clipPath><clipPath
+     id="clipPath6483-1-7-3"><rect
+       width="548"
+       height="280"
+       x="67.578148"
+       y="187.65627"
+       id="rect6485-6-4-5"
+       style="fill:#ffffff;fill-opacity:1;stroke:none" /></clipPath><clipPath
+     id="clipPath6483-1-7"><rect
+       width="548"
+       height="280"
+       x="67.578148"
+       y="187.65627"
+       id="rect6485-6-4"
+       style="fill:#ffffff;fill-opacity:1;stroke:none" /></clipPath><clipPath
+     id="clipPath6483-1"><rect
+       width="548"
+       height="280"
+       x="67.578148"
+       y="187.65627"
+       id="rect6485-6"
+       style="fill:#ffffff;fill-opacity:1;stroke:none" /></clipPath><clipPath
+     id="clipPath6483"><rect
+       width="548"
+       height="280"
+       x="67.578148"
+       y="187.65627"
+       id="rect6485"
+       style="fill:#ffffff;fill-opacity:1;stroke:none" /></clipPath><clipPath
+     id="clipPath22"><path
+       d="M 0,792 1224,792 1224,0 0,0 0,792 z"
+       id="path24" /></clipPath><clipPath
+     id="clipPath3169"><rect
+       width="748.77557"
+       height="428.80975"
+       x="48.992397"
+       y="105.34417"
+       id="rect3171"
+       style="fill:#f5f5f4;fill-opacity:1;stroke:#888a85;stroke-width:2;stroke-miterlimit:4;stroke-opacity:1;stroke-dasharray:none;stroke-dashoffset:0" /></clipPath><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Lend"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="matrix(-1.1,0,0,-1.1,-1.1,0)"
+       id="path45126"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="Arrow2Mend"
+     style="overflow:visible"><path
+       d="M 8.7185878,4.0337352 -2.2072895,0.01601326 8.7185884,-4.0017078 c -1.7454984,2.3720609 -1.7354408,5.6174519 -6e-7,8.035443 z"
+       transform="scale(-0.6,-0.6)"
+       id="path45132"
+       style="font-size:12px;fill-rule:evenodd;stroke-width:0.625;stroke-linejoin:round" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotL"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.8,0,0,0.8,5.92,0.8)"
+       id="path14326"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker><marker
+     refX="0"
+     refY="0"
+     orient="auto"
+     id="DotM"
+     style="overflow:visible"><path
+       d="m -2.5,-1 c 0,2.76 -2.24,5 -5,5 -2.76,0 -5,-2.24 -5,-5 0,-2.76 2.24,-5 5,-5 2.76,0 5,2.24 5,5 z"
+       transform="matrix(0.4,0,0,0.4,2.96,0.4)"
+       id="path14329"
+       style="fill-rule:evenodd;stroke:#000000;stroke-width:1pt;marker-start:none;marker-end:none" /></marker></defs>
+<path
+   d="M 18.788295,0 C 18.258441,0 17.83188,0.42656 17.83188,0.9564138 l 0,2.4308835 C 16.594732,3.6944151 15.403984,4.1887145 14.285181,4.8617694 L 12.571607,3.1481946 c -0.374663,-0.3746629 -0.980257,-0.3746629 -1.35492,0 L 8.1083436,6.2565374 c -0.3746626,0.3746639 -0.3746626,0.980256 0,1.3549199 L 9.8219178,9.3250326 C 9.1541311,10.440568 8.6910851,11.644818 8.3872978,12.871731 l -2.4308844,0 C 5.4265604,12.871731 5,13.298291 5,13.828141 l 0,4.383563 c 0,0.529854 0.4265604,0.956414 0.9564135,0.956414 l 2.3910337,0 c 0.307067,1.238251 0.8008512,2.426955 1.4744706,3.546699 l -1.7135742,1.713575 c -0.3746626,0.374661 -0.3746626,0.980256 0,1.354921 l 3.1083434,3.108342 c 0.374663,0.374662 0.980257,0.374662 1.35492,0 l 1.713574,-1.713574 c 1.123692,0.677719 2.309334,1.12739 3.546699,1.43462 l 0,2.430884 c 0,0.529854 0.426561,0.956414 0.956415,0.956414 l 4.383563,0 c 0.52985,0 0.95641,-0.42656 0.95641,-0.956413 l 0,-2.430885 c 1.24001,-0.30559 2.425185,-0.761767 3.5467,-1.43462 l 1.713575,1.713574 c 0.374664,0.374662 0.980256,0.374662 1.35492,0 l 3.108343,-3.108342 c 0.374662,-0.374665 0.374662,-0.98026 0,-1.354921 l -1.713575,-1.713575 c 0.674452,-1.117718 1.166647,-2.315963 1.474471,-3.546698 l 2.430885,0 C 36.57344,19.168118 37,18.741558 37,18.211704 l 0,-4.383559 c 0,-0.529854 -0.42656,-0.956414 -0.956413,-0.956414 l -2.430885,0 C 33.307437,11.642048 32.805034,10.438055 32.138231,9.3250326 l 1.713575,-1.7135753 c 0.374662,-0.3746639 0.374662,-0.980256 0,-1.3549199 L 30.743463,3.1481946 c -0.374664,-0.3746629 -0.980256,-0.3746629 -1.35492,0 L 27.674968,4.8617694 C 26.555129,4.1896139 25.36061,3.6922413 24.128268,3.3872973 l 0,-2.4308835 C 24.128268,0.42656 23.701708,0 23.171858,0 l -4.383563,0 z m 2.032377,9.9626393 c 1.549644,-0.041137 3.129994,0.4829097 4.343712,1.6338727 2.427433,2.301926 2.541027,6.140437 0.239103,8.567871 -2.296244,2.421441 -6.138424,2.526877 -8.567871,0.239103 -2.427433,-2.301926 -2.541028,-6.140437 -0.239103,-8.567871 1.150964,-1.213716 2.674516,-1.831849 4.224159,-1.8729746 z"
+   id="rect3381-0"
+   style="fill:#434343;fill-opacity:1;stroke:none" /></svg>
\ No newline at end of file
diff --git a/resources/images/display.svg b/resources/images/display.svg
new file mode 100644
index 00000000..099afaf2
--- /dev/null
+++ b/resources/images/display.svg
@@ -0,0 +1,23 @@
+<?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="32"
+   height="32"
+   viewBox="0 0 32 32"
+   id="Layer_1"
+   xml:space="preserve"><metadata
+   id="metadata7"><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="defs5" />
+<path
+   d="m 0.00247807,3.6367819 0,20.7171051 13.45132193,0 c 0.855843,2.598647 -1.560716,2.858775 -3.044789,4.009331 0,0 3.669509,-0.03803 5.504329,-0.03802 1.830825,1.8e-5 5.492344,0.03802 5.492344,0.03802 -1.448218,-1.101695 -3.769303,-1.38983 -3.044788,-4.009331 l 13.647484,0 0,-20.7171051 -32.00838,0 z m 10.89845393,2.9455513 1.276296,0 5.302174,13.5495688 -1.669172,0 -1.669172,-4.221958 -5.4001178,0 -1.6691724,4.221958 -1.5709533,0 z m 0.589039,1.767336 c -0.13519,0.590197 -0.337146,1.25679 -0.589039,1.9637188 l -1.5709533,4.123766 4.3202593,0 -1.570953,-4.123766 C 11.875122,9.7847162 11.70517,9.1181232 11.489971,8.3496692 z m 11.389549,1.570981 c 1.204839,2.8e-5 2.073084,0.2507898 2.651087,0.7854768 0.583797,0.534852 0.883696,1.372528 0.883696,2.552813 l 0,6.872962 -1.080134,0 -0.294657,-1.374571 -0.09932,0 c -0.504062,0.633182 -0.968672,1.048958 -1.472734,1.276407 -0.497993,0.221268 -1.213668,0.294381 -1.963554,0.294381 -1.002055,0 -1.784773,-0.269275 -2.35643,-0.785477 -0.565587,-0.516367 -0.785476,-1.207184 -0.785476,-2.160074 0,-2.040943 1.644893,-3.141741 4.909298,-3.240126 l 1.668896,0 0,-0.687285 c 0,-0.792981 -0.146225,-1.392311 -0.490819,-1.767336 -0.338249,-0.381151 -0.919287,-0.490902 -1.669173,-0.49093 -0.842035,2.8e-5 -1.783945,0.171056 -2.847249,0.687313 l -0.491098,-1.080051 c 0.497992,-0.270655 1.07903,-0.533584 1.669172,-0.687286 0.596488,-0.1536738 1.17118,-0.1964378 1.767391,-0.1964378 z m 0.491095,5.3020088 c -1.217254,0.04304 -2.110054,0.251065 -2.651087,0.589093 -0.534687,0.331986 -0.785477,0.864052 -0.785477,1.570981 0,0.553283 0.16002,0.987461 0.49082,1.276407 0.338249,0.289056 0.870453,0.392738 1.472734,0.392738 0.952946,0 1.619235,-0.262929 2.160268,-0.785477 0.547102,-0.52252 0.883696,-1.219516 0.883696,-2.160074 l 0,-0.883668 z"
+   id="rect4908-5-1-5-9"
+   style="fill:#434343;fill-opacity:1;stroke:none" /></svg>
\ No newline at end of file
diff --git a/resources/images/input.svg b/resources/images/input.svg
new file mode 100644
index 00000000..54099555
--- /dev/null
+++ b/resources/images/input.svg
@@ -0,0 +1,23 @@
+<?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="32"
+   height="32"
+   viewBox="0 0 32 32"
+   id="Layer_1"
+   xml:space="preserve"><metadata
+   id="metadata7"><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="defs5" />
+<path
+   d="m 14.40625,2.4375 c 0,0 -0.09206,0.228205 -0.21875,0.5 -0.118962,0.255222 -0.343456,0.518385 -0.34375,0.53125 -0.07459,0.0056 -0.374806,0.106431 -0.78125,0.125 -0.541925,0.02476 -1.252016,0.0044 -2,-0.03125 C 9.5665318,3.49126 7.97186,3.348574 6.90625,3.53125 l -0.03125,0 c -0.6440186,0.119897 -1.1017059,0.548512 -1.4375,1 C 5.0967523,4.989398 4.8501105,5.50885 4.6875,6 4.4387499,6.751327 4.3485455,7.329266 4.3125,7.625 L 0,7.625 0,26 32,26 32,7.625 5.84375,7.625 C 5.8929222,7.326517 5.9697935,6.937537 6.125,6.46875 6.2560186,6.073021 6.4309233,5.667193 6.625,5.40625 6.8190767,5.145307 7.0067168,5.030991 7.1875,5 7.7997705,4.895039 9.4445334,4.98992 10.96875,5.0625 c 0.762108,0.03629 1.517666,0.06042 2.15625,0.03125 0.638584,-0.02917 1.151111,0.0042 1.6875,-0.4375 0.418957,-0.345022 0.558509,-0.718718 0.71875,-1.0625 C 15.691491,3.249968 15.8125,2.9375 15.8125,2.9375 l -1.40625,-0.5 z m -11.375,9.375 2.46875,0 c 0.1541065,0 0.28125,0.09589 0.28125,0.25 l 0,2.5 c 0,0.154106 -0.1271435,0.28125 -0.28125,0.28125 l -2.46875,0 C 2.8771435,14.84375 2.75,14.716606 2.75,14.5625 l 0,-2.5 c 0,-0.154106 0.1271435,-0.25 0.28125,-0.25 z m 4.53125,0 2.46875,0 c 0.154106,0 0.28125,0.09589 0.28125,0.25 l 0,2.5 c 0,0.154106 -0.127144,0.28125 -0.28125,0.28125 l -2.46875,0 c -0.1541065,0 -0.28125,-0.127144 -0.28125,-0.28125 l 0,-2.5 c 0,-0.154106 0.1271435,-0.25 0.28125,-0.25 z m 4.53125,0 2.46875,0 c 0.154106,0 0.28125,0.09589 0.28125,0.25 l 0,2.5 c 0,0.154106 -0.127144,0.28125 -0.28125,0.28125 l -2.46875,0 c -0.154106,0 -0.28125,-0.127144 -0.28125,-0.28125 l 0,-2.5 c 0,-0.154106 0.127144,-0.25 0.28125,-0.25 z m 4.53125,0 2.46875,0 c 0.154106,0 0.28125,0.09589 0.28125,0.25 l 0,2.5 c 0,0.154106 -0.127144,0.28125 -0.28125,0.28125 l -2.46875,0 c -0.154106,0 -0.28125,-0.127144 -0.28125,-0.28125 l 0,-2.5 c 0,-0.154106 0.127144,-0.25 0.28125,-0.25 z m 4.53125,0 2.46875,0 c 0.154106,0 0.28125,0.09589 0.28125,0.25 l 0,2.5 c 0,0.154106 -0.127144,0.28125 -0.28125,0.28125 l -2.46875,0 c -0.154106,0 -0.28125,-0.127144 -0.28125,-0.28125 l 0,-2.5 c 0,-0.154106 0.127144,-0.25 0.28125,-0.25 z m 4.53125,0 2.46875,0 c 0.154106,0 0.28125,0.09589 0.28125,0.25 l 0,2.5 c 0,0.154106 -0.127144,0.28125 -0.28125,0.28125 l -2.46875,0 c -0.154106,0 -0.28125,-0.127144 -0.28125,-0.28125 l 0,-2.5 c 0,-0.154106 0.127144,-0.25 0.28125,-0.25 z m -20.53125,4.8125 2.46875,0 c 0.1541065,0 0.28125,0.127144 0.28125,0.28125 l 0,2.46875 c 0,0.154106 -0.1271435,0.28125 -0.28125,0.28125 l -2.46875,0 C 5.0021435,19.65625 4.875,19.529106 4.875,19.375 l 0,-2.46875 c 0,-0.154106 0.1271435,-0.28125 0.28125,-0.28125 z m 4.65625,0 2.46875,0 c 0.154106,0 0.28125,0.127144 0.28125,0.28125 l 0,2.46875 c 0,0.154106 -0.127144,0.28125 -0.28125,0.28125 l -2.46875,0 c -0.1541065,0 -0.28125,-0.127144 -0.28125,-0.28125 l 0,-2.46875 c 0,-0.154106 0.1271435,-0.28125 0.28125,-0.28125 z m 4.65625,0 2.5,0 c 0.154106,0 0.28125,0.127144 0.28125,0.28125 l 0,2.46875 c 0,0.154106 -0.127144,0.28125 -0.28125,0.28125 l -2.5,0 c -0.154106,0 -0.28125,-0.127144 -0.28125,-0.28125 l 0,-2.46875 c 0,-0.154106 0.127144,-0.28125 0.28125,-0.28125 z m 4.6875,0 2.46875,0 c 0.154106,0 0.28125,0.127144 0.28125,0.28125 l 0,2.46875 c 0,0.154106 -0.127144,0.28125 -0.28125,0.28125 l -2.46875,0 c -0.154106,0 -0.28125,-0.127144 -0.28125,-0.28125 l 0,-2.46875 c 0,-0.154106 0.127144,-0.28125 0.28125,-0.28125 z m 4.65625,0 2.46875,0 c 0.154106,0 0.28125,0.127144 0.28125,0.28125 l 0,2.46875 c 0,0.154106 -0.127144,0.28125 -0.28125,0.28125 l -2.46875,0 c -0.154106,0 -0.28125,-0.127144 -0.28125,-0.28125 l 0,-2.46875 c 0,-0.154106 0.127144,-0.28125 0.28125,-0.28125 z m -17.40625,5.6875 19.1875,0 c 0.154106,0 0.25,0.127144 0.25,0.28125 l 0,1.28125 c 0,0.154106 -0.09589,0.28125 -0.25,0.28125 l -19.1875,0 c -0.1541065,0 -0.25,-0.127144 -0.25,-0.28125 l 0,-1.28125 c 0,-0.154106 0.095893,-0.28125 0.25,-0.28125 z"
+   id="path4443"
+   style="font-size:medium;font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;text-indent:0;text-align:start;text-decoration:none;line-height:normal;letter-spacing:normal;word-spacing:normal;text-transform:none;direction:ltr;block-progression:tb;writing-mode:lr-tb;text-anchor:start;baseline-shift:baseline;color:#000000;fill:#434343;fill-opacity:1;stroke:none;stroke-width:1.5;marker:none;visibility:visible;display:inline;overflow:visible;enable-background:accumulate;font-family:Sans;-inkscape-font-specification:Sans" /></svg>
\ No newline at end of file