Local Administrator a8dc457742 fix(mobile): mobile menu unreadable + secondary nav overflowing + forum auth white-on-light
Critical mobile bugs flagged from an iPhone screenshot.

1) Mobile hamburger menu — all main nav items (HOME / SHOW COVERAGE /
   DIRECTORY / FORUM / READING LIST) were `text-white` on
   `bg-[#F8FAFC]`, i.e. white-on-light. Effectively invisible. Legacy
   styling from the dark-theme era that never got updated. Flipped to
   `text-[#0F172A]` + `hover:bg-[#FFFFFF]` + `border-[#DCE6F2]` to match
   the My Profile / WP Import links right below them that were already
   correctly themed.

2) Secondary top nav (social icons / language switcher / Sign In + Join
   / newsletter email input) was a single h-8 flex row that always
   rendered — on a phone-width viewport the row spills the email input
   off the right edge. Added `hidden md:flex` so the whole bar
   disappears on mobile. Affordances stay reachable via the hamburger
   menu, in-forum Sign In/Join buttons, and the footer.

3) Forum auth pages (login, register, forgot-password, reset-password)
   had `text-white` on every H1 AND on every form input that uses
   `bg-[#F8FAFC]`. So users opening any of those four pages saw a blank
   white card with invisible labels and couldn't see what they were
   typing into the password fields. Same dark-theme regression as #1.
   Blanket-replaced `text-white` with `text-[#0F172A]` across all four
   files, then restored `text-white` only inside classNames that also
   contain `bg-[#1D4ED8]` / `bg-[#1E3A8A]` / `brand-gradient` (the
   submit buttons — those WERE correct).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2026-06-04 22:22:18 +00:00

Next.js

A modern Next.js 15 application built with TypeScript and Tailwind CSS.

🚀 Features

  • Next.js 15 - Latest version with improved performance and features
  • React 19 - Latest React version with enhanced capabilities
  • Tailwind CSS - Utility-first CSS framework for rapid UI development

🛠️ Installation

  1. Install dependencies:
npm install
# or
yarn install
  1. Start the development server:
npm run dev
# or
yarn dev
  1. Open http://localhost:4028 with your browser to see the result.

📁 Project Structure

nextjs/
├── public/             # Static assets
├── src/
│   ├── app/            # App router components
│   │   ├── layout.tsx  # Root layout component
│   │   └── page.tsx    # Main page component
│   ├── components/     # Reusable UI components
│   ├── styles/         # Global styles and Tailwind configuration
├── next.config.mjs     # Next.js configuration
├── package.json        # Project dependencies and scripts
├── postcss.config.js   # PostCSS configuration
└── tailwind.config.js  # Tailwind CSS configuration

🧩 Page Editing

You can start editing the page by modifying src/app/page.tsx. The page auto-updates as you edit the file.

🎨 Styling

This project uses Tailwind CSS for styling with the following features:

  • Utility-first approach for rapid development
  • Custom theme configuration
  • Responsive design utilities
  • PostCSS and Autoprefixer integration

📦 Available Scripts

  • npm run dev - Start development server on port 4028
  • npm run build - Build the application for production
  • npm run start - Start the development server
  • npm run serve - Start the production server
  • npm run lint - Run ESLint to check code quality
  • npm run lint:fix - Fix ESLint issues automatically
  • npm run format - Format code with Prettier

📱 Deployment

Build the application for production:

npm run build

📚 Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

🙏 Acknowledgments

  • Built with Rocket.new
  • Powered by Next.js and React
  • Styled with Tailwind CSS

Built with ❤️ on Rocket.new

Description
AV Beat — Next.js + Supabase (cloned from broadcastbeat 2026-06-01)
Readme 207 MiB
Languages
TypeScript 93.7%
PLpgSQL 4.4%
CSS 1.6%
JavaScript 0.3%