Reorganize oki links

pages/index.js

@@ -8,6 +8,7 @@ import Grid from '@mui/material/Grid'
 import Button from '@mui/material/Button'
 import ArrowCircleDownIcon from '@mui/icons-material/ArrowCircleDown'
 import OpenInNewIcon from '@mui/icons-material/OpenInNew'
+import FormHelperText from '@mui/material/FormHelperText'
 
 import HeadLayout from '../components/head-layout'
 import Footer from '../components/footer'
@@ -69,17 +70,21 @@ export default function Home({errorCode, errorMessage, stats}) {
               Paroles, traductions et Fédiverse
             </Typography>
           </Container>
-          <Container align='center'>
-            <Box sx={{marginBottom: 2}}>
-              <Button size='small' variant='outlined' endIcon={<OpenInNewIcon />} onClick={() => window.open('https://asso.oki.re/public/members/new.php', '_blank')}>
-                <strong>Adhésion ➡️ asso.oki.re</strong>
+          <Container>
+            <Grid container justifyContent='center' spacing={2}>
+              <Grid item>
+                <Button variant='outlined' endIcon={<OpenInNewIcon />} onClick={() => window.open('https://asso.oki.re/public/members/new.php', '_blank')}>
+                  <strong>Adhésion</strong>
                 </Button>
-            </Box>
-            <Box>
-              <Button size='small' variant='outlined' endIcon={<OpenInNewIcon />} onClick={() => window.open('https://o-k-i.net', '_blank')}>
-                <strong>Fédiverse ➡️ o-k-i.net</strong>
+                <FormHelperText sx={{textAlign: 'center', fontStyle: 'italic'}}>asso.oki.re</FormHelperText>
+              </Grid>
+              <Grid item>
+                <Button variant='outlined' endIcon={<OpenInNewIcon />} onClick={() => window.open('https://o-k-i.net', '_blank')}>
+                  <strong>Fédiverse</strong>
                 </Button>
-            </Box>
+                <FormHelperText sx={{textAlign: 'center', fontStyle: 'italic'}}>o-k-i.net</FormHelperText>
+              </Grid>
+            </Grid>
           </Container>
         </Box>
         <Container sx={{flexGrow: 100}}>