Skip to content

Commit e29b015

Browse files
committed
Implement dark mode and navigation updates
- Add dark mode support across multiple views including home page and header - Update navigation menu items (replace Dashboard with Home, add Report) - Add user-links relationship in User model - Adjust header styling with dark background - Improve responsive design and layout consistency The changes enhance UI/UX with dark mode support and better navigation structure while maintaining existing functionality.
1 parent 5073268 commit e29b015

7 files changed

Lines changed: 136 additions & 91 deletions

File tree

app/Models/User.php

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@
66
use Illuminate\Database\Eloquent\Factories\HasFactory;
77
use Illuminate\Foundation\Auth\User as Authenticatable;
88
use Illuminate\Notifications\Notifiable;
9+
use App\Models\Link;
910

1011
class User extends Authenticatable
1112
{
@@ -46,4 +47,12 @@ protected function casts(): array
4647
'password' => 'hashed',
4748
];
4849
}
50+
51+
/**
52+
* Get the links for the user.
53+
*/
54+
public function links()
55+
{
56+
return $this->hasMany(Link::class);
57+
}
4958
}

resources/js/components/app-header.tsx

Lines changed: 8 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,15 @@ import AppLogoIcon from './app-logo-icon';
1717

1818
const mainNavItems: NavItem[] = [
1919
{
20-
title: 'Dashboard',
21-
href: '/dashboard',
20+
title: 'Home',
21+
href: '/home',
2222
icon: LayoutGrid,
2323
},
24+
{
25+
title: 'Report',
26+
href: '/report',
27+
icon: BookOpen,
28+
},
2429
];
2530

