From 7f2f3973d84e979be48180d3d9e4f12d1daca261 Mon Sep 17 00:00:00 2001
From: meriadec <meriadec.pillet@gmail.com>
Date: Thu, 14 Jun 2018 18:36:32 +0200
Subject: [PATCH] Scroll inside ReleaseNotes

---
 src/components/modals/ReleaseNotes.js | 19 ++++++++++++++++++-
 1 file changed, 18 insertions(+), 1 deletion(-)

diff --git a/src/components/modals/ReleaseNotes.js b/src/components/modals/ReleaseNotes.js
index 2b031a80..a003fc2c 100644
--- a/src/components/modals/ReleaseNotes.js
+++ b/src/components/modals/ReleaseNotes.js
@@ -10,6 +10,7 @@ import Modal, { ModalBody, ModalTitle, ModalContent, ModalFooter } from 'compone
 
 import Button from 'components/base/Button'
 import Box from 'components/base/Box'
+import GrowScroll from 'components/base/GrowScroll'
 import Text from 'components/base/Text'
 import Spinner from 'components/base/Spinner'
 
@@ -217,7 +218,12 @@ class ReleaseNotes extends PureComponent<Props, State> {
       return (
         <ModalBody onClose={onClose}>
           <ModalTitle>{t('app:releaseNotes.title')}</ModalTitle>
-          <ModalContent>{content}</ModalContent>
+          <ModalContent style={{ height: 400 }} mx={-5} pb={0}>
+            <GrowScroll px={5} pb={8}>
+              {content}
+            </GrowScroll>
+            <GradientBox />
+          </ModalContent>
           <ModalFooter horizontal justifyContent="flex-end">
             <Button onClick={onClose} primary>
               {t('app:common.continue')}
@@ -231,4 +237,15 @@ class ReleaseNotes extends PureComponent<Props, State> {
   }
 }
 
+const GradientBox = styled.div`
+  width: 100%;
+  height: 60px;
+  position: absolute;
+  bottom: 68px;
+  left: 0;
+  right: 0;
+  background: linear-gradient(rgba(255, 255, 255, 0), #ffffff 70%);
+  z-index: 2;
+`
+
 export default translate()(ReleaseNotes)