Landing pages styling tweaks. Update metadata. Add Champions Ascension logo.

frontend/pages/index.js

@@ -48,6 +48,7 @@ const assets = {
   bc101: `${AWS_ASSETS_PATH}/featured_by/blockchain101_logo.png`,
   bulliverse: `${AWS_ASSETS_PATH}/bullieverse_logo.png`,
   cgcConference: `${AWS_ASSETS_PATH}/featured_by/cgc_conference_2022_logo.jpg`,
+  championsAscension: `${AWS_ASSETS_PATH}/featured_by/champions.png`,
   cointelegraph: `${AWS_ASSETS_PATH}/featured_by/Cointelegraph_logo.png`,
   cryptoGuilds: `${AWS_ASSETS_PATH}/crypto_guilds_logo.png`,
   cryptoinsiders: `${AWS_ASSETS_PATH}/featured_by/crypto_insiders.png`,
@@ -70,6 +71,8 @@ const assets = {
   polygon: `${AWS_ASSETS_PATH}/polygon_blockchain_logo.png`,
 };
 
+console.log(assets["championsAscension"]);
+
 const Homepage = () => {
   const [background, setBackground] = useState("background720");
   const [backgroundLoaded720, setBackgroundLoaded720] = useState(false);
@@ -190,7 +193,7 @@ const Homepage = () => {
             cursor="pointer"
             m={[2, 3, 3, 4, 8, 12]}
             pb={2}
-            minH={[null, "290px", "400px", null]}
+            minH={["225px", "290px", "400px", null]}
           >
             <ChakraImage
               boxSize={["150px", "220px", "xs", null, "xs"]}
@@ -252,6 +255,7 @@ const Homepage = () => {
                       boxSize="full"
                       pt={["120px", "120px", "150px"]}
                       pb={10}
+                      px="5%"
                       flexDir="column"
                     >
                       <Stack
@@ -260,7 +264,6 @@ const Homepage = () => {
                         spacing={6}
                         maxW={["1620px", null, null, null, "1620px", "2222px"]}
                         w="100%"
-                        px="5%"
                       >
                         <Heading
                           fontSize={["lg", "4xl", "5xl", "5xl", "5xl", "6xl"]}
@@ -448,6 +451,12 @@ const Homepage = () => {
                         ImgURL={assets["cryptoGuilds"]}
                         boxURL="https://crypto-guilds.com/"
                       />
+                      <TrustedBadge
+                        scaling={1.5}
+                        name="Champions Ascension"
+                        ImgURL={assets["championsAscension"]}
+                        boxURL="https://www.champions.io/"
+                      />
                       <TrustedBadge
                         scaling={[1.5]}
                         name="Crypto Unicorns"
@@ -1042,6 +1051,7 @@ const Homepage = () => {
                   bgColor="blue.900"
                   rounded={["lg", "xl", "2xl"]}
                   textColor="white"
+                  px={10}
                   py={8}
                   mb={8}
                 >
@@ -1086,10 +1096,11 @@ const Homepage = () => {
                   color="blue.900"
                   rounded={["lg", "xl", "2xl"]}
                   px={10}
+                  pb={[8, 8, 0]}
                 >
                   <chakra.span
                     display="block"
-                    my={12}
+                    py={[6, 6, 12]}
                     fontSize={["sm", "sm", "md", "lg", "xl", "xl"]}
                     textAlign={["justify", "justify", "left", null]}
                     mr={[0, 0, 14]}

frontend/src/components/EngineOverviewDiagram.js

@@ -151,17 +151,16 @@ const _EngineOverviewDiagram = (props) => {
           </Center>
         </GridItem>
         <GridItem
-          h={["160px", "160px", "auto"]}
           order={[3, 3, 1]}
           display="inline-grid"
           justifyItems="center"
           alignItems="center"
-          marginTop={[0, 0, 10]}
+          marginTop={10}
         >
           <Center>
             <Flex
               w={["155px", "155px", "189px"]}
-              h={["160px", "160px", "205px"]}
+              h={[null, null, "205px"]}
               justifyContent="center"
               position="relative"
             >

frontend/src/core/constants.js

@@ -6,9 +6,9 @@ export const BUGOUT_ENDPOINTS = {
 };
 
 export const DEFAULT_METATAGS = {
-  title: "Moonstream: Building blocks for your blockchain game",
+  title: "Build, Scale, and Monitor Your Game on the Blockchain",
   description:
-    "Moonstream DAO makes tools that help you build, manage, and secure your blockchain game.",
+    "Moonstream is a no code web3 game engine. Use Moonstream’s technical blockchain infrastructure to add on-chain game mechanics. Watch your game’s economy flourish.",
   keywords:
     "analytics, blockchain analytics, protocol, protocols, blockchain, crypto, data, NFT gaming, smart contracts, web3, smart contract, ethereum, polygon, matic, transactions, defi, finance, decentralized, mempool, NFT, NFTs, DAO, DAOs, cryptocurrency, cryptocurrencies, bitcoin, blockchain economy, blockchain game, marketplace, blockchain security, loyalty program, Ethereum bridge, Ethereum bridges, NFT game, NFT games",
   url: "https://www.moonstream.to",