From e2cc15a0ea69d0a9aff8825c55ddd1be896f52c4 Mon Sep 17 00:00:00 2001
From: Brett Sun <qisheng.brett.sun@gmail.com>
Date: Tue, 10 Sep 2019 20:33:26 +0100
Subject: [PATCH] Onboarding: leave space during configure screens for help
 scout

---
 src/onboarding2/Configure/ConfigureTemplateScreens.js | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/onboarding2/Configure/ConfigureTemplateScreens.js b/src/onboarding2/Configure/ConfigureTemplateScreens.js
index a25f058aa..16d2975a1 100644
--- a/src/onboarding2/Configure/ConfigureTemplateScreens.js
+++ b/src/onboarding2/Configure/ConfigureTemplateScreens.js
@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react'
-import { GU, springs } from '@aragon/ui'
+import { GU, springs, useViewport } from '@aragon/ui'
 import { Transition, animated } from 'react-spring'
 
 const AnimatedDiv = animated.div
@@ -13,6 +13,7 @@ function ConfigureTemplateScreens({
   templateData,
 }) {
   const [prevIndex, setPrevIndex] = useState(-1)
+  const { below } = useViewport()
 
   useEffect(() => {
     setPrevIndex(screenIndex)
@@ -59,7 +60,8 @@ function ConfigureTemplateScreens({
           <div
             css={`
               max-width: ${82 * GU}px;
-              padding: 0 ${3 * GU}px ${3 * GU}px;
+              padding: 0 ${3 * GU}px ${(below('medium') ? 9 : 0) * GU}px
+                ${3 * GU}px;
             `}
           >
             <Screen