Reflect new Developer Hub app (#1205)

* Update submission form link + other improvements

* Fix link

* Add demonstrative image

* ADjustments

* remove import statements

* Fix typo

* Amend button text

* Split events into separate page

* Fix missing word

* Alter titles

* Had to reinstall deps after a weird error probably having to do with Docusaurus versions

---------

Co-authored-by: mapachurro <[email protected]>

Author: jlwllmr

docs/get-started/build/quickstart/events.mdx

@@ -0,0 +1,62 @@
+---
+title: Publish an event for your app
+description: How to create an event for your Linea Hub app, using the Linea Developer Hub
+---
+
+In addition to [listing your app](./hub.mdx), you can also create events for your app.
+
+To do so, head to the Linea Developer Hub, find the "Events" section in the sidebar, and click the
+"Create event" button.
+
+An event page helps drive excitement and participation by showcasing engaging, time-limited 
+experiences in your app. Events are displayed directly on your app page, increasing visibility and 
+conversion by giving users a reason to engage with your app while the event is live.
+
+To create the best possible event, follow our guidance for submitting each of the following elements:
+
+### Name
+
+Choose a clear, unique name under 30 characters that captures the essence of your event. Use title 
+case for consistency across events.
+
+### Tagline
+
+Add a short tagline that communicates what makes your event unique and worth joining.
+
+### Banner
+
+Use a high-quality image that is visually distinct from your app banner to avoid confusion and 
+signal that this is a specific event. Avoid adding text: your event's name and tagline already 
+appear above it. As with your app banner, avoid light background colors, and keep important visual 
+elements in the top-right section to avoid cropping.
+
+### Event button
+
+Ensure the link behind your event's "View" button takes users directly into the event within your app.
+This minimizes friction and gets them to the experience quickly. Avoid directing users to another 
+event page in your app that repeats the same thing.
+
+### Overview
+
+Craft a clear, engaging paragraph outlining what users will experience, followed by a short list of 
+key activities, challenges, or rewards that will excite your audience.
+
+### Availability
+
+Clearly specify your event's start and end dates, and promote it up to 14 days in advance to 
+maximize interest and visibility.
+
+### Category
+
+Choose the appropriate event category to help users quickly understand the nature of your event.
+
+### Performance tracking
+
+Use analytics in your Developer Hub to monitor impressions, views, and user engagement with your 
+event. Analyze these insights to refine and improve your future event strategies.
+
+### Promotion
+
+Promote your event on your social media channels and within your app. Always link directly to your 
+Linea Hub event page; this helps users trust the event. It shows the event is officially listed and 
+verified within the Linea ecosystem, which signals it's real and safe.

docs/get-started/build/quickstart/hub-reviews.mdx

@@ -1,41 +1,51 @@
 ---
-title: Understanding reviews on Linea Hub
+title: Understanding reviews on the Linea Hub
 sidebar_position: 4
 description: A guide to how reviews work on the Linea Hub
 image: /img/socialCards/understanding-reviews-on-linea-hub.jpg
 ---
 
-We review every **app, token, and event** submitted to the Linea Hub to ensure they are safe, high quality, and ready to deliver value to users while protecting the ecosystem.
+We review every **app, token, and event** submitted to the Linea Hub to ensure they are safe, high 
+quality, and ready to deliver value to users while protecting the ecosystem.
 
 ## Why we review
 
-Reviews protect users and ensure that apps, tokens, and events on the Hub meet security, usability, and quality standards. This helps users trust the projects they discover on the Hub, which ultimately brings in more users to your app.
+Reviews protect users and ensure that apps, tokens, and events on the Hub meet security, usability, 
+and quality standards. This helps users trust the projects they discover on the Hub, which ultimately 
+brings more users to your app.
 
 ## What we check
 
-- That all smart contracts your users interact with are publicly verified on Lineascan and meet security and technical standards
+- That all smart contracts your users interact with are publicly verified on Lineascan and meet 
+  security and technical standards
 - The app functions as described, without crashes or critical bugs
 - Design meets quality standards
 - Screenshots and descriptions accurately reflect the app experience
 {/* - Privacy policies exist and are publicly shared with users (No needed for now) */}
 
 ## How long it takes
 
-Most reviews are completed within 48 hours if submissions are complete. You will receive updates by email.
+Most reviews are completed within 48 hours if submissions are complete. You will receive updates by 
+email.
 
 ## What you need to submit
 
-- A **tested, working app or event** without placeholder content and/or a token **deployed on Linea Mainnet**
-- Verification, on Lineascan, of **all smart contract addresses your users will interact with through your app or token**
+- A **tested, working app or event** without placeholder content and/or a token **deployed on Linea 
+  Mainnet**
+- Verification, on Lineascan, of **all smart contract addresses your users will interact with 
+  through your app or token**
 - **Accurate** descriptions and visuals
 - Link to demo environment with credentials allowing for full app functionality testing
-- **The best way to contact you** to share feedback on your submission (don't forget your specific email address, handle + platform, etc!)
+- **The best way to contact you** to share feedback on your submission (don't forget your specific 
+email address, handle and platform, etc.)
 - A **publicly accessible link to your privacy policy** explaining data collection and use
 
 ## What happens if changes are needed
 
-If we do not approve your submission, we will share feedback through your preferred contact methods so you can adjust and resubmit quickly.
+If we do not approve your submission, we will share feedback through your preferred contact methods 
+so you can adjust and resubmit quickly.
 
 ## After approval
 
-Once approved, your app, token, or event will go live on [the Hub](https://linea.build/hub), and you can track performance and user engagement in your Developer Hub.
+Once approved, your app, token, or event will go live on [the Hub](https://linea.build/hub), and you 
+can track performance and user engagement in your [Developer Hub](https://developer.linea.build).

docs/get-started/build/quickstart/hub.mdx

@@ -1,175 +1,138 @@
 ---
-title: List your app on the Linea Hub
+title: Publish your app on the Linea Hub
 sidebar_position: 3
 description: >-
   A guide to listing your app on the Linea hub, and tips for optimizing your
   listing
 image: /img/socialCards/list-your-app-on-the-linea-hub.jpg
 ---
 
-import Banner from "../../../../static/img/get_started/build/quickstart/hub/banner_example.svg";
-import LabelledBanner from "../../../../static/img/get_started/build/quickstart/hub/labelled_banner.svg";
 import SubmissionButton from "../../../../src/components/SubmissionButton";
 
-Publishing your app on the [Linea Hub](https://linea.build/hub) is the easiest way to reach users, grow your traffic, and get 
-discovered in the Linea ecosystem. This is where the journey begins for production-ready apps. 
+Publishing your app on the [Linea Hub](https://linea.build/hub) is the easiest way to reach users, 
+grow your traffic, and get discovered in the Linea ecosystem. This is where the journey begins for 
+production-ready apps. 
 
-<SubmissionButton />
-
-A great listing boosts your visibility. A verified contract builds trust. And the more usage you get, 
-the more we'll support and amplify your project.
-
-Here's what your listing will look like on the Hub:
-
-<div className="img-large" style={{ display: 'flex', justifyContent: 'center' }}>
-   <Banner alt="Example banner" />
-</div>
+The best way to do this is to create an account on the Linea Developer Hub. Click the button below
+to get started:
 
-:::info[What you'll need]
-
-- A [deployed app](./app) live on Linea Mainnet
-- A clear project name and short description
-- A logo and banner image
-- Verified [smart contract](./deploy)
-- Accurate URLs (website, app, socials, etc.)
+<SubmissionButton />
 
-:::
+The [Linea Developer Hub](https://developer.linea.build/) is a tool for managing your app, including:
+- App details
+- Token information
+- [Events](#checklist-create-a-great-event-page-on-the-linea-hub).
 
-Here's how the information you'll need matches up to the elements in your listing:
+You'll need to create an account at first, but once you're ready, the app will guide you through the
+process of registering your app for the Linea Hub.
 
+## Create a great app page on the Linea Hub
 
-<div className="img-medium">
-   <LabelledBanner alt="Labelled banner" />
-</div>
+Your app page is the gateway for your new users on Linea. Every section should help visitors 
+understand what your app does, why it's worth trying, and how it will add value to their onchain 
+experience. A great listing boosts your visibility, and the more usage you get, the more we'll 
+support and amplify your project.
 
-## Checklist: Create a great app page on the Linea Hub
+If you have all the elements below, you're on the right track to an effective app listing:
 
-Your app page is the gateway for your new users on Linea. Every section should help visitors understand what your app does, why it’s worth trying, and how it will add value to their onchain experience. If you have all the elements below for your app, you're on the right track:
+### Name
 
+Choose a simple, distinctive name that's easy to read and remember. It should hint at what your app 
+does, while standing out among others. To differentiate your project, avoid using generic terms or 
+names that are too close to those of existing apps.
 
-### 1. Name
-**Choose a simple, distinctive name that’s easy to read and remember.**
+### Icon
 
-- It should hint at what your app does, while standing out among others.
-  - **Protip:** Avoid using generic terms or names that are too close to existing apps!
+Your icon is your app's "visual handshake" with your users. Keep it visually clean, on-brand, and 
+easily recognizable even at small sizes (think favicon). Avoid unnecessary details that clutter the 
+design.
 
-### 2. Icon
-**Your icon is your app's "visual handshake" with your users.**
+### Tagline
 
-- Keep it visually clean, on-brand, and easily recognizable even at small sizes (think favicon).
-  - Avoid unnecessary details that clutter the design.
+Think of your tagline as your app's elevator pitch in a single line. Highlight a clear, tangible 
+benefit, _not_ vague superlatives. Readers should immediately grasp your app's core value.
 
-### 3. Tagline
-**Think of your tagline as your app’s elevator pitch, in a single line.**
-  
-- Highlight a clear, tangible benefit, *not* vague superlatives.
-  - Readers should **immediately grasp your app’s core value**.
+### Banner
 
-### 4. Banner
-**Your banner is the visual anchor of your app page.**
+Your banner is the visual anchor of your app page.
 
-- Use a high-quality, uncluttered image that conveys your app’s feel and purpose.
+- Use a high-quality, uncluttered image that conveys your app's feel and purpose.
 - Avoid adding text; your app's name and tagline already appear above the banner.
-- **Avoid light background colors**
-- Keep important visual elements in **the top right section** to avoid cropping.
+- Avoid light background colors.
+- **Keep important visual elements in the top right** section to avoid cropping. See the image below
+  for reference. The MetaMask Card examples above demonstrate the relationship between the banner 
+  image and the focus area within it.
+- Ensure your banner meets the following requirements:
+  - SVG or PNG 
+  - 16:9 aspect ratio 
+  - 1920x1080 resolution
+
+<br />
+  <div className="center-container">
+    <div className="img-large">
+      <img src="/img/get_started/build/quickstart/hub/image_specifications.png" 
+      alt="Banner focus area" 
+      />
+    </div>
+  </div>
 
 ### App button
-**Your app button should take users directly into the most engaging part of your app.**
-
-- The Linea Hub is used across mobile and desktop, so **ensure your app is fully optimized for mobile use**.
-- We automatically append UTM parameters to the button's URL, so you can track traffic coming from the Hub within your analytics stack. This helps to track conversions from the Hub, and provides insight to improve your app.
-
-### 6. Screenshots
-**Add up to three clear screenshots that capture the core features and user experience of your app.**
-
-- Use these images to tell a visual story of what users can expect when they try your app.
-
-### 7. Overview
-**This is a compelling written introduction to your app.**
-
-- The first sentence of your description is the most important: it’s what will make users decide to read more!
-- Explain the problem your app solves, and why users will benefit from it.
-- Follow this with a concise list of your key features
-- Use a tone that aligns with your brand, and speaks in the language of your audience.
-
-### 8. Ratings
-**Users can leave ratings on your app; use that to your advantage.**
 
-- From within your app, encourage your users to leave positive ratings on the Linea Hub. Higher ratings from others will improve your app’s discoverability across the Hub, and increase users' trust in your app.
+Your app button should take users directly into the most engaging part of your app. The Linea Hub 
+is used across mobile and desktop, so **ensure your app is fully optimized for mobile use**.
 
-### 9. Category
-**Where would users look to find your app?**
+We automatically append UTM parameters to the button's URL, so you can track traffic coming from 
+the Hub within your analytics stack. This helps to track conversions from the Hub, and provides 
+insight to improve your app.
 
-- Select the most relevant category for your app to ensure it is discoverable to the right audience. 
-- Consider multiple flows; users may be simply browsing, or filtering by interest.
+### Screenshots
 
-### 10. Smart contracts
-**Register your smart contract entry points on Lineascan.** 
+Add up to three clear screenshots that capture the core features and user experience of your app. 
+Use these images to tell a visual story of what users can expect when they try your app.
 
-- This helps improve your app’s discoverability across the Hub, and increase user safety
-- We require all contracts to be verified on Lineascan.
-  - If your are using a proxy pattern, include both proxy and implementation addresses; this allows us and power users to review the source code and identify issues eary. 
-- Include **all deployed contracts users interact with, *directly or indirectly*.**
+### Overview
 
-### 11. Final checks
-**Are you camera-ready?**
+This is a compelling written introduction to your app. The first sentence is the most important: 
+it's what will make users decide to read more!
 
-- Make sure all URLs work (website, app, docs, socials, etc.)
-- Link to your GitHub, if public
-- Triple-check spelling, formatting, and clarity
-
-## Checklist: Create a great event page on the Linea Hub
-
-Your event page helps drive excitement and participation by showcasing engaging, time-limited experiences in your app. **Events are displayed directly on your app page, increasing visibility and conversion** by giving users a reason to engage with your app while the event is live.
-
-If you include all the following elements for your event, you're setting yourself up for success:
-
-### 1. Name
-**Choose a clear, unique name under 30 characters that captures the essence of your event.**
+Explain the problem your app solves, and why users will benefit from it, and list your key features.
+Use a tone that aligns with your brand, and speaks in the language of your audience.
 
-- Use title case for consistency across events
+### Ratings
 
-### 2. Tagline
-**Add a short tagline that communicates what makes your event unique and worth joining**.
+Users can leave ratings on your app; use that to your advantage. From within your app, encourage 
+your users to leave positive ratings on the Linea Hub. Higher ratings from others will improve your 
+app's discoverability across the Hub, and increase users' trust in your app.
 
-### 3. Banner
-**Use a high-quality image that is visually distinct from your app banner to avoid confusion and signal that this is a specific event**
+### Category
 
-- Avoid adding text: your event's name and tagline already appear above it.
-- As with your app banner, **avoid light background colors**, and keep important visual elements in the top right section to avoid cropping.
+Where would users look to find your app?
 
-### 4. Event button
-**Ensure your event’s view button takes users directly into the event within your app**
+Select the most relevant category for your app to ensure it is discoverable to the right audience. 
+Consider multiple flows; users may be simply browsing, or filtering by interest.
 
-- This minimizes friction and gets them to the experience quickly.
-- Avoid directing users to another event page in your app that repeats the same thing.
+### Smart contracts
 
-### 5. Overview
-**Craft a clear, engaging paragraph outlining what users will experience, followed by a short list of key activities, challenges, or rewards that will excite your audience.**
+Register your smart contract entry points on Lineascan. 
 
-### 6. Availability
-**Clearly specify your event’s start and end dates, and promote it up to 14 days in advance to maximize interest and visibility.**
+This helps improve your app's discoverability across the Hub, and increase user safety. We require 
+all contracts to be verified on Lineascan. If you're using a proxy pattern, include both proxy and 
+implementation addresses; this allows us and power users to review the source code and identify 
+issues eary. 
 
-### 7. Category
-** Choose the appropriate event category to help users quickly understand the nature of your event**.
+Include all deployed contracts users interact with, *directly or indirectly*.
 
-### 8. Performance tracking
-**Use analytics in your Developer Hub to monitor impressions, views, and user engagement with your event.**
+### Final checks
 
-- Analyze these insights to refine and improve your future event strategies.
-
-### 10. Promotion
-**Promote your event on your social media channels and within your app.**
-
-- Always link directly to your Linea Hub event page; this helps users trust the event:
-  - It shows the event is **officially listed and verified within the Linea ecosystem**, which signals it’s real and safe.
+Are you camera-ready?
 
+- Make sure all URLs work (website, app, docs, socials, etc.)
+- Link to your GitHub, if public
+- Triple-check spelling, formatting, and clarity
 
 ## Submission
 
-Access the [submission form](https://2urwb.share.hsforms.com/2M7Q9cFIWQxyZgLdocN3Smg?submissionGuid=07ed5477-53c1-498a-a5e7-41b12999d66c) 
-to submit your app. 
-
+Submit your app in the [Developer Hub](https://developer.linea.build). You may need to sign in first. 
 
 ## What happens next
 

docusaurus.config.js

@@ -212,8 +212,8 @@ const config = {
             title: "Get involved",
             items: [
               {
-                label: "Builder Hub",
-                href: "https://linea.build/developers",
+                label: "Developer Hub",
+                href: "https://developer.linea.build/",
               },
               {
                 label: "Linea Hub",