diff --git a/resources/js/src/components/DateTimeInput.js b/resources/js/src/components/DateTimeInput.js
index c833163cda73d2a757245aae13f8bccc20b00fde..9c54f07542c7f2a7d60eaa3cdd01720fdf87d190 100644
--- a/resources/js/src/components/DateTimeInput.js
+++ b/resources/js/src/components/DateTimeInput.js
@@ -54,7 +54,6 @@ const Picker = ({ PickerComponent, ...fieldProps }) => {
         providerOptions,
         disabled,
     } = fieldProps;
-    console.log(fieldProps);
 
     const { input, meta } = useInput({ source });
 
diff --git a/resources/js/src/layout/Menu.js b/resources/js/src/layout/Menu.js
index 619279afb6144a43c6715e183661b60ced210ea9..882288fee71e35f487b37d39573ca2795f811794 100644
--- a/resources/js/src/layout/Menu.js
+++ b/resources/js/src/layout/Menu.js
@@ -131,7 +131,7 @@ const Menu = ({ onMenuClick, logout }) => {
             <Accordeon open={false} title={translate('menu.left.archives')} permissions={["archived_members.show"]}>
                 <Item to="/archived_members" permissions="archived_members.show" primaryText={translate('menu.left.archived_members')} leftIcon={<GroupIcon />} />
             </Accordeon>
-            {isXSmall && <Item to="/profile" primaryText={translate('menu.left.logout')} leftIcon={<AccountCircleIcon />} />}
+            {isXSmall && <Item to="/profile" primaryText={translate('menu.left.profile')} leftIcon={<AccountCircleIcon />} />}
             {isXSmall && logout}
         </>
     );
