tiennm99/coolify
1
0 Fork 0
mirror of https://github.com/tiennm99/coolify.git synced 2026-10-14 20:17:05 +00:00
Code Issues Packages Projects Releases Wiki Activity

style(ui): refine focus ring thickness and warning color

Browse Source
This commit is contained in:
Andras Bacsai committed 2026-08-10 11:52:24 +02:00
1 parent f412b2bf0d
commit a84505efe8
5 files changed
+13 -11
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

tests/Feature/DashboardDeploymentsTest.php
+4 -3
View File
@@ -56,11 +56,12 @@ function createDashboardDeployment(array $overrides = []): ApplicationDeployment
it('shows a visible yellow inset focus state on deployment rows', function () {
$view = file_get_contents(resource_path('views/livewire/dashboard/active-deployments.blade.php'));
expect(substr_count($view, 'focus-visible:bg-warning/[0.06]'))->toBe(4)
expect(substr_count($view, 'focus-visible:bg-warning/10'))->toBe(4)
->and(substr_count($view, 'focus-visible:ring-1'))->toBe(2)
->and(substr_count($view, 'focus-visible:ring-inset'))->toBe(2)
->and(substr_count($view, 'focus-visible:ring-warning/70'))->toBe(2)
->and(substr_count($view, 'focus-visible:ring-warning'))->toBe(2)
->and(substr_count($view, 'focus-visible:ring-offset-0'))->toBe(2)
->and(substr_count($view, 'dark:focus-visible:bg-warning/[0.06]'))->toBe(2);
->and(substr_count($view, 'dark:focus-visible:bg-warning/10'))->toBe(2);
});
it('hides the deployments section when there is nothing to show', function () {
tests/Unit/DarkModeFocusRingTest.php
+4 -3
View File
@@ -1,11 +1,12 @@
<?php
it('uses a subtle warning yellow focus ring in dark mode', function () {
it('uses a thin warning yellow focus ring in dark mode', function () {
$appStyles = file_get_contents(dirname(__DIR__, 2).'/resources/css/app.css');
$v5Styles = file_get_contents(dirname(__DIR__, 2).'/resources/css/v5/app.css');
expect($appStyles)
->toContain('ring-coollabs dark:ring-warning/70')
->toContain('ring-2 ring-coollabs dark:ring-1 dark:ring-warning')
->and($v5Styles)
->toMatch('/\.dark\s*\{[^}]*--ring:\s*color-mix\(in srgb, var\(--warning\) 70%, transparent\);/s');
->toMatch('/\.dark\s*\{[^}]*--ring:\s*var\(--warning\);/s')
->toContain('ring-2 dark:ring-1 ring-ring');
});