refactor: remove GetStarted section and consolidate with CallToAction component

README.md

@@ -1,83 +1,151 @@
-# Mycelium Cloud Website
+# Project Mycelium Website
+
+- **Repository:** [https://git.ourworld.tf/ourworld_web/www_project_mycelium/](https://git.ourworld.tf/ourworld_web/www_project_mycelium/)
+
+- **Main Branch (Production):** [https://project.mycelium.tf/](https://project.mycelium.tf/)
+- **Dev Branch (Staging):** [https://www2.project.mycelium.tf/](https://www2.project.mycelium.tf/)
+
+
+---
+
+## About
 
 This is the official website for Mycelium Cloud, built using Next.js and Tailwind CSS.
 
-## Getting Started
+---
 
-Follow these instructions to get a local copy up and running for development and testing purposes.
+## Technologies
 
-### Prerequisites
+- **Framework**: [Next.js](https://nextjs.org/)
+- **Language**: [TypeScript](https://www.typescriptlang.org/)
+- **Styling**: [Tailwind CSS](https://tailwindcss.com/)
 
-Make sure you have Node.js and npm installed on your machine. You can download them from [nodejs.org](https://nodejs.org/).
+---
 
-### Installation
+## Dependencies
+
+- **UI**: [@headlessui/react](https://headlessui.com/)
+- **Animation**: [framer-motion](https://www.framer.com/motion/)
+- **Utilities**: [clsx](https://github.com/lukeed/clsx), [use-debounce](https://github.com/xnimorz/use-debounce)
+
+---
+
+## File Structure
+
+- **Pages**: To edit the content of a specific page, navigate to `src/app/(main)/`.
+- **Components**: Reusable components are located in `src/components/`.
+- **Images**: Add or modify images in the `public/images/` directory.
+- **CSS**: Global styles can be found in `src/styles/tailwind.css`. Most styling is done using Tailwind CSS utility classes directly in the `.tsx` files.
+
+---
+
+## Branding
+
+- **Font**: The primary font used is [Mulish](https://fonts.google.com/specimen/Mulish).
+- **Logos**: Project logos are stored in `public/images/logos/`.
+
+---
+
+## Get Started
+
+Follow these steps to get the project running locally:
+
+1.  **Install Dependencies**:
 
-1.  Clone the repository to your local machine.
-2.  Install the NPM packages:
     ```bash
     npm install
     ```
 
-### Running the Application
+2.  **Build the Project**:
 
-To run the development server:
-
-```bash
-npm run dev
-```
-
-Open [http://localhost:3000](http://localhost:3000) in your browser to see the result.
-
-## Git Workflow
-
-We follow a branching model to ensure code quality and a stable production environment. All new work should be done on a feature branch.
-
-1.  **Switch to the `development` branch** and make sure it's up to date:
     ```bash
-    git checkout development
-    git pull origin development
+    npm run build
     ```
 
-2.  **Create a new feature branch** for your changes:
+3.  **Start the Development Server**:
+
     ```bash
-    git checkout -b your-feature-name
+    npm run start
     ```
 
-3.  **Make your changes and commit them**.
+---
 
-4.  **Push your feature branch** to the remote repository:
-    ```bash
-    git push origin your-feature-name
+## Development Guide
+
+This project follows a modular, component-based architecture. Pages are assembled by combining reusable components into a single layout.
+
+### Homepage Structure
+
+The homepage (`src/app/(main)/page.tsx`) is composed of the following components:
+
+- `HomeHero`
+- `WorldMap`
+- `StackSectionPreview`
+- `Steps`
+- `Companies`
+- `ClickableGallery`
+- `BentoReviews`
+- `CallToAction`
+
+To edit a specific section of the homepage, navigate to `src/components/` and modify the corresponding component file.
+
+### Base Layout
+
+The main layout for the application is defined in `src/components/Layout.tsx`. This file includes the `Header` and `Footer` and wraps the primary content of each page.
+
+### Creating a New Page
+
+To create a new page, follow these steps:
+
+1.  **Create a Folder**: Inside the `src/app/(main)/` directory, create a new folder with the desired URL slug for your page (e.g., `new-page`).
+
+2.  **Create the Page File**: Inside the new folder, create a `page.tsx` file.
+
+3.  **Add Page Content**: Compose your page by importing and using the reusable components from `src/components/`. For example:
+
+    ```tsx
+    import { HomeHero } from '@/components/HomeHero'
+    import { Faqs } from '@/components/Faqs'
+
+    export default function NewPage() {
+      return (
+        <>
+          <HomeHero />
+          <Faqs />
+        </>
+      )
+    }
     ```
 
-5.  **Create a Pull Request** on GitHub from your feature branch to the `development` branch.
+The new page will be accessible at `http://localhost:3000/new-page`.
 
-6.  After the pull request is reviewed and merged, the changes will be on the `development` branch. To deploy to production, the `development` branch will be merged into `main`.
+---
 
-## Project Structure
+## Contributing
 
-Here is an overview of the key directories in the project:
+- **Never update the `main` branch directly.** All changes must be reviewed and merged by the team through a pull request.
+- **Always work on the `development` branch.** Create a feature branch from `development` and submit your pull request to `development`.
+- **Request a review.** After submitting your pull request, ask the team to review and accept it into the `main` branch.
 
--   `src/app/(main)/page.tsx`
-    This is the main entry point for the homepage.
+---
 
--   `src/components/`
-    This directory contains all the reusable React components used throughout the site. The main components rendered on the homepage (`src/app/(main)/page.tsx`) are:
-    - `HomeHero.tsx`
-    - `StackSection.tsx` (as `StackSectionPreview`)
-    - `BentoReviews.tsx`
-    - `WorldMap.tsx`
-    - `Steps.tsx`
-    - `Companies.tsx`
-    - `ClickableGallery.tsx`
-    - `CallToAction.tsx`
+## Report an Error
 
--   `public/images/`
-    All static images are stored here. You can find logos, gallery images, and other visual assets in this folder.
+To report an issue, please use the following link and provide the requested information:
 
--   `public/videos/`
-    This folder contains video assets used on the site.
+- **Issue Tracker**: [git.ourworld.tf/ourworld_web/HOME/issues/new](https://git.ourworld.tf/ourworld_web/HOME/issues/new) and tag **OW Website & Wiki Project 2025**
 
-## License
+- See the current web rpoject on [OW Website & Wiki Project 2025](https://git.ourworld.tf/ourworld_web/-/projects/153)
 
-This site template is a commercial product and is licensed under the [Tailwind Plus license](https://tailwindcss.com/plus/license).
+When reporting an issue, please include:
+
+- **URL**: The page where the error occurred.
+- **Repo**: The repository you are working with.
+- **Branch**: The specific branch you are on.
+- **Problem**: A detailed description of the problem.
+
+---
+
+## Questions
+
+If you have any questions, you can reach out to [sashaastiadi](https://git.ourworld.tf/sashaastiadi).

src/app/(main)/page.tsx

@@ -27,10 +27,7 @@ export default function Home() {
       <section id="technologies">
         <StackSectionPreview />
       </section>
-      <section id="bento-reviews">
-        <BentoReviews />
-      </section>
-      <section id="deploy">
+      <section id="how-it-works">
         <Steps />
       </section>
       <section id="llms">
@@ -39,7 +36,10 @@ export default function Home() {
       <section id="clickable-gallery">
         <ClickableGallery />
       </section>
-      <section id="call-to-action">
+      <section id="bento-reviews">
+        <BentoReviews />
+      </section>
+      <section id="get-started">
         <CallToAction />
       </section>
     </>

src/components/CallTo.tsx

@@ -23,12 +23,7 @@ export function CallTo() {
               Book a Meeting
             </a>
             <a
-              href="javascript:;"
-              onClick={() => {
-                if (typeof window !== 'undefined' && (window as any).ml_account) {
-                  (window as any).ml_account('webforms', '6108375', 'l9m8g1', 'show')
-                }
-              }}
+              href="mailto:info@ourworld.tf"
               className="text-sm/6 font-semibold text-[#2F3178] hover:text-[#2F3178]/80"
             >
               Join the Waitlist <span aria-hidden="true">→</span>

src/components/CallToAction.tsx

@@ -47,11 +47,7 @@ export function CallToAction() {
             <Button
               variant="outline"
               color="white"
-              onClick={() => {
-                if (typeof window !== 'undefined' && (window as any).ml_account) {
-                  (window as any).ml_account('webforms', '6108375', 'l9m8g1', 'show')
-                }
-              }}
+              href="mailto:info@ourworld.tf"
             >
               Join the Waitlist
             </Button>

src/components/Header.tsx

@@ -113,11 +113,7 @@ export function Header() {
                             <Button
                               variant="outline"
                               color="white"
-                              onClick={() => {
-                                if (typeof window !== 'undefined' && (window as any).ml_account) {
-                                  (window as any).ml_account('webforms', '6108375', 'l9m8g1', 'show')
-                                }
-                              }}
+                              href="mailto:info@ourworld.tf"
                             >
                               Join the Waitlist
                             </Button>
@@ -134,11 +130,7 @@ export function Header() {
               <Button
                 variant="outline"
                 color="white"
-                onClick={() => {
-                  if (typeof window !== 'undefined' && (window as any).ml_account) {
-                    (window as any).ml_account('webforms', '6108375', 'l9m8g1', 'show')
-                  }
-                }}
+                href="mailto:info@ourworld.tf"
               >
                 Join the Waitlist
               </Button>