diff --git a/resources/js/src/providers/I18nProvider.js b/resources/js/src/providers/I18nProvider.js
index 45a0df6bcfec4d186bf38913eb156b1fa8a6e58c..c26501a817091386c765cc1850b978c9208584e9 100644
--- a/resources/js/src/providers/I18nProvider.js
+++ b/resources/js/src/providers/I18nProvider.js
@@ -222,7 +222,7 @@ const messages = {
                     user_id: 'Créateur',
                     created_at: 'Créé le',
                     updated_at: 'Modifié le',
-                    product_id: '#',
+                    product_id: 'Produit',
                     'product.name': 'Nom',
                     count: 'Différence',
                     products: 'Produits',
@@ -331,10 +331,8 @@ const messages = {
                     movement_id: 'Mouvement',
                     transaction_id: 'Transaction',
                     'movement.products': 'Produits',
-                    product_id: '#',
-                    'product_id.name': 'Nom',
-                    'product.name': 'Nom',
-                    count: 'Nombre'
+                    product_id: 'Produit',
+                    count: 'Différence'
                 }
             },
             purchases: {
@@ -350,9 +348,8 @@ const messages = {
                     transaction_id: 'Transaction',
                     'movement_id.products': 'Produits',
                     'movement.products': 'Produits',
-                    product_id: '#',
-                    'product.name': 'Nom',
-                    count: 'Nombre',
+                    product_id: 'Produit',
+                    count: 'Différence',
                     account_id: 'Compte',
                     category_id: 'Catégorie',
                     amount: 'Montant',
diff --git a/resources/js/src/resources/Accounts.js b/resources/js/src/resources/Accounts.js
index fee40fcb940d1ff979cf96de4f39512e28587ddf..dda930257cb8d824660e24e53ead914d6919fc55 100644
--- a/resources/js/src/resources/Accounts.js
+++ b/resources/js/src/resources/Accounts.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { CreateButton, Datagrid, EditButton, ExportButton, FilterButton, List, SimpleForm, SimpleShowLayout, TextField, TextInput, TopToolbar } from 'react-admin';
+import { CreateButton, Datagrid, EditButton, ExportButton, FilterButton, List, SimpleForm, SimpleList, SimpleShowLayout, TextField, TextInput, TopToolbar } from 'react-admin';
 import DateField from '../components/DateField';
 import DateInput from '../components/DateInput';
 import { CreateDialog, EditDialog, ShowDialog } from '../components/DialogForm';
@@ -22,49 +23,60 @@ const AccountsListActions = ({ basePath, ...props }) => (
     </TopToolbar>
 );
 
-const Accounts = (props) => (
-    <>
-        <List {...props} filters={AccountsFilters} actions={<AccountsListActions />}>
-            <Datagrid>
-                <TextField source="id" />
-                <TextField source="name" />
-                <TextField source="iban" />
-                <TextField source="bic" />
-                <MoneyField noLabel={true} source="balance" />
-                <EditButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput source="name" />
-                <TextInput source="iban" />
-                <TextInput source="bic" />
-            </SimpleForm>
-        </CreateDialog>
-        <EditDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput disabled source="id" />
-                <TextInput source="name" />
-                <TextInput source="iban" />
-                <TextInput source="bic" />
-                <MoneyInput disabled source="balance" />
-                <DateInput disabled source="created_at" />
-                <DateInput disabled source="updated_at" />
-            </SimpleForm>
-        </EditDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <TextField source="name" />
-                <TextField source="iban" />
-                <TextField source="bic" />
-                <MoneyField source="balance" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+const Accounts = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={AccountsFilters} actions={<AccountsListActions />}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <TextField source="name" />
+                        <TextField source="iban" />
+                        <TextField source="bic" />
+                        <MoneyField noLabel={true} source="balance" />
+                        <EditButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => record.name}
+                        secondaryText={record => Number(record.balance).toLocaleString('fr-FR', { currency: "EUR", currencyDisplay: 'symbol', style: 'currency' })}
+                        tertiaryText={record => "#" + record.id}
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput source="name" />
+                    <TextInput source="iban" />
+                    <TextInput source="bic" />
+                </SimpleForm>
+            </CreateDialog>
+            <EditDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput disabled source="id" />
+                    <TextInput source="name" />
+                    <TextInput source="iban" />
+                    <TextInput source="bic" />
+                    <MoneyInput disabled source="balance" />
+                    <DateInput disabled source="created_at" />
+                    <DateInput disabled source="updated_at" />
+                </SimpleForm>
+            </EditDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <TextField source="name" />
+                    <TextField source="iban" />
+                    <TextField source="bic" />
+                    <MoneyField source="balance" />
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: Accounts,
diff --git a/resources/js/src/resources/AccountsCounts.js b/resources/js/src/resources/AccountsCounts.js
index a2577d514a4b9317245287e5aedecd03cec3f9d3..a78181a8340172d9a8bcc7ee5d34c0c8afa77283 100644
--- a/resources/js/src/resources/AccountsCounts.js
+++ b/resources/js/src/resources/AccountsCounts.js
@@ -1,6 +1,6 @@
-import { Table, TableBody, TableCell, TableRow } from '@material-ui/core';
+import { Table, TableBody, TableCell, TableRow, useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { Datagrid, Labeled, List, ReferenceField, ShowButton, SimpleShowLayout, TextField, useRecordContext, useTranslate } from 'react-admin';
+import { Datagrid, Labeled, List, ReferenceField, ShowButton, SimpleList, SimpleShowLayout, TextField, useRecordContext, useTranslate } from 'react-admin';
 import DateField from '../components/DateField';
 import { ShowDialog } from '../components/DialogForm';
 import MoneyField from "../components/MoneyField";
@@ -46,54 +46,72 @@ const CountField = (props) => {
     </>);
 };
 
-const AccountsCounts = (props) => (
-    <>
-        <List {...props} bulkActionButtons={false}>
-            <Datagrid>
-                <TextField source="id" />
-                <TextField source="type" />
-                <MoneyField noLabel={true} source="balance" />
-                <ReferenceField source="transaction_id" reference="transactions" link="show">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField label="Compte" source="transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="account_id" reference="accounts" link="show">
+const AccountsCounts = (props) => {
+
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} bulkActionButtons={false}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <TextField source="type" />
+                        <MoneyField noLabel={true} source="balance" />
+                        <ReferenceField source="transaction_id" reference="transactions" link="show">
+                            <TextField source="name" />
+                        </ReferenceField>
+                        <ReferenceField label="Compte" source="transaction_id" reference="transactions" link={false}>
+                            <ReferenceField source="account_id" reference="accounts" link="show">
+                                <TextField source="name" />
+                            </ReferenceField>
+                        </ReferenceField>
+                        <ReferenceField label="Créateur" source="transaction_id" reference="transactions" link={false}>
+                            <ReferenceField source="user_id" reference="users" link="show">
+                                <TextField source="username" />
+                            </ReferenceField>
+                        </ReferenceField>
+                        <DateField source="created_at" />
+                        <ShowButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record =>
+                            <ReferenceField record={record} label="Compte" source="transaction_id" reference="transactions" link={false}>
+                                <ReferenceField source="account_id" reference="accounts" link={false}>
+                                    <TextField source="name" />
+                                </ReferenceField>
+                            </ReferenceField>}
+                        tertiaryText={record => Number(record.balance).toLocaleString('fr-FR', { currency: "EUR", currencyDisplay: 'symbol', style: 'currency' })}
+                        secondaryText={record => new Date(record.created_at).toLocaleString()}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <TextField source="type" />
+                    <CountField source="data" />
+                    <ReferenceField source="transaction_id" reference="transactions" link="show">
                         <TextField source="name" />
                     </ReferenceField>
-                </ReferenceField>
-                <ReferenceField label="Créateur" source="transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="user_id" reference="users" link="show">
-                        <TextField source="username" />
-                    </ReferenceField>
-                </ReferenceField>
-                <DateField source="created_at" />
-                <ShowButton />
-            </Datagrid>
-        </List>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <TextField source="type" />
-                <CountField source="data" />
-                <ReferenceField source="transaction_id" reference="transactions" link="show">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField label="Compte" source="transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="account_id" reference="accounts" link="show">
-                        <TextField source="name" />
+                    <ReferenceField label="Compte" source="transaction_id" reference="transactions" link="show">
+                        <ReferenceField source="account_id" reference="accounts" link="show">
+                            <TextField source="name" />
+                        </ReferenceField>
                     </ReferenceField>
-                </ReferenceField>
-                <ReferenceField label="Créateur" source="transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="user_id" reference="users" link="show">
-                        <TextField source="username" />
+                    <ReferenceField label="Créateur" source="transaction_id" reference="transactions" link="show">
+                        <ReferenceField source="user_id" reference="users" link="show">
+                            <TextField source="username" />
+                        </ReferenceField>
                     </ReferenceField>
-                </ReferenceField>
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: AccountsCounts,
diff --git a/resources/js/src/resources/ArchivedMembers.js b/resources/js/src/resources/ArchivedMembers.js
index d294af5b79bf9ec5ae9112b7aa8126669ed0b75c..6237962e43599664b2a32e4717b85e952db159d0 100644
--- a/resources/js/src/resources/ArchivedMembers.js
+++ b/resources/js/src/resources/ArchivedMembers.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { AutocompleteInput, BooleanField, BooleanInput, Datagrid, ExportButton, FilterButton, FunctionField, List, ReferenceField, ReferenceInput, ShowButton, SimpleShowLayout, TextField, TopToolbar } from 'react-admin';
+import { AutocompleteInput, BooleanField, BooleanInput, Datagrid, ExportButton, FilterButton, FunctionField, List, ReferenceField, ReferenceInput, ShowButton, SimpleList, SimpleShowLayout, TextField, TopToolbar } from 'react-admin';
 import DateField from '../components/DateField';
 import { ShowDialog } from '../components/DialogForm';
 
@@ -17,39 +18,54 @@ const ArchivedMembersListActions = ({ basePath, ...props }) => (
     </TopToolbar>
 );
 
-const ArchivedMembers = (props) => (
-    <>
-        <List {...props} filters={ArchivedMembersFilters} bulkActionButtons={false} actions={<ArchivedMembersListActions />}>
-            <Datagrid>
-                <TextField source="id" />
-                <ReferenceField source="person_id" reference="people" link="show" >
-                    <FunctionField render={r => r.firstname + " " + r.lastname} />
-                </ReferenceField>
-                <BooleanField source="paid" />
-                <ReferenceField source="transaction_id" reference="transactions" link="show" >
-                    <FunctionField render={r => "#" + r.id} />
-                </ReferenceField>
-                <TextField source="school_year" />
-                <ShowButton />
-            </Datagrid>
-        </List>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <ReferenceField source="person_id" reference="people" link="show" >
-                    <FunctionField render={r => r.firstname + " " + r.lastname} />
-                </ReferenceField>
-                <BooleanField source="paid" />
-                <ReferenceField source="transaction_id" reference="transactions" link="show" >
-                    <FunctionField render={r => "#" + r.id} />
-                </ReferenceField>
-                <TextField source="school_year" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+const ArchivedMembers = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={ArchivedMembersFilters} bulkActionButtons={false} actions={<ArchivedMembersListActions />}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <ReferenceField source="person_id" reference="people" link="show" >
+                            <FunctionField render={r => r.firstname + " " + r.lastname} />
+                        </ReferenceField>
+                        <BooleanField source="paid" />
+                        <ReferenceField source="transaction_id" reference="transactions" link="show" >
+                            <FunctionField render={r => "#" + r.id} />
+                        </ReferenceField>
+                        <TextField source="school_year" />
+                        <ShowButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record =>
+                            <ReferenceField record={record} source="person_id" reference="people" link={false} >
+                                <FunctionField render={r => r.firstname + " " + r.lastname} />
+                            </ReferenceField>}
+                        tertiaryText={record => <BooleanField record={record} source="paid" />}
+                        secondaryText={record => record.school_year}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <ReferenceField source="person_id" reference="people" link="show" >
+                        <FunctionField render={r => r.firstname + " " + r.lastname} />
+                    </ReferenceField>
+                    <BooleanField source="paid" />
+                    <ReferenceField source="transaction_id" reference="transactions" link="show" >
+                        <FunctionField render={r => "#" + r.id} />
+                    </ReferenceField>
+                    <TextField source="school_year" />
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: ArchivedMembers,
diff --git a/resources/js/src/resources/AutomatedTransactions.js b/resources/js/src/resources/AutomatedTransactions.js
index fac1a21146ca136fcc4f3d201fd7d49c982e9e2a..664d4d968e177bb5a861aee657a3ff577232d083 100644
--- a/resources/js/src/resources/AutomatedTransactions.js
+++ b/resources/js/src/resources/AutomatedTransactions.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { AutocompleteInput, BooleanField, BooleanInput, Datagrid, DateInput, EditButton, List, NumberField, NumberInput, ReferenceField, ReferenceInput, SelectField, SelectInput, SimpleForm, SimpleShowLayout, TextField, TextInput, useTranslate } from 'react-admin';
+import { AutocompleteInput, BooleanField, BooleanInput, Datagrid, DateInput, EditButton, List, NumberField, NumberInput, ReferenceField, ReferenceInput, SelectField, SelectInput, SimpleForm, SimpleList, SimpleShowLayout, TextField, TextInput, useTranslate } from 'react-admin';
 import DateField from '../components/DateField';
 import { CreateDialog, EditDialog, ShowDialog } from '../components/DialogForm';
 import MoneyField from "../components/MoneyField";
@@ -21,9 +22,18 @@ const AutomatedTransactionsFilters = [
 const AutomatedTransactions = (props) => {
     const translate = useTranslate();
 
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+
+    const l = {
+        yearly: "année",
+        monthly: "mois",
+        weekly: "semaine"
+    }
+
     return (
         <>
             <List {...props} filters={AutomatedTransactionsFilters}>
+            {isDesktop ? (
                 <Datagrid>
                     <TextField source="id" />
                     <TextField source="name" />
@@ -48,6 +58,13 @@ const AutomatedTransactions = (props) => {
                     <DateField source="created_at" />
                     <EditButton />
                 </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => record.name}
+                        tertiaryText={record => Number(record.amount).toLocaleString('fr-FR', { currency: "EUR", currencyDisplay: 'symbol', style: 'currency' })}
+                        secondaryText={record => record.frequency === 'dayly' ? 'Tous les jours' : `Le ${record.day} de chaque ${l[record.frequency]}`}
+                    />
+                )}
             </List>
             <CreateDialog {...props}>
                 <SimpleForm redirect="list">
diff --git a/resources/js/src/resources/Members.js b/resources/js/src/resources/Members.js
index 2df2c28a2db3d5a74b1d82a6a28f0870aa048f50..ac1721cbf20de435676ff7488ec8feea10fbc127 100644
--- a/resources/js/src/resources/Members.js
+++ b/resources/js/src/resources/Members.js
@@ -1,7 +1,8 @@
+import { useMediaQuery } from '@material-ui/core';
 import AttachMoneyIcon from '@material-ui/icons/AttachMoney';
 import * as React from "react";
 import { Fragment } from 'react';
-import { AutocompleteInput, BooleanField, BooleanInput, BulkDeleteButton, BulkUpdateButton, CreateButton, Datagrid, EditButton, ExportButton, FilterButton, FunctionField, List, ReferenceField, ReferenceInput, SimpleForm, SimpleShowLayout, TextField, TextInput, TopToolbar, useTranslate } from 'react-admin';
+import { AutocompleteInput, BooleanField, BooleanInput, BulkDeleteButton, BulkUpdateButton, CreateButton, Datagrid, EditButton, ExportButton, FilterButton, FunctionField, List, ReferenceField, ReferenceInput, SimpleForm, SimpleList, SimpleShowLayout, TextField, TextInput, TopToolbar, useTranslate } from 'react-admin';
 import { ArchiveButton } from '../components/ArchiveButton';
 import DateField from '../components/DateField';
 import DateInput from '../components/DateInput';
@@ -33,53 +34,67 @@ const MembersBulkActionButtons = props => {
     );
 };
 
-const Members = (props) => (
-    <>
-        <List {...props} filters={MembersFilters} bulkActionButtons={<MembersBulkActionButtons />} actions={<MembersListActions />}>
-            <Datagrid>
-                <TextField source="id" />
-                <ReferenceField source="person_id" reference="people" link="show" >
-                    <FunctionField render={r => r.firstname + " " + r.lastname} />
-                </ReferenceField>
-                <BooleanField source="paid" />
-                <ReferenceField source="transaction_id" reference="transactions" link="show" >
-                    <FunctionField render={r => "#" + r.id} />
-                </ReferenceField>
-                <EditButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <ReferenceInput source="person_id" reference="people" filterToQuery={searchText => ({ fullname: searchText, is_member: false })}>
-                    <AutocompleteInput optionText="fullname" />
-                </ReferenceInput>
-                <BooleanInput source="paid" />
-            </SimpleForm>
-        </CreateDialog>
-        <EditDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput disabled source="id" />
-                <ReferenceField source="person_id" reference="people" >
-                    <FunctionField render={r => r.firstname + " " + r.lastname} />
-                </ReferenceField>
-                <BooleanInput source="paid" />
-                <DateInput disabled source="created_at" />
-                <DateInput disabled source="updated_at" />
-            </SimpleForm>
-        </EditDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <ReferenceField source="person_id" reference="people" link="show" >
-                    <FunctionField render={r => r.firstname + " " + r.lastname} />
-                </ReferenceField>
-                <BooleanField source="paid" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+const Members = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={MembersFilters} bulkActionButtons={<MembersBulkActionButtons />} actions={<MembersListActions />}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <ReferenceField source="person_id" reference="people" link="show" >
+                            <FunctionField render={r => r.firstname + " " + r.lastname} />
+                        </ReferenceField>
+                        <BooleanField source="paid" />
+                        <ReferenceField source="transaction_id" reference="transactions" link="show" >
+                            <FunctionField render={r => "#" + r.id} />
+                        </ReferenceField>
+                        <EditButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record =>
+                            <ReferenceField record={record} source="person_id" reference="people" link={false} >
+                                <FunctionField render={r => r.firstname + " " + r.lastname} />
+                            </ReferenceField>}
+                        tertiaryText={record => <BooleanField record={record} source="paid" />}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <ReferenceInput source="person_id" reference="people" filterToQuery={searchText => ({ fullname: searchText, is_member: false })}>
+                        <AutocompleteInput optionText="fullname" />
+                    </ReferenceInput>
+                    <BooleanInput source="paid" />
+                </SimpleForm>
+            </CreateDialog>
+            <EditDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput disabled source="id" />
+                    <ReferenceField source="person_id" reference="people" >
+                        <FunctionField render={r => r.firstname + " " + r.lastname} />
+                    </ReferenceField>
+                    <BooleanInput source="paid" />
+                    <DateInput disabled source="created_at" />
+                    <DateInput disabled source="updated_at" />
+                </SimpleForm>
+            </EditDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <ReferenceField source="person_id" reference="people" link="show" >
+                        <FunctionField render={r => r.firstname + " " + r.lastname} />
+                    </ReferenceField>
+                    <BooleanField source="paid" />
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: Members,
diff --git a/resources/js/src/resources/Movements.js b/resources/js/src/resources/Movements.js
index 55afd1b69b14da95b5734d225a48d35fee691733..64a6d662e5d29b03f3167972182b5055d2da4e19 100644
--- a/resources/js/src/resources/Movements.js
+++ b/resources/js/src/resources/Movements.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import React from "react";
-import { ArrayField, ArrayInput, AutocompleteInput, BooleanField, BooleanInput, Datagrid, List, NumberInput, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleFormIterator, SimpleShowLayout, TextField, TextInput } from 'react-admin';
+import { ArrayField, ArrayInput, AutocompleteInput, BooleanField, BooleanInput, Datagrid, List, NumberInput, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleFormIterator, SimpleList, SimpleShowLayout, TextField, TextInput } from 'react-admin';
 import DateField from '../components/DateField';
 import { CreateDialog, ShowDialog } from '../components/DialogForm';
 
@@ -7,54 +8,67 @@ const MovementsFilters = [
     <TextInput source="name" />
 ];
 
-const Movements = (props) => (
-    <>
-        <List {...props} filters={MovementsFilters} bulkActionButtons={false} >
-            <Datagrid>
-                <TextField source="id" />
-                <TextField source="name" />
-                <BooleanField source="rectification" />
-                <ReferenceField source="user_id" reference="users">
-                    <TextField source="username" />
-                </ReferenceField>
-                <DateField source="created_at" />
-                <ShowButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput source="name" />
-                <BooleanInput source="rectification" />
-                <ArrayInput source="products">
-                    <SimpleFormIterator>
-                        <ReferenceInput source="id" reference="products" filterToQuery={searchText => ({ name: searchText })}>
-                            <AutocompleteInput optionText="name" />
-                        </ReferenceInput>
-                        <NumberInput source="diff" />
-                    </SimpleFormIterator>
-                </ArrayInput>
-            </SimpleForm>
-        </CreateDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <TextField source="name" />
-                <ArrayField source="products">
+const Movements = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={MovementsFilters} bulkActionButtons={false} >
+                {isDesktop ? (
                     <Datagrid>
-                        <TextField source="product_id" />
-                        <TextField source="product.name" />
-                        <TextField source="count" />
+                        <TextField source="id" />
+                        <TextField source="name" />
+                        <BooleanField source="rectification" />
+                        <ReferenceField source="user_id" reference="users">
+                            <TextField source="username" />
+                        </ReferenceField>
+                        <DateField source="created_at" />
+                        <ShowButton />
                     </Datagrid>
-                </ArrayField>
-                <BooleanField source="rectification" />
-                <ReferenceField source="user_id" reference="users">
-                    <TextField source="username" />
-                </ReferenceField>
-                <DateField source="created_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+                ) : (
+                    <SimpleList
+                        primaryText={record => record.name}
+                        tertiaryText={record => "#" + record.id}
+                        secondaryText={record => new Date(record.created_at).toLocaleString()}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput source="name" />
+                    <BooleanInput source="rectification" />
+                    <ArrayInput source="products">
+                        <SimpleFormIterator>
+                            <ReferenceInput source="id" reference="products" filterToQuery={searchText => ({ name: searchText })}>
+                                <AutocompleteInput optionText="name" />
+                            </ReferenceInput>
+                            <NumberInput source="diff" />
+                        </SimpleFormIterator>
+                    </ArrayInput>
+                </SimpleForm>
+            </CreateDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <TextField source="name" />
+                    <ArrayField source="products" >
+                        <Datagrid>
+                            <ReferenceField source="product_id" reference="products" link="edit">
+                                <TextField source="name" />
+                            </ReferenceField>
+                            <TextField source="count" />
+                        </Datagrid>
+                    </ArrayField>
+                    <BooleanField source="rectification" />
+                    <ReferenceField source="user_id" reference="users">
+                        <TextField source="username" />
+                    </ReferenceField>
+                    <DateField source="created_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: Movements,
diff --git a/resources/js/src/resources/People.js b/resources/js/src/resources/People.js
index 81501d7009f2c236a58e2fc3b5570dd2e443ff39..d7a24bc039672cd7ee89c94b190522a634444496 100644
--- a/resources/js/src/resources/People.js
+++ b/resources/js/src/resources/People.js
@@ -1,6 +1,7 @@
+import { useMediaQuery } from '@material-ui/core';
 import GetAppIcon from '@material-ui/icons/GetApp';
 import * as React from "react";
-import { Button, Datagrid, EditButton, List, SimpleForm, SimpleShowLayout, TextField, TextInput, useDataProvider, useNotify } from 'react-admin';
+import { Button, Datagrid, EditButton, List, SimpleForm, SimpleList, SimpleShowLayout, TextField, TextInput, useDataProvider, useNotify } from 'react-admin';
 import DateField from '../components/DateField';
 import DateInput from '../components/DateInput';
 import { CreateDialog, EditDialog, ShowDialog } from '../components/DialogForm';
@@ -31,12 +32,9 @@ const PeopleExportButton = ({ record, ...rest }) => {
     const notify = useNotify();
 
     const onClick = () => {
-        console.log(record.id);
         dataProvider.export('people', { id: record.id }).then((response) => {
             download(JSON.stringify(response), "export.json", "application/json");
-
             notify('ra.notification.exported');
-            console.log(response);
         });
     }
 
@@ -48,47 +46,54 @@ const PeopleExportButton = ({ record, ...rest }) => {
     )
 };
 
-const People = (props) => (
-    <>
-        <List {...props} filters={PeopleFilters}>
-            <Datagrid>
-                <TextField source="id" />
-                <TextField source="firstname" />
-                <TextField source="lastname" />
-                <TextField source="discord_id" />
-                <EditButton />
-                <PeopleExportButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput source="firstname" />
-                <TextInput source="lastname" />
-                <TextInput source="discord_id" />
-            </SimpleForm>
-        </CreateDialog>
-        <EditDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput disabled source="id" />
-                <TextInput source="firstname" />
-                <TextInput source="lastname" />
-                <TextInput source="discord_id" />
-                <DateInput disabled source="created_at" />
-                <DateInput disabled source="updated_at" />
-            </SimpleForm>
-        </EditDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <TextField source="firstname" />
-                <TextField source="lastname" />
-                <TextField source="discord_id" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+const People = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={PeopleFilters}>
+                {isDesktop ? (<Datagrid>
+                    <TextField source="id" />
+                    <TextField source="firstname" />
+                    <TextField source="lastname" />
+                    <TextField source="discord_id" />
+                    <EditButton />
+                    <PeopleExportButton />
+                </Datagrid>) : (<SimpleList 
+                    primaryText={record => record.firstname + " " + record.lastname}
+                    secondaryText={record => record.discord_id}
+                    tertiaryText={record => "#" + record.id}
+                />)}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput source="firstname" />
+                    <TextInput source="lastname" />
+                    <TextInput source="discord_id" />
+                </SimpleForm>
+            </CreateDialog>
+            <EditDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput disabled source="id" />
+                    <TextInput source="firstname" />
+                    <TextInput source="lastname" />
+                    <TextInput source="discord_id" />
+                    <DateInput disabled source="created_at" />
+                    <DateInput disabled source="updated_at" />
+                </SimpleForm>
+            </EditDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <TextField source="firstname" />
+                    <TextField source="lastname" />
+                    <TextField source="discord_id" />
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: People,
diff --git a/resources/js/src/resources/PersonalAccounts.js b/resources/js/src/resources/PersonalAccounts.js
index a55ebfaeb8479f4913f99c210f6551f0d1ff575c..d326104340e93e12b13ba0217dc72c4615ce02fe 100644
--- a/resources/js/src/resources/PersonalAccounts.js
+++ b/resources/js/src/resources/PersonalAccounts.js
@@ -1,6 +1,7 @@
+import { useMediaQuery } from '@material-ui/core';
 import AttachMoneyIcon from '@material-ui/icons/AttachMoney';
 import * as React from "react";
-import { AutocompleteInput, Button, CreateButton, Datagrid, ExportButton, FilterButton, FunctionField, List, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleShowLayout, TextField, TopToolbar, useRedirect } from 'react-admin';
+import { AutocompleteInput, Button, CreateButton, Datagrid, ExportButton, FilterButton, FunctionField, List, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleList, SimpleShowLayout, TextField, TopToolbar, useRedirect } from 'react-admin';
 import DateField from '../components/DateField';
 import { CreateDialog, ShowDialog } from '../components/DialogForm';
 import MoneyField from "../components/MoneyField";
@@ -30,39 +31,53 @@ const PersonalAccountsListActions = ({ basePath, ...props }) => {
     );
 }
 
-const PersonalAccounts = (props) => (
-    <>
-        <List {...props} filters={PersonalAccountsFilters} actions={<PersonalAccountsListActions />}>
-            <Datagrid>
-                <TextField source="id" />
-                <ReferenceField source="person_id" reference="people" link="show" >
-                    <FunctionField render={r => r.firstname + " " + r.lastname} />
-                </ReferenceField>
-                <MoneyField noLabel={true} source="balance" />
-                <ShowButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <ReferenceInput source="person_id" reference="people" filterToQuery={searchText => ({ fullname: searchText, has_account: false })}>
-                    <AutocompleteInput optionText="fullname" />
-                </ReferenceInput>
-                <QRInput source="token" label="Scan Carte Étudiant" regexp="(?:https?:\/\/esc\.gg\/|core:\/\/)([a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{12}).*" />
-            </SimpleForm>
-        </CreateDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <ReferenceField source="person_id" reference="people" link="show" >
-                    <FunctionField render={r => r.firstname + " " + r.lastname} />
-                </ReferenceField>
-                <MoneyField noLabel={false} source="balance" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+const PersonalAccounts = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={PersonalAccountsFilters} actions={<PersonalAccountsListActions />}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <ReferenceField source="person_id" reference="people" link="show" >
+                            <FunctionField render={r => r.firstname + " " + r.lastname} />
+                        </ReferenceField>
+                        <MoneyField noLabel={true} source="balance" />
+                        <ShowButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record =>
+                            <ReferenceField record={record} source="person_id" reference="people" link={false} >
+                                <FunctionField render={r => r.firstname + " " + r.lastname} />
+                            </ReferenceField>}
+                        tertiaryText={record => Number(record.balance).toLocaleString('fr-FR', { currency: "EUR", currencyDisplay: 'symbol', style: 'currency' })}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <ReferenceInput source="person_id" reference="people" filterToQuery={searchText => ({ fullname: searchText, has_account: false })}>
+                        <AutocompleteInput optionText="fullname" />
+                    </ReferenceInput>
+                    <QRInput source="token" label="Scan Carte Étudiant" regexp="(?:https?:\/\/esc\.gg\/|core:\/\/)([a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{4}-[a-f0-9]{12}).*" />
+                </SimpleForm>
+            </CreateDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <ReferenceField source="person_id" reference="people" link="show" >
+                        <FunctionField render={r => r.firstname + " " + r.lastname} />
+                    </ReferenceField>
+                    <MoneyField noLabel={false} source="balance" />
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: PersonalAccounts,
diff --git a/resources/js/src/resources/PersonalTransactions.js b/resources/js/src/resources/PersonalTransactions.js
index b054a5d9cb1671c9ec240d17fbba33a56333b1d7..e849fb46637b8fc7a46fe18c48e60a405d58e9df 100644
--- a/resources/js/src/resources/PersonalTransactions.js
+++ b/resources/js/src/resources/PersonalTransactions.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { AutocompleteInput, Datagrid, List, ReferenceField, ReferenceInput, ShowButton, SimpleShowLayout, TextField } from 'react-admin';
+import { AutocompleteInput, Datagrid, List, ReferenceField, ReferenceInput, ShowButton, SimpleList, SimpleShowLayout, TextField } from 'react-admin';
 import DateField from '../components/DateField';
 import { ShowDialog } from '../components/DialogForm';
 import MoneyField from "../components/MoneyField";
@@ -15,48 +16,68 @@ const PersonalTransactionsFilters = [
     </ReferenceInput>
 ];
 
-const PersonalTransactions = (props) => (
-    <>
-        <List {...props} filters={PersonalTransactionsFilters} bulkActionButtons={false}>
-            <Datagrid>
-                <TextField source="id" />
-                <MoneyField noLabel={true} source="amount" />
-                <ReferenceField source="transaction_id" reference="transactions" link="show">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField source="personal_account_id" reference="personal_accounts">
-                    <ReferenceField source="person_id" reference="people" link="show">
-                        <TextField source="fullname" />
+const PersonalTransactions = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={PersonalTransactionsFilters} bulkActionButtons={false}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <MoneyField noLabel={true} source="amount" />
+                        <ReferenceField source="transaction_id" reference="transactions" link="show">
+                            <TextField source="name" />
+                        </ReferenceField>
+                        <ReferenceField source="personal_account_id" reference="personal_accounts" link={false}>
+                            <ReferenceField source="person_id" reference="people" link="show">
+                                <TextField source="fullname" />
+                            </ReferenceField>
+                        </ReferenceField>
+                        <ReferenceField source="user_id" reference="users">
+                            <TextField source="username" />
+                        </ReferenceField>
+                        <DateField source="created_at" />
+                        <ShowButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record =>
+                            <ReferenceField record={record} source="transaction_id" reference="transactions" link={false} >
+                                <TextField source="name" />
+                            </ReferenceField>}
+                        secondaryText={record =>
+                            <ReferenceField record={record} source="personal_account_id" reference="personal_accounts">
+                                <ReferenceField source="person_id" reference="people" link={false}>
+                                    <TextField source="fullname" />
+                                </ReferenceField>
+                            </ReferenceField>}
+                        tertiaryText={record => Number(record.amount).toLocaleString('fr-FR', { currency: "EUR", currencyDisplay: 'symbol', style: 'currency' })}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <MoneyField source="amount" />
+                    <ReferenceField source="personal_account_id" reference="personal_accounts">
+                        <ReferenceField source="person_id" reference="people" link="show">
+                            <TextField source="fullname" />
+                        </ReferenceField>
                     </ReferenceField>
-                </ReferenceField>
-                <ReferenceField source="user_id" reference="users">
-                    <TextField source="username" />
-                </ReferenceField>
-                <DateField source="created_at" />
-                <ShowButton />
-            </Datagrid>
-        </List>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <MoneyField source="amount" />
-                <ReferenceField source="personal_account_id" reference="personal_accounts">
-                    <ReferenceField source="person_id" reference="people" link="show">
-                        <TextField source="fullname" />
+                    <ReferenceField source="transaction_id" reference="transactions" link="show">
+                        <TextField source="name" />
                     </ReferenceField>
-                </ReferenceField>
-                <ReferenceField source="transaction_id" reference="transactions" link="show">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField source="user_id" reference="users" link="show">
-                    <TextField source="username" />
-                </ReferenceField>
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+                    <ReferenceField source="user_id" reference="users" link="show">
+                        <TextField source="username" />
+                    </ReferenceField>
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: PersonalTransactions,
diff --git a/resources/js/src/resources/Products.js b/resources/js/src/resources/Products.js
index 03ab1436fdf4aa1e0f2b28278d177049e7db1715..e7a8bce36d57c4542ffd36ec42a4b552b0221a36 100644
--- a/resources/js/src/resources/Products.js
+++ b/resources/js/src/resources/Products.js
@@ -1,7 +1,8 @@
+import { useMediaQuery } from '@material-ui/core';
 import RemoveShoppingCartIcon from '@material-ui/icons/RemoveShoppingCart';
 import ShoppingCartIcon from '@material-ui/icons/ShoppingCart';
 import * as React from "react";
-import { AutocompleteInput, BooleanField, BooleanInput, BulkDeleteButton, BulkUpdateButton, CreateButton, Datagrid, EditButton, ExportButton, FilterButton, List, NullableBooleanInput, NumberField, NumberInput, ReferenceField, ReferenceInput, SimpleForm, SimpleShowLayout, TextField, TextInput, TopToolbar, useTranslate } from 'react-admin';
+import { AutocompleteInput, BooleanField, BooleanInput, BulkDeleteButton, BulkUpdateButton, CreateButton, Datagrid, EditButton, ExportButton, FilterButton, List, NullableBooleanInput, NumberField, NumberInput, ReferenceField, ReferenceInput, SimpleForm, SimpleList, SimpleShowLayout, TextField, TextInput, TopToolbar, useTranslate } from 'react-admin';
 import DateField from '../components/DateField';
 import DateInput from '../components/DateInput';
 import { CreateDialog, EditDialog, ShowDialog } from '../components/DialogForm';
@@ -38,67 +39,82 @@ const ProductsBulkActionButtons = props => {
     );
 };
 
-const Products = (props) => (
-    <>
-        <List {...props} filters={ProductsFilters} bulkActionButtons={<ProductsBulkActionButtons />} actions={<ProductsListActions />}>
-            <Datagrid>
-                <TextField source="id" />
-                <TextField source="name" />
-                <ReferenceField source="category_id" reference="products_categories" >
-                    <TextField source="name" />
-                </ReferenceField>
-                <MoneyField noLabel={true} source="price" />
-                <NumberField source="count" />
-                <NumberField source="alert_level" />
-                <BooleanField source="salable" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-                <EditButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput source="name" />
-                <ReferenceInput source="category_id" reference="products_categories" filterToQuery={searchText => ({ name: searchText })}>
-                    <AutocompleteInput optionText="name" />
-                </ReferenceInput>
-                <MoneyInput source="price" />
-                <NumberInput source="alert_level" />
-                <BooleanInput source="salable" defaultValue={true} />
-            </SimpleForm>
-        </CreateDialog>
-        <EditDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput disabled source="id" />
-                <TextInput source="name" />
-                <ReferenceInput source="category_id" reference="products_categories" filterToQuery={searchText => ({ name: searchText })}>
-                    <AutocompleteInput optionText="name" />
-                </ReferenceInput>
-                <MoneyInput source="price" />
-                <NumberInput disabled source="count" />
-                <NumberInput source="alert_level" />
-                <BooleanInput source="salable" />
-                <DateInput disabled source="created_at" />
-                <DateInput disabled source="updated_at" />
-            </SimpleForm>
-        </EditDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <TextField source="name" />
-                <ReferenceField source="category_id" reference="products_categories" >
+const Products = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={ProductsFilters} bulkActionButtons={<ProductsBulkActionButtons />} actions={<ProductsListActions />}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <TextField source="name" />
+                        <ReferenceField source="category_id" reference="products_categories" >
+                            <TextField source="name" />
+                        </ReferenceField>
+                        <MoneyField noLabel={true} source="price" />
+                        <NumberField source="count" />
+                        <NumberField source="alert_level" />
+                        <BooleanField source="salable" />
+                        <DateField source="created_at" />
+                        <DateField source="updated_at" />
+                        <EditButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => record.name}
+                        secondaryText={record =>
+                            <ReferenceField record={record} source="category_id" reference="products_categories" link={false}>
+                                <TextField source="name" />
+                            </ReferenceField>}
+                        tertiaryText={record => record.count}
+                        linkType="edit"
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput source="name" />
+                    <ReferenceInput source="category_id" reference="products_categories" filterToQuery={searchText => ({ name: searchText })}>
+                        <AutocompleteInput optionText="name" />
+                    </ReferenceInput>
+                    <MoneyInput source="price" />
+                    <NumberInput source="alert_level" />
+                    <BooleanInput source="salable" defaultValue={true} />
+                </SimpleForm>
+            </CreateDialog>
+            <EditDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput disabled source="id" />
+                    <TextInput source="name" />
+                    <ReferenceInput source="category_id" reference="products_categories" filterToQuery={searchText => ({ name: searchText })}>
+                        <AutocompleteInput optionText="name" />
+                    </ReferenceInput>
+                    <MoneyInput source="price" />
+                    <NumberInput disabled source="count" />
+                    <NumberInput source="alert_level" />
+                    <BooleanInput source="salable" />
+                    <DateInput disabled source="created_at" />
+                    <DateInput disabled source="updated_at" />
+                </SimpleForm>
+            </EditDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
                     <TextField source="name" />
-                </ReferenceField>
-                <MoneyField source="price" />
-                <NumberField source="count" />
-                <NumberField source="alert_level" />
-                <BooleanField source="salable" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+                    <ReferenceField source="category_id" reference="products_categories" >
+                        <TextField source="name" />
+                    </ReferenceField>
+                    <MoneyField source="price" />
+                    <NumberField source="count" />
+                    <NumberField source="alert_level" />
+                    <BooleanField source="salable" />
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: Products,
diff --git a/resources/js/src/resources/ProductsCategories.js b/resources/js/src/resources/ProductsCategories.js
index ec73522a97a1a6c1ec42b80fe2b22fcd2b426e9f..5c93b4002e7c69036c6ccdd67b9503d6b07fd9dc 100644
--- a/resources/js/src/resources/ProductsCategories.js
+++ b/resources/js/src/resources/ProductsCategories.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { Datagrid, EditButton, List, SimpleForm, SimpleShowLayout, TextField, TextInput } from 'react-admin';
+import { Datagrid, EditButton, List, SimpleForm, SimpleList, SimpleShowLayout, TextField, TextInput } from 'react-admin';
 import DateField from '../components/DateField';
 import DateInput from '../components/DateInput';
 import { CreateDialog, EditDialog, ShowDialog } from '../components/DialogForm';
@@ -8,40 +9,51 @@ const ProductsCategoriesFilters = [
     <TextInput source="name" />
 ];
 
-const ProductsCategories = (props) => (
-    <>
-        <List {...props} filters={ProductsCategoriesFilters}>
-            <Datagrid>
-                <TextField source="id" />
-                <TextField source="name" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-                <EditButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput source="name" />
-            </SimpleForm>
-        </CreateDialog>
-        <EditDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput disabled source="id" />
-                <TextInput source="name" />
-                <DateInput disabled source="created_at" />
-                <DateInput disabled source="updated_at" />
-            </SimpleForm>
-        </EditDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <TextField source="name" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+const ProductsCategories = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={ProductsCategoriesFilters}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <TextField source="name" />
+                        <DateField source="created_at" />
+                        <DateField source="updated_at" />
+                        <EditButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => record.name}
+                        tertiaryText={record => "#" + record.id}
+                        linkType="edit"
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput source="name" />
+                </SimpleForm>
+            </CreateDialog>
+            <EditDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput disabled source="id" />
+                    <TextInput source="name" />
+                    <DateInput disabled source="created_at" />
+                    <DateInput disabled source="updated_at" />
+                </SimpleForm>
+            </EditDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <TextField source="name" />
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: ProductsCategories,
diff --git a/resources/js/src/resources/ProductsCounts.js b/resources/js/src/resources/ProductsCounts.js
index f9e445f2661b89875f38a0e063f90cfd69bca38e..5884d9cf4dd2a82742e7880531706a23a38a8f3d 100644
--- a/resources/js/src/resources/ProductsCounts.js
+++ b/resources/js/src/resources/ProductsCounts.js
@@ -1,51 +1,66 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { ArrayField, Create, Datagrid, List, ReferenceField, ShowButton, SimpleForm, SimpleShowLayout, TextField } from 'react-admin';
+import { ArrayField, Create, Datagrid, List, ReferenceField, ShowButton, SimpleForm, SimpleList, SimpleShowLayout, TextField } from 'react-admin';
 import DateField from '../components/DateField';
 import { ShowDialog } from '../components/DialogForm';
 import { MultiProductCountInput, MultiProductCountItem } from "../components/MultiProductCountInput";
 
-const ProductsCounts = (props) => (
-    <>
-        <List {...props} bulkActionButtons={false}>
-            <Datagrid>
-                <TextField source="id" />
-                <ReferenceField source="movement_id" reference="movements" link="show">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField label="Créateur" source="movement_id" reference="movements" link="show">
-                    <ReferenceField source="user_id" reference="users">
-                        <TextField source="username" />
-                    </ReferenceField>
-                </ReferenceField>
-                <DateField source="created_at" />
-                <ShowButton />
-            </Datagrid>
-        </List>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <ArrayField source="data">
+const ProductsCounts = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} bulkActionButtons={false}>
+                {isDesktop ? (
                     <Datagrid>
-                        <ReferenceField source="id" reference="products" link="show">
+                        <TextField source="id" />
+                        <ReferenceField source="movement_id" reference="movements" link="show">
                             <TextField source="name" />
                         </ReferenceField>
-                        <TextField source="count" />
+                        <ReferenceField label="Créateur" source="movement_id" reference="movements" link={false}>
+                            <ReferenceField source="user_id" reference="users" link="show">
+                                <TextField source="username" />
+                            </ReferenceField>
+                        </ReferenceField>
+                        <DateField source="created_at" />
+                        <ShowButton />
                     </Datagrid>
-                </ArrayField>
-                <ReferenceField source="movement_id" reference="movements" link="show">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField label="Créateur" source="movement_id" reference="movements" link="show">
-                    <ReferenceField source="user_id" reference="users">
-                        <TextField source="username" />
+                ) : (
+                    <SimpleList
+                        primaryText={record => <ReferenceField record={record} source="movement_id" reference="movements" link={false}>
+                            <TextField source="name" />
+                        </ReferenceField>}
+                        secondaryText={record => new Date(record.created_at).toLocaleString()}
+                        tertiaryText={record => "#" + record.id}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <ArrayField source="data">
+                        <Datagrid>
+                            <ReferenceField source="id" reference="products" link="show">
+                                <TextField source="name" />
+                            </ReferenceField>
+                            <TextField source="count" />
+                        </Datagrid>
+                    </ArrayField>
+                    <ReferenceField source="movement_id" reference="movements" link="show">
+                        <TextField source="name" />
                     </ReferenceField>
-                </ReferenceField>
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+                    <ReferenceField label="Créateur" source="movement_id" reference="movements" link="show">
+                        <ReferenceField source="user_id" reference="users">
+                            <TextField source="username" />
+                        </ReferenceField>
+                    </ReferenceField>
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 const CountProducts = (props) => {
     return <>
diff --git a/resources/js/src/resources/Purchases.js b/resources/js/src/resources/Purchases.js
index 62b7e6abbee790f828dcfc089e3ebefa2ed551e4..bc6b17d82d54cf82477ee3e48ce4020d44502d52 100644
--- a/resources/js/src/resources/Purchases.js
+++ b/resources/js/src/resources/Purchases.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import React from "react";
-import { ArrayField, AutocompleteInput, BooleanInput, Create, Datagrid, FormDataConsumer, List, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleShowLayout, TextField, TextInput } from 'react-admin';
+import { ArrayField, AutocompleteInput, BooleanInput, Create, Datagrid, FormDataConsumer, List, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleList, SimpleShowLayout, TextField, TextInput } from 'react-admin';
 import DateField from '../components/DateField';
 import { ShowDialog } from '../components/DialogForm';
 import MoneyField from "../components/MoneyField";
@@ -7,29 +8,41 @@ import MoneyInput from '../components/MoneyInput';
 import { MultiProductCountInput, MultiProductCountItem } from "../components/MultiProductCountInput";
 
 const Purchases = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
     return (
         <>
             <List {...props} bulkActionButtons={false} >
-                <Datagrid>
-                    <TextField source="id" />
-                    <TextField source="name" />
-                    <DateField source="created_at" />
-                    <ReferenceField label="Montant" source="transaction_id" reference="transactions" link="show">
-                        <MoneyField source="amount" noLabel={true} />
-                    </ReferenceField>
-                    <ReferenceField label="Créateur" source="transaction_id" reference="transactions" link="show">
-                        <ReferenceField source="user_id" reference="users">
-                            <TextField source="username" />
-                        </ReferenceField>
-                    </ReferenceField>
-                    <ReferenceField source="movement_id" reference="movements" link="show">
-                        <TextField source="name" />
-                    </ReferenceField>
-                    <ReferenceField source="transaction_id" reference="transactions" link="show">
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
                         <TextField source="name" />
-                    </ReferenceField>
-                    <ShowButton />
-                </Datagrid>
+                        <DateField source="created_at" />
+                        <ReferenceField label="Montant" source="transaction_id" reference="transactions" link="show">
+                            <MoneyField source="amount" noLabel={true} />
+                        </ReferenceField>
+                        <ReferenceField label="Créateur" source="transaction_id" reference="transactions" link={false}>
+                            <ReferenceField source="user_id" reference="users" link="show">
+                                <TextField source="username" />
+                            </ReferenceField>
+                        </ReferenceField>
+                        <ReferenceField source="movement_id" reference="movements" link="show">
+                            <TextField source="name" />
+                        </ReferenceField>
+                        <ReferenceField source="transaction_id" reference="transactions" link="show">
+                            <TextField source="name" />
+                        </ReferenceField>
+                        <ShowButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => record.name}
+                        secondaryText={record => new Date(record.created_at).toLocaleString()}
+                        tertiaryText={record => <ReferenceField record={record} label="Montant" source="transaction_id" reference="transactions" link={false}>
+                            <MoneyField source="amount" noLabel={true} />
+                        </ReferenceField>}
+                        linkType="show"
+                    />
+                )}
             </List>
             <ShowDialog>
                 <SimpleShowLayout>
@@ -43,13 +56,16 @@ const Purchases = (props) => {
                             <TextField source="username" />
                         </ReferenceField>
                     </ReferenceField>
-                    <ArrayField source="movement.products" >
-                        <Datagrid>
-                            <TextField source="product_id" />
-                            <TextField source="product.name" />
-                            <TextField source="count" />
-                        </Datagrid>
-                    </ArrayField>
+                    <ReferenceField label="Produits" source="movement_id" reference="movements" link="show">
+                        <ArrayField source="products" >
+                            <Datagrid>
+                                <ReferenceField source="product_id" reference="products" link="edit">
+                                    <TextField source="name" />
+                                </ReferenceField>
+                                <TextField source="count" />
+                            </Datagrid>
+                        </ArrayField>
+                    </ReferenceField>
                     <DateField source="created_at" />
                 </SimpleShowLayout>
             </ShowDialog>
diff --git a/resources/js/src/resources/Sales.js b/resources/js/src/resources/Sales.js
index ae47214b659a8d67fbfd5c5c6a1b9e727eaefc53..38b6088fd1b023fd4556790dc046a5c43692916e 100644
--- a/resources/js/src/resources/Sales.js
+++ b/resources/js/src/resources/Sales.js
@@ -1,6 +1,6 @@
-import { TextField as MuiTextField } from "@material-ui/core";
+import { TextField as MuiTextField, useMediaQuery } from "@material-ui/core";
 import React, { useState } from "react";
-import { ArrayField, Create, Datagrid, FormDataConsumer, FormTab, List, ReferenceField, SelectInput, ShowButton, SimpleShowLayout, TabbedForm, TextField, useNotify, useRefresh, useTranslate } from 'react-admin';
+import { ArrayField, Create, Datagrid, FormDataConsumer, FormTab, List, ReferenceField, SelectInput, ShowButton, SimpleList, SimpleShowLayout, TabbedForm, TextField, useNotify, useRefresh, useTranslate } from 'react-admin';
 import DateField from '../components/DateField';
 import { ShowDialog } from '../components/DialogForm';
 import MoneyField from "../components/MoneyField";
@@ -8,28 +8,42 @@ import { MultiProductCountInput, MultiProductCountItem } from "../components/Mul
 import PersonalAccountSelector from "../components/PersonalAccountSelector";
 
 const Sales = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
     return (
         <>
             <List {...props} bulkActionButtons={false} >
-                <Datagrid>
-                    <TextField source="id" />
-                    <DateField source="created_at" />
-                    <ReferenceField label="Montant" source="transaction_id" reference="transactions" link="show">
-                        <MoneyField source="amount" noLabel={true} />
-                    </ReferenceField>
-                    <ReferenceField label="Créateur" source="transaction_id" reference="transactions" link="show">
-                        <ReferenceField source="user_id" reference="users">
-                            <TextField source="username" />
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <DateField source="created_at" />
+                        <ReferenceField label="Montant" source="transaction_id" reference="transactions" link="show">
+                            <MoneyField source="amount" noLabel={true} />
                         </ReferenceField>
-                    </ReferenceField>
-                    <ReferenceField source="movement_id" reference="movements" link="show">
-                        <TextField source="name" />
-                    </ReferenceField>
-                    <ReferenceField source="transaction_id" reference="transactions" link="show">
-                        <TextField source="name" />
-                    </ReferenceField>
-                    <ShowButton />
-                </Datagrid>
+                        <ReferenceField label="Créateur" source="transaction_id" reference="transactions" link={false}>
+                            <ReferenceField source="user_id" reference="users" link="show">
+                                <TextField source="username" />
+                            </ReferenceField>
+                        </ReferenceField>
+                        <ReferenceField source="movement_id" reference="movements" link="show">
+                            <TextField source="name" />
+                        </ReferenceField>
+                        <ReferenceField source="transaction_id" reference="transactions" link="show">
+                            <TextField source="name" />
+                        </ReferenceField>
+                        <ShowButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => <ReferenceField record={record} source="movement_id" reference="movements" link={false}>
+                            <TextField source="name" />
+                        </ReferenceField>}
+                        secondaryText={record => new Date(record.created_at).toLocaleString()}
+                        tertiaryText={record => <ReferenceField record={record} label="Montant" source="transaction_id" reference="transactions" link={false}>
+                            <MoneyField source="amount" noLabel={true} />
+                        </ReferenceField>}
+                        linkType="show"
+                    />
+                )}
             </List>
             <ShowDialog>
                 <SimpleShowLayout>
diff --git a/resources/js/src/resources/Transactions.js b/resources/js/src/resources/Transactions.js
index 9c85f1ada07c276c9c5cbc9668b92717e179f4bd..c7a20ec1467c68dff0f19d17b42a314d3eed3ec8 100644
--- a/resources/js/src/resources/Transactions.js
+++ b/resources/js/src/resources/Transactions.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { AutocompleteInput, BooleanField, BooleanInput, Datagrid, List, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleShowLayout, TextField, TextInput } from 'react-admin';
+import { AutocompleteInput, BooleanField, BooleanInput, Datagrid, List, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleList, SimpleShowLayout, TextField, TextInput } from 'react-admin';
 import DateField from '../components/DateField';
 import { CreateDialog, ShowDialog } from '../components/DialogForm';
 import MoneyField from "../components/MoneyField";
@@ -18,61 +19,73 @@ const TransactionsFilters = [
     </ReferenceInput>
 ];
 
-const Transactions = (props) => (
-    <>
-        <List {...props} filters={TransactionsFilters} bulkActionButtons={false}>
-            <Datagrid>
-                <TextField source="id" />
-                <TextField source="name" />
-                <MoneyField noLabel={true} source="amount" />
-                <BooleanField source="rectification" />
-                <ReferenceField source="account_id" reference="accounts">
+const Transactions = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={TransactionsFilters} bulkActionButtons={false}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <TextField source="name" />
+                        <MoneyField noLabel={true} source="amount" />
+                        <BooleanField source="rectification" />
+                        <ReferenceField source="account_id" reference="accounts">
+                            <TextField source="name" />
+                        </ReferenceField>
+                        <ReferenceField source="category_id" reference="transactions_categories">
+                            <TextField source="name" />
+                        </ReferenceField>
+                        <ReferenceField source="user_id" reference="users">
+                            <TextField source="username" />
+                        </ReferenceField>
+                        <DateField source="created_at" />
+                        <ShowButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => record.name}
+                        secondaryText={record => new Date(record.created_at).toLocaleDateString()}
+                        tertiaryText={record => <MoneyField record={record} source="amount" noLabel={true} />}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput source="name" />
+                    <MoneyInput source="amount" />
+                    <BooleanInput source="rectification" />
+                    <ReferenceInput source="account_id" reference="accounts" filterToQuery={searchText => ({ name: searchText })}>
+                        <AutocompleteInput optionText="name" />
+                    </ReferenceInput>
+                    <ReferenceInput source="category_id" reference="transactions_categories" filterToQuery={searchText => ({ name: searchText })}>
+                        <AutocompleteInput optionText="name" />
+                    </ReferenceInput>
+                </SimpleForm>
+            </CreateDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
                     <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField source="category_id" reference="transactions_categories">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField source="user_id" reference="users">
-                    <TextField source="username" />
-                </ReferenceField>
-                <DateField source="created_at" />
-                <ShowButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput source="name" />
-                <MoneyInput source="amount" />
-                <BooleanInput source="rectification" />
-                <ReferenceInput source="account_id" reference="accounts" filterToQuery={searchText => ({ name: searchText })}>
-                    <AutocompleteInput optionText="name" />
-                </ReferenceInput>
-                <ReferenceInput source="category_id" reference="transactions_categories" filterToQuery={searchText => ({ name: searchText })}>
-                    <AutocompleteInput optionText="name" />
-                </ReferenceInput>
-            </SimpleForm>
-        </CreateDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <TextField source="name" />
-                <MoneyField source="amount" />
-                <BooleanField source="rectification" />
-                <ReferenceField source="account_id" reference="accounts">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField source="category_id" reference="transactions_categories">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField source="user_id" reference="users">
-                    <TextField source="username" />
-                </ReferenceField>
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+                    <MoneyField source="amount" />
+                    <BooleanField source="rectification" />
+                    <ReferenceField source="account_id" reference="accounts">
+                        <TextField source="name" />
+                    </ReferenceField>
+                    <ReferenceField source="category_id" reference="transactions_categories">
+                        <TextField source="name" />
+                    </ReferenceField>
+                    <ReferenceField source="user_id" reference="users">
+                        <TextField source="username" />
+                    </ReferenceField>
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: Transactions,
diff --git a/resources/js/src/resources/TransactionsCategories.js b/resources/js/src/resources/TransactionsCategories.js
index 5fc3f1dd555da73981b823f746010b216a1fd2f7..469d418808795f8082899baf2813e18d9fd40bee 100644
--- a/resources/js/src/resources/TransactionsCategories.js
+++ b/resources/js/src/resources/TransactionsCategories.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { Datagrid, EditButton, List, SimpleForm, SimpleShowLayout, TextField, TextInput } from 'react-admin';
+import { Datagrid, EditButton, List, SimpleForm, SimpleList, SimpleShowLayout, TextField, TextInput } from 'react-admin';
 import DateField from '../components/DateField';
 import DateInput from '../components/DateInput';
 import { CreateDialog, EditDialog, ShowDialog } from '../components/DialogForm';
@@ -8,40 +9,51 @@ const TransactionsCategoriesFilters = [
     <TextInput source="name" />
 ];
 
-const TransactionsCategories = (props) => (
-    <>
-        <List {...props} filters={TransactionsCategoriesFilters}>
-            <Datagrid>
-                <TextField source="id" />
-                <TextField source="name" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-                <EditButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput source="name" />
-            </SimpleForm>
-        </CreateDialog>
-        <EditDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput disabled source="id" />
-                <TextInput source="name" />
-                <DateInput disabled source="created_at" />
-                <DateInput disabled source="updated_at" />
-            </SimpleForm>
-        </EditDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <TextField source="name" />
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+const TransactionsCategories = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={TransactionsCategoriesFilters}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <TextField source="name" />
+                        <DateField source="created_at" />
+                        <DateField source="updated_at" />
+                        <EditButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => record.name}
+                        tertiaryText={record => "#" + record.id}
+                        linkType="edit"
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput source="name" />
+                </SimpleForm>
+            </CreateDialog>
+            <EditDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput disabled source="id" />
+                    <TextInput source="name" />
+                    <DateInput disabled source="created_at" />
+                    <DateInput disabled source="updated_at" />
+                </SimpleForm>
+            </EditDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <TextField source="name" />
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: TransactionsCategories,
diff --git a/resources/js/src/resources/Transferts.js b/resources/js/src/resources/Transferts.js
index 95eb4a2cdb46688be380c59a4336f04f78b49ff0..f083c6039d633c37e2f48fd8eb44d6618bc83035 100644
--- a/resources/js/src/resources/Transferts.js
+++ b/resources/js/src/resources/Transferts.js
@@ -1,81 +1,108 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { AutocompleteInput, Datagrid, List, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleShowLayout, TextField } from 'react-admin';
+import { AutocompleteInput, Datagrid, List, ReferenceField, ReferenceInput, ShowButton, SimpleForm, SimpleList, SimpleShowLayout, TextField } from 'react-admin';
 import DateField from '../components/DateField';
 import { CreateDialog, ShowDialog } from '../components/DialogForm';
 import MoneyField from "../components/MoneyField";
 import MoneyInput from "../components/MoneyInput";
 
-const Transferts = (props) => (
-    <>
-        <List {...props} bulkActionButtons={false}>
-            <Datagrid>
-                <TextField source="id" />
-                <ReferenceField label="Depuis" source="sub_transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="account_id" reference="accounts">
-                        <TextField source="name" />
+const Transferts = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} bulkActionButtons={false}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <ReferenceField label="Depuis" source="sub_transaction_id" reference="transactions" link="show">
+                            <ReferenceField source="account_id" reference="accounts">
+                                <TextField source="name" />
+                            </ReferenceField>
+                        </ReferenceField>
+                        <ReferenceField label="Vers" source="add_transaction_id" reference="transactions" link="show">
+                            <ReferenceField source="account_id" reference="accounts">
+                                <TextField source="name" />
+                            </ReferenceField>
+                        </ReferenceField>
+                        <ReferenceField label="Montant" source="add_transaction_id" reference="transactions" link="show">
+                            <MoneyField source="amount" noLabel={true} />
+                        </ReferenceField>
+                        <ReferenceField label="Créateur" source="add_transaction_id" reference="transactions" link="show">
+                            <ReferenceField source="user_id" reference="users">
+                                <TextField source="username" />
+                            </ReferenceField>
+                        </ReferenceField>
+                        <DateField source="created_at" />
+                        <ShowButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => (
+                            <>
+                                <ReferenceField record={record} label="Depuis" source="sub_transaction_id" reference="transactions" link={false}>
+                                    <ReferenceField source="account_id" reference="accounts" link={false}>
+                                        <TextField source="name" />
+                                    </ReferenceField>
+                                </ReferenceField> &rarr; <ReferenceField record={record} label="Vers" source="add_transaction_id" reference="transactions" link={false}>
+                                    <ReferenceField source="account_id" reference="accounts" link={false}>
+                                        <TextField source="name" />
+                                    </ReferenceField>
+                                </ReferenceField>
+                            </>
+                        )}
+                        secondaryText={record => new Date(record.created_at).toLocaleDateString()}
+                        tertiaryText={record => <ReferenceField record={record} label="Montant" source="add_transaction_id" reference="transactions" link={false}>
+                            <MoneyField source="amount" noLabel={true} />
+                        </ReferenceField>}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <MoneyInput source="amount" />
+                    <ReferenceInput source="from_account_id" reference="accounts" filterToQuery={searchText => ({ name: searchText })}>
+                        <AutocompleteInput optionText="name" />
+                    </ReferenceInput>
+                    <ReferenceInput source="to_account_id" reference="accounts" filterToQuery={searchText => ({ name: searchText })}>
+                        <AutocompleteInput optionText="name" />
+                    </ReferenceInput>
+                </SimpleForm>
+            </CreateDialog>
+            <ShowDialog>
+                <SimpleShowLayout>
+                    <TextField source="id" />
+                    <ReferenceField label="Depuis" source="sub_transaction_id" reference="transactions" link="show">
+                        <ReferenceField source="account_id" reference="accounts">
+                            <TextField source="name" />
+                        </ReferenceField>
                     </ReferenceField>
-                </ReferenceField>
-                <ReferenceField label="Vers" source="add_transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="account_id" reference="accounts">
+                    <ReferenceField label="Transaction soustraction" source="sub_transaction_id" reference="transactions" link="show">
                         <TextField source="name" />
                     </ReferenceField>
-                </ReferenceField>
-                <ReferenceField label="Montant" source="add_transaction_id" reference="transactions" link="show">
-                    <MoneyField source="amount" noLabel={true} />
-                </ReferenceField>
-                <ReferenceField label="Créateur" source="add_transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="user_id" reference="users">
-                        <TextField source="username" />
+                    <ReferenceField label="Vers" source="add_transaction_id" reference="transactions" link="show">
+                        <ReferenceField source="account_id" reference="accounts">
+                            <TextField source="name" />
+                        </ReferenceField>
                     </ReferenceField>
-                </ReferenceField>
-                <DateField source="created_at" />
-                <ShowButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <MoneyInput source="amount" />
-                <ReferenceInput source="from_account_id" reference="accounts" filterToQuery={searchText => ({ name: searchText })}>
-                    <AutocompleteInput optionText="name" />
-                </ReferenceInput>
-                <ReferenceInput source="to_account_id" reference="accounts" filterToQuery={searchText => ({ name: searchText })}>
-                    <AutocompleteInput optionText="name" />
-                </ReferenceInput>
-            </SimpleForm>
-        </CreateDialog>
-        <ShowDialog>
-            <SimpleShowLayout>
-                <TextField source="id" />
-                <ReferenceField label="Depuis" source="sub_transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="account_id" reference="accounts">
+                    <ReferenceField label="Transaction addition" source="add_transaction_id" reference="transactions" link="show">
                         <TextField source="name" />
                     </ReferenceField>
-                </ReferenceField>
-                <ReferenceField label="Transaction soustraction" source="sub_transaction_id" reference="transactions" link="show">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField label="Vers" source="add_transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="account_id" reference="accounts">
-                        <TextField source="name" />
+                    <ReferenceField label="Montant" source="add_transaction_id" reference="transactions" link="show">
+                        <MoneyField source="amount" noLabel={true} />
                     </ReferenceField>
-                </ReferenceField>
-                <ReferenceField label="Transaction addition" source="add_transaction_id" reference="transactions" link="show">
-                    <TextField source="name" />
-                </ReferenceField>
-                <ReferenceField label="Montant" source="add_transaction_id" reference="transactions" link="show">
-                    <MoneyField source="amount" noLabel={true} />
-                </ReferenceField>
-                <ReferenceField label="Créateur" source="add_transaction_id" reference="transactions" link="show">
-                    <ReferenceField source="user_id" reference="users">
-                        <TextField source="username" />
+                    <ReferenceField label="Créateur" source="add_transaction_id" reference="transactions" link="show">
+                        <ReferenceField source="user_id" reference="users">
+                            <TextField source="username" />
+                        </ReferenceField>
                     </ReferenceField>
-                </ReferenceField>
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-            </SimpleShowLayout>
-        </ShowDialog>
-    </>
-);
+                    <DateField source="created_at" />
+                    <DateField source="updated_at" />
+                </SimpleShowLayout>
+            </ShowDialog>
+        </>
+    );
+};
 
 export default {
     list: Transferts,
diff --git a/resources/js/src/resources/Users.js b/resources/js/src/resources/Users.js
index 006357381a797cfafee02678bea69975bf28353e..621a912f6e638b6f105426eb6a1efb1f2f8a9a36 100644
--- a/resources/js/src/resources/Users.js
+++ b/resources/js/src/resources/Users.js
@@ -1,5 +1,6 @@
+import { useMediaQuery } from '@material-ui/core';
 import * as React from "react";
-import { AutocompleteArrayInput, AutocompleteInput, ChipField, Datagrid, EditButton, FunctionField, List, ReferenceArrayField, ReferenceArrayInput, ReferenceField, ReferenceInput, SimpleForm, SingleFieldList, TextField, TextInput } from 'react-admin';
+import { AutocompleteArrayInput, AutocompleteInput, Datagrid, EditButton, FunctionField, List, ReferenceArrayInput, ReferenceField, ReferenceInput, SimpleForm, SimpleList, TextField, TextInput } from 'react-admin';
 import DateField from '../components/DateField';
 import DateInput from '../components/DateInput';
 import { CreateDialog, EditDialog } from '../components/DialogForm';
@@ -9,56 +10,65 @@ const UsersFilters = [
     <TextInput label="Email" source="email" />
 ];
 
-const Users = (props) => (
-    <>
-        <List {...props} filters={UsersFilters}>
-            <Datagrid>
-                <TextField source="id" />
-                <TextField source="username" />
-                <ReferenceField source="person_id" reference="people" link="show" >
-                    <FunctionField render={r => r.firstname + " " + r.lastname} />
-                </ReferenceField>
-                <TextField source="email" />
-                <ReferenceArrayField label="Permissions" reference="permissions" source="permissions">
-                    <SingleFieldList linkType={false}>
-                        <ChipField source="name" />
-                    </SingleFieldList>
-                </ReferenceArrayField>
-                <DateField source="created_at" />
-                <DateField source="updated_at" />
-                <DateField source="password_changed_at" />
-                <EditButton />
-            </Datagrid>
-        </List>
-        <CreateDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput source="username" />
-                <ReferenceInput source="person_id" reference="people" filterToQuery={searchText => ({ fullname: searchText, has_account: false })}>
-                    <AutocompleteInput optionText="fullname" />
-                </ReferenceInput>
-                <TextInput source="email" />
-                <ReferenceArrayInput label="Permissions" reference="permissions" source="permissions">
-                    <AutocompleteArrayInput />
-                </ReferenceArrayInput>
-            </SimpleForm>
-        </CreateDialog>
-        <EditDialog {...props}>
-            <SimpleForm redirect="list">
-                <TextInput source="username" />
-                <ReferenceInput disabled source="person_id" reference="people" filterToQuery={searchText => ({ fullname: searchText, has_account: false })}>
-                    <AutocompleteInput optionText="fullname" />
-                </ReferenceInput>
-                <TextInput source="email" />
-                <ReferenceArrayInput label="Permissions" reference="permissions" source="permissions">
-                    <AutocompleteArrayInput />
-                </ReferenceArrayInput>
-                <DateInput disabled source="created_at" />
-                <DateInput disabled source="updated_at" />
-                <DateInput disabled source="password_changed_at" />
-            </SimpleForm>
-        </EditDialog>
-    </>
-);
+const Users = (props) => {
+    const isDesktop = useMediaQuery(theme => theme.breakpoints.up('md'));
+    return (
+        <>
+            <List {...props} filters={UsersFilters}>
+                {isDesktop ? (
+                    <Datagrid>
+                        <TextField source="id" />
+                        <TextField source="username" />
+                        <ReferenceField source="person_id" reference="people" link="show" >
+                            <FunctionField render={r => r.firstname + " " + r.lastname} />
+                        </ReferenceField>
+                        <TextField source="email" />
+                        <DateField source="created_at" />
+                        <DateField source="updated_at" />
+                        <DateField source="password_changed_at" />
+                        <EditButton />
+                    </Datagrid>
+                ) : (
+                    <SimpleList
+                        primaryText={record => <ReferenceField record={record} source="person_id" reference="people" link={false} >
+                            <FunctionField render={r => r.firstname + " " + r.lastname} />
+                        </ReferenceField>}
+                        secondaryText={record => record.username}
+                        tertiaryText={record => "#" + record.id}
+                        linkType="show"
+                    />
+                )}
+            </List>
+            <CreateDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput source="username" />
+                    <ReferenceInput source="person_id" reference="people" filterToQuery={searchText => ({ fullname: searchText, has_account: false })}>
+                        <AutocompleteInput optionText="fullname" />
+                    </ReferenceInput>
+                    <TextInput source="email" />
+                    <ReferenceArrayInput label="Permissions" reference="permissions" source="permissions">
+                        <AutocompleteArrayInput />
+                    </ReferenceArrayInput>
+                </SimpleForm>
+            </CreateDialog>
+            <EditDialog {...props}>
+                <SimpleForm redirect="list">
+                    <TextInput source="username" />
+                    <ReferenceInput disabled source="person_id" reference="people" filterToQuery={searchText => ({ fullname: searchText, has_account: false })}>
+                        <AutocompleteInput optionText="fullname" />
+                    </ReferenceInput>
+                    <TextInput source="email" />
+                    <ReferenceArrayInput label="Permissions" reference="permissions" source="permissions">
+                        <AutocompleteArrayInput />
+                    </ReferenceArrayInput>
+                    <DateInput disabled source="created_at" />
+                    <DateInput disabled source="updated_at" />
+                    <DateInput disabled source="password_changed_at" />
+                </SimpleForm>
+            </EditDialog>
+        </>
+    );
+};
 
 export default {
     list: Users,