Fix TeksDrawer display

components/teks/teks-drawer.js

@@ -1,7 +1,6 @@
 import {useEffect, useState, forwardRef} from 'react'
 import PropTypes from 'prop-types'
 import Link from 'next/link'
-import {useRouter} from 'next/router'
 import {useSession} from 'next-auth/client'
 
 import {
@@ -104,7 +103,7 @@ const Root = styled('div')((
 
   [`& .${classes.content}`]: {
     flexGrow: 1,
-    padding: theme.spacing(3)
+    padding: theme.spacing(1)
   },
 
   [`& .${classes.list}`]: {
@@ -150,7 +149,7 @@ const Root = styled('div')((
 
   [`& .${classes.pataje}`]: {
     position: 'fixed',
-    top: '85px',
+    top: '83px',
     left: '110px',
     zIndex: 2,
     [theme.breakpoints.up('sm')]: {
@@ -210,7 +209,6 @@ const ExplicitTooltip = Tooltip
 
 export default function TeksDrawer({teks, anTeks, komante}) {
   const [session] = useSession()
-  const router = useRouter()
 
   const isMobile = useMediaQuery('(max-width:800px)')
   const langArray = langToArray(anTeks)
@@ -319,7 +317,7 @@ export default function TeksDrawer({teks, anTeks, komante}) {
             <div className={classes.pataje}>
               <Pataje teks={anTeks} setError={setError} setSuccess={setSuccess} />
             </div>
-            <Box sx={{textAlign: 'center', marginTop: 9}}>
+            <Box sx={{textAlign: 'center', marginTop: 11}}>
               <Typography style={{marginTop: '0.8em'}} variant='h4' display='block'>
                 <Typography gutterBottom variant='h6'>
                   {anTeks.awtis.map(a => a.alias).join(', ')}
@@ -339,12 +337,14 @@ export default function TeksDrawer({teks, anTeks, komante}) {
                     </ExplicitTooltip>
                   )}
                 </Typography>
-                {komante && (
+                <Grid container alignItems='center' justifyContent='center'>
-                  <VweKomante komante={komante} teks={anTeks} />
+                  {komante && (
-                )}
+                    <VweKomante komante={komante} teks={anTeks} />
-                {session && (
+                  )}
-                  <Dekoneksyon chimen={router.asPath} tooltipPlacement='bottom' />
+                  {session && (
-                )}
+                    <Dekoneksyon tooltipPlacement='bottom' />
+                  )}
+                </Grid>
               </Typography>
               {anTeks.user && (
                 <Typography style={{marginBottom: '1.5em'}} display='block' variant='caption'>
@@ -360,7 +360,7 @@ export default function TeksDrawer({teks, anTeks, komante}) {
             {anTeks.okiMizikID && (
               <OkiMizik id={anTeks.okiMizikID} />
             )}
-            <Grid container justifyContent='center' spacing={1}>
+            <Grid container justifyContent='start' spacing={1}>
               <Grid item xs={12} md={langArray.length > 0 ? 6 : null}>
                 <div className={classes.gridText}>
                   <Typography align='center' className={classes.text} variant='h4'>