2631
const rightNavItems: NavItem[] = [
@@ -48,7 +53,7 @@ export function AppHeader({ breadcrumbs = [] }: AppHeaderProps) {
4853
const getInitials = useInitials();
4954
return (
5055
<>
51-
<div className="border-sidebar-border/80 border-b">
56+
<div className="border-sidebar-border/80 border-b bg-neutral-900 text-white">
5257
<div className="mx-auto flex h-16 items-center px-4 md:max-w-7xl">
5358
{/* Mobile Menu */}
5459
<div className="lg:hidden">
Lines changed: 38 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,44 @@
1-
<div class="max-w-4xl mx-auto py-12 px-4">
2-
<div class="text-center mb-12">
3-
<h1 class="text-4xl font-bold mb-6">Recent URL Ratings</h1>
4-
<a href="{{ route('google.login') }}"
5-
class="inline-block px-8 py-4 bg-blue-600 text-white text-xl font-bold rounded-lg hover:bg-blue-700 transition">
6-
Login with Google to Rate URLs
7-
</a>
8-
</div>
9-
10-
<div class="space-y-6">
11-
@foreach ($recentRatings as $rating)
12-
<div class="p-6 border rounded-lg shadow-sm">
13-
<div class="flex items-center justify-between">
14-
<div>
15-
<a href="{{ route('links.show', $rating->link) }}" class="text-blue-600 hover:underline">
16-
{{ $rating->link->url }}
1+
<x-layouts.app>
2+
<div class="py-12">
3+
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
4+
<div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
5+
<div class="p-6 text-gray-900 dark:text-gray-100">
6+
<div class="text-center mb-12">
7+
<h1 class="text-4xl font-bold mb-6">Recent URL Ratings</h1>
8+
<a href="{{ route('google.login') }}"
9+
class="inline-block px-8 py-4 bg-blue-600 dark:bg-blue-500 text-white text-xl font-bold rounded-lg hover:bg-blue-700 dark:hover:bg-blue-600 transition">
10+
Login with Google to Rate URLs
1711
</a>
18-
<div class="text-gray-600 mt-1">
19-
Rated by {{ $rating->user->name }}
20-
</div>
2112
</div>
22-
<div class="text-2xl font-bold {{ $rating->score > 0 ? 'text-green-600' : 'text-red-600' }}">
23-
{{ $rating->score }}
13+
14+
<div class="space-y-6">
15+
@foreach ($recentRatings as $rating)
16+
<div class="p-6 border dark:border-gray-700 rounded-lg shadow-sm dark:bg-gray-700/50">
17+
<div class="flex items-center justify-between">
18+
<div>
19+
<a href="{{ route('links.show', $rating->link) }}"
20+
class="text-blue-600 dark:text-blue-400 hover:underline">
21+
{{ $rating->link->url }}
22+
</a>
23+
<div class="text-gray-600 dark:text-gray-400 mt-1">
24+
Rated by {{ $rating->user->name }}
25+
</div>
26+
</div>
27+
<div
28+
class="text-2xl font-bold {{ $rating->score > 0 ? 'text-green-600 dark:text-green-400' : 'text-red-600 dark:text-red-400' }}">
29+
{{ $rating->score }}
30+
</div>
31+
</div>
32+
@if ($rating->evidence->count() > 0)
33+
<div class="mt-4 text-sm text-gray-500 dark:text-gray-400">
34+
{{ $rating->evidence->count() }} pieces of evidence
35+
</div>
36+
@endif
37+
</div>
38+
@endforeach
2439
</div>
2540
</div>
26-
@if ($rating->evidence->count() > 0)
27-
<div class="mt-4 text-sm text-gray-500">
28-
{{ $rating->evidence->count() }} pieces of evidence
29-
</div>
30-
@endif
3141
</div>
32-
@endforeach
42+
</div>
3343
</div>
34-
</div>
44+
</x-layouts.app>
Lines changed: 49 additions & 41 deletions
Original file line numberDiff line numberDiff line change
@@ -1,50 +1,58 @@
1-
<div class="max-w-lg mx-auto mt-12 p-6 bg-white rounded-lg shadow-md">
2-
<div class="mb-8">
3-
<h1 class="text-2xl font-bold mb-2">Link Details</h1>
4-
<a href="{{ $link->url }}" target="_blank" class="text-blue-600 hover:underline">
5-
{{ $link->url }}
6-
</a>
7-
<div class="mt-4 text-xl">
8-
Total Rating: <span class="font-bold">{{ $this->totalRating }}</span>
9-
</div>
10-
</div>
1+
<x-layouts.app>
2+
<div class="py-12">
3+
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
4+
<div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
5+
<div class="p-6 text-gray-900 dark:text-gray-100">
6+
<h1 class="text-2xl font-bold mb-4">Link Details</h1>
7+
<a href="{{ $link->url }}" target="_blank" class="text-blue-600 dark:text-blue-400 hover:underline">
8+
{{ $link->url }}
9+
</a>
10+
<div class="mt-4 text-xl">
11+
Total Rating: <span class="font-bold">{{ $this->totalRating }}</span>
12+
</div>
1113

12-
<div class="mb-8">
13-
<h2 class="text-xl font-bold mb-4">Rate This Link</h2>
14-
@livewire('links.rating-slider', ['link' => $link])
15-
</div>
14+
<div class="mt-8">
15+
<h2 class="text-xl font-bold mb-4">Rate This Link</h2>
16+
@livewire('links.rating-slider', ['link' => $link])
17+
</div>
1618

17-
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
18-
<div>
19-
<h2 class="text-xl font-bold mb-4">Positive Ratings ({{ $this->positiveRatings->count() }})</h2>
20-
<div class="space-y-4">
21-
@foreach ($this->positiveRatings as $rating)
22-
<div class="p-4 bg-green-50 rounded-lg">
23-
<div class="font-medium">Rating: {{ $rating->score }}</div>
24-
@if ($rating->evidence->count() > 0)
25-
<div class="mt-2 text-sm">
26-
Evidence: {{ $rating->evidence->count() }} items
19+
<div class="mt-8 grid grid-cols-1 md:grid-cols-2 gap-8">
20+
<div>
21+
<h2 class="text-xl font-bold mb-4">Positive Ratings ({{ $this->positiveRatings->count() }})
22+
</h2>
23+
<div class="space-y-4">
24+
@foreach ($this->positiveRatings as $rating)
25+
<div class="p-4 bg-green-50 dark:bg-green-900/20 rounded-lg">
26+
<div class="font-medium">Rating: {{ $rating->score }}</div>
27+
@if ($rating->evidence->count() > 0)
28+
<div class="mt-2 text-sm">
29+
Evidence: {{ $rating->evidence->count() }} items
30+
</div>
31+
@endif
32+
</div>
33+
@endforeach
2734
</div>
28-
@endif
29-
</div>
30-
@endforeach
31-
</div>
32-
</div>
35+
</div>
3336

34-
<div>
35-
<h2 class="text-xl font-bold mb-4">Negative Ratings ({{ $this->negativeRatings->count() }})</h2>
36-
<div class="space-y-4">
37-
@foreach ($this->negativeRatings as $rating)
38-
<div class="p-4 bg-red-50 rounded-lg">
39-
<div class="font-medium">Rating: {{ $rating->score }}</div>
40-
@if ($rating->evidence->count() > 0)
41-
<div class="mt-2 text-sm">
42-
Evidence: {{ $rating->evidence->count() }} items
37+
<div>
38+
<h2 class="text-xl font-bold mb-4">Negative Ratings ({{ $this->negativeRatings->count() }})
39+
</h2>
40+
<div class="space-y-4">
41+
@foreach ($this->negativeRatings as $rating)
42+
<div class="p-4 bg-red-50 dark:bg-red-900/20 rounded-lg">
43+
<div class="font-medium">Rating: {{ $rating->score }}</div>
44+
@if ($rating->evidence->count() > 0)
45+
<div class="mt-2 text-sm">
46+
Evidence: {{ $rating->evidence->count() }} items
47+
</div>
48+
@endif
49+
</div>
50+
@endforeach
4351
</div>
44-
@endif
52+
</div>
4553
</div>
46-
@endforeach
54+
</div>
4755
</div>
4856
</div>
4957
</div>
50-
</div>
58+
</x-layouts.app>
Lines changed: 28 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,29 @@
1-
<div>
2-
<form wire:submit.prevent="submit">
3-
<div class="mb-4">
4-
<label for="url" class="block text-sm font-medium text-gray-700">Submit a URL</label>
5-
<input type="url" id="url" wire:model="url"
6-
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500"
7-
placeholder="https://example.com">
8-
@error('url')
9-
<span class="text-red-500 text-sm">{{ $message }}</span>
10-
@enderror
11-
</div>
1+
<x-layouts.app>
2+
<div class="py-12">
3+
<div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
4+
<div class="bg-white dark:bg-gray-800 overflow-hidden shadow-sm sm:rounded-lg">
5+
<div class="p-6 text-gray-900 dark:text-gray-100">
6+
<h1 class="text-2xl font-bold mb-6">Submit New Link</h1>
7+
<form wire:submit.prevent="submit">
8+
<div class="mb-4">
9+
<label for="url" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
10+
URL
11+
</label>
12+
<input type="url" id="url" wire:model="url"
13+
class="mt-1 block w-full rounded-md border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-gray-300 shadow-sm focus:border-indigo-500 focus:ring-indigo-500"
14+
placeholder="https://example.com">
15+
@error('url')
16+
<span class="text-red-500 text-sm">{{ $message }}</span>
17+
@enderror
18+
</div>
1219

13-
<button type="submit" class="px-4 py-2 bg-indigo-600 text-white rounded-md hover:bg-indigo-700">
14-
Submit URL
15-
</button>
16-
</form>
17-
</div>
20+
<button type="submit"
21+
class="px-4 py-2 bg-indigo-600 text-white rounded-md hover:bg-indigo-700 dark:bg-indigo-500 dark:hover:bg-indigo-600">
22+
Submit URL
23+
</button>
24+
</form>
25+
</div>
26+
</div>
27+
</div>
28+
</div>
29+
</x-layouts.app>

routes/web.php

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,10 @@
88
Route::get('/', \App\Livewire\HomePage::class)->name('home');
99

1010
Route::middleware(['auth', 'verified'])->group(function () {
11-
Route::get('dashboard', function () {
12-
return Inertia::render('dashboard');
11+
Route::get('home', function () {
12+
return Inertia::render('dashboard', [
13+
'links' => auth()->user()->links()->latest()->take(5)->get(),
14+
]);
1315
})->name('dashboard');
1416
});
1517

vite.config.ts

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,6 @@ export default defineConfig({
1111
ssr: 'resources/js/ssr.tsx',
1212
refresh: true,
1313
}),
14-
react(),
1514
tailwindcss(),
1615
],
1716
esbuild: {

0 commit comments

Comments
 (0)