-
-
-
-
+
{{ config('app.name', 'Laravel') }}
diff --git a/resources/views/components/layouts/auth/simple.blade.php b/resources/views/components/layouts/auth/simple.blade.php
index 27628f6..968472e 100644
--- a/resources/views/components/layouts/auth/simple.blade.php
+++ b/resources/views/components/layouts/auth/simple.blade.php
@@ -17,9 +17,7 @@
-
-
-
+
{{ config('app.name', 'Laravel') }}
diff --git a/resources/views/components/layouts/auth/split.blade.php b/resources/views/components/layouts/auth/split.blade.php
index 20cc36e..421c759 100644
--- a/resources/views/components/layouts/auth/split.blade.php
+++ b/resources/views/components/layouts/auth/split.blade.php
@@ -17,11 +17,9 @@
-
-
-
-
- {{ config('app.name', 'Laravel') }}
+
+
+ {{ config('app.name', 'Laravel') }}
@php
@@ -38,10 +36,7 @@
-
-
-
-
+
{{ config('app.name', 'Laravel') }}
{{ $slot }}
diff --git a/resources/views/components/logo.blade.php b/resources/views/components/logo.blade.php
index 78ba859..b661e20 100644
--- a/resources/views/components/logo.blade.php
+++ b/resources/views/components/logo.blade.php
@@ -1,29 +1,17 @@
-@props(['size' => 'default', 'variant' => 'full'])
+@props(['size' => 'md'])
@php
-$variants = [
- 'full' => 'logo.svg',
- 'reversed' => 'logo-reversed.svg',
- 'mono' => 'logo-mono.svg',
+$sizes = [
+ 'sm' => 'h-10 w-10', // 40px - Mobile nav
+ 'md' => 'h-12 w-12', // 48px - Desktop nav
+ 'lg' => 'h-16 w-16', // 64px - Footer
+ 'xl' => 'h-20 w-20', // 80px - Auth pages
];
-$logoFile = $variants[$variant] ?? $variants['full'];
+$sizeClass = $sizes[$size] ?? $sizes['md'];
@endphp
-@if(file_exists(public_path('images/' . $logoFile)))
-
$size === 'small',
- 'h-12' => $size === 'default',
- 'h-16' => $size === 'large',
- ])
- />
-@else
- $size === 'small',
- 'text-2xl' => $size === 'default',
- 'text-3xl' => $size === 'large',
- ])>LIBRA
-@endif
+
merge(['class' => $sizeClass . ' object-contain']) }}
+/>
diff --git a/resources/views/components/navigation.blade.php b/resources/views/components/navigation.blade.php
index fc8ee22..d649300 100644
--- a/resources/views/components/navigation.blade.php
+++ b/resources/views/components/navigation.blade.php
@@ -8,7 +8,7 @@
@@ -32,7 +32,7 @@
-
+
diff --git a/resources/views/partials/head.blade.php b/resources/views/partials/head.blade.php
index 95c05b6..ccb62c8 100644
--- a/resources/views/partials/head.blade.php
+++ b/resources/views/partials/head.blade.php
@@ -3,9 +3,14 @@
{{ $title ?? config('app.name') }}
-
-
-
+{{-- Favicons --}}
+
+
+
+
+
+
+
diff --git a/tests/Feature/Components/LogoComponentTest.php b/tests/Feature/Components/LogoComponentTest.php
index 20fe475..d5fee78 100644
--- a/tests/Feature/Components/LogoComponentTest.php
+++ b/tests/Feature/Components/LogoComponentTest.php
@@ -1,82 +1,138 @@
blade(' ');
$view->assertSee('LIBRA for Rights');
- $view->assertSee('logo.svg');
+ $view->assertSee('logo.png');
});
-test('logo component renders small size variant', function () {
- $view = $this->blade(' ');
+test('app-logo component renders small size variant', function () {
+ $view = $this->blade(' ');
- $view->assertSee('h-8');
+ $view->assertSee('h-8', false);
+ $view->assertSee('w-8', false);
});
-test('logo component renders default size variant', function () {
- $view = $this->blade(' ');
+test('app-logo component renders default size variant', function () {
+ $view = $this->blade(' ');
- $view->assertSee('h-12');
+ $view->assertSee('h-10', false);
+ $view->assertSee('w-10', false);
});
-test('logo component renders large size variant', function () {
- $view = $this->blade(' ');
+test('app-logo component renders large size variant', function () {
+ $view = $this->blade(' ');
- $view->assertSee('h-16');
+ $view->assertSee('h-12', false);
+ $view->assertSee('w-12', false);
});
-test('logo component renders reversed color variant', function () {
- $view = $this->blade(' ');
-
- $view->assertSee('logo-reversed.svg');
-});
-
-test('logo component renders mono color variant', function () {
- $view = $this->blade(' ');
-
- $view->assertSee('logo-mono.svg');
-});
-
-test('logo component renders without text when showText is false', function () {
+test('app-logo component renders without text when showText is false', function () {
$view = $this->blade(' ');
$view->assertDontSee('blade(' ');
$view->assertSee('assertSee('LIBRA for Rights');
});
-test('logo has accessible alt text', function () {
+test('app-logo has accessible alt text', function () {
$view = $this->blade(' ');
$view->assertSee('alt="LIBRA for Rights"', false);
});
-test('logo has PNG fallback via onerror attribute', function () {
- $view = $this->blade(' ');
-
- $view->assertSee('logo.png', false);
- $view->assertSee('onerror', false);
-});
-
-test('logo component accepts custom classes', function () {
+test('app-logo component accepts custom classes', function () {
$view = $this->blade(' ');
$view->assertSee('custom-class', false);
});
-test('logo component has correct minimum width for desktop', function () {
- $view = $this->blade(' ');
+// x-logo component tests
+test('logo component renders with default md size', function () {
+ $view = $this->blade(' ');
- $view->assertSee('min-w-[120px]', false);
+ $view->assertSee('logo.png');
+ $view->assertSee('h-12', false);
+ $view->assertSee('w-12', false);
});
-test('logo component has correct minimum width for mobile', function () {
- $view = $this->blade(' ');
+test('logo component renders sm size for mobile nav', function () {
+ $view = $this->blade(' ');
- $view->assertSee('min-w-[80px]', false);
+ $view->assertSee('h-10', false);
+ $view->assertSee('w-10', false);
+});
+
+test('logo component renders lg size for footer', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('h-16', false);
+ $view->assertSee('w-16', false);
+});
+
+test('logo component renders xl size for auth pages', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('h-20', false);
+ $view->assertSee('w-20', false);
+});
+
+test('logo component has accessible alt text', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('alt="LIBRA for Rights"', false);
+});
+
+test('logo component accepts custom classes', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('custom-test-class', false);
+});
+
+test('logo component has object-contain for aspect ratio', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('object-contain', false);
+});
+
+// x-app-logo-icon component tests
+test('app-logo-icon component renders with default md size', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('logo.png');
+ $view->assertSee('h-9', false);
+ $view->assertSee('w-9', false);
+});
+
+test('app-logo-icon component renders sm size', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('h-7', false);
+ $view->assertSee('w-7', false);
+});
+
+test('app-logo-icon component renders lg size', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('h-12', false);
+ $view->assertSee('w-12', false);
+});
+
+test('app-logo-icon has accessible alt text', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('alt="LIBRA for Rights"', false);
+});
+
+test('app-logo-icon component accepts custom classes', function () {
+ $view = $this->blade(' ');
+
+ $view->assertSee('icon-custom-class', false);
});
merge(['class' => $sizeClass . ' object-contain']) }}
+/>
diff --git a/resources/views/components/navigation.blade.php b/resources/views/components/navigation.blade.php
index fc8ee22..d649300 100644
--- a/resources/views/components/navigation.blade.php
+++ b/resources/views/components/navigation.blade.php
@@ -8,7 +8,7 @@
@@ -32,7 +32,7 @@
-