diff --git a/packages/support/resources/views/assets.blade.php b/packages/support/resources/views/assets.blade.php index 1cf3bded70..11de77171e 100644 --- a/packages/support/resources/views/assets.blade.php +++ b/packages/support/resources/views/assets.blade.php @@ -14,4 +14,6 @@ :root { @foreach ($cssVariables ?? [] as $cssVariableName => $cssVariableValue) --{{ $cssVariableName }}:{{ $cssVariableValue }}; @endforeach } + + @foreach ($customColors ?? [] as $customColorName => $customColorShades) .fi-color-{{ $customColorName }} { @foreach ($customColorShades as $customColorShade) --color-{{ $customColorShade }}:var(--{{ $customColorName }}-{{ $customColorShade }}); @endforeach } @endforeach diff --git a/packages/support/src/Assets/AssetManager.php b/packages/support/src/Assets/AssetManager.php index 0f98f90606..d7251984d7 100644 --- a/packages/support/src/Assets/AssetManager.php +++ b/packages/support/src/Assets/AssetManager.php @@ -3,6 +3,7 @@ namespace Filament\Support\Assets; use Exception; +use Filament\Support\Colors\ColorManager; use Filament\Support\Facades\FilamentColor; use Illuminate\Support\Arr; @@ -265,11 +266,18 @@ class AssetManager */ public function renderStyles(?array $packages = null): string { - $variables = $this->getCssVariables($packages); + $cssVariables = $this->getCssVariables($packages); + $customColors = []; + + $defaultColorNames = array_keys(ColorManager::DEFAULT_COLORS); foreach (FilamentColor::getColors() as $name => $palette) { foreach (array_keys($palette) as $shade) { - $variables["{$name}-{$shade}"] = $this->resolveColorShadeFromPalette($palette, $shade); + $cssVariables["{$name}-{$shade}"] = $this->resolveColorShadeFromPalette($palette, $shade); + } + + if (! in_array($name, $defaultColorNames)) { + $customColors[$name] = array_keys($palette); } } @@ -281,7 +289,8 @@ class AssetManager $this->getFonts($packages), ), ], - 'cssVariables' => $variables, + 'cssVariables' => $cssVariables, + 'customColors' => $customColors, ])->render(); }