fixed tree component changing outer div size

Author: joshua0308

src/app/containers/TravelContainer.jsx

@@ -1,11 +1,5 @@
-<<<<<<< HEAD
-import React, { Component } from 'react';
-
-import Slider from '../components/Slider';
-=======
 import React from 'react';
-import MainSlider from '../components/MainSlider'
->>>>>>> dev
+import MainSlider from '../components/MainSlider';
 
 const TravelContainer = ({
   playForward,

src/app/styles/components/_buttons.scss

@@ -9,7 +9,17 @@
   visibility: hidden;
 }
 
+.jump-button:focus {
+  outline: 0;
+  // make the text in the button not highlightable
+  -webkit-user-select: none; /* Safari */
+  -moz-user-select: none; /* Firefox */
+  -ms-user-select: none; /* IE10+/Edge */
+  user-select: none; /* Standard */
+}
+
 .jump-button:hover {
+  // remove the blue border when button is clicked
   background-color: $highlight-color;
 }
 

src/app/styles/components/_jsonTree.scss

@@ -1,7 +1,8 @@
 .json-tree {
-  margin: 0;
-  padding: 10px;
+  position: absolute;
+  margin: 10px;
+  padding: 0;
   background-color: $brand-color;
   list-style: none;
-  min-width: 300px;
+  // overflow: hidden;
 }