Add empty dotation cards

components/dotations/results/Results.module.scss

+.container {
+  height: calc(100% - 31px);
+  overflow-y: scroll;
+  margin: -12px -12px 0 -12px;
+}
+
+.container > * {
+  width: 100% !important;
+  margin: 0px!important;
+}
+
+@media screen and (max-width: 1427px) {
+  .container {
+    height: calc(100% - 72px);
+  }
+}
\ No newline at end of file

components/dotations/results/Results.tsx

+import Grid from "@material-ui/core/Grid";
 import { PureComponent } from "react";
 
+import { CommuneSearch } from "./commune-search";
+import { CommuneStrateDetails } from "./commune-strate-details";
+import { CommuneSummary } from "./commune-summary";
+import { CommuneType } from "./commune-type";
+import styles from "./Results.module.scss";
+
 export class Results extends PureComponent {
   render() {
     return (
-      <div />
+      <div className={styles.container}>
+        <Grid container spacing={24}>
+          <Grid item lg={4} md={6} sm={6} xl={3} xs={12}>
+            <CommuneSummary />
+          </Grid>
+          <Grid item lg={8} md={12} sm={6} xl={6} xs={12}>
+            <CommuneStrateDetails />
+          </Grid>
+        </Grid>
+        <Grid container spacing={24}>
+          <Grid item lg={4} md={6} sm={6} xl={3} xs={12}>
+            <CommuneType
+              departement="Isère"
+              name="Vaujany"
+            />
+          </Grid>
+          <Grid item lg={4} md={6} sm={6} xl={3} xs={12}>
+            <CommuneType
+              departement="Quasquara"
+              name="Corse-du-sud"
+            />
+          </Grid>
+          <Grid item lg={4} md={6} sm={6} xl={3} xs={12}>
+            <CommuneSearch />
+          </Grid>
+        </Grid>
+      </div>
     );
   }
 }

components/dotations/results/commune-search/CommuneSearch.tsx

+import { PureComponent } from "react";
+
+import { Card } from "../../../card";
+
+export class CommuneSearch extends PureComponent {
+  render() {
+    return (
+      <Card
+        content1={(
+          <div>
+            Barre de recherche
+          </div>
+        )}
+        title="Ajouter une nouvelle commune"
+      />
+    );
+  }
+}

components/dotations/results/commune-search/index.ts

+export { CommuneSearch } from "./CommuneSearch";

components/dotations/results/commune-strate-details/CommuneStrateDetails.tsx

+import { PureComponent } from "react";
+
+import { Card } from "../../../card";
+
+export class CommuneStrateDetails extends PureComponent {
+  render() {
+    return (
+      <Card
+        content1={(
+          <div>
+            Tableau des communes par strate
+          </div>
+        )}
+        subTitle="par taille de commune"
+        title="Impact sur les communes"
+      />
+    );
+  }
+}

components/dotations/results/commune-strate-details/index.ts

+export { CommuneStrateDetails } from "./CommuneStrateDetails";

components/dotations/results/commune-summary/CommuneSummary.tsx

+import { PureComponent } from "react";
+
+import { Card } from "../../../card";
+
+export class CommuneSummary extends PureComponent {
+  render() {
+    return (
+      <Card
+        content1={(
+          <div>
+            Résultats globaux
+          </div>
+        )}
+        title="Nombre de communes éligibles"
+      />
+    );
+  }
+}

components/dotations/results/commune-summary/index.ts

+export { CommuneSummary } from "./CommuneSummary";

components/dotations/results/commune-type/CommuneType.tsx

+import { PureComponent } from "react";
+
+import { Card } from "../../../card";
+
+// TODO: use the future state interface "Commune" from "types."
+interface Props {
+  name: string;
+  departement: string;
+}
+
+export class CommuneType extends PureComponent<Props> {
+  render() {
+    const { departement, name } = this.props;
+    return (
+      <Card
+        content1={(
+          <div>
+            Descriptif de la commune
+          </div>
+        )}
+        content2={(
+          <div>
+            Résultat
+          </div>
+        )}
+        subTitle={departement}
+        title={name}
+        onClose={() => {}}
+        onEdit={() => {}}
+      />
+    );
+  }
+}

components/dotations/results/commune-type/index.ts

+export { CommuneType } from "./CommuneType";