Merge pull request #42 from maxmx/2022

2022

.npmrc

@@ -0,0 +1 @@
+registry=https://registry.npmjs.org/

README.md

@@ -15,7 +15,3 @@ $ yarn start
 ```
 $ yarn build
 ```
-
-### Access Netlify
-
-Go to https://www.drmobilo.com/admin/

gatsby-config.js

@@ -1,6 +1,6 @@
 module.exports = {
   siteMetadata: {
-    title: 'Dr. Mobilo Aquafest 2020'
+    title: 'Dr. Mobilo Aquafest 2022'
   },
   plugins: [
     'gatsby-plugin-react-helmet',
@@ -58,13 +58,6 @@ module.exports = {
       options: {
         fonts: [`Arvo`]
       }
-    },
-    {
-      resolve: 'gatsby-plugin-netlify-cms',
-      options: {
-        modulePath: `${__dirname}/src/cms/cms.js`,
-        enableIdentityWidget: false
-      }
     }
   ]
 };

package.json

@@ -15,17 +15,15 @@
     "gatsby-plugin-favicon": "^3.1.6",
     "gatsby-plugin-google-analytics": "^2.1.35",
     "gatsby-plugin-google-fonts": "^1.0.1",
-    "gatsby-plugin-netlify-cms": "^4.1.38",
     "gatsby-plugin-page-transitions": "^1.0.8",
     "gatsby-plugin-react-helmet": "^3.1.22",
-    "gatsby-plugin-sharp": "^2.4.5",
+    "gatsby-plugin-sharp": "^2.6.36",
     "gatsby-plugin-styled-components": "3.1.19",
     "gatsby-source-filesystem": "^2.1.48",
     "gatsby-transformer-remark": "^2.6.50",
-    "gatsby-transformer-sharp": "^2.3.14",
+    "gatsby-transformer-sharp": "^2.5.15",
     "lodash.groupby": "^4.6.0",
     "lodash.sortby": "^4.7.0",
-    "netlify-cms": "^2.10.16",
     "react": "^16.12.0",
     "react-dom": "^16.12.0",
     "react-dropzone": "^10.2.1",
@@ -67,5 +65,8 @@
     "uglifyjs-webpack-plugin": "^2.0.1"
   },
   "license": "none",
-  "private": true
+  "private": true,
+  "resolutions": {
+    "sharp": "0.28.0"
+  }
 }

src/components/Hero/styles.js

