From 32450c49de649a36abb45a8d6598d128689be4ce Mon Sep 17 00:00:00 2001
From: Shekar Siri <sshekarsiri@gmail.com>
Date: Tue, 16 Aug 2022 15:06:51 +0200
Subject: [PATCH] change(ui) - player controls margin

---
 .../Player/Controls/components/PlayerControls.tsx    | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/frontend/app/components/Session_/Player/Controls/components/PlayerControls.tsx b/frontend/app/components/Session_/Player/Controls/components/PlayerControls.tsx
index 9f813ce93..4a8276482 100644
--- a/frontend/app/components/Session_/Player/Controls/components/PlayerControls.tsx
+++ b/frontend/app/components/Session_/Player/Controls/components/PlayerControls.tsx
@@ -83,7 +83,10 @@ function PlayerControls(props: Props) {
       <div className="rounded ml-4 bg-active-blue border border-active-blue-border flex items-stretch">
         {/* @ts-ignore */}
         <Tooltip title="Rewind 10s" delay={0} position="top">
-          <button ref={arrowBackRef} className="h-full hover:border-active-blue-border focus:border focus:border-blue border-borderColor-transparent">
+          <button
+            ref={arrowBackRef}
+            className="h-full hover:border-active-blue-border focus:border focus:border-blue border-borderColor-transparent"
+          >
             {controlIcon(
               'skip-forward-fill',
               18,
@@ -123,7 +126,10 @@ function PlayerControls(props: Props) {
         </div>
         {/* @ts-ignore */}
         <Tooltip title="Forward 10s" delay={0} position="top">
-          <button ref={arrowForwardRef} className="h-full hover:border-active-blue-border focus:border focus:border-blue  border-borderColor-transparent">
+          <button
+            ref={arrowForwardRef}
+            className="h-full hover:border-active-blue-border focus:border focus:border-blue  border-borderColor-transparent"
+          >
             {controlIcon(
               'skip-forward-fill',
               18,
@@ -136,7 +142,7 @@ function PlayerControls(props: Props) {
       </div>
 
       {!live && (
-        <div className="flex items-center mx-4">
+        <div className="flex items-center ml-4">
           {/* @ts-ignore */}
           <Tooltip title="Control play back speed (↑↓)" delay={0} position="top">
             <button