fix style issues on mobile (graphql#1684)

* fix

* prettier

Author: dimaMachina

src/components/cards.tsx

@@ -37,8 +37,10 @@ export function Cards({
             >
               {/* @ts-expect-error */}
               {typeof Icon === "function" ? <Icon className="h-6" /> : Icon}
-              <b className="mt-4 text-lg text-center">{title}</b>
-              <span className="text-xs md:text-sm">{description}</span>
+              <b className="mt-4 mb-2 text-lg text-center">{title}</b>
+              <span className="text-xs md:text-sm text-center break-all">
+                {description}
+              </span>
             </Card>
           )
         },

src/pages/community/events.mdx

@@ -131,7 +131,7 @@ export function Meetups() {
   }, [])
   return (
     <>
-      <div id="map" className="h-96 my-6" />
+      <div id="map" className="h-96 my-6 z-0" />
       {meetups.map(({ node }) => (
         <EventCard
           key={node.id}

src/pages/community/foundation/annual-reports.mdx

@@ -1,5 +1,5 @@
 ---
-heroText: Reflecting upon our accomplishments, anticipating our future
+description: Reflecting upon our accomplishments, anticipating our future
 ---
 
 # Annual Reports

src/pages/community/foundation/annual-reports/2019.mdx

@@ -1,5 +1,4 @@
 ---
-heroText: 2019 Annual Report
 date: 2020-04-02
 ---
 

src/pages/community/foundation/community-grant.mdx

@@ -1,6 +1,6 @@
 ---
 sidebarTitle: Community Grant
-heroText:
+description:
   The GraphQL Community Grant program helps the GraphQL Foundation invest
   directly into the success, health, and sustainability of our ecosystem.
 ---

src/pages/community/foundation/contact.mdx

@@ -1,13 +1,17 @@
 ---
-heroText: The GraphQL Foundation is here to help.
+description: The GraphQL Foundation is here to help.
 ---
 
 # Contact the GraphQL Foundation
 
 The GraphQL Foundation is supported by staff from [The Linux Foundation](https://linuxfoundation.org). If you have questions, please reach out to us using the links below.
 
-_Please note that we do not provide user support for GraphQL. If you have an implementation question,
-please use the [relevant community channels](/community/)._
+import { Callout } from 'nextra/components'
+
+<Callout type="warning">
+  **Please note:** we do not provide user support for GraphQL. If you have an implementation question,
+  please use the [relevant community channels](/community).
+</Callout>
 
 ## Membership Inquiries
 

src/pages/community/foundation/graphql-conf.mdx

@@ -1,5 +1,5 @@
 ---
-heroText: The official GraphQL conference, hosted by the GraphQL Foundation.
+description: The official GraphQL conference, hosted by the GraphQL Foundation.
 ---
 
 # GraphQL Conf

src/pages/community/foundation/index.mdx

@@ -1,5 +1,5 @@
 ---
-heroText: An open and neutral home for the GraphQL community, dedicated to promoting widespread adoption and accelerating development of the surrounding ecosystem
+description: An open and neutral home for the GraphQL community, dedicated to promoting widespread adoption and accelerating development of the surrounding ecosystem
 ---
 
 # What is the GraphQL Foundation?

src/pages/community/foundation/join.mdx

@@ -1,5 +1,5 @@
 ---
-heroText: GraphQL Foundation members demonstrate their commitment to the ecosystem by providing essential financial support.
+description: GraphQL Foundation members demonstrate their commitment to the ecosystem by providing essential financial support.
 ---
 
 # Become a Member