Create quicklinks style class

Change-Id: Ibbe769a9c23d288db6b8e9db1a41b25d7b060999
Signed-off-by: Michael Davis <michael.s.davis@ibm.com>

2 files changed, 64 insertions, 1 deletions

diff --git a/app/common/styles/elements/index.scss b/app/common/styles/elements/index.scss
index b19ecab..d136134 100644
--- a/app/common/styles/elements/index.scss
+++ b/app/common/styles/elements/index.scss
@@ -10,4 +10,5 @@
 @import "paginate";
 @import "thresholds";
 @import "export";
-@import "modals";
\ No newline at end of file
+@import "modals";
+@import "quicklinks";
\ No newline at end of file
diff --git a/app/common/styles/elements/quicklinks b/app/common/styles/elements/quicklinks
new file mode 100644
index 0000000..45f7ffb
--- /dev/null
+++ b/app/common/styles/elements/quicklinks
@@ -0,0 +1,62 @@
+//Quick links block
+.quick-links {
+  background-color: $lightgrey;
+  padding: 1em 1.4em;
+  font-size: .9em;
+  font-weight: 400;
+  a {
+    color: $black;
+    text-decoration: none;
+    display: block;
+  }
+  p {
+    margin-bottom: 0;
+  }
+  .event-log__events {
+    margin-top: 0;
+  }
+}
+
+.quick-links__item {
+  padding: 1em 0 1em 0;
+  border-bottom: 1px solid $medgrey;
+  position: relative;
+  &:after {
+    content: '\203A';
+    position: absolute;
+    top: 50%;
+    right: 0;
+    font-size: 3em;
+    color: lighten($darkgrey, 15%);
+    transform: translateY(-50%);
+  }
+  &.no-icon {
+    &:after {
+      display: none;
+    }
+  }
+  &:last-child {
+    border-bottom: 0;
+  }
+}
+
+.quick-links__label {
+  font-weight: 700;
+}
+
+.quick-links__event-copy {
+  color: $alert__error;
+  margin-left: 1em;
+  margin-bottom: 0;
+  font-weight: 700;
+  font-size: .9em;
+  a {
+    color: $alert__error;
+  }
+}
+
+//toggle switch
+.quick-links__item .toggle label {
+  transform: translateY(-2px);
+  margin-right: 0;
+}