diff --git a/README.md b/README.md index 5b5ad07..5e10778 100644 --- a/README.md +++ b/README.md @@ -1,9 +1,11 @@ -# Mycelium Cloud Website +# Project Mycelium Website -- **Main Branch:** [https://project.mycelium.tf/](https://project.mycelium.tf/) -- **Dev Branch:** [https://www2.project.mycelium.tf/](https://www2.project.mycelium.tf/) - **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 @@ -20,11 +22,19 @@ This is the official website for Mycelium Cloud, built using Next.js and Tailwin --- +## 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 and Videos**: Add or modify images and videos in the `public/` directory. Images are in `public/images/` and videos are in `public/videos/`. +- **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. --- @@ -60,6 +70,57 @@ Follow these steps to get the project running locally: --- +## 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 ( + <> + + + + ) + } + ``` + +The new page will be accessible at `http://localhost:3000/new-page`. + +--- + ## Contributing - **Never update the `main` branch directly.** All changes must be reviewed and merged by the team through a pull request. @@ -72,7 +133,9 @@ Follow these steps to get the project running locally: To report an issue, please use the following link and provide the requested information: -- **Issue Tracker**: [https://git.ourworld.tf/tfgrid_internal/circle_tfgrid_ops/issues](https://git.ourworld.tf/tfgrid_internal/circle_tfgrid_ops/issues) +- **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** + +- See the current web rpoject on [OW Website & Wiki Project 2025](https://git.ourworld.tf/ourworld_web/-/projects/153) When reporting an issue, please include: