complete story 10.2
This commit is contained in:
@@ -10,7 +10,7 @@ test('card component renders with default variant', function () {
|
||||
$html = Blade::render('<x-ui.card>Card content</x-ui.card>');
|
||||
|
||||
expect($html)
|
||||
->toContain('bg-cream')
|
||||
->toContain('bg-off-white')
|
||||
->toContain('rounded-lg')
|
||||
->toContain('p-6')
|
||||
->toContain('shadow-card')
|
||||
@@ -21,7 +21,7 @@ test('card component renders with elevated variant', function () {
|
||||
$html = Blade::render('<x-ui.card variant="elevated">Elevated card</x-ui.card>');
|
||||
|
||||
expect($html)
|
||||
->toContain('bg-cream')
|
||||
->toContain('bg-off-white')
|
||||
->toContain('rounded-lg')
|
||||
->toContain('p-6')
|
||||
->toContain('shadow-md')
|
||||
@@ -55,7 +55,7 @@ test('card component applies highlight border when highlight is true', function
|
||||
|
||||
expect($html)
|
||||
->toContain('border-s-4')
|
||||
->toContain('border-gold')
|
||||
->toContain('border-warm-gray')
|
||||
->toContain('Highlighted card');
|
||||
});
|
||||
|
||||
@@ -64,7 +64,7 @@ test('card component does not apply highlight border when highlight is false', f
|
||||
|
||||
expect($html)
|
||||
->not->toContain('border-s-4')
|
||||
->not->toContain('border-gold')
|
||||
->not->toContain('border-warm-gray')
|
||||
->toContain('Normal card');
|
||||
});
|
||||
|
||||
@@ -73,7 +73,7 @@ test('card component allows custom classes via attributes', function () {
|
||||
|
||||
expect($html)
|
||||
->toContain('custom-class')
|
||||
->toContain('bg-cream')
|
||||
->toContain('bg-off-white')
|
||||
->toContain('Custom class card');
|
||||
});
|
||||
|
||||
@@ -86,7 +86,7 @@ test('card component supports multiple props together', function () {
|
||||
->toContain('hover:-translate-y-0.5')
|
||||
->toContain('cursor-pointer')
|
||||
->toContain('border-s-4')
|
||||
->toContain('border-gold')
|
||||
->toContain('border-warm-gray')
|
||||
->toContain('Full featured card');
|
||||
});
|
||||
|
||||
@@ -102,14 +102,14 @@ test('stat card displays value and label correctly', function () {
|
||||
->toContain('Total Items')
|
||||
->toContain('text-2xl')
|
||||
->toContain('font-bold')
|
||||
->toContain('text-navy');
|
||||
->toContain('text-charcoal');
|
||||
});
|
||||
|
||||
test('stat card renders icon when provided', function () {
|
||||
$html = Blade::render('<x-ui.stat-card icon="users" value="100" label="Users" />');
|
||||
|
||||
expect($html)
|
||||
->toContain('bg-gold/10')
|
||||
->toContain('bg-warm-gray/10')
|
||||
->toContain('rounded-lg')
|
||||
->toContain('100')
|
||||
->toContain('Users');
|
||||
@@ -120,7 +120,7 @@ test('stat card hides icon container when icon is null', function () {
|
||||
|
||||
// Icon container should not be rendered when icon is null
|
||||
expect($html)
|
||||
->not->toContain('bg-gold/10')
|
||||
->not->toContain('bg-warm-gray/10')
|
||||
->toContain('50')
|
||||
->toContain('Items');
|
||||
});
|
||||
@@ -175,7 +175,7 @@ test('stat card is wrapped in a card component', function () {
|
||||
|
||||
// Should contain card styling
|
||||
expect($html)
|
||||
->toContain('bg-cream')
|
||||
->toContain('bg-off-white')
|
||||
->toContain('rounded-lg')
|
||||
->toContain('p-6');
|
||||
});
|
||||
@@ -184,7 +184,7 @@ test('stat card displays all elements together', function () {
|
||||
$html = Blade::render('<x-ui.stat-card icon="chart-bar" value="1,234" label="Total Sales" :trend="25" />');
|
||||
|
||||
expect($html)
|
||||
->toContain('bg-gold/10') // Icon container
|
||||
->toContain('bg-warm-gray/10') // Icon container
|
||||
->toContain('1,234') // Value
|
||||
->toContain('Total Sales') // Label
|
||||
->toContain('+25%') // Trend
|
||||
|
||||
@@ -213,11 +213,16 @@ describe('Tailwind Colors', function () {
|
||||
test('app.css contains brand colors', function () {
|
||||
$css = file_get_contents(resource_path('css/app.css'));
|
||||
|
||||
expect($css)->toContain('--color-navy: #0A1F44');
|
||||
expect($css)->toContain('--color-gold: #D4AF37');
|
||||
expect($css)->toContain('--color-gold-light: #F4E4B8');
|
||||
expect($css)->toContain('--color-cream: #F9F7F4');
|
||||
expect($css)->toContain('--color-charcoal: #2C3E50');
|
||||
// New brand palette from Story 10.1
|
||||
expect($css)->toContain('--color-primary: #4A4A42'); // Charcoal
|
||||
expect($css)->toContain('--color-accent: #C9C4BA'); // Warm Gray
|
||||
expect($css)->toContain('--color-accent-light: #E8E4DC'); // Off-White
|
||||
expect($css)->toContain('--color-background: #E8E4DC'); // Off-White
|
||||
expect($css)->toContain('--color-text: #1A1A1A'); // Deep Black
|
||||
|
||||
// Backward compatibility aliases (mapped to new colors)
|
||||
expect($css)->toContain('--color-navy: var(--color-primary)');
|
||||
expect($css)->toContain('--color-gold: var(--color-accent)');
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
Reference in New Issue
Block a user