From a59e09e8ed58e49952d468d1578594cc0b6a3ba1 Mon Sep 17 00:00:00 2001 From: sasha-astiadi Date: Thu, 30 Oct 2025 13:05:40 +0100 Subject: [PATCH] docs: update README with comprehensive project documentation - Expanded project overview with detailed technology stack and dependencies - Added deployment information for production and staging environments - Included complete development setup instructions and contribution guidelines - Added issue reporting process and contact information - Updated file structure documentation with new component organization - Included branding guidelines and font specifications - Added links to project management --- README.md | 252 ++++++++++++++++++++++++++++++++++++++---------------- 1 file changed, 177 insertions(+), 75 deletions(-) diff --git a/README.md b/README.md index 88c9c3d..72b3325 100644 --- a/README.md +++ b/README.md @@ -1,93 +1,195 @@ # Project Mycelium Website -A multi-page website for Project Mycelium built with React, Vite, TypeScript, and Tailwind CSS. +All in one project mycelium website -## Tech Stack -- **Framework**: React 19 -- **Build Tool**: Vite 7 +- **Repository:** [https://git.ourworld.tf/ourworld_web/www_project_mycelium_com/](https://git.ourworld.tf/ourworld_web/www_project_mycelium_com/) + + +- **Main Branch (Production):** [https://www.projectmycelium.com/](https://www.projectmycelium.com) +- **Dev Branch (Staging):** [https://www2.projectmycelium.com/](https://www2.projectmycelium.com/) + + + +--- + + +## About + + +This is the official website for Mycelium , built using Vite.js and Tailwind CSS. + + +--- + + +## Technologies + + +- **Framework**: Vite.js (React) - **Language**: TypeScript -- **Styling**: Tailwind CSS 4 -- **Routing**: React Router DOM 7 -- **Animations**: Framer Motion 11 +- **Styling**: Tailwind CSS -## Project Structure -``` -src/ -├── components/ # Shared components -│ ├── AnimatedSection.tsx -│ ├── Button.tsx -│ ├── CircleBackground.tsx -│ ├── Container.tsx -│ ├── Header.tsx -│ ├── Layout.tsx -│ └── Logo.tsx -├── pages/ # Page-specific components -│ ├── home/ # Home page blocks -│ ├── cloud/ # Cloud page blocks -│ ├── network/ # Network page blocks -│ │ ├── animations/ # SVG animations -│ │ ├── Hero.tsx -│ │ ├── About.tsx -│ │ ├── Features.tsx -│ │ ├── PrimaryFeatures.tsx -│ │ ├── SecondaryFeatures.tsx -│ │ ├── CallToAction.tsx -│ │ └── NetworkPage.tsx -│ └── agents/ # Agents page blocks -├── styles/ -│ └── tailwind.css # Tailwind configuration -└── App.tsx # Main app with routing -``` +--- -## Pages -- **Home** (`/`) - Main landing page with placeholder content -- **Cloud** (`/cloud`) - Mycelium Cloud information (placeholder) -- **Network** (`/network`) - Full Network page with: - - Hero section - - Our Mission (About) - - Core Components (Features with animations) - - How It Works - - Roadmap - - Call to Action -- **Agents** (`/agents`) - Mycelium Agents information (placeholder) +## Dependencies -## Development +- **@emailjs/browser**: ^4.4.1 +- **@headlessui/react**: ^2.2.9 +- **@heroicons/react**: ^2.2.0 +- **@lobehub/icons**: ^1.97.2 +- **@radix-ui/react-icons**: ^1.3.2 +- **@react-three/drei**: ^9.89.2 +- **@react-three/fiber**: ^8.15.12 +- **@tabler/icons-react**: ^3.35.0 +- **@tailwindcss/forms**: ^0.5.10 +- **@types/node**: ^20.19.23 +- **@types/react**: ^18.3.26 +- **@types/react-dom**: ^18.3.7 +- **@types/react-router-dom**: ^5.3.3 +- **class-variance-authority**: ^0.7.1 +- **clsx**: ^2.1.1 +- **cobe**: ^0.6.5 +- **dotted-map**: ^2.2.3 +- **framer-motion**: ^10.18.0 +- **lucide-react**: ^0.544.0 +- **motion**: ^12.23.24 +- **popmotion**: ^11.0.5 +- **react**: ^18.3.1 +- **react-countup**: ^6.5.3 +- **react-dom**: ^18.3.1 +- **react-icons**: ^5.5.0 +- **react-router-dom**: ^7.9.4 +- **react-type-animation**: ^3.2.0 +- **tailwind-merge**: ^3.3.1 +- **tailwindcss**: ^4.1.15 +- **three**: ^0.151.0 +- **typescript**: ^5.9.3 +- **use-debounce**: ^10.0.6 -Install dependencies: -```bash -npm install -``` +### Dev Dependencies -Run development server: -```bash -npm run dev -``` +- **@tailwindcss/postcss**: ^4.1.15 +- **@types/three**: ^0.151.0 +- **@vitejs/plugin-react**: ^5.0.4 +- **autoprefixer**: ^10.4.20 +- **eslint**: ^8.57.1 +- **prettier**: ^3.6.2 +- **prettier-plugin-tailwindcss**: ^0.6.14 +- **sharp**: ^0.33.1 +- **tw-animate-css**: ^1.4.0 +- **vite**: ^7.1.7 -Build for production: -```bash -npm run build -``` +--- -Preview production build: -```bash -npm run preview -``` -## Styling +## File Structure -The project follows the same styling conventions as the source Mycelium website: -- **Font**: Inter (Google Fonts) -- **Colors**: Custom gray scale and cyan accent -- **Animations**: Framer Motion with reduced motion support -- **Design**: Tailwind CSS with custom theme extensions -## Migration Notes +- **Pages**: `src/pages` +- **Components**: `src/components` +- **Images**: `public/images`, `src/images` +- **CSS**: `src/index.css`, `src/App.css` -This website consolidates multiple one-pager sites into a single multi-page application. The Network page contains fully migrated content from the original www_mycelium_net repository, including: -- All animated SVG components -- Responsive layouts -- Hover effects and transitions -- Accessibility features + +--- + + +## Branding + + +- **Font**: 'Mulish', 'Neuton' +- **Logos**: `public/images/logo.svg`, `public/images/logomark.svg` + +--- + + +## Get Started + + +Follow these steps to get the project running locally: + + +1. **Install Dependencies**: + + `npm install` + +2. **Build the Project**: + + `npm run build` + +3. **Start the Development Server**: + + `npm run dev` + +--- + + +## 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 is composed of components from `src/components` and pages are defined in `src/pages`. + +To edit a specific section of the homepage, navigate to `src/components/` and modify the corresponding component file. + + +### Base Layout + +The base layout for all pages is defined in `src/components/Layout.tsx`. + + +### Creating a New Page + +To create a new page, add a new route in `src/App.tsx` and create a corresponding component in `src/pages`. + + +--- + + +## Contributing + + +- **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. + + +--- + + +## Report an Error + + +To report an issue, please use the following link and provide the requested information: + + +- **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: + + +- **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).