From 8cd7fb54ed88ffe8dc9c010b4b1eb3a3ebeca195 Mon Sep 17 00:00:00 2001
From: Mary Nagle <mnagle16@gmail.com>
Date: Tue, 21 Mar 2017 14:39:57 -0400
Subject: [PATCH] Add sticky scroll to side panel

---
 ui/index.html           | 2 +-
 ui/styles/_buttons.scss | 1 +
 ui/styles/_forms.scss   | 1 +
 ui/styles/base.scss     | 7 +++++++
 4 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/ui/index.html b/ui/index.html
index bca196a1fe..e0517e7ba5 100644
--- a/ui/index.html
+++ b/ui/index.html
@@ -285,7 +285,7 @@
         <hr>
       </div>
 
-      <div class="col-md-6 col-lg-7 border-left">
+      <div class="col-md-6 col-lg-7 border-left sticky-scroll">
         <div class="padded-border">
 
           <div class="panel">
diff --git a/ui/styles/_buttons.scss b/ui/styles/_buttons.scss
index 3e84096d95..28ab611992 100644
--- a/ui/styles/_buttons.scss
+++ b/ui/styles/_buttons.scss
@@ -12,6 +12,7 @@
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
+    -webkit-transform: translateZ(0);
 
     &:hover {
         color: darken($gray, 10%);
diff --git a/ui/styles/_forms.scss b/ui/styles/_forms.scss
index fe279322a8..4a00a98f61 100644
--- a/ui/styles/_forms.scss
+++ b/ui/styles/_forms.scss
@@ -23,4 +23,5 @@
 
 textarea.form-control {
     height: 130px;
+    -webkit-transform: translateZ(0);
 }
diff --git a/ui/styles/base.scss b/ui/styles/base.scss
index 4334ae468b..cedc39e372 100644
--- a/ui/styles/base.scss
+++ b/ui/styles/base.scss
@@ -71,6 +71,13 @@ a {
     margin-top: 200px;
 }
 
+.sticky-scroll {
+    top: 15px;
+    position: sticky;
+    position: -webkit-sticky;
+    overflow: scroll;
+}
+
 .row {
     &.colored {
         background-color: $light-purple;