Rift.IO OSM R1 Initial Submission
[osm/UI.git] / skyquake / plugins / launchpad / src / launchpad_card / jobListCard.scss
diff --git a/skyquake/plugins/launchpad/src/launchpad_card/jobListCard.scss b/skyquake/plugins/launchpad/src/launchpad_card/jobListCard.scss
new file mode 100644 (file)
index 0000000..8551abb
--- /dev/null
@@ -0,0 +1,86 @@
+@import 'style/_colors.scss';
+
+.jobListCard {
+    background:white;
+    border-radius: 5px;
+    padding:0.5rem;
+    margin:0.5rem;
+    &--header {
+        display:-ms-flexbox;
+        display:flex;
+        -ms-flex-pack: justify;
+        justify-content: space-between;
+        -ms-flex-align: center;
+        align-items: center;
+        -ms-flex-wrap: wrap;
+        flex-wrap: wrap;
+        margin-bottom:0.25rem;
+    }
+    &--subtitle {
+        color:$darker-gray;
+        font-size:0.75rem;
+        margin-bottom:0.125rem;
+    }
+    &--status {
+        height: 0.75rem;
+        width: 0.75rem;
+        border-radius:50%;
+        &_red {
+            background:red;
+            border-color:red;
+        }
+        &_green {
+            background:green;
+            border-color:green;
+        }
+        &_yellow {
+            background:yellow;
+            border-color:yellow;
+        }
+    }
+    &--parameters {
+        font-size:0.75rem;
+        h4 {
+            padding-bottom:0.5rem;
+            text-decoration:underline;
+            cursor:pointer;
+        }
+
+    }
+    &--list {
+        display:-ms-flexbox;
+        display:flex;
+        -ms-flex-wrap:wrap;
+            flex-wrap:wrap;
+    }
+    &--listitem {
+        -ms-flex: 1 1 48%;
+            flex: 1 1 48%;
+        margin:0.125rem;
+    }
+    &--listname {
+        -ms-flex:1 1 100%;
+            flex:1 1 100%;
+    }
+    &--parameter {
+        color:$darker-gray;
+    }
+    &--details {
+        font-size:0.75rem;
+        h4 {
+            padding-bottom:0.5rem;
+            text-decoration:underline;
+            cursor:pointer;
+        }
+        &--content {
+            height: 26em;
+            overflow-y: scroll;
+            padding: 1em;
+        }
+        &--close {
+            text-align: center;
+            margin-top: 3em;
+        }
+
+    }
+}