Rift.IO OSM R1 Initial Submission
[osm/UI.git] / skyquake / plugins / launchpad / src / instantiate / instantiateInputParams.scss
diff --git a/skyquake/plugins/launchpad/src/instantiate/instantiateInputParams.scss b/skyquake/plugins/launchpad/src/instantiate/instantiateInputParams.scss
new file mode 100644 (file)
index 0000000..3494316
--- /dev/null
@@ -0,0 +1,221 @@
+/*
+ * 
+ *   Copyright 2016 RIFT.IO Inc
+ *
+ *   Licensed under the Apache License, Version 2.0 (the "License");
+ *   you may not use this file except in compliance with the License.
+ *   You may obtain a copy of the License at
+ *
+ *       http://www.apache.org/licenses/LICENSE-2.0
+ *
+ *   Unless required by applicable law or agreed to in writing, software
+ *   distributed under the License is distributed on an "AS IS" BASIS,
+ *   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ *   See the License for the specific language governing permissions and
+ *   limitations under the License.
+ *
+ */
+
+@import 'style/_colors.scss';
+@import 'style/layout.scss';
+.instantiateInputParams {
+    -ms-flex-preferred-size: 70%;
+        flex-basis: 70%;
+    &_section {
+      width:100%;
+      padding-top:0rem;
+      &:last-child {
+        padding-bottom:2rem;
+      }
+      &:first-child{
+        padding-top:0;
+      }
+      &:nth-child(odd) {
+        background:$gray-lighter;
+      }
+      >div {
+        padding:1rem;
+      }
+      h3 {
+        width:100%;
+        text-transform:uppercase;
+        padding-right: 0;
+
+      }
+      &-info {
+        /*add button*/
+        button{
+          margin:0;
+        }
+        label {
+          >div {
+            display: none;
+            -ms-flex-align: center;
+                -ms-grid-row-align: center;
+                align-items: center;
+          }
+          >span{
+            display:-ms-flexbox;
+            display:flex;
+            -ms-flex-align:center;
+                align-items:center;
+          }
+        }
+      }
+    }
+    &-body {
+      -ms-flex-align: center;
+          -ms-grid-row-align: center;
+          align-items: center;
+      -ms-flex: none;
+          flex: none;
+      display: block;
+      width:100%;
+
+    }
+    label {
+        display: -ms-flexbox;
+        display: flex;
+        -ms-flex-direction: column;
+            flex-direction: column;
+        width: 100%;
+        margin: 0.5rem 0;
+        -ms-flex-align: start;
+            align-items: flex-start;
+        -ms-flex-pack:start;
+            justify-content:flex-start;
+        input[type="text"], input[type="password"] {
+          height: 35px;
+          box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.39), 0 -1px 1px #ffffff, 0 1px 0 #ffffff;
+          font-size: 1rem;
+          display: block;
+          background: white !important;
+          margin: 0;
+          margin-top: 0.25rem;
+          min-width:75%;
+        }
+        select {
+          font-size: 1rem;
+          min-width:75%;
+          height:35px;
+        }
+        span {
+          color:$darker-gray;
+          text-transform:uppercase;
+        }
+        >span {
+          display:-ms-flexbox;
+          display:flex;
+          margin-bottom: 0.5rem;
+        }
+        :first-child {
+        }
+      }
+      .input_group{
+          display:-ms-flexbox;
+          display:flex;
+          -ms-flex-wrap: wrap;
+              flex-wrap: wrap;
+          -ms-flex-pack: justify;
+              justify-content: space-between;
+          input, button{
+            -ms-flex: 1 1 auto;
+                flex: 1 1 auto;
+            margin-right: 1rem;
+            min-width:auto;
+          }
+          &-users {
+            display:-ms-flexbox;
+            display:flex;
+            -ms-flex-align: start;
+                align-items: flex-start;
+            .removeInput {
+              -ms-flex: 0 1;
+                  flex: 0 1;
+            }
+          }
+          button {
+            /*remove button*/
+            padding: 0.75rem 0.75rem;
+            -ms-flex:0 1 auto;
+                flex:0 1 auto;
+          }
+        }
+    .inputControls {
+      -ms-flex: 1 0;
+          flex: 1 0;
+      &-sshkeys {
+        display:-ms-flexbox;
+        display:flex;
+        padding-top:0.5rem;
+        padding-bottom:0px;
+          -ms-flex: 1 1;
+              flex: 1 1;
+        > label {
+          margin-bottom:0;
+          margin-top:0;
+        }
+        > label:nth-child(2) {
+              -ms-flex: 0 1 25%;
+                  flex: 0 1 25%;
+                  display: -ms-flexbox;
+                  display: flex;
+    -ms-flex-direction: column;
+        flex-direction: column;
+    -ms-flex-pack: center;
+        justify-content: center;
+        }
+      }
+      &-title {
+        margin-bottom: 0.5rem;
+        font-weight:bold;
+        text-transform:uppercase;
+      }
+      &-radio {
+        -ms-flex-direction:row;
+            flex-direction:row;
+            margin:0.5rem 0.5rem 0.5rem 0;
+            width:auto;
+      }
+      &-radioGroup {
+        display:-ms-flexbox;
+        display:flex;
+      }
+    }
+     .addInput, .removeInput {
+          display:-ms-flexbox;
+          display:flex;
+          -ms-flex-align:center;
+              align-items:center;
+          margin-left: 1rem;
+
+          font-size:0.75rem;
+          text-transform:uppercase;
+          font-weight:bold;
+
+          cursor:pointer;
+          img {
+            height:0.75rem;
+            margin-right:0.5rem;
+            width:auto;
+          }
+      }
+    .LaunchpadCard_title {
+      margin:1rem 0;
+    }
+    .placementGroup_description {
+      margin: 1rem 0;
+      >div {
+        margin:1rem 0;
+        strong {
+          font-weight:bold;
+        }
+        em {
+          font-style:italic;
+        }
+      }
+      &-name strong{
+        font-weight:bold;
+      }
+    }
+}