@@ -15,7 +15,6 @@ export const Container = styled.div`
     left: 0;
     right: 0;
     position: absolute;
-    background: linear-gradient(to bottom, rgba(10, 17, 19, 1) 0%, rgba(10, 17, 19, 0) 100%);
   }
 
   &:after {
@@ -38,3 +37,33 @@ export const Container = styled.div`
     z-index: 1;
   }
 `;
+
+export const Poster = styled.div`
+  position: relative;
+  text-align: center;
+  background-color: rgb(229, 202, 173);
+
+  &:before {
+    content: '';
+    top: 100%;
+    height: 2rem;
+    left: 0;
+    right: 0;
+    position: absolute;
+    background: linear-gradient(to bottom, rgba(10, 17, 19, 1) 0%, rgba(10, 17, 19, 0) 100%);
+  }
+  &:after {
+    content: '';
+    top: 50%;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    position: absolute;
+    z-index: 2;
+    background: linear-gradient(to bottom, rgba(10, 17, 19, 0) 0%, rgba(10, 17, 19, 0) 80%, rgba(10, 17, 19, 1) 100%);
+  }
+  > * {
+    position: relative;
+    z-index: 1;
+  }
+`;

src/components/Home/galas.js

@@ -4,22 +4,17 @@ import sortBy from 'lodash.sortby';
 
 import Link from './link';
 
-export default ({ galas, images }) => {
-  console.log(galas);
-  return (
-    <Grid>
-      <Row>
-        {sortBy(galas, ['order']).map(({ title, day, time, poster, artistes, slug }, i) => {
-          const sharp = images[poster];
-          return (
-            <Col key={`${title}-${day}-${time}`} xs={12} md={4}>
-              <Link
-                {...{ title, day, time, poster: sharp, artistes, slug, first: true, last: true, color: '#ef9635' }}
-              />
-            </Col>
-          );
-        })}
-      </Row>
-    </Grid>
-  );
-};
+export default ({ galas, images }) => (
+  <Grid>
+    <Row>
+      {sortBy(galas, ['order']).map(({ title, day, time, poster, artistes, slug }, i) => {
+        const sharp = images[poster];
+        return (
+          <Col key={`${title}-${day}-${time}`} xs={12} md={4}>
+            <Link {...{ title, day, time, poster: sharp, artistes, slug, first: true, last: true, color: '#ef9635' }} />
+          </Col>
+        );
+      })}
+    </Row>
+  </Grid>
+);

src/components/Home/index.js

@@ -2,35 +2,20 @@ import React from 'react';
 import { Grid, Row } from 'react-styled-flexboxgrid';
 import { HTMLContent } from '../Content';
 
-import Galas from './galas';
 import Day from './day';
-import Promo from './promo';
-import Hero from '../Hero';
-import { Logo } from './styles';
 
-import heroImg from '../../img/hero-2020.png';
-import logo from '../../img/mobilo-logo.png';
+import hero2022 from '../../img/hero-2022.jpg';
+import { Poster } from '../Hero/styles';
+import { SiteNote } from '../styles';
+import Promo from './promo';
 
-export default ({ images, dates = [], galas, content }) => (
+export default ({ images, dates = [], content }) => (
   <>
-    <Hero image={heroImg} style={{ paddingTop: '7rem', minHeight: '50vh' }}>
-      <Grid style={{ textAlign: 'center' }}>
-        <Logo src={logo} alt="" />
-        <h1 style={{ textAlign: 'center', textTransform: 'uppercase', marginBottom: '3rem' }}>1 au 16 Mai 2020</h1>
-      </Grid>
-    </Hero>
-    <h1
-      style={{
-        textAlign: 'center',
-        textTransform: 'uppercase',
-        marginBottom: '3rem',
-        marginTop: '3rem',
-        color: '#fcc163'
-      }}
-    >
-      Les Galas
-    </h1>
-    <Galas {...{ galas, images }} />
+    <Poster style={{ paddingTop: '3.25rem' }}>
+      <img src={hero2022} alt="Dr. Mobilo Aquafest, 20 au 26 juin 2022" />
+    </Poster>
+    <Promo />
+
     <h1
       style={{
         textAlign: 'center',
@@ -42,16 +27,23 @@ export default ({ images, dates = [], galas, content }) => (
     >
       Les Spectacles
     </h1>
-    <Promo />
+
     <Grid>
       <Row>
         {Object.keys(dates).map((key, i) => (
           <Day {...{ key, images }} shows={dates[key]} index={i} />
         ))}
       </Row>
+
       <Promo />
 
       <HTMLContent {...{ content }} />
+      <SiteNote>
+        <span>
+          Ce site est <a href="https://github.com/maxmx/mobilo">open source</a>
+        </span>
+        <a href="mailto:[email protected]">Contact</a>
+      </SiteNote>
     </Grid>
   </>
 );

src/components/Home/promo.js

@@ -2,35 +2,19 @@ import React from 'react';
 import { Margin } from 'styled-components-spacing';
 import { Grid, Row, Col } from 'react-styled-flexboxgrid';
 
-import P1 from '../../img/passes-1.png';
 import P2 from '../../img/passes-2.png';
-import P3 from '../../img/passes-3.png';
 
 export default () => (
   <Margin bottom={{ xs: 3 }}>
     <Grid>
-      <Row around="xs" style={{ textAlign: 'center', marginTop: '3rem' }}>
-        <Col xs={12} md={4}>
+      <Row style={{ textAlign: 'center', marginTop: '3rem' }}>
+        <Col xs={12} md={4} mdOffset={4}>
           <Margin bottom={{ xs: 3 }}>
-            <a href="https://shop.drmobilo.com/collections/frontpage/products/passe-scaphandrier-2020">
-              <img src={P1} alt="" />
-            </a>
-          </Margin>
-        </Col>
-        <Col xs={12} md={4}>
-          <Margin bottom={{ xs: 3 }}>
-            <a href="https://shop.drmobilo.com/collections/frontpage/products/passe-scaphandrier-2020">
+            <a href="https://shop.drmobilo.com/collections/frontpage/products/passe-scaphandrier-2022">
               <img src={P2} alt="" />
             </a>
           </Margin>
         </Col>
-        <Col xs={12} md={4}>
-          <Margin bottom={{ xs: 3 }}>
-            <a href="https://shop.drmobilo.com/collections/frontpage/products/passe-scaphandrier-2020">
-              <img src={P3} alt="" />
-            </a>
-          </Margin>
-        </Col>
       </Row>
     </Grid>
   </Margin>

src/components/Layout.js

@@ -1,9 +1,8 @@
 import React from 'react';
 import { ThemeProvider } from 'styled-components';
-import { Grid } from 'react-styled-flexboxgrid';
 
 import Helmet from './Helmet';
-import { GlobalStyles, theme, SiteNote } from './styles';
+import { GlobalStyles, theme } from './styles';
 
 import Navigation from './Navigation';
 
@@ -15,14 +14,6 @@ export default ({ children }) => (
       <div>
         <Navigation />
         {children}
-        <Grid>
-          <SiteNote>
-            <span>
-              Ce site est <a href="https://github.com/maxmx/mobilo">open source</a>
-            </span>
-            <a href="mailto:[email protected]">Contact</a>
-          </SiteNote>
-        </Grid>
       </div>
     </ThemeProvider>
   </>

src/constants/seo-defaults.js

@@ -1,8 +1,8 @@
 export default {
-  title: 'Dr. Mobilo Aquafest 2020',
+  title: 'Dr. Mobilo Aquafest 2022',
   description:
     'Alliant humour et musique, l’espace de liberté pure qui caractérise cette scène donne souvent lieu à des prises de position, des expérimentations audacieuses et des élans de créativité sans limites. Embarquez dans le mouvement qui chamboule les idées préconçues de ce que doit être l’humour. Les murs tombent. C’est le début d’une nouvelle ère. Bienvenue au Dr. Mobilo Aquafest.',
-  image: '/img/share-default.png',
+  image: '/img/share-2022.png',
   type: 'website',
   slug: '/'
 };

src/pages/index.md

@@ -1,4 +1,4 @@
 ---
 templateKey: home-page
-title: Dr. Mobilo Aquafest 2019
+title: Dr. Mobilo Aquafest 2022
 ---

src/pages/spectacles/alexandre-forest.md

@@ -0,0 +1,16 @@
+---
+templateKey: spectacle
+type: spectacle
+title: 'Alexandre Forest'
+dates: 
+  - billet: 'https://www.universe.com/events/alexandre-forest-tickets-7JW1FV'
+    date: 2022-06-25T23:00:00.000Z
+
+poster: '/img/poster-alexandre.png'
+scene: Ritz PDB
+artistes:
+  - Alexandre Forest
+
+---
+Une chose incroyable s'est produite à St-Alphonse-De-Rodriguez. Appuyé dans un récit monologué, Alexandre Forest transporte un fait divers de son coin de pays pour exprimer le fantastique dans l'ordinaire. 
+

src/pages/spectacles/anas-hassouna.md

@@ -0,0 +1,14 @@
+---
+templateKey: spectacle
+type: spectacle
+title: 'Anas Hassouna'
+dates: 
+  - billet: 'https://www.universe.com/events/anas-hassouna-tickets-3B5VJ2'
+    date: 2022-06-25T01:00:00.000Z
+poster: '/img/poster-anas.png'
+scene: Théâtre Fairmount
+artistes:
+  - Anas Hassouna
+
+---
+Anas Hassouna est de retour sur scène. Après une pause forcée suite à un traumatisme qu’il a subi après avoir sauvé un autobus scolaire de la noyade dans un lac en feu, à mains nues, il a été forcé de prendre une pause. Environ entre 2020 et 2022. Maintenant pleinement reposé, il présente une heure de matériel exclusif.

src/pages/spectacles/catherine-ethier.md

@@ -0,0 +1,14 @@
+---
+templateKey: spectacle
+type: spectacle
+title: 'Le droit d’être applaudie'
+dates: 
+  - billet: 'https://www.universe.com/events/catherine-ethier-le-droit-dtre-applaudie-tickets-G8BY9R'
+    date: 2022-06-25T23:00:00.000Z
+poster: '/img/poster-catherine.png'
+scene: Théâtre Fairmount
+artistes:
+  - Catherine Ethier
+
+---
+En mars 2020, la femme en jeans a regagné son modeste bungalow, humble devant les éléments, déterminée à te revoir (un jour. Peut-être. Elle ne savait pas, elle n’est pas devin). À cette époque précise, elle était en colère et caressait (aussi) l’envie de danser. Cette fois, elle rêve d’être applaudie. Et elle a bien l’intention de revendiquer son droit. Traumavertissement : probabilité élevée de dissection de porc.