finished styling for slider and jump/current buttons

Author: garrettlchow

src/app/components/Actions/RouteDescription.tsx

@@ -18,7 +18,7 @@ const RouteDescription = (props: RouteProps): JSX.Element => {
   return (
     <div className='route-container'>
       <div className='route-header'>Route: {url.pathname}</div>
-      <div className='route-content' style={{ height: `${actions.length * 42}px` }}>
+      <div className='route-content' style={{ height: `${actions.length * 40.5}px` }}>
         <div>
           <VerticalSlider className='main-slider' snapshots={actions} />
         </div>

src/app/styles/components/_actionComponent.scss

@@ -71,14 +71,17 @@
 .jump-button,
 .current-location {
   min-width: 90px;
-  padding: 4px 8px;
+  height: 28px; /* Fixed height for better vertical centering */
+  padding: 0 8px; /* Reduced vertical padding */
   border-radius: 6px;
   font-size: 0.9375rem;
   font-weight: 500;
-  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   border: none;
   transition: all 200ms ease;
-  margin-top: 6px;
+  margin: 0; /* Removed top margin */
 }
 
 .time-button {