RIFT-15038: SSH Keys styling fix for overlapping.

Signed-off-by: Laurence Maultsby <laurence.maultsby@riftio.com>

diff --git a/skyquake/plugins/launchpad/src/ssh_keys/sshKeyCard.scss b/skyquake/plugins/launchpad/src/ssh_keys/sshKeyCard.scss
index f72af71..cbb6691 100644 (file)
--- a/skyquake/plugins/launchpad/src/ssh_keys/sshKeyCard.scss
+++ b/skyquake/plugins/launchpad/src/ssh_keys/sshKeyCard.scss
@@ -1,5 +1,5 @@
 /*
- * 
+ *
  *   Copyright 2016 RIFT.IO Inc
  *
  *   Licensed under the Apache License, Version 2.0 (the "License");
@@ -17,12 +17,20 @@
  */
 @import "style/_colors.scss";
 
+.sshKeyCards {
+    display:-ms-flexbox;
+    display:flex;
+    -ms-flex-direction:column;
+        flex-direction:column;
+}
+
 .sshKeyCard {
     display:-ms-flexbox;
     display:flex;
     -ms-flex-align: start;
         align-items: flex-start;
-    height:250px;
+    -ms-flex: 1 0 auto;
+        flex: 1 0 auto;
     border-top: 1px solid $neutral-white;
     &:nth-child(odd) {
         background:$gray-lighter;
@@ -58,20 +66,15 @@
     }
     &-key.sqTextInput {
         font-size:1rem;
-        -ms-flex-align: stretch;
-            -ms-grid-row-align: stretch;
-            align-items: stretch;
-            -ms-flex:1;
-                flex:1;
+
         > textarea {
             padding:0.5rem;
             min-height:190px;
         }
         > .readonly {
-            -ms-flex: 1;
-                flex: 1;
             background: none !important;
             word-break: break-all;
+            height:auto;
         }
     }
     &-name {
@@ -95,8 +98,8 @@
         -ms-flex-align: center;
         -ms-grid-row-align: center;
     align-items: center;
-        height: 100%;
-        border-left: 1px solid $neutral-white;
+        -ms-flex-item-align: center;
+            align-self: center;
         >div {
             display:-ms-flexbox;
             display:flex;

diff --git a/skyquake/plugins/launchpad/src/ssh_keys/sshKeys.jsx b/skyquake/plugins/launchpad/src/ssh_keys/sshKeys.jsx
index 1676cff..8f8945d 100644 (file)
--- a/skyquake/plugins/launchpad/src/ssh_keys/sshKeys.jsx
+++ b/skyquake/plugins/launchpad/src/ssh_keys/sshKeys.jsx
@@ -1,5 +1,5 @@
 /*
- * 
+ *
  *   Copyright 2016 RIFT.IO Inc
  *
  *   Licensed under the Apache License, Version 2.0 (the "License");
@@ -45,7 +45,7 @@ class SshKeys extends Component {
         let Store = self.Store;
         // return <div>test</div>
         return (
-          <div>
+          <div className="sshKeyCards">
             {
               self.state.data && self.state.data.keys.map(function(k, i) {
                 let sshKey = self.state.data.entities[k];