- How do I install the Northwestern Filament theme without breaking my existing Filament setup?
- Run `composer require northwestern-sysdev/northwestern-filament-theme` and register the plugin in your `PanelProvider` using `NorthwesternTheme::make()`. The theme adds CSS layers without replacing your current theme, so existing `viteTheme()` or custom styles remain intact. Always test in staging first to check for conflicts.
- Does this theme work with Laravel 11 or Filament 3?
- No, this package explicitly supports Laravel 12/13 and Filament 4.x/5.x. If you’re on Laravel 11 or Filament 3, you’ll need to upgrade first or look for alternative solutions. The package leverages modern Filament features like the plugin system and asset pipeline.
- Can I use this theme if my app blocks external CDN requests (e.g., common.northwestern.edu)?
- No, the theme relies on Northwestern’s CDN for fonts, logos, and other assets. If your environment blocks external domains, you’ll need to self-host these assets or avoid using the package. Check your CSP or network policies before installation.
- How do I customize the footer or disable the environment indicator?
- Publish the theme’s views with `php artisan vendor:publish --tag=northwestern-filament-theme-views`, then modify the published files. To disable components like the environment indicator, use method chaining in your `PanelProvider`: `NorthwesternTheme::make()->withoutEnvironmentIndicator()`.
- Will this theme conflict with other Filament plugins like pxlrbt/filament-environment-indicator?
- Yes, the package includes its own environment indicator. If you already use `pxlrbt/filament-environment-indicator`, unregister it first or configure the Northwestern theme to avoid duplicates. The package will warn you during setup if conflicts are detected.
- Do I need Tailwind CSS v4+ for this theme, or will v3 work?
- This theme requires Tailwind CSS v4+ to use design tokens like `bg-nu-purple-100` or `text-nu-gold`. If you’re on Tailwind v3, you’ll either need to upgrade or use the theme’s standalone CSS without the utility classes. Check your `tailwind.config.js` for compatibility.
- How do I integrate this theme with Vite for a single CSS bundle?
- Run `php artisan northwestern-theme:install` to generate a Vite-compatible theme file. This imports the Northwestern styles directly into your panel’s CSS, allowing you to override styles and use design tokens. Ensure your `vite.config.js` is configured for Filament’s asset pipeline.
- What’s the best way to test this theme before deploying to production?
- Start by running `php artisan filament:assets` in a staging environment to load the theme CSS. Test all Filament pages, especially dark mode, forms, and modals, for visual consistency. Use browser dev tools to inspect for CSS conflicts or missing assets (e.g., fonts).
- Can I use this theme in a multi-tenant Laravel app where some clients aren’t Northwestern?
- Yes, but you’ll need to conditionally load the theme. Wrap the plugin registration in a check (e.g., `if (auth()->user()->isNorthwestern())`) or use Filament’s dynamic plugins. The theme’s additive design makes it easy to toggle on/off per tenant.
- Are there alternatives if I need a different university or corporate branding theme?
- For other institutions, check if they offer official Filament themes (e.g., Harvard, MIT). For custom branding, consider building a theme using Filament’s `viteTheme()` or tools like `laravel-breeze` with Tailwind. Packages like `spatie/laravel-theme` can also help manage multiple themes in one app.