From a551c7dc9d8e7db7a627c6f36589cf1a65747ff1 Mon Sep 17 00:00:00 2001
From: Igor Stuev <108066576+isstuev@users.noreply.github.com>
Date: Mon, 6 Jan 2025 15:28:33 +0100
Subject: [PATCH] Add the text for the CapyRun game (#2508)

---
 ui/games/CapybaraRunner.tsx | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/ui/games/CapybaraRunner.tsx b/ui/games/CapybaraRunner.tsx
index dc23d40de2..11d01405b6 100644
--- a/ui/games/CapybaraRunner.tsx
+++ b/ui/games/CapybaraRunner.tsx
@@ -4,12 +4,14 @@ import Script from 'next/script';
 import React from 'react';
 
 import config from 'configs/app';
-
+import useIsMobile from 'lib/hooks/useIsMobile';
 const easterEggBadgeFeature = config.features.easterEggBadge;
 
 const CapybaraRunner = () => {
   const [ hasReachedHighScore, setHasReachedHighScore ] = React.useState(false);
 
+  const isMobile = useIsMobile();
+
   React.useEffect(() => {
     const preventDefaultKeys = (e: KeyboardEvent) => {
       if (e.code === 'Space' || e.code === 'ArrowUp' || e.code === 'ArrowDown') {
@@ -32,6 +34,8 @@ const CapybaraRunner = () => {
 
   return (
     <>
+      <Box as="h2" mt={ 12 } mb={ 2 } fontWeight={ 600 } fontSize="xl">Score 1000 to win a special prize!</Box>
+      <Box mb={ 4 }>{ isMobile ? 'Tap below to start' : 'Press space to start' }</Box>
       <Script strategy="lazyOnload" src="/static/capibara/index.js"/>
       <Box width={{ base: '100%', lg: '600px' }} height="300px" p="50px 0">
         <div id="main-frame-error" className="interstitial-wrapper" style={{ marginTop: '20px' }}>