From de838ed5459a869e0d4686678c21d24c7fd6ee97 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Farkas=20J=C3=B3zsef?= <fjozsef001@gmail.com>
Date: Fri, 16 Sep 2016 22:21:36 +0200
Subject: [PATCH] Fix Key label positioning bug on Firefox

Closes #90
---
 .../svg/keys/svg-keyboard-key/svg-keyboard-key.component.html  | 3 +--
 .../svg/keys/svg-keyboard-key/svg-keyboard-key.component.scss  | 3 +++
 .../svg/keys/svg-keyboard-key/svg-keyboard-key.component.ts    | 3 ++-
 3 files changed, 6 insertions(+), 3 deletions(-)
 create mode 100644 src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.scss

diff --git a/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.html b/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.html
index 9b66cb9a..9bd97786 100644
--- a/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.html
+++ b/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.html
@@ -5,8 +5,7 @@
 <svg:g [ngSwitch]="labelType"
         [attr.font-size]="19"
         [attr.font-family]="'Helvetica'"
-        [attr.fill]="'white'"
-        style="dominant-baseline: central">
+        [attr.fill]="'white'">
     <svg:g svg-keystroke-key *ngSwitchCase="enumLabelTypes.KeystrokeKey"
             [height]="height"
             [width]="width"
diff --git a/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.scss b/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.scss
new file mode 100644
index 00000000..d4dfffbc
--- /dev/null
+++ b/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.scss
@@ -0,0 +1,3 @@
+:host /deep/ text {
+    dominant-baseline: central;
+}
diff --git a/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.ts b/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.ts
index 931420cb..f2042441 100644
--- a/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.ts
+++ b/src/components/svg/keys/svg-keyboard-key/svg-keyboard-key.component.ts
@@ -26,7 +26,8 @@ enum LabelTypes {
 
 @Component({
     selector: 'g[svg-keyboard-key]',
-    template: require('./svg-keyboard-key.component.html')
+    template: require('./svg-keyboard-key.component.html'),
+    styles: [require('./svg-keyboard-key.component.scss')]
 })
 export class SvgKeyboardKeyComponent implements OnInit, OnChanges {
     @Input() id: string;