devadex247/AfriCut-Sell

AfriCut Sell is a mobile-first, Dala Studio-powered AI assistant that helps African small businesses turn raw product or service videos into sales-ready social content—hooks, video overlays, CTAs, captions, WhatsApp Status copy, hashtags, and style recommendations. It helps sell and create content that help buisness grow. # React + Vite + shadcn/ui Starter Template A modern React starter template built with Vite, TypeScript, Tailwind CSS, and shadcn/ui components. ## 🚀 Features - ⚡️ **Vite** - Fast build tool and development server - ⚛️ **React 18** - Latest React with hooks support - 🎯 **TypeScript** - Type safety and better developer experience - 🎨 **Tailwind CSS** - Utility-first CSS framework - 🧩 **shadcn/ui** - Beautifully designed components built with Radix UI - 📦 **Path Mapping** - Clean imports with `@/` prefix ## 📦 Included shadcn/ui Components - Button - Card - Input - Label - Badge - Dialog - And more... ## 🛠️ Getting Started 1. **Install dependencies** ```bash npm install ``` 2. **Start development server** ```bash npm run dev ``` 3. **Build for production** ```bash npm run build ``` 4. **Preview production build** ```bash npm run preview ``` ## 📁 Project Structure ``` src/ ├── components/ │ └── ui/ # shadcn/ui components ├── lib/ │ └── utils.ts # Utility functions ├── App.tsx # Main application component ├── index.css # Global styles with Tailwind └── main.tsx # Application entry point ``` ## 🎨 Customization ### Adding New shadcn/ui Components This template is pre-configured with shadcn/ui. You can add more components by creating them in the `src/components/ui/` directory. ### Tailwind Configuration The Tailwind configuration is set up with shadcn/ui color variables. You can customize colors and other design tokens in: - `tailwind.config.js` - Tailwind configuration - `src/index.css` - CSS custom properties for themes ### TypeScript Configuration Path mapping is configured for clean imports: ```typescript import { Button } from "@/components/ui/button"; import { cn } from "@/lib/utils"; ``` ## 🌗 Dark Mode The template includes dark mode support through Tailwind's `dark:` classes and CSS custom properties. ## 📚 Learn More - Vite Documentation - React Documentation - Tailwind CSS - sh …