fixes

blockscout · Dec 16, 2024 · 2b6cfe5 · 2b6cfe5
1 parent 84bc2ad
commit 2b6cfe5
Show file tree

Hide file tree

Showing 8 changed files with 10 additions and 131 deletions.
diff --git a/configs/app/features/easterEggBadge.ts b/configs/app/features/easterEggBadge.ts
@@ -2,7 +2,7 @@ import type { Feature } from './types';
 
 import { getEnvValue } from '../utils';
 
-const badgeClaimLink = getEnvValue('NEXT_PUBLIC_BADGE_CLAIM_LINK');
+const badgeClaimLink = getEnvValue('NEXT_PUBLIC_GAME_BADGE_CLAIM_LINK');
 
 const title = 'Easter egg badge';
 

diff --git a/configs/envs/.env.eth b/configs/envs/.env.eth
@@ -67,4 +67,4 @@ NEXT_PUBLIC_TRANSACTION_INTERPRETATION_PROVIDER=blockscout
 NEXT_PUBLIC_VIEWS_CONTRACT_SOLIDITYSCAN_ENABLED=true
 NEXT_PUBLIC_VISUALIZE_API_HOST=https://visualizer.services.blockscout.com
 NEXT_PUBLIC_XSTAR_SCORE_URL=https://docs.xname.app/the-solution-adaptive-proof-of-humanity-on-blockchain/xhs-scoring-algorithm?utm_source=blockscout&utm_medium=address
-NEXT_PUBLIC_BADGE_CLAIM_LINK=https://badges.blockscout.com/mint/hiddenBlockBadge
+NEXT_PUBLIC_GAME_BADGE_CLAIM_LINK=https://badges.blockscout.com/mint/hiddenBlockBadge
diff --git a/deploy/tools/envs-validator/schema.ts b/deploy/tools/envs-validator/schema.ts
@@ -887,7 +887,7 @@ const schema = yup
       }),
     NEXT_PUBLIC_REWARDS_SERVICE_API_HOST: yup.string().test(urlTest),
     NEXT_PUBLIC_XSTAR_SCORE_URL: yup.string().test(urlTest),
-    NEXT_PUBLIC_BADGE_CLAIM_LINK: yup.string().test(urlTest),
+    NEXT_PUBLIC_GAME_BADGE_CLAIM_LINK: yup.string().test(urlTest),
 
     // 6. External services envs
     NEXT_PUBLIC_WALLET_CONNECT_PROJECT_ID: yup.string(),

diff --git a/docs/ENVS.md b/docs/ENVS.md
@@ -856,7 +856,7 @@ This feature enables Blockscout Merits program. It requires that the [My account
 
 | Variable | Type| Description | Compulsoriness  | Default value | Example value | Version |
 | --- | --- | --- | --- | --- | --- | --- |
-| NEXT_PUBLIC_BADGE_CLAIM_LINK | `string` | Provide to enable the easter egg badge feature | - | - | `https://example.com` | v1.37.0+ |
+| NEXT_PUBLIC_GAME_BADGE_CLAIM_LINK | `string` | Provide to enable the easter egg badge feature | - | - | `https://example.com` | v1.37.0+ |
 
 ## External services configuration
 

diff --git a/nextjs/csp/policies/app.ts b/nextjs/csp/policies/app.ts
@@ -72,6 +72,8 @@ export function app(): CspDev.DirectiveDescriptor {
       // hash of ColorModeScript: system + dark
       '\'sha256-e7MRMmTzLsLQvIy1iizO1lXf7VWYoQ6ysj5fuUzvRwE=\'',
       '\'sha256-9A7qFFHmxdWjZMQmfzYD2XWaNHLu1ZmQB0Ds4Go764k=\'',
+
+      // CapybaraRunner
       '\'sha256-5+YTmTcBwCYdJ8Jetbr6kyjGp0Ry/H7ptpoun6CrSwQ=\'',
     ],
 

diff --git a/pages/_app.tsx b/pages/_app.tsx
@@ -28,7 +28,6 @@ import Layout from 'ui/shared/layout/Layout';
 import Web3ModalProvider from 'ui/shared/Web3ModalProvider';
 
 import 'lib/setLocale';
-import 'ui/games/Capybara.css';
 // import 'focus-visible/dist/focus-visible';
 
 type AppPropsWithLayout = AppProps & {

diff --git a/ui/games/Capybara.css b/ui/games/Capybara.css
diff --git a/ui/games/CapybaraRunner.tsx b/ui/games/CapybaraRunner.tsx
@@ -34,18 +34,18 @@ const CapybaraRunner = () => {
     <>
       <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">
+        <div id="main-frame-error" className="interstitial-wrapper" style={{ marginTop: '20px' }}>
           <div id="main-content"></div>
-          <div id="offline-resources">
+          <div id="offline-resources" style={{ display: 'none' }}>
             <img id="offline-resources-1x" src="/static/capibara/capybaraSprite.png"/>
             <img id="offline-resources-2x" src="/static/capibara/capybaraSpriteX2.png"/>
           </div>
         </div>
       </Box>
       { easterEggBadgeFeature.isEnabled && hasReachedHighScore && (
-        <Flex flexDirection="column" alignItems="center" justifyContent="center" gap={ 4 }>
+        <Flex flexDirection="column" alignItems="center" justifyContent="center" gap={ 4 } mt={ 10 }>
           <Text fontSize="2xl" fontWeight="bold">You unlocked a hidden badge!</Text>
-          <Text fontSize="lg">Congratulations! You’re eligible to claim an epic hidden badge!</Text>
+          <Text fontSize="lg" textAlign="center">Congratulations! You’re eligible to claim an epic hidden badge!</Text>
           <Button as="a" href={ easterEggBadgeFeature.badgeClaimLink } target="_blank">Claim</Button>
         </Flex>
       ) }