Compare commits

...

18 Commits

Author SHA1 Message Date
imadhigp e6b5166782 set code structures 2026-08-07 10:13:29 +05:30
imadhigp db3373002d admin set 3 2026-08-07 09:07:35 +05:30
imadhigp d24235a2b7 admin pages 2026-08-06 16:43:59 +05:30
imadhigp 679e37b780 set mycourese 2026-08-05 12:58:03 +05:30
imadhigp 41934b31fc set result and timetable pages 2026-08-05 10:21:54 +05:30
imadhigp 5d76c711f7 set lms parts 2026-08-04 10:36:33 +05:30
imadhigp 705917497d new chages add 2026-08-03 16:29:58 +05:30
imadhigp 897cd82bc6 set 0731 2026-07-31 09:00:01 +05:30
imadhigp d63e9c0a2b set courese backend 2026-07-28 16:46:11 +05:30
imadhigp fa299bcd7c set forget password backend 2026-07-28 11:56:20 +05:30
imadhigp 309934c18f forget password set 2026-07-27 17:01:28 +05:30
imadhigp a03cfc0f40 ui change new themes 2026-07-23 16:53:17 +05:30
imadhigp 5ca81c9b24 set new themes 0722 2026-07-22 17:06:18 +05:30
imadhigp 021ec03fda set new themes 0721 2026-07-21 16:57:33 +05:30
imadhigp 2e799d798a change themes 0720 2026-07-20 17:02:26 +05:30
imadhigp 4289f1d576 change themes 2026-07-18 17:01:09 +05:30
imadhigp 37cd68f170 change themes blue and red 2026-07-17 17:01:32 +05:30
imadhigp 4f3a79c114 7/16 push home 2026-07-16 19:20:24 +05:30
61 changed files with 7998 additions and 3089 deletions

View File

@ -0,0 +1,75 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
use Illuminate\Support\Facades\Hash;
class AdminAuthController extends Controller
{
public function showLoginForm()
{
return view('adminlogin');
}
public function login(Request $request)
{
// 1. set Validation
$request->validate([
'username' => 'required',
'password' => 'required',
]);
$admin = DB::table('adminlogins')->where('username', $request->username)->first();
if ($admin && Hash::check($request->password, $admin->password)) {
$request->session()->regenerate();
session([
'admin_id' => $admin->id,
'admin_username' => $admin->username
]);
return response()->json([
'success' => true,
'message' => 'Login Successful!',
'redirect_url' => route('admin.mycourses') // නැතහොත් route('admin.admindashboard')
]);
}
return response()->json([
'success' => false,
'message' => 'Wrong Username or Password!'
], 401);
}
public function logout(Request $request)
{
$request->session()->forget(['admin_id', 'admin_username']);
$request->session()->invalidate();
$request->session()->regenerateToken();
if ($request->ajax() || $request->wantsJson()) {
return response()->json([
'success' => true,
'redirect_url' => route('admin.login')
]);
}
return redirect()->route('admin.login')->with('success', 'Logged out successfully!');
}
}

View File

@ -0,0 +1,43 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Timetable;
use App\Models\Notification;
class AdminDashboardController extends Controller
{
public function index()
{
if (!session()->has('admin_id')) {
return redirect()->route('admin.login')->with('error', 'Please login first.');
}
$totalTimetableSlots = Timetable::count();
$unreadNotifications = Notification::where('target_role', 'admin')
->where('is_read', false)
->count();
$notifications = Notification::where('target_role', 'admin')
->orderBy('created_at', 'desc')
->take(5)
->get();
return view('admin.admindashboard', compact(
'totalTimetableSlots',
'unreadNotifications',
'notifications'
));
}
public function markAsRead($id)
{
$notification = Notification::findOrFail($id);
$notification->update(['is_read' => true]);
return redirect()->back()->with('success', 'Notification marked as read!');
}
}

View File

@ -0,0 +1,60 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Hash;
use App\Models\AdminLogin;
class AdminProfileController extends Controller
{
// Display Admin Profile
public function index()
{
$adminId = session('admin_id');
$admin = AdminLogin::find($adminId);
return view('admin.adminprofile', compact('admin'));
}
// Update Username Information
public function update(Request $request)
{
$adminId = session('admin_id');
$admin = AdminLogin::findOrFail($adminId);
$request->validate([
'username' => 'required|string|max:255|unique:adminlogins,username,' . $admin->id,
]);
$admin->update([
'username' => $request->username,
]);
return redirect()->back()->with('success', 'Username updated successfully!');
}
// Change Password
public function updatePassword(Request $request)
{
$request->validate([
'current_password' => 'required',
'new_password' => 'required|min:6|confirmed',
]);
$adminId = session('admin_id');
$admin = AdminLogin::findOrFail($adminId);
// Verify current password
if (!Hash::check($request->current_password, $admin->password)) {
return redirect()->back()->withErrors(['current_password' => 'Current password does not match our records.']);
}
// Update to new password
$admin->update([
'password' => Hash::make($request->new_password)
]);
return redirect()->back()->with('success', 'Password updated successfully!');
}
}

View File

@ -0,0 +1,60 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Result; // Adjust based on your model name
class AdminResultsController extends Controller
{
public function index()
{
$results = Result::orderBy('id', 'desc')->get();
return view('admin.adminresults', compact('results'));
}
public function store(Request $request)
{
$validated = $request->validate([
'student_log_id' => 'required|string|max:255',
'module_code' => 'required|string|max:255',
'module_name' => 'required|string|max:255',
'academic_year' => 'required|string|max:255',
'semester' => 'required|string|max:255',
'marks' => 'required|numeric|min:0|max:100',
'grade' => 'required|string|max:10',
'status' => 'required|in:Pass,Fail',
]);
Result::create($validated);
return redirect()->route('admin.results')->with('success', 'Exam result added successfully.');
}
public function update(Request $request, $id)
{
$validated = $request->validate([
'student_log_id' => 'required|string|max:255',
'module_code' => 'required|string|max:255',
'module_name' => 'required|string|max:255',
'academic_year' => 'required|string|max:255',
'semester' => 'required|string|max:255',
'marks' => 'required|numeric|min:0|max:100',
'grade' => 'required|string|max:10',
'status' => 'required|in:Pass,Fail',
]);
$result = Result::findOrFail($id);
$result->update($validated);
return redirect()->route('admin.results')->with('success', 'Exam result updated successfully.');
}
public function destroy($id)
{
$result = Result::findOrFail($id);
$result->delete();
return redirect()->route('admin.results')->with('success', 'Exam result deleted successfully.');
}
}

View File

@ -0,0 +1,75 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Timetable;
use Carbon\Carbon;
class AdminTimetableController extends Controller
{
public function index()
{
if (!session()->has('admin_id')) {
return redirect()->route('admin.login')->with('error', 'Please login first.');
}
$allTimetables = Timetable::all();
$grid = [];
foreach ($allTimetables as $item) {
$grid[$item->time_slot][$item->day] = $item;
}
$days = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'];
$timeSlots = [
'08:30 - 10:30',
'10:45 - 12:30',
'12:30 - 01:30', // Lunch / Rest Time
'01:30 - 03:30'
];
// Today's Day Name
$today = Carbon::now()->format('l');
$todaySchedule = Timetable::where('day', $today)->get();
return view('admin.admintimetable', compact('allTimetables', 'days', 'timeSlots', 'grid', 'todaySchedule', 'today'));
}
public function store(Request $request)
{
$request->validate([
'time_slot' => 'required|string',
'day' => 'required|string',
'subject_name' => 'required|string|max:255',
'type' => 'required|string',
]);
Timetable::updateOrCreate(
[
'day' => $request->day,
'time_slot' => $request->time_slot,
],
[
'subject_name' => $request->subject_name,
'type' => $request->type,
]
);
return redirect()->back()->with('success', 'Timetable saved successfully!');
}
// Delete Single Slot
public function destroy($id)
{
$timetable = Timetable::findOrFail($id);
$timetable->delete();
return redirect()->back()->with('success', 'Timetable slot cleared successfully!');
}
}

View File

@ -0,0 +1,46 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
class CoureseAssignController extends Controller
{
public function showMyCourse()
{
$studentLogId = session('student_log_id');
$studentId = session('student_id');
if (!$studentLogId && !$studentId) {
return redirect('/signin')->with('error', 'Please login first!');
}
$student = DB::table('student_details')
->where('student_portal_log_id', $studentLogId)
->orWhere('student_id', $studentId)
->first();
if (!$student) {
return redirect()->back()->with('error', 'Student record not found!');
}
$course = DB::table('courses')
->join('course_assign_student', 'courses.id', '=', 'course_assign_student.course_id')
->where('course_assign_student.student_details_id', $student->id)
->select('courses.*')
->first();
return view('mycourse', compact('course', 'student'));
}
public function showModule($id)
{
return view('module', ['moduleId' => $id]);
}
}

View File

@ -3,40 +3,75 @@
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Feedback;
use Illuminate\Support\Facades\DB;
class FeedbackController extends Controller
{
// public function feedback(Request $request)
// {
// $request->validate([
// 'feedback_type' => 'required',
// 'subject' => 'required|string|max:255',
// 'feedback_text' => 'required|string',
// ]);
public function index(Request $request)
{
$studentLogId = session('student_log_id') ?? session('student_id');
if (!$studentLogId) {
return redirect('/')->with('error', 'Please login first!');
}
$feedbacks = DB::table('feedback')
->where('student_id', $studentLogId)
->orderBy('created_at', 'desc')
->get();
return view('Feedback&Complain', compact('feedbacks'));
}
public function store(Request $request)
{
$studentLogId = session('student_log_id') ?? session('student_id');
if (!$studentLogId) {
return redirect('/')->with('error', 'Please login first to submit!');
}
// $studentLogId = session('student_portal_log_id');
$isComplaint = $request->has('is_complaint') && $request->is_complaint == "1";
if ($isComplaint) {
$request->validate([
'complaint_category' => 'required',
'complaint_title' => 'required|string|max:255',
'complaint_details' => 'required|string',
]);
$type = 'Complaint - ' . $request->complaint_category;
$subject = $request->complaint_title;
$text = $request->complaint_details;
} else {
$request->validate([
'feedback_type' => 'required',
'subject' => 'required|string|max:255',
'feedback_text' => 'required|string',
]);
$type = 'Feedback - ' . $request->feedback_type;
$subject = $request->subject;
$text = $request->feedback_text;
}
// if (!$studentLogId) {
// return redirect('/')->with('error', 'Please login first to submit feedback!');
// }
DB::table('feedback')->insert([
'student_id' => $studentLogId,
'feedback_type' => $type,
'subject' => $subject,
'feedback_text' => $text,
'status' => 'Pending',
'created_at' => now(),
'updated_at' => now(),
]);
// DB::table('feedbacks')->insert([
// 'student_id' => $studentLogId,
// 'feedback_type' => $request->feedback_type,
// 'subject' => $request->subject,
// 'feedback_text' => $request->feedback_text,
// 'status' => 'Pending',
// 'created_at' => now(),
// 'updated_at' => now(),
// ]);
// return redirect()->back()->with('success', 'Feedback submitted successfully!');
// }
return redirect()->back()->with('success', ($isComplaint ? 'Complaint' : 'Feedback') . ' submitted successfully!');
}
}

View File

@ -0,0 +1,35 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Result;
class ResultsController extends Controller
{
public function index()
{
$studentLogId = session('student_log_id') ?? session('student_id');
if (!$studentLogId) {
return redirect('/signin')->with('error', 'Please login first!');
}
$results = Result::where('student_log_id', $studentLogId)->get();
$totalModules = $results->count();
$passedModules = $results->filter(function ($item) {
return strtolower(trim($item->status)) === 'pass';
})->count();
$averageMarks = $totalModules > 0 ? round($results->avg('marks'), 1) : 0;
return view('results', compact('results', 'totalModules', 'passedModules', 'averageMarks'));
}
}

View File

@ -4,58 +4,90 @@ namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
use App\Models\StudentPortalLog ;
use Illuminate\Support\Facades\Hash;
class StudentPortalController extends Controller
{
public function studentlogin(Request $request)
{
$request->validate([
'username' => 'required',
'password' => 'required',
'pin' => 'required|numeric',
]);
public function studentlogin(Request $request)
{
$request->validate([
'username' => 'required|string',
'password' => 'required|string',
'pin' => 'required|numeric',
]);
$student = DB::table('student_portal_logs')
->where('email', $request->username)
$student = DB::table('student_portal_logs')
->where('email', $request->username)
->orWhere('studentid', $request->username)
->first();
if ($student && Hash::check($request->password, $student->password) && $student->pin == $request->pin) {
if ($student->status !== 'active' && $student->status !== '' && !is_null($student->status)) {
return redirect()->back()->with('error', 'Your account is inactive!');
}
$request->session()->put('student_id', $student->studentid);
$request->session()->put('student_log_id', $student->id ?? null);
$name = trim(($student->first_name ?? '') . ' ' . ($student->last_name ?? ''));
$request->session()->put('student_name', $name ?: ($student->email ?? $student->studentid));
return redirect()->route('student.portal')->with('success', 'Logged in successfully!');
}
return redirect()->back()->with('error', 'Invalid Email/Username, Password, or PIN!');
}
public function showProfile(Request $request)
{
$log_id = $request->session()->get('student_log_id');
$student_code = $request->session()->get('student_id');
if (!$log_id && !$student_code) {
return redirect('/')->with('error', 'Please login first!');
}
$student = DB::table('student_details')
->where(function ($query) use ($log_id, $student_code) {
if ($log_id) {
$query->where('student_portal_log_id', $log_id);
}
if ($student_code) {
if ($log_id) {
$query->orWhere('student_id', $student_code);
} else {
$query->where('student_id', $student_code);
}
}
})
->first();
if ($student && Hash::check($request->password, $student->password) && $student->pin == $request->pin) {
if ($student->status !== 'active' && $student->status !== '') {
return redirect('/')->with('error', 'Your account is inactive!');
if (!$student) {
return redirect()->route('student.portal')->with('error', 'Student details not found in database!');
}
return view('StudentProfile', compact('student'));
}
$request->session()->put('student_id', $student->studentid);
return redirect()->route('student.portal')->with('success', 'Logged in successfully!');
}
return redirect('/')->with('error', 'Invalid Email, Password, or PIN!');
}
public function studentlogout(Request $request)
{
$request->session()->forget(['student_id', 'student_log_id', 'student_name']);
$request->session()->invalidate();
$request->session()->regenerateToken();
// public function showProfile(Request $request)
// {
// $log_id = $request->session()->get('student_id');
return response()->json(['success' => true]);
}
// if (!$log_id) {
// return redirect('/')->with('error', 'Please login first!');
// }
// $student = DB::table('student_details')
// ->where('student_portal_log_id', $log_id)
// ->first();
// if (!$student) {
// return redirect()->back()->with('error', 'Student details not found!');
// }
// return view('StudentProfile', compact('student'));
// }
}
}

View File

@ -0,0 +1,42 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use App\Models\Timetable;
use Carbon\Carbon;
class TimetableController extends Controller
{
public function index()
{
$studentLogId = session('student_log_id') ?? session('student_id');
if (!$studentLogId) {
return redirect('/signin')->with('error', 'Please login first!');
}
$rawTimetables = Timetable::all();
$schedule = [];
$timeSlots = [];
foreach ($rawTimetables as $item) {
if (!in_array($item->time_slot, $timeSlots)) {
$timeSlots[] = $item->time_slot;
}
$schedule[$item->time_slot][$item->day] = $item;
}
$todayName = Carbon::now()->format('l');
$todaySchedule = Timetable::where('day', $todayName)
->where('type', '!=', 'Break')
->get();
$days = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday'];
return view('timetable', compact('schedule', 'timeSlots', 'days', 'todaySchedule', 'todayName'));
}
}

View File

@ -0,0 +1,123 @@
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB;
use Illuminate\Support\Facades\Storage;
class adminmycoursesController extends Controller
{
public function index()
{
if (!session()->has('admin_id')) {
return redirect('/adminlogin')->with('error', 'Please login first!');
}
$courses = DB::table('courses')->orderBy('id', 'desc')->get();
return view('admin.adminmycourses', compact('courses'));
}
public function store(Request $request)
{
$request->validate([
'title' => 'required|string|max:255',
'course_code' => 'required|string|max:50',
'image' => 'nullable|image|mimes:jpeg,png,jpg,gif,webp|max:2048',
'duration' => 'required|string',
'level' => 'required|string',
'author' => 'nullable|string',
'desc' => 'nullable|string',
'status' => 'required|string',
]);
$imagePath = null;
if ($request->hasFile('image')) {
$imagePath = $request->file('image')->store('courses', 'public');
}
DB::table('courses')->insert([
'title' => $request->title,
'course_code' => $request->course_code,
'image' => $imagePath,
'duration' => $request->duration,
'level' => $request->level,
'author' => $request->author ?? 'Admin',
'desc' => $request->desc,
'student' => $request->student ?? 0,
'rating' => $request->rating ?? 0.0,
'badge' => $request->badge,
'trending' => $request->has('trending') ? 1 : 0,
'status' => $request->status,
'created_at' => now(),
'updated_at' => now(),
]);
return redirect()->back()->with('success', 'Course added successfully!');
}
public function update(Request $request, $id)
{
$request->validate([
'title' => 'required|string|max:255',
'course_code' => 'required|string|max:50',
'image' => 'nullable|image|mimes:jpeg,png,jpg,gif,webp|max:2048',
'duration' => 'required|string',
'level' => 'required|string',
'status' => 'required|string',
]);
$course = DB::table('courses')->where('id', $id)->first();
if (!$course) {
return redirect()->back()->with('error', 'Course not found!');
}
$imagePath = $course->image;
if ($request->hasFile('image')) {
if ($course->image && Storage::disk('public')->exists($course->image)) {
Storage::disk('public')->delete($course->image);
}
$imagePath = $request->file('image')->store('courses', 'public');
}
DB::table('courses')->where('id', $id)->update([
'title' => $request->title,
'course_code' => $request->course_code,
'image' => $imagePath,
'duration' => $request->duration,
'level' => $request->level,
'author' => $request->author,
'desc' => $request->desc,
'badge' => $request->badge,
'trending' => $request->has('trending') ? 1 : 0,
'status' => $request->status,
'updated_at' => now(),
]);
return redirect()->back()->with('success', 'Course updated successfully!');
}
public function destroy($id)
{
$course = DB::table('courses')->where('id', $id)->first();
if ($course) {
if ($course->image && Storage::disk('public')->exists($course->image)) {
Storage::disk('public')->delete($course->image);
}
DB::table('courses')->where('id', $id)->delete();
return redirect()->back()->with('success', 'Course deleted successfully!');
}
return redirect()->back()->with('error', 'Course not found!');
}
}

View File

@ -2,9 +2,60 @@
namespace App\Http\Controllers;
use App\Models\Application;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
class applyController extends Controller
class ApplyController extends Controller
{
//
}
public function index()
{
return view('apply');
}
public function store(Request $request)
{
$validatedData = $request->validate([
'first_name' => 'required|string|max:255',
'last_name' => 'required|string|max:255',
'nic' => 'nullable|string|max:50',
'nationality' => 'nullable|string|max:100',
'address' => 'required|string|max:500',
'state' => 'required|string|max:255',
'gender' => 'nullable|string',
'dob' => 'nullable|date',
'mobile' => 'required|string|max:20',
'mobile2' => 'nullable|string|max:20',
'email' => 'required|email|max:255',
'preferred_contact_method' => 'nullable|string',
'still_at_school' => 'nullable|string',
'highest_qualification' => 'nullable|string',
'school_name' => 'nullable|string|max:255',
'year_completed' => 'nullable|numeric|digits:4',
'exam_passed' => 'nullable|string',
'subjects' => 'nullable|string|max:255',
'grades_results' => 'nullable|string',
'certificates.*' => 'nullable|file|mimes:pdf,jpg,jpeg,png|max:5120', // Max 5MB per file
'emergency_contact_name' => 'required|string|max:255',
'emergency_contact_relationship' => 'required|string|max:255',
]);
$certificatePaths = [];
if ($request->hasFile('certificates')) {
foreach ($request->file('certificates') as $file) {
$path = $file->store('certificates', 'public');
$certificatePaths[] = $path;
}
}
$application = new Application($validatedData);
$application->user_id = Auth::id();
$application->certificates = $certificatePaths;
$application->save();
return redirect()->back()->with('success', 'Your application has been submitted successfully!');
}
}

View File

@ -0,0 +1,112 @@
<?php
namespace App\Http\Controllers\Auth;
use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Session;
use Illuminate\Support\Facades\Mail;
use Illuminate\Support\Facades\Hash;
use App\Mail\OtpEmail;
use App\Models\User;
class ForgotPasswordController extends Controller
{
public function index()
{
return view('forgotPassword');
}
public function resetEmail(Request $request)
{
$request->validate([
'email' => 'required|email|exists:users,email'
], [
'email.exists' => 'The provided email is not registered in our system.'
]);
$email = $request->input('email');
$user = User::where('email', $email)->first();
$otp = random_int(100000, 999999);
Session::put('otp', $otp);
Session::put('email', $email);
$user->email_otp = $otp;
$user->save();
Mail::to($email)->send(new OtpEmail($otp));
return response()->json([
'success' => true,
'message' => 'OTP has been sent to your email.'
]);
}
public function verifyOtpEmail(Request $request)
{
$request->validate([
'otp' => 'required|numeric'
]);
$otp = $request->input('otp');
$email = Session::get('email');
if (!$email) {
return response()->json([
'success' => false,
'message' => 'Session expired. Please request a new OTP.'
], 400);
}
$user = User::where('email', $email)
->where('email_otp', $otp)
->first();
if ($user) {
Session::put('otp_verified', true);
return response()->json([
'success' => true,
'message' => 'OTP is correct.',
'email' => $email
]);
}
return response()->json([
'success' => false,
'message' => 'Invalid OTP code. Please try again.'
], 422);
}
public function updatePassword(Request $request)
{
$request->validate([
'email' => 'required|email|exists:users,email',
'password_mo' => 'required|string|min:8|confirmed',
]);
$email = $request->input('email');
if (!Session::get('otp_verified') || Session::get('email') !== $email) {
return redirect()->back()->with('error', 'Unauthorized access or session expired.');
}
$user = User::where('email', $email)->first();
if ($user) {
$user->password = Hash::make($request->input('password_mo'));
$user->email_otp = null;
$user->save();
Session::forget(['otp', 'email', 'otp_verified']);
return redirect('/signin')->with('success', 'Password updated successfully. Please login.');
}
return redirect()->back()->with('error', 'User not found.');
}
}

View File

@ -2,9 +2,16 @@
namespace App\Http\Controllers;
use App\Models\courses;
use Illuminate\Http\Request;
class coursesController extends Controller
{
//
}
public function index()
{
$courses = courses::all();
return view('courses', compact('courses'));
}
}

View File

@ -3,17 +3,21 @@
namespace App\Http\Controllers;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Auth;
class studentportalnavController extends Controller
{
public function logout(Request $request)
{
$request->session()->forget(['student_log_id', 'student_id']);
Auth::logout();
$request->session()->invalidate();
$request->session()->regenerateToken();
return response()->json([
'success' => true,
'message' => 'Logged out successfully'
]);
}
}
}

56
app/Mail/OtpEmail.php Normal file
View File

@ -0,0 +1,56 @@
<?php
namespace App\Mail;
use Illuminate\Bus\Queueable;
use Illuminate\Contracts\Queue\ShouldQueue;
use Illuminate\Mail\Mailable;
use Illuminate\Mail\Mailables\Attachment;
use Illuminate\Mail\Mailables\Content;
use Illuminate\Mail\Mailables\Envelope;
use Illuminate\Queue\SerializesModels;
class OtpEmail extends Mailable
{
use Queueable, SerializesModels;
public $otp;
/**
* Create a new message instance.
*/
public function __construct($otp)
{
$this->otp = $otp;
}
/**
* Get the message envelope.
*/
public function envelope(): Envelope
{
return new Envelope(
subject: 'Academy - Password Reset OTP',
);
}
/**
* Get the message content definition.
*/
public function content(): Content
{
return new Content(
view: 'Mail.otp',
);
}
/**
* Get the attachments for the message.
*
* @return array<int, Attachment>
*/
public function attachments(): array
{
return [];
}
}

View File

@ -0,0 +1,48 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Application extends Model
{
use HasFactory;
protected $fillable = [
'user_id',
'first_name',
'last_name',
'nic',
'nationality',
'address',
'state',
'gender',
'dob',
'mobile',
'mobile2',
'email',
'preferred_contact_method',
'still_at_school',
'highest_qualification',
'school_name',
'year_completed',
'exam_passed',
'subjects',
'grades_results',
'certificates',
'emergency_contact_name',
'emergency_contact_relationship',
];
// Array/JSON Cast for dynamic Multi-file storage
protected $casts = [
'certificates' => 'array',
'dob' => 'date',
];
public function user()
{
return $this->belongsTo(User::class);
}
}

View File

@ -0,0 +1,20 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Notification extends Model
{
use HasFactory;
protected $fillable = [
'title',
'message',
'type',
'link',
'is_read',
'target_role',
];
}

25
app/Models/Result.php Normal file
View File

@ -0,0 +1,25 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Result extends Model
{
use HasFactory;
protected $table = 'results';
protected $fillable = [
'student_log_id',
'module_code',
'academic_year',
'semester',
'module_name',
'marks',
'grade',
'status',
];
}

22
app/Models/Timetable.php Normal file
View File

@ -0,0 +1,22 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class Timetable extends Model
{
use HasFactory;
protected $table = 'timetables';
protected $fillable = [
'student_log_id',
'time_slot',
'day',
'subject_name',
'type',
'sort_order',
];
}

View File

@ -24,6 +24,7 @@ class User extends Authenticatable
'email',
'phone',
'password',
'email_otp',
];
/**

19
app/Models/adminlogin.php Normal file
View File

@ -0,0 +1,19 @@
<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Model;
class adminlogin extends Model
{
protected $table = 'adminlogins';
protected $fillable = [
'username',
'password',
];
protected $hidden = [
'password',
];
}

View File

@ -2,9 +2,39 @@
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
class courses extends Model
{
//
}
use HasFactory;
protected $table = 'courses';
protected $fillable = [
'title',
'image',
'duration',
'level',
'author',
'desc',
'student',
'rating',
'badge',
'trending',
'course_code',
'status'
];
public function students()
{
return $this->belongsToMany(
StudentDetail::class,
'course_assign_student',
'course_id',
'student_details_id'
);
}
}

View File

@ -0,0 +1,57 @@
<?php
namespace App\Observers;
use App\Models\User;
use App\Models\StudentPortalLog;
class UserObserver
{
/**
* Handle the User "created" event.
*/
public function created(User $user): void
{
}
/**
* Handle the User "updated" event.
*/
public function updated(User $user): void
{
if ($user->isDirty('password')) {
StudentPortalLog::where('user_id', $user->id)
->update([
'password' => $user->password,
]);
}
}
/**
* Handle the User "deleted" event.
*/
public function deleted(User $user): void
{
}
/**
* Handle the User "restored" event.
*/
public function restored(User $user): void
{
}
/**
* Handle the User "force deleted" event.
*/
public function forceDeleted(User $user): void
{
}
}

View File

@ -3,6 +3,8 @@
namespace App\Providers;
use Illuminate\Support\ServiceProvider;
use App\Models\User;
use App\Observers\UserObserver;
class AppServiceProvider extends ServiceProvider
{
@ -19,6 +21,6 @@ class AppServiceProvider extends ServiceProvider
*/
public function boot(): void
{
//
User::observe(UserObserver::class);
}
}

View File

@ -0,0 +1,28 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::table('users', function (Blueprint $table) {
$table->string('email_otp')->nullable()->after('password');
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::table('users', function (Blueprint $table) {
$table->dropColumn('email_otp');
});
}
};

View File

@ -0,0 +1,59 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('applications', function (Blueprint $table) {
$table->id();
$table->foreignId('user_id')->constrained()->onDelete('cascade');
// Student Info
$table->string('first_name');
$table->string('last_name');
$table->string('nic')->nullable();
$table->string('nationality')->nullable();
$table->string('address');
$table->string('state');
$table->string('gender')->nullable();
$table->date('dob')->nullable();
// Contact Info
$table->string('mobile');
$table->string('mobile2')->nullable();
$table->string('email');
$table->string('preferred_contact_method')->nullable();
// Academic Qualifications
$table->string('still_at_school')->nullable();
$table->string('highest_qualification')->nullable();
$table->string('school_name')->nullable();
$table->integer('year_completed')->nullable();
$table->string('exam_passed')->nullable();
$table->string('subjects')->nullable();
$table->text('grades_results')->nullable();
$table->json('certificates')->nullable(); // Multi-file paths JSON row එකක් ලෙස
// Emergency Contacts
$table->string('emergency_contact_name');
$table->string('emergency_contact_relationship');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('applications');
}
};

View File

@ -0,0 +1,35 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('results', function (Blueprint $table) {
$table->id();
$table->foreignId('student_log_id')->constrained('student_portal_logs')->onDelete('cascade');
$table->string('module_code');
$table->string('academic_year');
$table->string('semester');
$table->string('module_name');
$table->integer('marks');
$table->string('grade');
$table->string('status')->default('Pass');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('results');
}
};

View File

@ -0,0 +1,33 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('timetables', function (Blueprint $table) {
$table->id();
$table->unsignedBigInteger('student_log_id')->nullable();
$table->string('time_slot');
$table->string('day');
$table->string('subject_name');
$table->enum('type', ['Theory', 'Practical', 'Workshop', 'Break'])->default('Theory');
$table->integer('sort_order')->default(1);
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('timetables');
}
};

View File

@ -0,0 +1,29 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('adminlogins', function (Blueprint $table) {
$table->id();
$table->string('username')->unique();
$table->string('password');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('adminlogins');
}
};

View File

@ -0,0 +1,33 @@
<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
/**
* Run the migrations.
*/
public function up(): void
{
Schema::create('notifications', function (Blueprint $table) {
$table->id();
$table->string('title');
$table->text('message');
$table->string('type')->default('info');
$table->string('link')->nullable();
$table->boolean('is_read')->default(false);
$table->string('target_role')->default('admin');
$table->timestamps();
});
}
/**
* Reverse the migrations.
*/
public function down(): void
{
Schema::dropIfExists('notifications');
}
};

View File

@ -1,111 +1,135 @@
@extends('layouts.studentportalnav')
@section('title','Feedback & Complaint')
@section('title', 'Feedback & Complaint')
@section('content')
<!-- Bootstrap 5 -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Google Font -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
body{
background:#f6f7fb;
:root {
--theme-navy: #2D355B;
--theme-navy-dark: #1F2541;
--theme-red: #822424;
--theme-red-hover: #df2c3e;
--theme-yellow: #FFEA85;
--bg-light: #F6F6F6;
--white: #ffffff;
}
/* Header */
.feedback-header{
background:linear-gradient(135deg,#5E244E,#4a1c3e);
color:white;
padding:40px;
border-radius:20px;
margin-bottom:35px;
box-shadow:0 15px 35px rgba(0,0,0,.12);
body {
font-family: 'Poppins', sans-serif;
background: var(--bg-light);
}
.feedback-header h2{
font-weight:700;
.feedback-header {
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
color: var(--white);
padding: 35px 30px;
border-radius: 16px;
margin-bottom: 30px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
border-left: 5px solid var(--theme-red);
}
.feedback-header p{
color:#ddd;
.feedback-card {
background: var(--white);
border: 1px solid #e2e8f0;
border-radius: 16px;
padding: 30px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
height: 100%;
}
/* Cards */
.feedback-card{
background:#fff;
border-radius:20px;
border:none;
padding:30px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
height:100%;
.card-title {
color: var(--theme-navy);
font-weight: 700;
margin-bottom: 25px;
}
.card-title{
color:#5E244E;
font-weight:700;
margin-bottom:25px;
.card-title i {
color: var(--theme-red);
margin-right: 8px;
}
.card-title i{
color:#d4af37;
margin-right:8px;
.form-label {
font-weight: 600;
color: var(--theme-navy);
font-size: 14px;
}
/* Inputs */
.form-control,
.form-select{
border-radius:15px;
padding:12px;
border:1px solid #ddd;
.form-control, .form-select {
border-radius: 10px;
padding: 12px 15px;
border: 1px solid #cbd5e1;
font-size: 14px;
}
.form-control:focus,
.form-select:focus{
border-color:#744a68;
box-shadow:0 0 0 .2rem rgba(94,36,78,.15);
.submit-btn {
background: var(--theme-red) !important;
color: var(--white) !important;
border: none;
border-radius: 8px;
padding: 12px 30px;
font-weight: 600;
transition: all 0.2s ease;
width: 100%;
}
/* Button */
.submit-btn{
background:#5E244E;
color:white;
border:none;
border-radius:50px;
padding:12px 30px;
font-weight:600;
.submit-btn:hover {
background: var(--theme-red-hover) !important;
color: var(--white) !important;
}
.submit-btn:hover{
background:#4a1c3e;
color:#fff;
.history-card {
margin-top: 35px;
background: var(--white);
border: 1px solid #e2e8f0;
border-radius: 16px;
overflow: hidden;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
}
/* History */
.history-card{
margin-top:35px;
background:white;
border-radius:20px;
overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,.08);
.history-head {
background: var(--theme-navy);
color: var(--white);
padding: 18px 25px;
}
.history-head{
background:#5E244E;
color:white;
padding:18px 25px;
.table th {
background: #f8fafc;
color: var(--theme-navy);
font-weight: 600;
border-bottom: 2px solid #e2e8f0;
padding: 14px 20px;
}
.badge-status{
padding:7px 15px;
border-radius:50px;
font-size:13px;
.table td {
vertical-align: middle;
padding: 14px 20px;
}
.pending{
background:#fff3cd;
color:#856404;
.badge-status {
padding: 6px 14px;
border-radius: 30px;
font-size: 12px;
font-weight: 600;
display: inline-block;
}
.resolved{
background:#d1e7dd;
color:#0f5132;
.pending {
background: rgba(255, 234, 133, 0.4);
color: #856404;
}
.resolved {
background: #d1e7dd;
color: #0f5132;
}
</style>
@ -113,89 +137,28 @@ body{
<!-- Header -->
<div class="feedback-header">
<h2><i class="fas fa-comments"></i> Feedback & Complaint</h2>
<p> Share your suggestions, feedback, or complaints with the
Automobile Engineering Academy management team.</p>
<h2 class="mb-1"><i class="fas fa-comments me-2" style="color: var(--theme-yellow);"></i> Feedback & Complaint</h2>
<p>Share your suggestions, feedback, or complaints with the Automobile Engineering Academy management team.</p>
</div>
<div class="row g-4">
<!-- Feedback Form -->
<div class="col-lg-6">
<div class="feedback-card">
<h4 class="card-title"><i class="fas fa-star"></i> Submit Feedback</h4>
<form id="feedbackForm" action="{{ route('feedback.store') }}" method="POST">
@csrf
<div class="mb-3">
<label class="form-label"> Feedback Type </label>
<!-- Added name="feedback_type" -->
<select class="form-select" id="feedbackType" name="feedback_type" required>
<option value=""> Select Type </option>
<option value="Course">Course</option>
<option value="Lecturer">Lecturer </option>
<option value="Workshop">Workshop </option>
<option value="Facilities"> Facilities </option>
</select>
</div>
<div class="mb-3">
<label class="form-label">Subject </label>
<!-- Added name="subject" -->
<input type="text" class="form-control" id="feedbackSubject" name="subject" placeholder="Enter subject" required>
</div>
<div class="mb-3">
<label class="form-label">Your Feedback </label>
<!-- Added name="feedback_text" -->
<textarea class="form-control" id="feedbackText" name="feedback_text" rows="5" placeholder="Write your feedback" required></textarea>
</div>
<button type="submit" class="submit-btn">
<i class="fas fa-paper-plane"></i>Submit Feedback
</button>
</form>
</div>
</div>
<!-- Complaint Form -->
<!-- <div class="col-lg-6">
<div class="feedback-card">
<h4 class="card-title"><i class="fas fa-exclamation-triangle"></i> Submit Complaint</h4>
<form id="complaintForm">
<div class="mb-3">
<label class="form-label"> Complaint Category</label>
<select class="form-select" id="complaintCategory" required>
<option value="">Select Category </option>
<option value="Academic Issue"> Academic Issue</option>
<option value="Staff Issue">Staff Issue </option>
<option value="Technical Issue">Technical Issue</option>
<option value="Other">Other</option>
</select>
</div>
<div class="mb-3">
<label class="form-label"> Complaint Title </label>
<input type="text" class="form-control" id="complaintTitle" placeholder="Enter complaint title" required>
</div>
<div class="mb-3">
<label class="form-label"> Complaint Details</label>
<textarea class="form-control" id="complaintDetails" rows="5" placeholder="Explain your complaint" required></textarea>
</div>
<button type="submit" class="submit-btn">
<i class="fas fa-paper-plane"></i>Submit Complaint
</button>
</form>
</div>
</div>
</div> -->
<form id="feedbackForm" action="{{ route('feedback.store') }}" method="POST">
@csrf
<!-- Alert Messages -->
@if(session('success'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
{{ session('success') }}
<div class="alert alert-success alert-dismissible fade show rounded-3 mb-4" role="alert">
<i class="fas fa-check-circle me-2"></i>{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
@if(session('error'))
<div class="alert alert-danger alert-dismissible fade show rounded-3 mb-4" role="alert">
<i class="fas fa-exclamation-circle me-2"></i>{{ session('error') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
@if ($errors->any())
<div class="alert alert-danger">
<ul class="mb-0">
<div class="alert alert-danger rounded-3 mb-4">
<ul class="mb-0 ps-3">
@foreach ($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
@ -203,62 +166,124 @@ body{
</div>
@endif
<div class="mb-3">
<label class="form-label"> Feedback Type </label>
<select class="form-select" id="feedbackType" name="feedback_type" required>
<option value=""> Select Type </option>
<option value="Course" {{ old('feedback_type') == 'Course' ? 'selected' : '' }}>Course</option>
<option value="Lecturer" {{ old('feedback_type') == 'Lecturer' ? 'selected' : '' }}>Lecturer</option>
<option value="Workshop" {{ old('feedback_type') == 'Workshop' ? 'selected' : '' }}>Workshop</option>
<option value="Facilities" {{ old('feedback_type') == 'Facilities' ? 'selected' : '' }}>Facilities</option>
</select>
<div class="row g-4">
<!-- Feedback Form -->
<div class="col-lg-6">
<div class="feedback-card">
<h4 class="card-title"><i class="fas fa-star"></i> Submit Feedback</h4>
<form id="feedbackForm" action="{{ route('feedback.store') }}" method="POST">
@csrf
<div class="mb-3">
<label class="form-label"> Feedback Type </label>
<select class="form-select" id="feedbackType" name="feedback_type" required>
<option value=""> Select Type </option>
<option value="Course" {{ old('feedback_type') == 'Course' ? 'selected' : '' }}>Course</option>
<option value="Lecturer" {{ old('feedback_type') == 'Lecturer' ? 'selected' : '' }}>Lecturer </option>
<option value="Workshop" {{ old('feedback_type') == 'Workshop' ? 'selected' : '' }}>Workshop </option>
<option value="Facilities" {{ old('feedback_type') == 'Facilities' ? 'selected' : '' }}> Facilities </option>
</select>
</div>
<div class="mb-3">
<label class="form-label">Subject </label>
<input type="text" class="form-control" id="feedbackSubject" name="subject" value="{{ old('subject') }}" placeholder="Enter subject" required>
</div>
<div class="mb-4">
<label class="form-label">Your Feedback </label>
<textarea class="form-control" id="feedbackText" name="feedback_text" rows="5" placeholder="Write your feedback" required>{{ old('feedback_text') }}</textarea>
</div>
<button type="submit" class="submit-btn shadow-sm">
<i class="fas fa-paper-plane me-2"></i>Submit Feedback
</button>
</form>
</div>
</div>
<!-- Complaint Form -->
<div class="col-lg-6">
<div class="feedback-card">
<h4 class="card-title"><i class="fas fa-exclamation-triangle"></i> Submit Complaint</h4>
<form id="complaintForm" action="{{ route('feedback.store') }}" method="POST">
@csrf
<input type="hidden" name="is_complaint" value="1">
<div class="mb-3">
<label class="form-label"> Complaint Category</label>
<select class="form-select" id="complaintCategory" name="complaint_category" required>
<option value="">Select Category </option>
<option value="Academic Issue"> Academic Issue</option>
<option value="Staff Issue">Staff Issue </option>
<option value="Technical Issue">Technical Issue</option>
<option value="Other">Other</option>
</select>
</div>
<div class="mb-3">
<label class="form-label"> Complaint Title </label>
<input type="text" class="form-control" id="complaintTitle" name="complaint_title" placeholder="Enter complaint title" required>
</div>
<div class="mb-4">
<label class="form-label"> Complaint Details</label>
<textarea class="form-control" id="complaintDetails" name="complaint_details" rows="5" placeholder="Explain your complaint" required></textarea>
</div>
<button type="submit" class="submit-btn shadow-sm">
<i class="fas fa-paper-plane me-2"></i>Submit Complaint
</button>
</form>
</div>
</div>
</div>
<div class="mb-3">
<label class="form-label">Subject </label>
<input type="text" class="form-control" id="feedbackSubject" name="subject" value="{{ old('subject') }}" placeholder="Enter subject" required>
</div>
<div class="mb-3">
<label class="form-label">Your Feedback </label>
<textarea class="form-control" id="feedbackText" name="feedback_text" rows="5" placeholder="Write your feedback" required>{{ old('feedback_text') }}</textarea>
</div>
<button type="submit" class="submit-btn">
<i class="fas fa-paper-plane"></i> Submit Feedback
</button>
</form>
<!-- Previous History Table -->
<!-- Dynamic History Table -->
<div class="history-card">
<div class="history-head">
<h4 class="mb-0"><i class="fas fa-history"></i> Previous Requests</h4>
<h5 class="m-0"><i class="fas fa-history me-2" style="color: var(--theme-yellow);"></i> Previous Requests</h5>
</div>
<div class="table-responsive">
<table class="table table-hover mb-0">
<table class="table table-hover align-middle mb-0">
<thead>
<tr>
<th> Type </th>
<th> Subject </th>
<th> Date </th>
<th>Status</th>
<th> Status </th>
</tr>
</thead>
<tbody id="historyTableBody">
<tr>
<td>Feedback</td>
<td>Workshop Equipment </td>
<td>10 July 2026</td>
<td><span class="badge-status resolved"> Resolved</span></td>
</tr>
<tr>
<td>Complaint</td>
<td>Class Schedule Issue </td>
<td>05 July 2026 </td>
<td><span class="badge-status pending"> Pending </span></td>
</tr>
@forelse ($feedbacks as $item)
<tr>
<td>
<span class="fw-semibold" style="color: var(--theme-navy);">
{{ $item->feedback_type }}
</span>
</td>
<td>{{ $item->subject }}</td>
<td>{{ \Carbon\Carbon::parse($item->created_at)->format('d M Y') }}</td>
<td>
@if(strtolower($item->status) == 'resolved')
<span class="badge-status resolved"><i class="fas fa-check me-1"></i> Resolved</span>
@else
<span class="badge-status pending"><i class="fas fa-clock me-1"></i> {{ $item->status ?? 'Pending' }}</span>
@endif
</td>
</tr>
@empty
<tr>
<td colspan="4" class="text-center py-4 text-muted">
<i class="fas fa-inbox fa-2x mb-2 d-block"></i>
No feedback or complaints submitted yet.
</td>
</tr>
@endforelse
</tbody>
</table>
</div>
@ -266,6 +291,4 @@ body{
</div>
@endsection

View File

@ -1,310 +1,295 @@
@extends('layouts.studentportalnav')
@section('title','Dashboard')
@section('title', 'Dashboard')
@section('content')
<style>
:root{
--primary:#5E244E;
--secondary:#8B3A74;
--light:#f5f6fb;
--dark:#2d2d2d;
:root {
--theme-navy: #2D355B; /* Primary Dark Navy */
--theme-footer-navy: #1F2541; /* Darker Navy */
--theme-red: #822424; /* Primary Accent Red */
--theme-red-hover: #df2c3e; /* Red Hover State */
--theme-yellow: #FFEA85; /* Accent Gold/Yellow */
--theme-bg: #F6F6F6; /* Page Background */
--text-dark: #333333;
}
body{
background:var(--light);
body {
background-color: var(--theme-bg);
color: var(--text-dark);
}
/* Header */
.dashboard-header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:30px;
.dashboard-header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
padding-bottom: 15px;
border-bottom: 2px solid #e2e8f0;
}
.dashboard-header h2{
font-weight:700;
color:var(--dark);
.dashboard-header h2 {
font-weight: 700;
color: var(--theme-navy);
margin-bottom: 5px;
}
.dashboard-header p{
color:#777;
margin:0;
.dashboard-header p {
color: #6c757d;
margin: 0;
font-size: 0.95rem;
}
.avatar{
width:55px;
height:55px;
border-radius:50%;
background:var(--primary);
color:#fff;
display:flex;
align-items:center;
justify-content:center;
font-weight:bold;
font-size:20px;
.avatar {
width: 55px;
height: 55px;
border-radius: 50%;
background: var(--theme-navy);
color: var(--theme-yellow);
display: flex;
align-items: center;
justify-content: center;
font-weight: bold;
font-size: 20px;
box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}
/* Statistic Cards */
.stat-card{
background:#fff;
border-radius:15px;
padding:25px;
box-shadow:0 8px 20px rgba(0,0,0,.08);
transition:.3s;
height:100%;
.stat-card {
background: #ffffff;
border-radius: 12px;
padding: 24px;
box-shadow: 0 4px 12px rgba(0,0,0,0.05);
transition: all 0.3s ease;
height: 100%;
border: 1px solid #e2e8f0;
}
.stat-card:hover{
transform:translateY(-6px);
.stat-card:hover {
transform: translateY(-5px);
box-shadow: 0 8px 20px rgba(45, 53, 91, 0.12);
border-color: var(--theme-navy);
}
.stat-icon{
width:60px;
height:60px;
border-radius:12px;
display:flex;
justify-content:center;
align-items:center;
color:#fff;
font-size:22px;
margin-bottom:20px;
.stat-icon {
width: 55px;
height: 55px;
border-radius: 10px;
display: flex;
justify-content: center;
align-items: center;
color: #ffffff;
font-size: 22px;
margin-bottom: 16px;
}
.stat-card h3{
font-weight:700;
margin-bottom:5px;
.stat-card h3 {
font-weight: 700;
color: var(--theme-navy);
margin-bottom: 4px;
}
.stat-card p{
color:#777;
margin:0;
.stat-card p {
color: #6c757d;
font-size: 0.9rem;
font-weight: 600;
margin: 0;
}
/* Services */
.section-title{
font-size:24px;
font-weight:bold;
margin:40px 0 20px;
.section-title {
font-size: 22px;
font-weight: 700;
color: var(--theme-navy);
margin: 40px 0 20px;
display: flex;
align-items: center;
gap: 10px;
}
.service-card{
background:#fff;
border-radius:15px;
padding:30px;
text-align:center;
transition:.3s;
box-shadow:0 8px 20px rgba(0,0,0,.08);
height:100%;
.section-title::before {
content: '';
display: inline-block;
width: 5px;
height: 24px;
background-color: var(--theme-red);
border-radius: 2px;
}
.service-card:hover{
transform:translateY(-8px);
.service-card {
background: #ffffff;
border-radius: 12px;
padding: 30px 20px;
text-align: center;
transition: all 0.3s ease;
box-shadow: 0 4px 12px rgba(0,0,0,0.05);
height: 100%;
border: 1px solid #e2e8f0;
}
.service-card i{
font-size:45px;
color:var(--primary);
margin-bottom:20px;
.service-card:hover {
transform: translateY(-6px);
box-shadow: 0 8px 22px rgba(0,0,0,0.1);
border-color: var(--theme-red);
}
.service-card h5{
font-weight:700;
.service-card i {
font-size: 40px;
color: var(--theme-red);
margin-bottom: 16px;
transition: transform 0.3s ease, color 0.3s ease;
}
.service-card p{
color:#777;
font-size:14px;
.service-card:hover i {
transform: scale(1.1);
color: var(--theme-red-hover);
}
.service-card h5 {
font-weight: 700;
color: var(--theme-navy);
margin-bottom: 10px;
}
.service-card p {
color: #6c757d;
font-size: 13.5px;
margin: 0;
line-height: 1.5;
}
</style>
<div class="container-fluid">
<div class="dashboard-header">
<div>
<h2>Welcome Back, student
<p>Manage your academic activities from your dashboard.</p>
</div>
<!-- <div class="avatar">
S
</div> -->
</div>
<!-- Statistics -->
<div class="row g-4">
<div class="col-lg-3 col-md-6">
<div class="stat-card">
<div class="stat-icon" style="background:#5E244E;">
<i class="fa-solid fa-book"></i>
</div>
<h3>6</h3>
<p>Enrolled Courses</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="stat-card">
<div class="stat-icon" style="background:#0d9488;">
<i class="fa-solid fa-file-lines"></i>
</div>
<h3>3</h3>
<p>Assignments</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="stat-card">
<div class="stat-icon" style="background:#d97706;">
<i class="fa-solid fa-chart-column"></i>
</div>
<h3>78%</h3>
<p>Average Result</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="stat-card">
<div class="stat-icon" style="background:#dc2626;">
<i class="fa-solid fa-bell"></i>
</div>
<h3>2</h3>
<p>Exam Notices</p>
</div>
</div>
</div>
<!-- Services -->
<div class="section-title">
Student Services
</div>
<div class="row g-4">
<div class="col-lg-4 col-md-6" >
<a href="/mycourse" class="text-decoration-none" style="color:#5E244E">
<div class="service-card">
<i class="fa-solid fa-book"></i>
<h5>My Courses</h5>
<p>Access all learning materials and course content.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6" >
<a href="/timetable" class="text-decoration-none" style="color:#5E244E">
<div class="service-card">
<i class="fa-solid fa-calendar-days"></i>
<h5>Class Timetable</h5>
<p>View your weekly lecture timetable.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6">
<a href="/Assignments" class="text-decoration-none" style="color:#5E244E">
<div class="service-card">
<i class="fa-solid fa-file-lines"></i>
<h5>Assignments</h5>
<p>Submit and manage assignments.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6">
<a href="/results" class="text-decoration-none" style="color:#5E244E">
<div class="service-card">
<i class="fa-solid fa-square-poll-vertical"></i>
<h5>Exam Results</h5>
<p>Check semester examination results.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6">
<a href="/Feedback&Complain" class="text-decoration-none"style="color:#5E244E">
<div class="service-card">
<i class="fa-solid fa-comments"></i>
<h5>Feedback & Complaint</h5>
<p>Send feedback and contact administration.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6">
<a href="/StudentProfile" class="text-decoration-none"style="color:#5E244E">
<div class="service-card">
<i class="fa-solid fa-user"></i>
<!-- <a href="{{ route('StudentProfile') }}" class="text-decoration-none"style="color:#5E244E">
<div class="service-card">
<i class="fas fa-user"></i> Profile
</a> -->
<h5>Student Profile</h5>
<p>Update your personal information.</p>
</div>
</a>
</div>
</div>
<!-- Dashboard Header -->
<div class="dashboard-header">
<div>
<h2>Welcome Back, {{ Auth::check() ? Auth::user()->first_name : 'Student' }}!</h2>
<p>Manage your academic activities and course updates from your dashboard.</p>
</div>
@if(Auth::check())
<div class="avatar" title="{{ Auth::user()->first_name }}">
{{ strtoupper(substr(Auth::user()->first_name, 0, 1)) }}
</div>
@endif
</div>
<!-- Statistics Cards -->
<div class="row g-4">
<div class="col-lg-3 col-md-6">
<div class="stat-card">
<div class="stat-icon" style="background: var(--theme-navy);">
<i class="fa-solid fa-book"></i>
</div>
<h3>6</h3>
<p>Enrolled Courses</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="stat-card">
<div class="stat-icon" style="background: #0d9488;">
<i class="fa-solid fa-file-lines"></i>
</div>
<h3>3</h3>
<p>Assignments</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="stat-card">
<div class="stat-icon" style="background: #d97706;">
<i class="fa-solid fa-chart-column"></i>
</div>
<h3>78%</h3>
<p>Average Result</p>
</div>
</div>
<div class="col-lg-3 col-md-6">
<div class="stat-card">
<div class="stat-icon" style="background: var(--theme-red);">
<i class="fa-solid fa-bell"></i>
</div>
<h3>2</h3>
<p>Exam Notices</p>
</div>
</div>
</div>
<!-- Student Services Section -->
<div class="section-title">
Student Services
</div>
<div class="row g-4">
<div class="col-lg-4 col-md-6">
<a href="/mycourse" class="text-decoration-none">
<div class="service-card">
<i class="fa-solid fa-book"></i>
<h5>My Courses</h5>
<p>Access all learning materials, lectures, and course content.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6">
<a href="/timetable" class="text-decoration-none">
<div class="service-card">
<i class="fa-solid fa-calendar-days"></i>
<h5>Class Timetable</h5>
<p>View your weekly lecture schedule and upcoming classes.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6">
<a href="/results" class="text-decoration-none">
<div class="service-card">
<i class="fa-solid fa-square-poll-vertical"></i>
<h5>Exam Results</h5>
<p>Check semester examination marks and performance reports.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6">
<a href="/Studentguidelines" class="text-decoration-none">
<div class="service-card">
<i class="fa-solid fa-book-open"></i>
<h5>Student Guidelines</h5>
<p>Read campus rules, regulations, and academic guidelines.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6">
<a href="/Feedback&Complain" class="text-decoration-none">
<div class="service-card">
<i class="fa-solid fa-comments"></i>
<h5>Feedback & Complaint</h5>
<p>Send feedback or submit inquiries directly to administration.</p>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6">
<a href="/StudentProfile" class="text-decoration-none">
<div class="service-card">
<i class="fa-solid fa-user"></i>
<h5>Student Profile</h5>
<p>Manage and update your personal student profile details.</p>
</div>
</a>
</div>
</div>
</div>

View File

@ -4,383 +4,289 @@
@section('content')
<style>
<!-- Bootstrap 5 -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
body{
background:#f6f7fb;
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Google Font -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
:root {
--theme-navy: #2D355B; /* Primary Navy */
--theme-navy-dark: #1F2541; /* Dark Navy */
--theme-red: #822424; /* Primary Accent Red */
--theme-red-hover: #df2c3e; /* Red Hover */
--theme-yellow: #FFEA85; /* Accent Yellow/Gold */
--bg-light: #F6F6F6; /* Page Background */
--white: #ffffff;
}
body {
font-family: 'Poppins', sans-serif;
background: var(--bg-light);
}
/* Header */
.profile-header{
background:linear-gradient(135deg,#5E244E,#4a1c3e);
color:#fff;
border-radius:20px;
padding:40px;
margin-bottom:35px;
box-shadow:0 15px 35px rgba(0,0,0,.15);
.profile-header {
background: linear-gradient(135deg, var(--theme-navy) 0%, var(--theme-navy-dark) 100%) !important;
color: var(--white);
border-radius: 16px;
padding: 35px 30px;
margin-bottom: 30px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
border-left: 5px solid var(--theme-red);
}
.profile-header h2{
font-weight:700;
.profile-header h2 {
font-weight: 700;
}
.profile-header p{
color:#ddd;
.profile-header p {
color: rgba(255, 255, 255, 0.85);
margin-bottom: 0;
}
/* Profile Card */
.profile-card{
background:#fff;
border-radius:20px;
padding:30px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
height:100%;
.profile-card {
background: var(--white);
border-radius: 16px;
padding: 30px;
border: 1px solid #e2e8f0;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
height: 100%;
}
/* Student Image */
.profile-image{
width:150px;
height:150px;
border-radius:50%;
object-fit:cover;
border:6px solid #d4af37;
.profile-image {
width: 140px;
height: 140px;
border-radius: 50%;
object-fit: cover;
border: 4px solid var(--theme-navy);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}
.student-name{
color:#5E244E;
font-weight:700;
margin-top:15px;
.student-name {
color: var(--theme-navy);
font-weight: 700;
margin-top: 15px;
}
.student-id{
background:#5E244E;
color:#fff;
padding:8px 20px;
border-radius:50px;
display:inline-block;
font-size:14px;
.student-id {
background: var(--theme-navy);
color: var(--white);
padding: 8px 20px;
border-radius: 50px;
display: inline-block;
font-size: 13px;
font-weight: 600;
letter-spacing: 0.5px;
}
/* Information */
.info-title{
color:#5E244E;
font-weight:700;
border-bottom:2px solid #d4af37;
padding-bottom:10px;
margin-bottom:20px;
.info-title {
color: var(--theme-navy);
font-weight: 700;
border-bottom: 2px solid var(--theme-yellow);
padding-bottom: 10px;
margin-bottom: 20px;
}
.info-row{
display:flex;
justify-content:space-between;
padding:12px 0;
border-bottom:1px solid #eee;
.info-title i {
color: var(--theme-red);
margin-right: 8px;
}
.label{
color:#777;
.info-row {
display: flex;
justify-content: space-between;
padding: 12px 0;
border-bottom: 1px solid #f1f5f9;
}
.value{
font-weight:600;
color:#333;
.info-row:last-child {
border-bottom: none;
}
/* Course */
.course-box{
background:#5E244E;
color:#fff;
padding:25px;
border-radius:20px;
.label {
color: #64748b;
font-weight: 500;
}
.course-box h4{
color:#d4af37;
font-weight:700;
.value {
font-weight: 600;
color: #1e293b;
}
.course-item{
margin-top:12px;
/* Course Box */
.course-box {
background: linear-gradient(135deg, var(--theme-navy) 0%, var(--theme-navy-dark) 100%);
color: var(--white);
padding: 30px;
border-radius: 16px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
height: 100%;
}
.course-item i{
color:#d4af37;
width:25px;
.course-box h4 {
color: var(--theme-yellow);
font-weight: 700;
margin-bottom: 20px;
border-bottom: 1px solid rgba(255, 255, 255, 0.15);
padding-bottom: 10px;
}
/* Button */
.edit-btn{
background:#d4af37;
color:white;
border:none;
border-radius:50px;
padding:12px 30px;
font-weight:600;
.course-item {
margin-top: 14px;
font-size: 15px;
color: rgba(255, 255, 255, 0.9);
}
.edit-btn:hover{
background:#c49d20;
color:#fff;
.course-item i {
color: var(--theme-yellow);
width: 28px;
}
/* Buttons */
.edit-btn {
background: var(--theme-red) !important;
color: var(--white) !important;
border: none;
border-radius: 8px;
padding: 10px 25px;
font-weight: 600;
transition: all 0.2s ease;
}
.edit-btn:hover {
background: var(--theme-red-hover) !important;
color: var(--white) !important;
}
@media(max-width:768px) {
.profile-header, .profile-card, .course-box {
padding: 25px;
}
}
</style>
<div class="container py-4">
<!-- Header -->
<div class="profile-header">
<h2>
<i class="fas fa-user-graduate"></i>
Student Profile
</h2>
<p>
Manage your personal information and academic details.
</p>
<h2> <i class="fas fa-user-graduate"></i> Student Profile </h2>
<p>Manage your personal information and academic details.</p>
</div>
<!-- Main Profile Row -->
<div class="row g-4">
<!-- Profile Left -->
<!-- Profile Card -->
<div class="col-lg-4">
<div class="profile-card text-center">
<img src="https://i.pravatar.cc/300"
class="profile-image">
<h3 class="student-name">Kasun Perera </h3>
<div class="profile-card text-center">
<img src="{{ !empty($student->image) ? asset($student->image) : 'https://i.pravatar.cc/300' }}"
class="profile-image" alt="Profile Image">
<h3 class="student-name">{{ $student->full_name }}</h3>
<span class="student-id">
Student ID : AEA20260045
<span class="student-id">
Student ID : {{ $student->student_id }}
</span>
<hr>
<button class="edit-btn mt-3">
<i class="fas fa-edit"></i> Edit Profile </button>
<button class="edit-btn mt-3">
<i class="fas fa-edit"></i> Edit Profile
</button>
</div>
</div>
</div>
<!-- Details -->
<!-- Personal Details -->
<div class="col-lg-8">
<div class="profile-card">
<h4 class="info-title">
<i class="fas fa-user"></i>
Personal Information
<i class="fas fa-user"></i> Personal Information
</h4>
<div class="info-row">
<span class="label">
Full Name
</span>
<span class="value">
Kasuni Perera
</span>
<span class="label">Full Name</span>
<span class="value">{{ $student->full_name }}</span>
</div>
<div class="info-row">
<span class="label">
NIC / Passport
</span>
<span class="value">
200012345678
</span>
<span class="label">NIC / Passport</span>
<span class="value">{{ $student->nic_passport }}</span>
</div>
<div class="info-row">
<span class="label">
Date of Birth
</span>
<span class="label">Date of Birth</span>
<span class="value">
15 March 2000
{{ !empty($student->date_of_birth) ? date('d F Y', strtotime($student->date_of_birth)) : 'N/A' }}
</span>
</div>
<div class="info-row">
<span class="label">
Gender
</span>
<span class="value">
Male
</span>
<span class="label">Gender</span>
<span class="value">{{ $student->gender }}</span>
</div>
<div class="info-row">
<span class="label">
Email
</span>
<span class="value">
student@email.com
</span>
<span class="label">Email</span>
<span class="value">{{ $student->email }}</span>
</div>
<div class="info-row">
<span class="label">
Phone
</span>
<span class="value">
+94 77 1234567
</span>
<span class="label">Phone</span>
<span class="value">{{ $student->phone }}</span>
</div>
</div>
</div>
</div>
<!-- Education & Course Details Row -->
<div class="row g-4 mt-1">
<!-- Education -->
<div class="col-lg-6">
<div class="profile-card">
<h4 class="info-title">
<i class="fas fa-graduation-cap"></i>
Educational Background
<i class="fas fa-graduation-cap"></i> Educational Background
</h4>
<div class="info-row">
<span class="label">
Qualification
</span>
<span class="value">
NVQ Level 4
</span>
<span class="label">Qualification</span>
<span class="value">{{ $student->qualification }}</span>
</div>
<div class="info-row">
<span class="label">
Institute
</span>
<span class="value">
ABC Technical College
</span>
<span class="label">Institute</span>
<span class="value">{{ $student->institute }}</span>
</div>
<div class="info-row">
<span class="label">
Year Completed
</span>
<span class="value">
2025
</span>
<span class="label">Year Completed</span>
<span class="value">{{ $student->year_completed }}</span>
</div>
</div>
</div>
<!-- Course Details -->
<div class="col-lg-6">
<div class="course-box">
<h4><i class="fas fa-car"></i>Course Details</h4>
<h4><i class="fas fa-car"></i> Course Details</h4>
<div class="course-item">
<i class="fas fa-book"></i> Diploma in Automobile Engineering </div>
<div class="course-item"> <i class="fas fa-calendar"></i> Duration : 2 Years</div>
<div class="course-item">
<i class="fas fa-layer-group"></i>Current Semester : Semester 2
</div>
<div class="course-item">
<i class="fas fa-user-tie"></i>
Trainer : Mr. Nimal Silva
<div class="course-item">
<i class="fas fa-book"></i> {{ $student->course_name }}
</div>
<div class="course-item">
<i class="fas fa-calendar"></i> Duration : {{ $student->duration }}
</div>
<div class="course-item">
<i class="fas fa-layer-group"></i> Current Semester : {{ $student->current_semester }}
</div>
<div class="course-item">
<i class="fas fa-user-tie"></i> Trainer : {{ $student->trainer_name }}
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@ -4,469 +4,348 @@
@section('content')
<!-- Bootstrap 5 -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Google Font -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
:root {
--theme-navy: #2D355B; /* Primary Navy */
--theme-navy-dark: #1F2541; /* Dark Navy */
--theme-red: #822424; /* Primary Accent Red */
--theme-red-hover: #df2c3e; /* Red Hover */
--theme-yellow: #FFEA85; /* Accent Yellow/Gold */
--bg-light: #F6F6F6; /* Page Background */
--white: #ffffff;
}
body{
background:#f6f7fb;
body {
font-family: 'Poppins', sans-serif;
background: var(--bg-light);
}
/*==========================
Hero
Hero Section
===========================*/
.guideline-hero{
background:linear-gradient(135deg,#5E244E,#4a1c3e);
border-radius:20px;
padding:45px;
color:#fff;
margin-bottom:35px;
box-shadow:0 18px 40px rgba(0,0,0,.12);
.guideline-hero {
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
border-radius: 16px;
padding: 35px 30px;
color: var(--white);
margin-bottom: 30px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
border-left: 5px solid var(--theme-red);
}
.guideline-hero h2{
font-weight:700;
margin-bottom:10px;
.guideline-hero h2 {
font-weight: 700;
margin-bottom: 10px;
}
.guideline-hero p{
color:#ececec;
margin-bottom:0;
font-size:15px;
.guideline-hero p {
color: rgba(255, 255, 255, 0.85);
margin-bottom: 0;
font-size: 15px;
}
/*==========================
Cards
Guide Cards
===========================*/
.guide-card{
background:#fff;
border:none;
border-radius:20px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
transition:.3s;
overflow:hidden;
height:100%;
.guide-card {
background: var(--white);
border: 1px solid #e2e8f0;
border-radius: 16px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
transition: all 0.3s ease;
overflow: hidden;
height: 100%;
}
.guide-card:hover{
transform:translateY(-6px);
.guide-card:hover {
transform: translateY(-4px);
border-color: var(--theme-navy);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
}
.card-head{
background:#5E244E;
color:#fff;
padding:18px 22px;
.card-head {
background: #753636;
color: var(--white);
padding: 18px 22px;
}
.card-head h5{
margin:0;
font-weight:600;
.card-head h5 {
margin: 0;
font-weight: 600;
}
.card-head i{
color:#d4af37;
margin-right:10px;
.card-head i {
color: var(--theme-yellow);
margin-right: 10px;
}
.card-body{
padding:22px;
.card-body {
padding: 22px;
}
.card-body ul{
padding-left:20px;
.card-body ul {
padding-left: 20px;
margin-bottom: 0;
}
.card-body li{
margin-bottom:10px;
color:#555;
.card-body li {
margin-bottom: 10px;
color: #475569;
}
.card-body li:last-child {
margin-bottom: 0;
}
/*==========================
Alert
Notice Alert Box
===========================*/
.notice{
background:#fff7e4;
border-left:6px solid #d4af37;
border-radius:16px;
padding:22px;
margin-top:35px;
box-shadow:0 8px 25px rgba(0,0,0,.06);
.notice {
background: rgba(255, 234, 133, 0.2);
border-left: 5px solid var(--theme-red);
border-radius: 16px;
padding: 22px;
margin-top: 35px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .03);
}
.notice h5{
color:#5E244E;
font-weight:700;
.notice h5 {
color: var(--theme-navy);
font-weight: 700;
}
.notice p{
margin-bottom:0;
color:#555;
.notice p {
margin-bottom: 0;
color: #475569;
}
/*==========================
Contact
Contact Box
===========================*/
.contact-card{
margin-top:35px;
border-radius:20px;
background:#4a1c3e;
color:#fff;
padding:35px;
box-shadow:0 12px 35px rgba(0,0,0,.12);
.contact-card {
margin-top: 30px;
border-radius: 16px;
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
color: var(--white);
padding: 35px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
}
.contact-card h4{
color:#d4af37;
font-weight:700;
.contact-card h4 {
color: var(--theme-yellow);
font-weight: 700;
}
.contact-item{
margin-top:18px;
font-size:15px;
.contact-item {
margin-top: 18px;
font-size: 15px;
}
.contact-item i{
color:#d4af37;
width:28px;
.contact-item i {
color: var(--theme-yellow);
width: 28px;
}
@media(max-width:768px) {
.guideline-hero, .contact-card {
padding: 25px;
}
}
</style>
<div class="container py-4">
<!-- Hero -->
<div class="guideline-hero">
<h2>
<i class="fas fa-book-open"></i>
<i class="fas fa-book-open me-2" style="color: var(--theme-yellow);"></i>
Student Guidelines
</h2>
<p>
Welcome to the Automobile Engineering Academy. These guidelines are
designed to help every student maintain professionalism, safety,
discipline, and academic excellence throughout the training programme.
</p>
</div>
<!-- Guidelines Cards -->
<div class="row g-4">
<!-- Classroom -->
<div class="col-lg-6">
<div class="guide-card">
<div class="card-head">
<h5>
<i class="fas fa-chalkboard-teacher"></i>
Classroom Rules
</h5>
</div>
<div class="card-body">
<ul>
<li>Attend every class on time.</li>
<li>Maintain discipline and respect lecturers.</li>
<li>Switch mobile phones to silent mode.</li>
<li>Complete all assignments before deadlines.</li>
<li>Keep classrooms clean and organized.</li>
</ul>
</div>
</div>
</div>
<!-- Workshop -->
<div class="col-lg-6">
<div class="guide-card">
<div class="card-head">
<h5>
<i class="fas fa-tools"></i>
Workshop Safety
</h5>
</div>
<div class="card-body">
<ul>
<li>Wear PPE before entering workshops.</li>
<li>Follow instructor safety instructions.</li>
<li>Never operate equipment without permission.</li>
<li>Report damaged tools immediately.</li>
<li>Keep workstations clean after practical sessions.</li>
</ul>
</div>
</div>
</div>
<!-- Attendance -->
<div class="col-lg-6">
<div class="guide-card">
<div class="card-head">
<h5>
<i class="fas fa-user-check"></i>
Attendance Policy
</h5>
</div>
<div class="card-body">
<ul>
<li>Minimum attendance requirement is 80%.</li>
<li>Medical leave must be supported by documents.</li>
<li>Repeated absence may affect examinations.</li>
<li>Late arrivals will be recorded.</li>
<li>Inform the administration if absent.</li>
</ul>
</div>
</div>
</div>
<!-- Dress -->
<div class="col-lg-6">
<div class="guide-card">
<div class="card-head">
<h5>
<i class="fas fa-user-tie"></i>
Uniform & PPE
</h5>
</div>
<div class="card-body">
<ul>
<li>Wear academy uniform during lectures.</li>
<li>Safety shoes are compulsory.</li>
<li>Use gloves and safety glasses.</li>
<li>Long hair must be tied properly.</li>
<li>ID card must be visible at all times.</li>
</ul>
</div>
</div>
</div>
<!-- Assessment -->
<div class="col-lg-6">
<div class="guide-card">
<div class="card-head">
<h5>
<i class="fas fa-file-alt"></i>
Assessment Rules
</h5>
</div>
<div class="card-body">
<ul>
<li>Submit assignments before due dates.</li>
<li>No plagiarism is permitted.</li>
<li>Bring required materials for practical tests.</li>
<li>Follow examination regulations.</li>
<li>Maintain academic honesty.</li>
</ul>
</div>
</div>
</div>
<!-- Conduct -->
<div class="col-lg-6">
<div class="guide-card">
<div class="card-head">
<h5>
<i class="fas fa-handshake"></i>
Student Conduct
</h5>
</div>
<div class="card-body">
<ul>
<li>Respect staff and fellow students.</li>
<li>Protect academy property.</li>
<li>Do not smoke inside the campus.</li>
<li>Avoid discrimination and harassment.</li>
<li>Represent the academy professionally.</li>
</ul>
</div>
</div>
</div>
</div>
<!-- Notice -->
<div class="notice">
<h5>
<i class="fas fa-exclamation-circle text-warning"></i>
<i class="fas fa-exclamation-circle me-1" style="color: var(--theme-red);"></i>
Important Notice
</h5>
<p>
Students who fail to follow academy regulations may face disciplinary
action according to the Automobile Engineering Academy Student Policy.
</p>
</div>
<!-- Contact -->
<div class="contact-card">
<h4>
<i class="fas fa-headset"></i>
<i class="fas fa-headset me-2"></i>
Student Support
</h4>
<p class="mt-3">
<p class="mt-3 text-white-50">
If you have any questions regarding academic regulations,
attendance, workshop safety, or student services, please contact
the Student Affairs Office.
</p>
<div class="contact-item">
<i class="fas fa-envelope"></i>
support@academy.lk
</div>
<div class="contact-item">
<i class="fas fa-phone"></i>
+94 11 234 5678
</div>
<div class="contact-item">
<i class="fas fa-map-marker-alt"></i>
Automobile Engineering Academy
</div>
</div>
</div>

View File

@ -6,16 +6,29 @@
<style>
:root{
--primary:#5E244E;
--secondary:#8B3A74;
--light:#f8f4f7;
/* Premium Modern Automotive Palette */
--primary: #3E51B8; /* Tech Blue */
--primary-light: #0a67df; /* Vibrant Electric Blue */
--secondary: #BC1A1A; /* Deep Racing Red */
--secondary-hover: #822424; /* Dark Burnt Red */
--accent-dark: #753939; /* Muted Crimson */
--bg-light: #F8FAFC; /* Soft slate light gray */
/* Semantic Adjustments */
--text-main: #1E293B; /* Slate dark grey */
--text-muted: #64748B; /* Neutral gray */
--card-border: rgba(62, 81, 184, 0.1);
}
.hero-about{
body {
font-family: 'Segoe UI', Arial, sans-serif;
color: var(--text-main);
}
/* .hero-about{
min-height:60vh;
background:
linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),
url('https://images.pexels.com/photos/1595385/pexels-photo-1595385.jpeg');
linear-gradient(rgba(185, 205, 253, 0.31), rgb(0, 0, 0)), url('https://images.pexels.com/photos/1595385/pexels-photo-1595385.jpeg');
background-size:cover;
background-position:center;
display:flex;
@ -23,6 +36,17 @@
justify-content:center;
text-align:center;
color:#fff;
} */
.hero-about {
min-height: 60vh;
background: linear-gradient(rgba(194, 217, 255, 0.75), rgba(0, 0, 0, 0.85)), url('https://images.unsplash.com/photo-1617814076367-b759c7d7e738?auto=format&fit=crop&w=1600&q=80');
background-size: cover;
background-position: center;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: #fff;
}
.section-title{
@ -34,22 +58,22 @@
background:#fff;
border-radius:20px;
padding:35px 25px;
box-shadow:0 10px 30px rgba(0,0,0,.05);
box-shadow: 0 10px 30px rgba(0,0,0,.04);
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
border: 1px solid #efeff4;
border: 1px solid var(--card-border);
}
.about-box:hover {
transform: translateY(-10px) scale(1.02);
box-shadow: 0 20px 40px rgba(94, 36, 78, 0.1);
border-color: var(--primary);
box-shadow: 0 20px 40px rgba(62, 81, 184, 0.12);
border-color: var(--primary-light);
}
.icon-circle {
width:75px;
height:75px;
background:var(--primary);
color:#fff;
background: #6e3232;
color: #f6e983;
border-radius:50%;
display:flex;
align-items:center;
@ -60,8 +84,9 @@
}
.about-box:hover .icon-circle {
background: var(--secondary);
transform: rotateY(180deg); /* කාඩ් එක උඩට යද්දී අයිකන් එක කැරකෙනවා */
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
transform: rotateY(180deg);
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.3);
}
/* ========================================================
@ -73,41 +98,36 @@
transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}
/* 1. පල්ලෙහා ඉඳන් උඩට එන ඇනිමේෂන් */
.fade-up-init {
transform: translateY(40px);
}
/* 2. වමේ ඉඳන් දකුණට (රූපය සඳහා) */
.slide-left-init {
transform: translateX(-50px);
}
/* 3. දකුණේ ඉඳන් වමට (විස්තරය සඳහා) */
.slide-right-init {
transform: translateX(50px);
}
/* 4. Zoom වෙලා bounce වෙන්න (කාඩ්ස් සඳහා) */
.zoom-in-init {
transform: scale(0.85);
}
/* Active Class (Scroll කරද්දී apply වේ) */
.animate-item.animated {
opacity: 1;
transform: translate(0) scale(1);
}
/* CTA බටන් එක ගැස්සෙන ඇනිමේෂන් එකක් */
/* Automotive Theme Glow Pulse Button */
@keyframes pulse-btn {
0% { box-shadow: 0 0 0 0 rgba(94, 36, 78, 0.4); }
70% { box-shadow: 0 0 0 15px rgba(94, 36, 78, 0); }
100% { box-shadow: 0 0 0 0 rgba(94, 36, 78, 0); }
0% { box-shadow: 0 0 0 0 rgba(10, 103, 223, 0.4); }
70% { box-shadow: 0 0 0 15px rgba(10, 103, 223, 0); }
100% { box-shadow: 0 0 0 0 rgba(10, 103, 223, 0); }
}
.cta-btn {
background: var(--primary);
background: var(--primary-light);
color: #fff !important;
padding: 14px 35px;
border-radius: 50px;
@ -118,8 +138,249 @@
}
.cta-btn:hover {
background: var(--secondary);
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
transform: scale(1.05);
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.4);
}
/* .btn-view-courses {
background: var(--primary);
color: #fff;
transition: all 0.3s ease;
}
.btn-view-courses:hover {
background: var(--secondary);
color: #fff;
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.2);
} */
.btn-view-courses{
background: #822424;
color: #fff;
/* padding: 14px ; */
border-radius: 40px;
font-weight: 600;
transition: all 0.3s ease;
font-weight: bolder;
}
.btn-view-courses:hover {
background: var(--secondary-hover);
border-color: var(--secondary-hover);
color: #fff;
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(227, 100, 20, 0.3);
}
</style>
<!-- HERO -->
<section class="hero-about">
<div class="container">
<div class="animate-item animated fade-up-init">
<h1 class="fw-bold display-4">About Our Institute</h1>
<p class="mt-3 lead" style="max-width: 700px; margin: auto;">
We are committed to delivering high-quality automotive education
with practical training and industry-focused learning.
</p>
</div>
</div>
</section>
<!-- ABOUT CONTENT -->
<section class="py-5 overflow-hidden">
<div class="container">
<div class="row align-items-center g-5">
<div class="col-md-6 animate-item slide-left-init">
<img src="https://images.pexels.com/photos/3862130/pexels-photo-3862130.jpeg"
class="img-fluid rounded shadow-lg"
alt="About Image">
</div>
<div class="col-md-6 animate-item slide-right-init">
<h2 class="fw-bold mb-3">Who We Are</h2>
<p class="text-muted fs-5">
Our institute specializes in automotive engineering education,
offering hands-on training in modern vehicle technologies,
mechanical systems, and electric vehicles.
</p>
<p class="text-muted mb-4">
We focus on building skilled professionals who are ready for
the global automotive industry.
</p>
<a href="/courses" class="btn btn-view-courses btn-lg px-4 rounded-pill shadow-sm">
View Courses@extends('layouts.app')
@section('title','About Us')
@section('content')
<style>
:root {
/* Premium Modern Automotive Palette */
--primary: #3E51B8; /* Tech Blue */
--primary-light: #0a67df; /* Vibrant Electric Blue */
--secondary: #BC1A1A; /* Deep Racing Red */
--secondary-hover: #822424; /* Dark Burnt Red */
--accent-dark: #753939; /* Muted Crimson */
--bg-light: #F8FAFC; /* Soft slate light gray */
/* Semantic Adjustments */
--text-main: #1E293B; /* Slate dark grey */
--text-muted: #64748B; /* Neutral gray */
--card-border: rgba(62, 81, 184, 0.1);
}
body {
font-family: 'Segoe UI', Arial, sans-serif;
color: var(--text-main);
}
.hero-about {
min-height: 60vh;
background: linear-gradient(rgba(194, 217, 255, 0.75), rgba(0, 0, 0, 0.85)),url('https://images.unsplash.com/photo-1552519507-da3b142c6e3d?auto=format&fit=crop&w=1600&q=80');
background-size: cover;
background-position: center;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
color: #fff;
}
.section-title {
text-align: center;
margin-bottom: 40px;
}
.about-box {
background: #fff;
border-radius: 20px;
padding: 35px 25px;
box-shadow: 0 10px 30px rgba(0,0,0,.04);
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
border: 1px solid var(--card-border);
}
.about-box:hover {
transform: translateY(-10px) scale(1.02);
box-shadow: 0 20px 40px rgba(62, 81, 184, 0.12);
border-color: var(--primary-light);
}
.icon-circle {
width: 75px;
height: 75px;
background: #6e3232;
color: #fffefa;;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 28px;
margin: auto;
transition: all 0.4s ease;
}
.about-box:hover .icon-circle {
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
transform: rotateY(180deg);
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.3);
}
/* ========================================================
Advanced CSS Scroll Animations
======================================================== */
.animate-item {
opacity: 0;
will-change: transform, opacity;
transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}
.fade-up-init {
transform: translateY(40px);
}
.slide-left-init {
transform: translateX(-50px);
}
.slide-right-init {
transform: translateX(50px);
}
.zoom-in-init {
transform: scale(0.85);
}
.animate-item.animated {
opacity: 1;
transform: translate(0) scale(1);
}
/* Automotive Theme Glow Pulse Button */
@keyframes pulse-btn {
0% { box-shadow: 0 0 0 0 rgba(10, 103, 223, 0.4); }
70% { box-shadow: 0 0 0 15px rgba(10, 103, 223, 0); }
100% { box-shadow: 0 0 0 0 rgba(10, 103, 223, 0); }
}
/* .cta-btn {
background: var(--primary-light);
color: #fff !important;
padding: 14px 35px;
border-radius: 50px;
font-weight: 600;
text-decoration: none;
transition: all 0.3s ease;
animation: pulse-btn 2s infinite;
}
.cta-btn:hover {
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
transform: scale(1.05);
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.4);
} */
.cta-btn{
background: #822424;
color: #fff;
padding: 14px 35px;
border-radius: 40px;
font-weight: 600;
transition: all 0.3s ease;
font-weight: bolder;
}
.cta-btn:hover {
background: var(--secondary-hover);
border-color: var(--secondary-hover);
color: #fff;
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(227, 100, 20, 0.3);
}
.btn-view-courses {
background: var(--secondary-hover);
color: #fff;
padding: 14px 35px;
border-radius: 40px;
font-weight: 600;
text-decoration: none;
transition: all 0.3s ease;
/* border: none; */
}
.btn-view-courses:hover {
background: var(--secondary);
color: #fff;
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(188, 26, 26, 0.3);
}
</style>
@ -140,14 +401,12 @@
<section class="py-5 overflow-hidden">
<div class="container">
<div class="row align-items-center g-5">
<!-- වමේ සිට දකුණට පැමිණේ -->
<div class="col-md-6 animate-item slide-left-init">
<img src="https://images.pexels.com/photos/3862130/pexels-photo-3862130.jpeg"
class="img-fluid rounded shadow-lg"
alt="About Image">
</div>
<!-- දකුණේ සිට වමට පැමිණේ -->
<div class="col-md-6 animate-item slide-right-init">
<h2 class="fw-bold mb-3">Who We Are</h2>
<p class="text-muted fs-5">
@ -159,7 +418,7 @@
We focus on building skilled professionals who are ready for
the global automotive industry.
</p>
<a href="{{ route('courses') }}" class="btn btn-dark btn-lg px-4 rounded-pill">
<a href="/courses" class="btn btn-view-courses btn-lg px-4 rounded-pill shadow-sm">
View Courses
</a>
</div>
@ -177,7 +436,97 @@
</div>
<div class="row g-4">
<!-- කාඩ් එකින් එක Zoom-in වේ -->
<div class="col-md-4 animate-item zoom-in-init" style="transition-delay: 100ms;">
<div class="about-box text-center">
<div class="icon-circle">
<i class="fa-solid fa-chalkboard-user"></i>
</div>
<h4 class="mt-4 fw-bold">Expert Lecturers</h4>
<p class="text-muted mb-0">
Experienced industry professionals guiding your learning journey.
</p>
</div>
</div>
<div class="col-md-4 animate-item zoom-in-init" style="transition-delay: 250ms;">
<div class="about-box text-center">
<div class="icon-circle">
<i class="fa-solid fa-screwdriver-wrench"></i>
</div>
<h4 class="mt-4 fw-bold">Practical Training</h4>
<p class="text-muted mb-0">
Hands-on workshop experience with real vehicles and tools.
</p>
</div>
</div>
<div class="col-md-4 animate-item zoom-in-init" style="transition-delay: 400ms;">
<div class="about-box text-center">
<div class="icon-circle">
<i class="fa-solid fa-certificate"></i>
</div>
<h4 class="mt-4 fw-bold">Certified Courses</h4>
<p class="text-muted mb-0">
Industry-recognized certifications to boost your career.
</p>
</div>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="py-5 text-center bg-white overflow-hidden">
<div class="container py-4 animate-item fade-up-init">
<h2 class="fw-bold mb-3">Start Your Automotive Career Today</h2>
<p class="text-muted fs-5 mb-5">
Join our institute and become a skilled automotive professional.
</p>
<div class="d-flex justify-content-center">
<a href="/apply" class="cta-btn shadow">
Apply Courses
</a>
</div>
</div>
</section>
<script>
document.addEventListener('DOMContentLoaded', function () {
const animatedElements = document.querySelectorAll('.animate-item');
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
entry.target.classList.add('animated');
observer.unobserve(entry.target);
}
});
}, {
threshold: 0.15
});
animatedElements.forEach(el => observer.observe(el));
});
</script>
@endsection
</a>
</div>
</div>
</div>
</section>
<!-- FEATURES -->
<section class="py-5 bg-light">
<div class="container">
<div class="section-title animate-item fade-up-init">
<h2 class="fw-bold">Why Choose Us</h2>
<p class="text-muted">We provide the best learning experience</p>
</div>
<div class="row g-4">
<div class="col-md-4 animate-item zoom-in-init" style="transition-delay: 100ms;">
<div class="about-box text-center">
<div class="icon-circle">
@ -245,7 +594,7 @@ document.addEventListener('DOMContentLoaded', function () {
}
});
}, {
threshold: 0.15 // Element එකෙන් 15%ක් පෙනෙද්දීම ඇනිමේෂන් එක පටන් ගනී
threshold: 0.15
});
animatedElements.forEach(el => observer.observe(el));

View File

@ -0,0 +1,233 @@
@extends('layouts.adminnav')
@section('title', 'Admin Dashboard')
@section('content')
<style>
.welcome-card {
background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
color: #ffffff;
border-radius: 12px;
}
.stat-card {
transition: transform 0.2s ease, box-shadow 0.2s ease;
border: none;
border-radius: 12px;
}
.stat-card:hover {
transform: translateY(-4px);
}
.icon-box {
width: 55px;
height: 55px;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
font-size: 24px;
}
</style>
<div class="container-fluid py-4">
<!-- Welcome Banner -->
<div class="welcome-card p-4 mb-4 shadow-sm d-flex justify-content-between align-items-center">
<div>
<h3 class="fw-bold mb-1"><i class="fa-solid fa-gauge me-2"></i>Welcome to Admin Dashboard</h3>
<p class="mb-0 text-white-50">Automobile Engineering Academy System Overview</p>
</div>
<div class="text-end d-none d-md-block">
<span class="badge bg-danger fs-6 px-3 py-2 rounded-pill"><i class="fa-solid fa-shield-halved me-1"></i> System Active</span>
</div>
</div>
<!-- Alert Messages -->
@if(session('success'))
<div class="alert alert-success alert-dismissible fade show mb-4" role="alert">
<i class="fa-solid fa-circle-check me-2"></i>{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
@endif
<!-- Quick Stats Cards Row -->
<div class="row g-4 mb-4">
<!-- Courses Card -->
<div class="col-md-6 col-lg-3">
<div class="card stat-card shadow-sm h-100">
<div class="card-body d-flex align-items-center justify-content-between p-4">
<div>
<span class="text-muted fw-bold small text-uppercase">My Courses</span>
<h3 class="fw-bold text-dark mt-1 mb-0">Manage</h3>
</div>
<div class="icon-box bg-primary bg-opacity-10 text-primary">
<i class="fa-solid fa-book"></i>
</div>
</div>
<div class="card-footer bg-light border-0 py-2 text-center">
<a href="{{ route('admin.mycourses') }}" class="text-primary fw-bold text-decoration-none small">
View Details <i class="fa-solid fa-arrow-right ms-1"></i>
</a>
</div>
</div>
</div>
<!-- Timetable Card -->
<div class="col-md-6 col-lg-3">
<div class="card stat-card shadow-sm h-100">
<div class="card-body d-flex align-items-center justify-content-between p-4">
<div>
<span class="text-muted fw-bold small text-uppercase">Active Slots</span>
<h3 class="fw-bold text-dark mt-1 mb-0">{{ $totalTimetableSlots ?? 0 }}</h3>
</div>
<div class="icon-box bg-success bg-opacity-10 text-success">
<i class="fa-solid fa-calendar-days"></i>
</div>
</div>
<div class="card-footer bg-light border-0 py-2 text-center">
<a href="{{ route('admin.timetable') }}" class="text-success fw-bold text-decoration-none small">
Manage Timetable <i class="fa-solid fa-arrow-right ms-1"></i>
</a>
</div>
</div>
</div>
<!-- Exam Results Card -->
<div class="col-md-6 col-lg-3">
<div class="card stat-card shadow-sm h-100">
<div class="card-body d-flex align-items-center justify-content-between p-4">
<div>
<span class="text-muted fw-bold small text-uppercase">Results</span>
<h3 class="fw-bold text-dark mt-1 mb-0">Publish</h3>
</div>
<div class="icon-box bg-warning bg-opacity-10 text-warning">
<i class="fa-solid fa-graduation-cap"></i>
</div>
</div>
<div class="card-footer bg-light border-0 py-2 text-center">
<a href="{{ route('admin.results') }}" class="text-warning fw-bold text-decoration-none small">
Manage Results <i class="fa-solid fa-arrow-right ms-1"></i>
</a>
</div>
</div>
</div>
<!-- Notifications Card -->
<div class="col-md-6 col-lg-3">
<div class="card stat-card shadow-sm h-100">
<div class="card-body d-flex align-items-center justify-content-between p-4">
<div>
<span class="text-muted fw-bold small text-uppercase">Notifications</span>
<h3 class="fw-bold text-dark mt-1 mb-0">{{ $unreadNotifications ?? 0 }} New</h3>
</div>
<div class="icon-box bg-danger bg-opacity-10 text-danger">
<i class="fa-solid fa-bell"></i>
</div>
</div>
<div class="card-footer bg-light border-0 py-2 text-center">
<a href="#notifications-section" class="text-danger fw-bold text-decoration-none small">
View All <i class="fa-solid fa-arrow-down ms-1"></i>
</a>
</div>
</div>
</div>
</div>
<!-- Main Content Area: Quick Navigation & Live Notifications -->
<div class="row g-4">
<!-- Quick Action Shortcuts Panel -->
<div class="col-lg-7">
<div class="card border-0 shadow-sm rounded-3 h-100">
<div class="card-header bg-white py-3 border-0">
<h5 class="fw-bold mb-0 text-dark">
<i class="fa-solid fa-bolt text-warning me-2"></i>Quick Management Shortcuts
</h5>
</div>
<div class="card-body">
<div class="row g-3">
<div class="col-md-6">
<a href="{{ route('admin.timetable') }}" class="btn btn-outline-primary p-3 w-100 text-start d-flex align-items-center rounded-3">
<i class="fa-solid fa-calendar-plus fs-3 me-3"></i>
<div>
<strong class="d-block">Manage Timetable</strong>
<small class="text-muted">Edit weekly schedules and subjects</small>
</div>
</a>
</div>
<div class="col-md-6">
<a href="{{ route('admin.mycourses') }}" class="btn btn-outline-success p-3 w-100 text-start d-flex align-items-center rounded-3">
<i class="fa-solid fa-folder-plus fs-3 me-3"></i>
<div>
<strong class="d-block">Courses & Modules</strong>
<small class="text-muted">Add or edit active modules</small>
</div>
</a>
</div>
<div class="col-md-6">
<a href="{{ route('admin.results') }}" class="btn btn-outline-warning p-3 w-100 text-start d-flex align-items-center rounded-3">
<i class="fa-solid fa-file-invoice fs-3 me-3"></i>
<div>
<strong class="d-block">Student Results</strong>
<small class="text-muted">Upload and update grades</small>
</div>
</a>
</div>
<div class="col-md-6">
<a href="{{ route('admin.profile') }}" class="btn btn-outline-danger p-3 w-100 text-start d-flex align-items-center rounded-3">
<i class="fa-solid fa-user-gear fs-3 me-3"></i>
<div>
<strong class="d-block">Account Settings</strong>
<small class="text-muted">Update profile and password</small>
</div>
</a>
</div>
</div>
</div>
</div>
</div>
<!-- Live Notifications Feed Panel -->
<div class="col-lg-5" id="notifications-section">
<div class="card border-0 shadow-sm rounded-3 h-100">
<div class="card-header bg-white py-3 border-0 d-flex justify-content-between align-items-center">
<h5 class="fw-bold mb-0 text-dark">
<i class="fa-solid fa-bell text-danger me-2"></i>System Notifications
</h5>
<span class="badge bg-danger rounded-pill">{{ $unreadNotifications ?? 0 }} Unread</span>
</div>
<div class="card-body p-0">
<ul class="list-group list-group-flush">
@forelse($notifications ?? [] as $notification)
<li class="list-group-item p-3 border-bottom {{ $notification->is_read ? 'bg-light' : '' }}">
<div class="d-flex justify-content-between align-items-start">
<div>
<h6 class="fw-bold mb-1 text-dark">{{ $notification->title }}</h6>
<p class="mb-1 text-muted small">{{ $notification->message }}</p>
<small class="text-secondary opacity-75" style="font-size: 11px;">
<i class="fa-regular fa-clock me-1"></i>{{ $notification->created_at->diffForHumans() }}
</small>
</div>
@if(!$notification->is_read)
<form action="{{ route('admin.notifications.read', $notification->id) }}" method="POST">
@csrf
<button type="submit" class="btn btn-sm btn-outline-success" title="Mark as Read">
<i class="fa-solid fa-check"></i>
</button>
</form>
@endif
</div>
</li>
@empty
<li class="list-group-item text-center py-4 text-muted">
<i class="fa-solid fa-inbox fs-3 d-block mb-2 text-secondary"></i>
No notifications found.
</li>
@endforelse
</ul>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@ -0,0 +1,518 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Course Management - Admin Portal</title>
<!-- Font Awesome Icons & Bootstrap 5 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
:root {
--theme-navy: #2D355B;
--theme-footer-navy: #1F2541;
--theme-red: #822424;
--theme-red-hover: #df2c3e;
--theme-yellow: #FFEA85;
--theme-bg: #F6F6F6;
--sidebar-width: 260px;
--text-dark: #333333;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', sans-serif;
}
body {
background-color: var(--theme-bg);
color: var(--text-dark);
display: flex;
min-height: 100vh;
overflow-x: hidden;
}
.sidebar {
width: var(--sidebar-width);
height: 100vh;
background: var(--theme-navy);
color: #fff;
position: fixed;
top: 0;
left: 0;
padding: 24px 0;
transition: all 0.3s ease;
z-index: 1030;
display: flex;
flex-direction: column;
box-shadow: 2px 0 10px rgba(0,0,0,0.1);
}
.sidebar .brand {
padding: 0 24px 20px;
font-weight: 700;
font-size: 1.25rem;
color: #ffffff;
border-bottom: 1px solid rgba(255,255,255,.15);
margin-bottom: 12px;
display: flex;
align-items: center;
}
.sidebar .admin-badge {
background-color: var(--theme-red);
font-size: 0.7rem;
padding: 2px 8px;
border-radius: 4px;
margin-left: 8px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.sidebar .nav {
display: flex;
flex-direction: column;
flex-grow: 1;
overflow-y: auto;
}
.sidebar .nav-link {
color: rgba(255, 255, 255, 0.85);
padding: 14px 24px;
font-size: 0.95rem;
font-weight: 600;
display: flex;
align-items: center;
gap: 12px;
transition: all 0.2s ease;
border-left: 4px solid transparent;
text-decoration: none;
}
.sidebar .nav-link i {
width: 20px;
text-align: center;
}
.sidebar .nav-link:hover {
background: rgba(255, 255, 255, 0.08);
color: var(--theme-yellow) !important;
padding-left: 28px;
}
.sidebar .nav-link.active {
background: var(--theme-footer-navy);
color: var(--theme-yellow) !important;
border-left: 4px solid #F73F52;
font-weight: 700;
}
.sidebar-user-profile {
padding: 15px 24px;
border-top: 1px solid rgba(255,255,255,.15);
margin-top: auto;
background: var(--theme-footer-navy);
}
.main {
margin-left: var(--sidebar-width);
width: calc(100% - var(--sidebar-width));
min-height: 100vh;
padding: 40px;
background: var(--theme-bg);
transition: all 0.3s ease;
}
.mobile-header {
display: none;
background: var(--theme-navy);
color: #ffffff;
padding: 12px 20px;
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
align-items: center;
justify-content: space-between;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1020;
}
.sidebar-toggle {
background: none;
border: none;
font-size: 1.4rem;
cursor: pointer;
color: #ffffff;
}
.sidebar-overlay {
display: none;
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
background: rgba(0,0,0,0.5);
z-index: 1025;
}
.sidebar-overlay.show { display: block; }
@media (max-width: 991px) {
.sidebar { left: calc(-1 * var(--sidebar-width)); }
.sidebar.show { left: 0; }
.main { margin-left: 0; padding: 85px 20px 20px 20px; width: 100%; }
.mobile-header { display: flex; }
}
.course-img-preview {
width: 50px;
height: 50px;
object-fit: cover;
border-radius: 6px;
}
</style>
</head>
<body>
<!-- Mobile Top Navigation Bar -->
<header class="mobile-header">
<button class="sidebar-toggle" id="toggleBtn" aria-label="Toggle Sidebar">
<i class="fa-solid fa-bars"></i>
</button>
<div class="fw-bold">Admin Panel</div>
<a href="/admin/login" class="btn btn-sm btn-outline-light">Sign In</a>
</header>
<div class="sidebar-overlay" id="sidebarOverlay"></div>
<!-- Sidebar Navigation -->
<aside class="sidebar" id="sidebar">
<div class="brand">
<i class="fa-solid fa-car-side me-2"></i> AutoEdu
<span class="admin-badge">Admin</span>
</div>
<nav class="nav">
<a href="/admin/dashboard" class="nav-link">
<i class="fa-solid fa-chart-line"></i> Admin Dashboard
</a>
<a href="/admin/adminmycourses" class="nav-link active">
<i class="fa-solid fa-book-bookmark"></i> Course Management
</a>
<a href="/admin/timetable" class="nav-link">
<i class="fa-solid fa-calendar-check"></i> Class Timetable
</a>
<a href="/admin/results" class="nav-link">
<i class="fa-solid fa-file-invoice-dollar"></i> Exam Results
</a>
</nav>
<div class="sidebar-user-profile">
<div class="dropdown dropup">
<a class="text-white text-decoration-none dropdown-toggle d-flex align-items-center gap-2" href="#" data-bs-toggle="dropdown">
<i class="fa-solid fa-circle-user" style="font-size: 24px; color: var(--theme-yellow);"></i>
<span>{{ session('admin_username', 'Admin') }}</span>
</a>
<ul class="dropdown-menu dropdown-menu-start shadow w-100">
<li>
<button type="button" onclick="submitAdminLogout()" class="dropdown-item text-danger border-0 bg-transparent">
<i class="fa-solid fa-right-from-bracket me-2"></i> Logout
</button>
</li>
</ul>
</div>
</div>
</aside>
<!-- Main Content Area -->
<main class="main">
<div class="d-flex justify-content-between align-items-center mb-4">
<h3 class="fw-bold"><i class="fa-solid fa-book-bookmark me-2"></i> Course Management</h3>
<button class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#addCourseModal">
<i class="fa-solid fa-plus me-1"></i> Add New Course
</button>
</div>
<!-- Success/Error Alerts -->
@if(session('success'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
@endif
@if(session('error'))
<div class="alert alert-danger alert-dismissible fade show" role="alert">
{{ session('error') }}
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
@endif
<!-- Courses Table Card -->
<div class="card border-0 shadow-sm rounded-3">
<div class="card-body p-0">
<div class="table-responsive">
<table class="table table-hover align-middle mb-0">
<thead class="table-dark">
<tr>
<th>#</th>
<th>Image</th>
<th>Code</th>
<th>Title</th>
<th>Duration</th>
<th>Level</th>
<th>Status</th>
<th class="text-center">Actions</th>
</tr>
</thead>
<tbody>
@forelse($courses as $course)
<tr>
<td>{{ $loop->iteration }}</td>
<td>
@if($course->image)
<img src="{{ asset('storage/' . $course->image) }}" class="course-img-preview" alt="Course Image">
@else
<span class="badge bg-secondary">No Image</span>
@endif
</td>
<td><span class="badge bg-light text-dark border">{{ $course->course_code }}</span></td>
<td class="fw-semibold">{{ $course->title }}</td>
<td>{{ $course->duration }}</td>
<td>{{ $course->level }}</td>
<td>
@if($course->status == 'Active')
<span class="badge bg-success">Active</span>
@else
<span class="badge bg-secondary">Inactive</span>
@endif
</td>
<td class="text-center">
<!-- Edit Button -->
<button class="btn btn-sm btn-outline-warning me-1"
data-bs-toggle="modal"
data-bs-target="#editCourseModal{{ $course->id }}">
<i class="fa-solid fa-pen-to-square"></i> Edit
</button>
<!-- Delete Form -->
<form action="{{ route('admin.courses.delete', $course->id) }}" method="POST" class="d-inline" onsubmit="return confirm('Are you sure you want to delete this course?')">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-sm btn-outline-danger">
<i class="fa-solid fa-trash"></i> Delete
</button>
</form>
</td>
</tr>
<!-- EDIT COURSE MODAL -->
<div class="modal fade" id="editCourseModal{{ $course->id }}" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form action="{{ route('admin.courses.update', $course->id) }}" method="POST" enctype="multipart/form-data">
@csrf
<div class="modal-header bg-warning text-dark">
<h5 class="modal-title fw-bold"><i class="fa-solid fa-pen-to-square me-2"></i>Edit Course</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<div class="row g-3">
<div class="col-md-8">
<label class="form-label fw-semibold">Course Title</label>
<input type="text" name="title" class="form-control" value="{{ $course->title }}" required>
</div>
<div class="col-md-4">
<label class="form-label fw-semibold">Course Code</label>
<input type="text" name="course_code" class="form-control" value="{{ $course->course_code }}" required>
</div>
<div class="col-md-4">
<label class="form-label fw-semibold">Duration</label>
<input type="text" name="duration" class="form-control" value="{{ $course->duration }}" required>
</div>
<div class="col-md-4">
<label class="form-label fw-semibold">Level</label>
<select name="level" class="form-select" required>
<option value="Beginner" {{ $course->level == 'Beginner' ? 'selected' : '' }}>Beginner</option>
<option value="Intermediate" {{ $course->level == 'Intermediate' ? 'selected' : '' }}>Intermediate</option>
<option value="Advanced" {{ $course->level == 'Advanced' ? 'selected' : '' }}>Advanced</option>
</select>
</div>
<div class="col-md-4">
<label class="form-label fw-semibold">Status</label>
<select name="status" class="form-select" required>
<option value="Active" {{ $course->status == 'Active' ? 'selected' : '' }}>Active</option>
<option value="Inactive" {{ $course->status == 'Inactive' ? 'selected' : '' }}>Inactive</option>
</select>
</div>
<div class="col-md-6">
<label class="form-label fw-semibold">Author/Lecturer</label>
<input type="text" name="author" class="form-control" value="{{ $course->author }}">
</div>
<div class="col-md-6">
<label class="form-label fw-semibold">Badge (e.g. Popular, New)</label>
<input type="text" name="badge" class="form-control" value="{{ $course->badge }}">
</div>
<div class="col-md-12">
<label class="form-label fw-semibold">Change Image (Optional)</label>
<input type="file" name="image" class="form-control">
</div>
<div class="col-md-12">
<label class="form-label fw-semibold">Description</label>
<textarea name="desc" class="form-control" rows="3">{{ $course->desc }}</textarea>
</div>
<div class="col-md-12 form-check">
<input class="form-check-input" type="checkbox" name="trending" value="1" id="trendingEdit{{ $course->id }}" {{ $course->trending ? 'checked' : '' }}>
<label class="form-check-label fw-semibold" for="trendingEdit{{ $course->id }}">
Mark as Trending Course
</label>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-warning">Save Changes</button>
</div>
</form>
</div>
</div>
</div>
@empty
<tr>
<td colspan="8" class="text-center py-4 text-muted">No courses found. Click "Add New Course" to create one.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
</main>
<!-- ADD COURSE MODAL -->
<div class="modal fade" id="addCourseModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<form action="{{ route('admin.courses.store') }}" method="POST" enctype="multipart/form-data">
@csrf
<div class="modal-header bg-navy text-white" style="background-color: var(--theme-navy);">
<h5 class="modal-title fw-bold text-white"><i class="fa-solid fa-plus me-2"></i>Add New Course</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
<div class="row g-3">
<div class="col-md-8">
<label class="form-label fw-semibold">Course Title</label>
<input type="text" name="title" class="form-control" placeholder="e.g. Engine Diagnostics Masterclass" required>
</div>
<div class="col-md-4">
<label class="form-label fw-semibold">Course Code</label>
<input type="text" name="course_code" class="form-control" placeholder="e.g. AUTO-101" required>
</div>
<div class="col-md-4">
<label class="form-label fw-semibold">Duration</label>
<input type="text" name="duration" class="form-control" placeholder="e.g. 6 Months" required>
</div>
<div class="col-md-4">
<label class="form-label fw-semibold">Level</label>
<select name="level" class="form-select" required>
<option value="Beginner">Beginner</option>
<option value="Intermediate">Intermediate</option>
<option value="Advanced">Advanced</option>
</select>
</div>
<div class="col-md-4">
<label class="form-label fw-semibold">Status</label>
<select name="status" class="form-select" required>
<option value="Active">Active</option>
<option value="Inactive">Inactive</option>
</select>
</div>
<div class="col-md-6">
<label class="form-label fw-semibold">Author/Lecturer</label>
<input type="text" name="author" class="form-control" placeholder="Lecturer Name">
</div>
<div class="col-md-6">
<label class="form-label fw-semibold">Badge</label>
<input type="text" name="badge" class="form-control" placeholder="e.g. Popular">
</div>
<div class="col-md-12">
<label class="form-label fw-semibold">Course Image</label>
<input type="file" name="image" class="form-control">
</div>
<div class="col-md-12">
<label class="form-label fw-semibold">Description</label>
<textarea name="desc" class="form-control" rows="3" placeholder="Enter course description..."></textarea>
</div>
<div class="col-md-12 form-check">
<input class="form-check-input" type="checkbox" name="trending" value="1" id="trendingAdd">
<label class="form-check-label fw-semibold" for="trendingAdd">
Mark as Trending Course
</label>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Save Course</button>
</div>
</form>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script>
// Sidebar Toggle Logic
const toggleBtn = document.getElementById('toggleBtn');
const sidebar = document.getElementById('sidebar');
const overlay = document.getElementById('sidebarOverlay');
if(toggleBtn) {
toggleBtn.addEventListener('click', () => {
sidebar.classList.toggle('show');
overlay.classList.toggle('show');
});
}
if(overlay) {
overlay.addEventListener('click', () => {
sidebar.classList.remove('show');
overlay.classList.remove('show');
});
}
// Admin Logout Logic
function submitAdminLogout() {
const tokenEl = document.querySelector('meta[name="csrf-token"]');
fetch('/admin/logout', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
'X-CSRF-TOKEN': tokenEl ? tokenEl.getAttribute('content') : ''
}
})
.then(res => res.json())
.then(data => {
if (data.success) {
window.location.href = '/adminlogin';
} else {
alert('Logout failed. Please try again.');
}
})
.catch(err => {
console.error('Error:', err);
alert('Server side error occurred during logout.');
});
}
</script>
</body>
</html>

View File

@ -0,0 +1,126 @@
@extends('layouts.adminnav')
@section('title', 'Admin Profile - Admin Panel')
@section('content')
<div class="container py-4">
<div class="row">
<div class="col-12 mb-4">
<h3 class="fw-bold text-navy">
<i class="fa-solid fa-user-gear me-2"></i>Admin Profile Management
</h3>
</div>
</div>
<!-- Success & Error Alerts -->
@if(session('success'))
<div class="alert alert-success alert-dismissible fade show mb-4" role="alert">
<i class="fa-solid fa-circle-check me-2"></i>{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
@if($errors->any())
<div class="alert alert-danger alert-dismissible fade show mb-4" role="alert">
<i class="fa-solid fa-triangle-exclamation me-2"></i>
<strong>Please check the form for errors:</strong>
<ul class="mb-0 mt-1">
@foreach($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
<div class="row g-4">
<!-- Profile Summary Card -->
<div class="col-lg-4">
<div class="card border-0 shadow-sm rounded-3 text-center p-4">
<div class="card-body">
<div class="mb-3">
<div class="rounded-circle bg-navy text-white d-inline-flex align-items-center justify-content-center shadow" style="width: 100px; height: 100px; font-size: 40px;">
<i class="fa-solid fa-user-shield"></i>
</div>
</div>
<h4 class="fw-bold mb-1">{{ $admin->username ?? 'Administrator' }}</h4>
<span class="badge bg-danger fs-6 px-3 py-2 rounded-pill mt-2">System Administrator</span>
<hr class="my-4">
<div class="text-start">
<p class="mb-2"><strong><i class="fa-solid fa-id-badge text-navy me-2"></i>Admin ID:</strong> {{ $admin->id ?? session('admin_id') }}</p>
<p class="mb-2"><strong><i class="fa-solid fa-user text-navy me-2"></i>Username:</strong> {{ $admin->username ?? 'N/A' }}</p>
<p class="mb-0"><strong><i class="fa-solid fa-clock text-navy me-2"></i>Created At:</strong> {{ isset($admin->created_at) ? $admin->created_at->format('Y-m-d') : 'N/A' }}</p>
</div>
</div>
</div>
</div>
<!-- Edit Profile & Password Forms -->
<div class="col-lg-8">
<!-- Update Username Card -->
<div class="card border-0 shadow-sm rounded-3 mb-4">
<div class="card-header bg-white py-3 border-0">
<h5 class="fw-bold mb-0 text-navy">
<i class="fa-solid fa-pen-to-square me-2"></i>Update Account Details
</h5>
</div>
<div class="card-body">
<form action="{{ route('admin.profile.update') }}" method="POST">
@csrf
@method('PUT')
<div class="row g-3">
<div class="col-md-12">
<label class="form-label fw-bold">Username</label>
<input type="text" name="username" class="form-control" value="{{ old('username', $admin->username ?? '') }}" required>
</div>
<div class="col-12 text-end mt-4">
<button type="submit" class="btn btn-primary">
<i class="fa-solid fa-floppy-disk me-1"></i> Save Changes
</button>
</div>
</div>
</form>
</div>
</div>
<!-- Change Password Card -->
<div class="card border-0 shadow-sm rounded-3">
<div class="card-header bg-white py-3 border-0">
<h5 class="fw-bold mb-0 text-navy">
<i class="fa-solid fa-key me-2"></i>Change Password
</h5>
</div>
<div class="card-body">
<form action="{{ route('admin.profile.password') }}" method="POST">
@csrf
@method('PUT')
<div class="row g-3">
<div class="col-md-12">
<label class="form-label fw-bold">Current Password</label>
<input type="password" name="current_password" class="form-control" required>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">New Password</label>
<input type="password" name="new_password" class="form-control" required>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Confirm New Password</label>
<input type="password" name="new_password_confirmation" class="form-control" required>
</div>
<div class="col-12 text-end mt-4">
<button type="submit" class="btn btn-danger">
<i class="fa-solid fa-shield-halved me-1"></i> Update Password
</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@ -0,0 +1,221 @@
@extends('layouts.adminnav')
@section('title', 'Exam Results Management - Admin Panel')
@section('content')
<div class="container-fluid">
<div class="d-flex justify-content-between align-items-center mb-4">
<h3 class="fw-bold text-navy">
<i class="fa-solid fa-square-poll-vertical me-2"></i>Exam Results Management
</h3>
<button class="btn btn-danger" data-bs-toggle="modal" data-bs-target="#addResultModal">
<i class="fa-solid fa-plus me-1"></i> Add New Result
</button>
</div>
@if(session('success'))
<div class="alert alert-success alert-dismissible fade show" role="alert">
<i class="fa-solid fa-circle-check me-2"></i>{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
@if($errors->any())
<div class="alert alert-danger alert-dismissible fade show" role="alert">
<i class="fa-solid fa-triangle-exclamation me-2"></i>
<strong>Please fix the following errors:</strong>
<ul class="mb-0 mt-1">
@foreach($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
<!-- Results Table -->
<div class="card border-0 shadow-sm rounded-3">
<div class="card-body p-0">
<div class="table-responsive">
<table class="table table-hover align-middle mb-0">
<thead class="table-dark">
<tr>
<th>ID</th>
<th>Student Log ID</th>
<th>Module Code</th>
<th>Module Name</th>
<th>Academic Year</th>
<th>Semester</th>
<th>Marks</th>
<th>Grade</th>
<th>Status</th>
<th class="text-center">Actions</th>
</tr>
</thead>
<tbody>
@forelse($results as $result)
<tr>
<td>{{ $result->id }}</td>
<td><span class="badge bg-secondary">{{ $result->student_log_id }}</span></td>
<td><strong>{{ $result->module_code }}</strong></td>
<td>{{ $result->module_name }}</td>
<td>{{ $result->academic_year }}</td>
<td>{{ $result->semester }}</td>
<td><span class="fw-bold">{{ $result->marks }}</span></td>
<td>
<span class="badge bg-primary fs-6">{{ $result->grade }}</span>
</td>
<td>
@if(strtolower($result->status) == 'pass')
<span class="badge bg-success">Pass</span>
@else
<span class="badge bg-danger">Fail</span>
@endif
</td>
<td class="text-center">
<!-- Edit Button -->
<button class="btn btn-sm btn-outline-primary me-1"
data-bs-toggle="modal"
data-bs-target="#editResultModal{{ $result->id }}">
<i class="fa-solid fa-pen-to-square"></i>
</button>
<!-- Delete Button -->
<form action="{{ route('admin.results.delete', $result->id) }}" method="POST" class="d-inline" onsubmit="return confirm('Are you sure you want to delete this result?');">
@csrf
@method('DELETE')
<button type="submit" class="btn btn-sm btn-outline-danger">
<i class="fa-solid fa-trash-can"></i>
</button>
</form>
</td>
</tr>
<!-- Edit Result Modal -->
<div class="modal fade" id="editResultModal{{ $result->id }}" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header bg-navy text-white">
<h5 class="modal-title"><i class="fa-solid fa-pen-to-square me-2"></i>Edit Student Result</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="{{ route('admin.results.update', $result->id) }}" method="POST">
@csrf
@method('PUT')
<div class="modal-body text-start">
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-bold">Student Log ID</label>
<input type="text" name="student_log_id" class="form-control" value="{{ $result->student_log_id }}" required>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Module Code</label>
<input type="text" name="module_code" class="form-control" value="{{ $result->module_code }}" required>
</div>
<div class="col-md-12">
<label class="form-label fw-bold">Module Name</label>
<input type="text" name="module_name" class="form-control" value="{{ $result->module_name }}" required>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Academic Year</label>
<input type="text" name="academic_year" class="form-control" value="{{ $result->academic_year }}" required>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Semester</label>
<input type="text" name="semester" class="form-control" value="{{ $result->semester }}" required>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Marks</label>
<input type="number" step="0.01" name="marks" class="form-control" value="{{ $result->marks }}" required>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Grade</label>
<input type="text" name="grade" class="form-control" value="{{ $result->grade }}" required>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Status</label>
<select name="status" class="form-select" required>
<option value="Pass" {{ $result->status == 'Pass' ? 'selected' : '' }}>Pass</option>
<option value="Fail" {{ $result->status == 'Fail' ? 'selected' : '' }}>Fail</option>
</select>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-primary">Update Result</button>
</div>
</form>
</div>
</div>
</div>
@empty
<tr>
<td colspan="10" class="text-center py-4 text-muted">No examination results found.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- Add Result Modal -->
<div class="modal fade" id="addResultModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header bg-navy text-white">
<h5 class="modal-title"><i class="fa-solid fa-plus-circle me-2"></i>Add New Examination Result</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<form action="{{ route('admin.results.store') }}" method="POST">
@csrf
<div class="modal-body">
<div class="row g-3">
<div class="col-md-6">
<label class="form-label fw-bold">Student Log ID</label>
<input type="text" name="student_log_id" class="form-control" placeholder="e.g. ST1001" required>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Module Code</label>
<input type="text" name="module_code" class="form-control" placeholder="e.g. AME201" required>
</div>
<div class="col-md-12">
<label class="form-label fw-bold">Module Name</label>
<input type="text" name="module_name" class="form-control" placeholder="e.g. Automobile Technology II" required>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Academic Year</label>
<input type="text" name="academic_year" class="form-control" placeholder="e.g. 2025/2026" required>
</div>
<div class="col-md-6">
<label class="form-label fw-bold">Semester</label>
<input type="text" name="semester" class="form-control" placeholder="e.g. Semester 1" required>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Marks</label>
<input type="number" step="0.01" name="marks" class="form-control" placeholder="0 - 100" required>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Grade</label>
<input type="text" name="grade" class="form-control" placeholder="e.g. A+, B, C" required>
</div>
<div class="col-md-4">
<label class="form-label fw-bold">Status</label>
<select name="status" class="form-select" required>
<option value="Pass">Pass</option>
<option value="Fail">Fail</option>
</select>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
<button type="submit" class="btn btn-success"><i class="fa-solid fa-floppy-disk me-1"></i> Save Result</button>
</div>
</form>
</div>
</div>
</div>
@endsection

View File

@ -0,0 +1,296 @@
@extends('layouts.adminnav')
@section('title', 'Admin Timetable Management')
@section('content')
<style>
.bg-custom-header {
background: linear-gradient(135deg, #2c2a4a 0%, #4a4773 100%);
color: white;
border-radius: 12px;
}
/* Badge Colors matching the design */
.badge-type {
font-size: 11px;
font-weight: 600;
padding: 3px 12px;
border-radius: 12px;
letter-spacing: 0.3px;
display: inline-block;
}
.badge-theory { background-color: #1e2035; color: #ffffff; }
.badge-practical { background-color: #6b1d1d; color: #ffffff; }
.badge-workshop { background-color: #ea580c; color: #ffffff; }
.badge-exam { background-color: #ca8a04; color: #ffffff; }
/* Table Custom Styles */
.table-timetable {
border-collapse: separate;
border-spacing: 0;
border: 1px solid #e2e8f0;
border-radius: 10px;
overflow: hidden;
}
.table-timetable th {
text-align: center;
vertical-align: middle;
font-weight: 700;
padding: 14px 10px;
color: #334155;
background-color: #f8fafc;
border-bottom: 1px solid #e2e8f0;
}
.table-timetable td {
text-align: center;
vertical-align: middle;
height: 90px;
padding: 6px;
border-bottom: 1px solid #e2e8f0;
border-right: 1px solid #e2e8f0;
}
.table-timetable tr:last-child td {
border-bottom: none;
}
.table-timetable td:last-child {
border-right: none;
}
/* Cell Hover & Click */
.timetable-cell {
cursor: pointer;
padding: 8px;
border-radius: 8px;
transition: all 0.2s ease-in-out;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.timetable-cell:hover {
background-color: #f1f5f9;
transform: translateY(-1px);
}
/* Today's Red Header Highlight */
.today-header {
background-color: #d9383a !important;
color: white !important;
}
</style>
<div class="container-fluid py-4">
<!-- Header Banner -->
<div class="p-4 mb-4 bg-custom-header shadow-sm d-flex justify-content-between align-items-center">
<div>
<h3 class="fw-bold mb-1"><i class="fa-solid fa-calendar-days me-2"></i>My Class Timetable</h3>
<p class="mb-0 text-white-50 small">Automobile Engineering Academy Timetable Management</p>
</div>
</div>
<!-- Alert Messages -->
@if(session('success'))
<div class="alert alert-success alert-dismissible fade show mb-4" role="alert">
<i class="fa-solid fa-circle-check me-2"></i>{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert"></button>
</div>
@endif
<div class="row g-4 mb-4">
<!-- Today's Schedule Card -->
<div class="col-lg-5">
<div class="card border-0 shadow-sm rounded-3 h-100">
<div class="card-header bg-white py-3 border-0">
<h6 class="fw-bold mb-0 text-danger">
<i class="fa-solid fa-clock me-2"></i>Today's Schedule ({{ $today }})
</h6>
</div>
<div class="card-body">
@forelse($todaySchedule as $item)
<div class="p-3 mb-2 bg-light rounded border-start border-4 border-danger d-flex justify-content-between align-items-center">
<div>
<span class="badge badge-type badge-{{ strtolower($item->type) }} mb-1">{{ $item->type }}</span>
<h6 class="fw-bold mb-0 text-dark">{{ $item->subject_name }}</h6>
</div>
<small class="text-muted fw-bold">{{ $item->time_slot }}</small>
</div>
@empty
<p class="text-muted text-center py-4 mb-0">No classes scheduled for today.</p>
@endforelse
</div>
</div>
</div>
<!-- Legend Card -->
<div class="col-lg-7">
<div class="card border-0 shadow-sm rounded-3 h-100">
<div class="card-header bg-white py-3 border-0">
<h6 class="fw-bold mb-0 text-primary">
<i class="fa-solid fa-layer-group me-2"></i>Timetable Legend
</h6>
</div>
<div class="card-body">
<div class="d-flex flex-wrap gap-2 mb-3">
<span class="badge badge-type badge-theory">Theory</span>
<span class="badge badge-type badge-practical">Practical</span>
<span class="badge badge-type badge-workshop">Workshop</span>
<span class="badge badge-type badge-exam">Exam</span>
</div>
<hr>
<p class="text-muted small mb-0">
<i class="fa-solid fa-hand-pointer me-1 text-primary"></i> <strong>How to Edit / Add:</strong> Click on any timetable slot in the table below to add or edit class details.
</p>
</div>
</div>
</div>
</div>
<!-- Main Timetable Grid -->
<div class="card border-0 shadow-sm rounded-3">
<div class="card-body p-3">
<div class="table-responsive">
<table class="table table-timetable mb-0 align-middle">
<thead>
<tr>
<th style="width: 15%;">Time</th>
@foreach($days as $day)
<th class="{{ strtolower($today) == strtolower($day) ? 'today-header' : '' }}">
{{ $day }} {{ strtolower($today) == strtolower($day) ? '(Today)' : '' }}
</th>
@endforeach
</tr>
</thead>
<tbody>
@foreach($timeSlots as $slot)
<tr>
<!-- Time Column -->
<td class="fw-bold text-secondary bg-light" style="font-size: 13px;">{{ $slot }}</td>
@if($slot == '12:30 - 01:30')
<!-- Lunch / Rest Time Row -->
<td colspan="5" class="bg-light text-center fw-bold text-secondary py-3" style="letter-spacing: 0.5px;">
🍱 LUNCH BREAK / REST TIME
</td>
@else
<!-- Days Columns -->
@foreach($days as $day)
@php
$item = $grid[$slot][$day] ?? null;
@endphp
<td>
<div class="timetable-cell"
data-bs-toggle="modal"
data-bs-target="#editSlotModal"
onclick="openEditModal('{{ $day }}', '{{ $slot }}', '{{ $item->subject_name ?? '' }}', '{{ $item->type ?? 'Theory' }}', '{{ $item->id ?? '' }}')">
@if($item)
<span class="badge badge-type badge-{{ strtolower($item->type) }} mb-1">
{{ $item->type }}
</span>
<div class="fw-bold text-dark small">{{ $item->subject_name }}</div>
@else
<span class="text-muted small opacity-50"><i class="fa-solid fa-plus text-primary me-1"></i>Add</span>
@endif
</div>
</td>
@endforeach
@endif
</tr>
@endforeach
</tbody>
</table>
</div>
</div>
</div>
</div>
<!-- Modal for Edit / Add Slot -->
<div class="modal fade" id="editSlotModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content border-0 shadow">
<div class="modal-header bg-custom-header text-white">
<h5 class="modal-title" id="modalTitle"><i class="fa-solid fa-pen-to-square me-2"></i>Update Timetable Slot</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
</div>
<form action="{{ route('admin.timetable.store') }}" method="POST">
@csrf
<input type="hidden" name="day" id="modal_day">
<input type="hidden" name="time_slot" id="modal_time_slot">
<div class="modal-body">
<div class="mb-3">
<label class="form-label fw-bold">Day & Time Slot</label>
<input type="text" id="display_day_time" class="form-control bg-light" readonly>
</div>
<div class="mb-3">
<label class="form-label fw-bold">Subject Name</label>
<input type="text" name="subject_name" id="modal_subject" class="form-control" placeholder="e.g. Engine Fundamentals" required>
</div>
<div class="mb-3">
<label class="form-label fw-bold">Subject Type</label>
<select name="type" id="modal_type" class="form-select" required>
<option value="Theory">Theory</option>
<option value="Practical">Practical</option>
<option value="Workshop">Workshop</option>
<!-- <option value="Exam">Exam</option> -->
</select>
</div>
</div>
<div class="modal-footer d-flex justify-content-between">
<button type="button" id="clearBtn" class="btn btn-outline-danger d-none" onclick="clearSlotData()">
<i class="fa-solid fa-trash me-1"></i> Clear Slot
</button>
<div>
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-success"><i class="fa-solid fa-floppy-disk me-1"></i> Save Changes</button>
</div>
</div>
</form>
<!-- Hidden Form to Clear Slot -->
<form id="deleteSlotForm" method="POST" class="d-none">
@csrf
@method('DELETE')
</form>
</div>
</div>
</div>
<script>
var currentSlotId = null;
function openEditModal(day, timeSlot, subject, type, id) {
document.getElementById('modal_day').value = day;
document.getElementById('modal_time_slot').value = timeSlot;
document.getElementById('display_day_time').value = day + ' (' + timeSlot + ')';
document.getElementById('modal_subject').value = subject;
document.getElementById('modal_type').value = type || 'Theory';
currentSlotId = id;
var clearBtn = document.getElementById('clearBtn');
var modalTitle = document.getElementById('modalTitle');
if(id) {
clearBtn.classList.remove('d-none');
modalTitle.innerHTML = '<i class="fa-solid fa-pen-to-square me-2"></i>Edit Class Slot';
} else {
clearBtn.classList.add('d-none');
modalTitle.innerHTML = '<i class="fa-solid fa-plus me-2"></i>Add Class Slot';
}
}
function clearSlotData() {
if(currentSlotId && confirm('Are you sure you want to clear this timetable slot?')) {
var form = document.getElementById('deleteSlotForm');
form.action = "/admin/timetable/delete/" + currentSlotId;
form.submit();
}
}
</script>
@endsection

View File

@ -0,0 +1,143 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Admin Login - AutoEdu</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
:root {
--theme-navy: #2D355B;
--theme-red: #822424;
--theme-yellow: #FFEA85;
--theme-bg: #F6F6F6;
}
body {
background-color: var(--theme-bg);
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
font-family: 'Segoe UI', sans-serif;
}
.login-card {
width: 100%;
max-width: 400px;
border: none;
border-radius: 16px;
box-shadow: 0 10px 30px rgba(0,0,0,0.1);
overflow: hidden;
background: #fff;
}
.login-header {
background: var(--theme-navy);
color: #fff;
padding: 25px 20px;
text-align: center;
}
.btn-theme-red {
background-color: var(--theme-red);
color: #fff;
border: none;
padding: 12px;
font-weight: 600;
border-radius: 8px;
transition: all 0.3s;
}
.btn-theme-red:hover {
background-color: #a32d2d;
color: #fff;
}
</style>
</head>
<body>
<div class="login-card">
<div class="login-header">
<i class="fa-solid fa-user-shield fa-2x mb-2" style="color: var(--theme-yellow);"></i>
<h5 class="fw-bold mb-0">Admin Login</h5>
</div>
<div class="p-4">
<!-- Error Alert -->
<div id="errorAlert" class="alert alert-danger d-none py-2 text-center small" role="alert"></div>
<form id="adminLoginForm">
<div class="mb-3">
<label class="form-label fw-semibold text-dark">Username</label>
<div class="input-group">
<span class="input-group-text"><i class="fa-solid fa-user"></i></span>
<input type="text" id="username" class="form-control" placeholder="Username" required>
</div>
</div>
<div class="mb-4">
<label class="form-label fw-semibold text-dark">Password</label>
<div class="input-group">
<span class="input-group-text"><i class="fa-solid fa-lock"></i></span>
<input type="password" id="password" class="form-control" placeholder="Password" required>
</div>
</div>
<button type="submit" class="btn btn-theme-red w-100" id="loginBtn">
<i class="fa-solid fa-right-to-bracket me-2"></i> Login
</button>
</form>
</div>
</div>
<script>
document.getElementById('adminLoginForm').addEventListener('submit', function(e) {
e.preventDefault();
const username = document.getElementById('username').value;
const password = document.getElementById('password').value;
const errorAlert = document.getElementById('errorAlert');
const loginBtn = document.getElementById('loginBtn');
const csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
errorAlert.classList.add('d-none');
loginBtn.disabled = true;
loginBtn.innerHTML = '<i class="fa-solid fa-spinner fa-spin me-2"></i> Logging in...';
fetch('/admin/login', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
'X-CSRF-TOKEN': csrfToken
},
body: JSON.stringify({ username: username, password: password })
})
.then(res => res.json())
.then(data => {
if (data.success) {
window.location.href = '/admin/adminmycourses';
} else {
errorAlert.innerText = data.message || 'Login failed!';
errorAlert.classList.remove('d-none');
loginBtn.disabled = false;
loginBtn.innerHTML = '<i class="fa-solid fa-right-to-bracket me-2"></i> Login';
}
})
.catch(err => {
console.error('Error:', err);
errorAlert.innerText = 'Server error occurred!';
errorAlert.classList.remove('d-none');
loginBtn.disabled = false;
loginBtn.innerHTML = '<i class="fa-solid fa-right-to-bracket me-2"></i> Login';
});
});
</script>
</body>
</html>

View File

@ -1,141 +1,189 @@
@extends('layouts.app')
@section('title','Apply Now')
@section('title', 'Apply Now')
@section('content')
<style>
body {
font-family: Arial, Helvetica, sans-serif;
background: #f5f5f5;
font-family: 'Segoe UI', Arial, Helvetica, sans-serif;
background: #F8FAFC;
color: #1E293B;
}
:root {
--primary: #5E244E;
--secondary: #8B3A74;
--light: #F8F4F7;
/* Premium Modern Automotive Palette */
--primary: #0F2C59;
--secondary: #822424;
--secondary-hover: #6a2525;
--accent-yellow: #FFE618;
--bg-light: #F8FAFC;
--text-main: #1E293B;
--card-border: rgba(62, 81, 184, 0.12);
}
.hero {
height: 220px;
background: linear-gradient(rgba(20,20,20,.55),rgba(20,20,20,.55)),
url('https://images.unsplash.com/photo-1517520287167-4bbf64a00d66?auto=format&fit=crop&w=1600&q=80');
height: 240px;
background: linear-gradient(rgba(214, 219, 255, 0.79), rgba(0, 0, 0, 0.85)), url('https://images.unsplash.com/photo-1517520287167-4bbf64a00d66?auto=format&fit=crop&w=1600&q=80');
background-size: cover;
background-position: center;
display: flex;
justify-content: center;
align-items: center;
color: white;
text-align: center;
}
.hero h1 {
font-size: 32px;
font-weight: bold;
font-size: 36px;
font-weight: 800;
margin: 0;
letter-spacing: -0.5px;
}
.apply-area {
margin-top: -40px;
margin-bottom: 40px;
margin-top: -50px;
margin-bottom: 50px;
}
.form-container-sm {
max-width: 820px;
max-width: 850px;
margin: 0 auto;
}
.form-card {
background: white;
border-radius: 10px;
border-radius: 16px;
overflow: hidden;
box-shadow: 0 10px 30px rgba(0,0,0,.08);
border: 1px solid var(--card-border);
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.05);
}
.form-header {
background: var(--primary);
background: linear-gradient(135deg, #8C4242 0%, #161414fa 100%);
color: white;
padding: 15px 25px;
padding: 25px 30px;
border-bottom: 3px solid var(--accent-yellow);
}
.form-header h2 {
margin: 0;
font-size: 20px;
font-weight: bold;
font-size: 22px;
font-weight: 700;
}
.section-title {
background: #735D6D;
background: var(--secondary);
color: white;
padding: 8px 12px;
margin-top: 22px;
margin-bottom: 15px;
padding: 10px 16px;
margin-top: 30px;
margin-bottom: 20px;
font-size: 14px;
border-radius: 5px;
border-radius: 6px;
font-weight: 600;
letter-spacing: 0.5px;
box-shadow: 0 4px 10px rgba(106, 37, 37, 0.15);
}
.form-label {
font-weight: 600;
font-size: 13px;
margin-bottom: 4px;
margin-bottom: 6px;
color: #000;
}
.form-control,
.form-select {
border-radius: 5px;
padding: 6px 10px;
font-size: 13px;
border: 1px solid #cbd5e1;
border-radius: 8px;
padding: 10px 14px;
font-size: 14px;
transition: all 0.2s ease;
}
.form-control:focus,
.form-select:focus {
border-color: var(--primary);
box-shadow: 0 0 0 4px rgba(62, 81, 184, 0.15);
outline: 0;
}
.required {
color: red;
color: var(--secondary-hover);
font-weight: bold;
}
.submit-btn {
background: var(--primary);
background:var(--secondary);
color: white;
border: none;
padding: 8px 20px;
font-size: 15px;
font-weight: bold;
border-radius: 30px;
padding: 14px 30px;
font-size: 16px;
font-weight: 700;
border-radius: 8px;
cursor: pointer;
width: 100%;
transition: 0.3s ease;
transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
box-shadow: 0 4px 12px rgba(62, 81, 184, 0.2);
}
.submit-btn:hover {
background: var(--secondary);
transform: translateY(-1px);
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
color: var(--accent-yellow);
transform: translateY(-2px);
box-shadow: 0 6px 20px rgba(130, 36, 36, 0.35);
}
.mb-3-custom {
margin-bottom: 0.75rem !important;
margin-bottom: 1.25rem !important;
}
.form-check-input:checked {
background-color: var(--primary);
border-color: var(--primary);
}
</style>
<div class="hero">
<div class="text-center">
<div class="text-center px-3">
<h1>Course Enrolment Form</h1>
<p class="lead mb-0" style="font-size: 14px; opacity: 0.9;">Automobile Engineering Academy</p>
<p class="lead mb-0 mt-2 fw-semibold" style="font-size: 15px; opacity: 0.95; color: var(--accent-yellow);">
Automobile Engineering Academy
</p>
</div>
</div>
<div class="container apply-area">
<div class="form-container-sm">
<div class="form-card">
<div class="form-header">
<h2>
<i class="fa-solid fa-file-circle-check me-2"></i>
Course Enrolment Form
New Student Registration
</h2>
</div>
<div class="p-4">
<form action="#" method="POST" enctype="multipart/form-data">
<div class="p-4 p-md-5">
@if(session('success'))
<div class="alert alert-success alert-dismissible fade show mb-4" role="alert">
{{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
@if($errors->any())
<div class="alert alert-danger mb-4">
<ul class="mb-0">
@foreach($errors->all() as $error)
<li>{{ $error }}</li>
@endforeach
</ul>
</div>
@endif
<form action="{{ route('apply.store') }}" method="POST" enctype="multipart/form-data">
@csrf
{{-- STUDENT INFORMATION --}}
@ -146,32 +194,32 @@
<div class="row">
<div class="col-md-6 mb-3-custom">
<label class="form-label">First Name <span class="required">*</span></label>
<input type="text" name="first_name" class="form-control" required>
<input type="text" name="first_name" class="form-control" placeholder="Enter your first name" required>
</div>
<div class="col-md-6 mb-3-custom">
<label class="form-label">Last Name <span class="required">*</span></label>
<input type="text" name="last_name" class="form-control" required>
<input type="text" name="last_name" class="form-control" placeholder="Enter your last name" required>
</div>
<div class="col-md-6 mb-3-custom">
<label class="form-label">NIC / Passport</label>
<input type="text" name="nic" class="form-control">
<label class="form-label">NIC / Passport Number</label>
<input type="text" name="nic" class="form-control" placeholder="Identity Document No.">
</div>
<div class="col-md-6 mb-3-custom">
<label class="form-label">Nationality</label>
<input type="text" name="nationality" class="form-control">
<input type="text" name="nationality" class="form-control" placeholder="e.g. Sri Lankan">
</div>
<div class="col-md-6 mb-3-custom">
<label class="form-label">Address <span class="required">*</span></label>
<input type="text" name="address" class="form-control" required>
<label class="form-label">Residential Address <span class="required">*</span></label>
<input type="text" name="address" class="form-control" placeholder="Street address" required>
</div>
<div class="col-md-6 mb-3-custom">
<label class="form-label">District / City / State <span class="required">*</span></label>
<input type="text" name="state" class="form-control" required>
<input type="text" name="state" class="form-control" placeholder="City or region" required>
</div>
<div class="col-md-6 mb-3-custom">
@ -198,17 +246,17 @@
<div class="row">
<div class="col-md-6 mb-3-custom">
<label class="form-label">Contact Number <span class="required">*</span></label>
<input type="tel" name="mobile" class="form-control" required>
<input type="tel" name="mobile" class="form-control" placeholder="Primary phone number" required>
</div>
<div class="col-md-6 mb-3-custom">
<label class="form-label">Alternative Contact Number</label>
<input type="tel" name="mobile2" class="form-control">
<input type="tel" name="mobile2" class="form-control" placeholder="Backup phone number">
</div>
<div class="col-md-6 mb-3-custom">
<label class="form-label">Email Address <span class="required">*</span></label>
<input type="email" name="email" class="form-control" required>
<input type="email" name="email" class="form-control" placeholder="name@example.com" required>
</div>
<div class="col-md-6 mb-3-custom">
@ -216,7 +264,7 @@
<select name="preferred_contact_method" class="form-select">
<option selected disabled>Select Your Option</option>
<option value="email">Email</option>
<option value="phone">Phone</option>
<option value="phone">Phone Call</option>
<option value="sms">SMS</option>
</select>
</div>
@ -224,12 +272,12 @@
{{-- EDUCATION --}}
<div class="section-title">
<i class="fa-solid fa-graduation-cap me-2"></i> Education
<i class="fa-solid fa-graduation-cap me-2"></i> Academic Qualifications
</div>
<div class="row">
<div class="col-md-6 mb-3-custom">
<label class="form-label">Still at school?</label>
<label class="form-label">Are you currently a school student?</label>
<select name="still_at_school" class="form-select">
<option selected disabled>Select Your Option</option>
<option value="Yes">Yes</option>
@ -255,7 +303,7 @@
<div class="col-md-6 mb-3-custom">
<label class="form-label">School / College Name</label>
<input type="text" name="school_name" class="form-control" placeholder="Enter School Name">
<input type="text" name="school_name" class="form-control" placeholder="Enter last attended school name">
</div>
<div class="col-md-6 mb-3-custom">
@ -266,10 +314,10 @@
<div class="col-md-6 mb-3-custom">
<label class="form-label">Examination Passed</label>
<select name="exam_passed" class="form-select">
<option selected disabled>Select Examination</option>
<option selected disabled>Select Final Examination</option>
<option value="G.C.E. O/L">G.C.E. O/L</option>
<option value="G.C.E. A/L">G.C.E. A/L</option>
<option value="NVQ">NVQ</option>
<option value="NVQ">NVQ Standards</option>
<option value="Certificate">Certificate</option>
<option value="Diploma">Diploma</option>
<option value="Degree">Degree</option>
@ -278,17 +326,17 @@
</div>
<div class="col-md-6 mb-3-custom">
<label class="form-label">Subjects</label>
<input type="text" name="subjects" class="form-control" placeholder="e.g. Mathematics, Science">
<label class="form-label">Core Subjects</label>
<input type="text" name="subjects" class="form-control" placeholder="e.g. Mathematics, Science, Tech">
</div>
<div class="col-12 mb-3-custom">
<label class="form-label">Grades / Results</label>
<textarea name="grades_results" class="form-control" rows="2" placeholder="Enter your grades or examination results"></textarea>
<label class="form-label">Grades / Academic Results Summary</label>
<textarea name="grades_results" class="form-control" rows="3" placeholder="List your relevant examination grades or index summaries..."></textarea>
</div>
<div class="col-12 mb-3-custom">
<label class="form-label">Educational Certificates</label>
<label class="form-label">Upload Educational Certificates (Multiple Allowed)</label>
<input type="file" name="certificates[]" class="form-control" accept=".pdf,.jpg,.jpeg,.png" multiple>
</div>
</div>
@ -301,24 +349,24 @@
<div class="row">
<div class="col-md-6 mb-3-custom">
<label class="form-label">Emergency Contact Name <span class="required">*</span></label>
<input type="text" name="emergency_contact_name" class="form-control" required>
<input type="text" name="emergency_contact_name" class="form-control" placeholder="Full name of guardian/relative" required>
</div>
<div class="col-md-6 mb-3-custom">
<label class="form-label">Relationship <span class="required">*</span></label>
<input type="text" name="emergency_contact_relationship" class="form-control" required>
<input type="text" name="emergency_contact_relationship" class="form-control" placeholder="e.g. Father, Mother, Spouse" required>
</div>
</div>
{{-- TERMS AND CONDITIONS --}}
<div class="form-check mb-3 mt-2">
<div class="form-check mb-4 mt-3">
<input class="form-check-input" type="checkbox" id="terms" required>
<label class="form-check-label" for="terms" style="font-size: 13px;">
I agree to the terms and conditions <span class="required">*</span>
<label class="form-check-label fw-semibold" for="terms" style="font-size: 13px; color: #000; cursor: pointer;">
I hereby declare that the details furnished above are true and correct to the best of my knowledge <span class="required">*</span>
</label>
</div>
<div class="mt-3">
<div class="mt-4">
<button type="submit" class="submit-btn">Submit Application</button>
</div>

View File

@ -6,20 +6,29 @@
<style>
:root{
--primary:#5E244E;
--secondary:#8B3A74;
--light:#f8f4f7;
/* Premium Modern Automotive Palette */
--primary: #3E51B8; /* Tech Blue */
--primary-light: #0a67df; /* Vibrant Electric Blue */
--secondary: #BC1A1A; /* Deep Racing Red */
--secondary-hover: #822424; /* Dark Burnt Red */
--accent-dark: #753939; /* Muted Crimson */
--bg-light: #F8FAFC; /* Soft slate light gray */
/* Semantic Adjustments */
--text-main: #1E293B; /* Slate dark grey */
--text-muted: #64748B; /* Neutral gray */
--card-border: rgba(62, 81, 184, 0.1);
}
body {
font-family: Arial, Helvetica, sans-serif;
font-family: 'Segoe UI', Arial, sans-serif;
color: var(--text-main);
}
.hero-contact{
min-height:50vh;
background:
linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),
url('https://images.pexels.com/photos/3184465/pexels-photo-3184465.jpeg');
linear-gradient(rgba(233, 236, 246, 0.6), rgba(39, 35, 35, 0.71)), url('https://images.pexels.com/photos/3184465/pexels-photo-3184465.jpeg');
background-size:cover;
background-position:center;
display:flex;
@ -33,37 +42,39 @@ body {
background:#fff;
border-radius:20px;
padding:35px;
box-shadow: 0 10px 30px rgba(0,0,0,.05);
border: 1px solid #efeff4;
box-shadow: 0 10px 30px rgba(0,0,0,.04);
border: 1px solid var(--card-border);
}
.form-control{
border-radius:10px;
padding:12px;
border: 1px solid #ced4da;
border: 1px solid #cbd5e1;
transition: all 0.3s ease;
}
.form-control:focus {
border-color: var(--primary);
box-shadow: 0 0 0 0.25rem rgba(94, 36, 78, 0.25);
border-color: var(--primary-light);
box-shadow: 0 0 0 4px rgba(10, 103, 223, 0.15);
outline: 0;
}
.btn-contact{
background:var(--primary);
background: #6a2525 ;
color:#fff;
border-radius:10px;
padding:12px 30px;
font-weight: 600;
transition: all 0.3s ease;
border: none;
box-shadow: 0 4px 12px rgba(62, 81, 184, 0.2);
}
.btn-contact:hover{
background:var(--secondary);
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
color:#fff;
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(94, 36, 78, 0.3);
box-shadow: 0 6px 15px rgba(188, 26, 26, 0.3);
}
.info-card{
@ -72,19 +83,23 @@ body {
padding:20px;
text-align:center;
box-shadow: 0 5px 20px rgba(0,0,0,.04);
border: 1px solid #efeff4;
border: 1px solid var(--card-border);
transition:.3s;
}
.info-card:hover{
transform:translateY(-5px);
border-color: var(--primary);
box-shadow: 0 10px 25px rgba(94, 36, 78, 0.08);
border-color: var(--primary-light);
box-shadow: 0 10px 25px rgba(62, 81, 184, 0.1);
}
.info-card i {
color: var(--primary) !important;
color: #861E28 !important;
transition: color 0.3s ease;
}
.info-card:hover i {
color: var(--secondary) !important;
}
/* ========================================================
@ -96,17 +111,14 @@ body {
transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}
.fade-up-init {
transform: translateY(30px);
}
.slide-left-init {
transform: translateX(-40px);
}
.fade-in-init {
transform: scale(0.98);
}
@ -123,7 +135,7 @@ body {
<div class="container">
<div class="animate-item animated fade-up-init">
<h1 class="fw-bold display-4">Contact Us</h1>
<p class="fs-5">We are here to help you. Reach us anytime.</p>
<p class="fs-5 text-white-50" style="color:rgba(255, 255, 255, 0.8) !important">We are here to help you. Reach us anytime.</p>
</div>
</div>
</section>
@ -138,37 +150,34 @@ body {
<div class="col-md-6 animate-item slide-left-init">
<div class="contact-box">
<h3 class="mb-4 fw-bold" style="color: #1c1d1f;">Send Message</h3>
<h3 class="mb-4 fw-bold" style="color: var(--text-main);">Send Message</h3>
@if(session('success'))
<div class="alert alert-success">
{{ session('success') }}
</div>
@endif
<form action="{{ route('contact.store') }}" method="POST">
@csrf
<div class="mb-3">
<label class="form-label fw-semibold">Name</label>
<label class="form-label fw-semibold text-secondary-emphasis">Name</label>
<input type="text" name="name" class="form-control" placeholder="Your Name" required>
</div>
<div class="mb-3">
<label class="form-label fw-semibold">Email</label>
<label class="form-label fw-semibold text-secondary-emphasis">Email</label>
<input type="email" name="email" class="form-control" placeholder="Your Email" required>
</div>
<div class="mb-3">
<label class="form-label fw-semibold">Subject</label>
<label class="form-label fw-semibold text-secondary-emphasis">Subject</label>
<input type="text" name="subject" class="form-control" placeholder="Subject" required>
</div>
<div class="mb-3">
<label class="form-label fw-semibold">Message</label>
<label class="form-label fw-semibold text-secondary-emphasis">Message</label>
<textarea name="message" rows="5" class="form-control" placeholder="Your Message" required></textarea>
</div>
@ -181,7 +190,7 @@ Send Message
</div>
</div>
<!-- Info Cards -->
<div class="col-md-6 animate-item fade-in-init">
<div class="info-card mb-3">
@ -216,38 +225,18 @@ Send Message
</section>
<!-- MAP -->
<section class="pb-5">
<div class="container">
<!-- <iframe
src="https://www.google.com/maps/embed/v1/place?key=YOUR_API_KEY&q=place_id:ChIJXdB3Sy_84joRYNze2w86UjQ"
width="100%"
height="300"
style="border:0;border-radius:15px;"
allowfullscreen=""
loading="lazy">
</iframe> -->
<section class="pb-5">
<div class="container animate-item fade-up-init">
<iframe
src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d989.8732851214081!2d80.0435697!3d7.0771955!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3ae2fc2f4b77d05d%3A0x34523a0fdbdedc60!2sGlitz%20Park!5e0!3m2!1sen!2slk!4v1719999999999!5m2!1sen!2slk"
width="100%"
height="300"
style="border:0;border-radius:15px;"
allowfullscreen=""
loading="lazy">
</iframe>
<!-- <section class="pb-5">
<div class="container animate-item fade-up-init">
<iframe
src="https://www.google.com/maps/embed/pb=!1m14!1m8!1m3!1d989.8732851214081!2d80.0435697!3d7.0771955!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x3ae2fc2f4b77d05d%3A0x34523a0fdbdedc60!2sGlitz%20Park!5e0!3m2!1sen!2slk!4v1719999999999!5m2!1sen!2slk"
width="100%"
height="350"
style="border:0;border-radius:20px; box-shadow: 0 10px 30px rgba(0,0,0,.05);"
style="border:0;border-radius:20px; box-shadow: 0 10px 30px rgba(0,0,0,.04); border: 1px solid var(--card-border);"
allowfullscreen=""
loading="lazy">
</iframe>
</div>
</section> -->
</section>
<script>
document.addEventListener('DOMContentLoaded', function () {
@ -267,5 +256,7 @@ document.addEventListener('DOMContentLoaded', function () {
animatedElements.forEach(el => observer.observe(el));
});
</script>
|
@endsection

View File

@ -1,60 +1,75 @@
@extends('layouts.app')
@section('title','Our Courses')
@section('title', 'Our Courses')
@section('content')
<style>
:root{
--primary:#5E244E;
--secondary:#8B3A74;
--light:#f8f4f7;
--card-border: #efeff4;
--text-muted: #6a6f73;
--success-green: #1f8a4c;
:root {
/* Premium Modern Automotive Palette */
--primary: #3E51B8;
--primary-light: #0a67df;
--secondary: #BC1A1A;
--secondary-hover: #822424;
--accent-dark: #753939;
--accent-light: rgba(227, 100, 20, 0.1);
--accent-orange: #e36414;
--accent-yellow: #FFE618;
--bg-light: #F8FAFC;
--text-main: #1E293B;
--text-muted: #64748B;
--card-border: rgba(62, 81, 184, 0.1);
--shadow-color: rgba(15, 44, 89, 0.05);
--success-green: #10B981;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-family: 'Segoe UI', Arial, sans-serif;
color: var(--text-main);
background-color: #ffffff;
}
/* ===== Hero Section ===== */
.hero {
background-image: linear-gradient(rgba(109, 105, 105, 0.65), rgb(64, 59, 66)),
url('https://images.unsplash.com/photo-1503376780353-7e6692767b70?auto=format&fit=crop&w=1600&q=80');
background-image: linear-gradient(rgba(207, 220, 238, 0.9), rgba(35, 29, 29, 0.85)), url('https://images.unsplash.com/photo-1503376780353-7e6692767b70?auto=format&fit=crop&w=1600&q=80');
background-size: cover;
background-position: center;
background-repeat: no-repeat;
color: #ffffff;
padding: 120px 0;
padding: 130px 0;
text-align: center;
}
.hero h1{
font-size:50px;
font-weight:700;
.hero h1 {
font-size: 55px;
font-weight: 800;
text-shadow: 0 2px 15px rgba(0,0,0,0.4);
}
.hero p{
max-width:700px;
margin:auto;
font-size:18px;
.hero p {
max-width: 700px;
margin: auto;
font-size: 19px;
color: #F1F5F9;
}
/* --- Search Box Styling --- */
/* --- Premium Search Box Styling --- */
.search-box {
max-width: 500px;
margin: 30px auto 0 auto;
max-width: 550px;
margin: 35px auto 0 auto;
position: relative;
display: flex;
box-shadow: 0 8px 25px rgba(0,0,0,0.1);
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
overflow: hidden;
background: #fff;
border-radius: 100px;
border: 1px solid rgba(255, 255, 255, 0.1);
}
.search-box input {
width: 100%;
padding: 15px 25px;
padding: 16px 28px;
border: none;
outline: none;
font-size: 16px;
@ -62,92 +77,107 @@ body {
}
.search-box button {
background: var(--primary);
background: linear-gradient(135deg, #13141A 0%, #8ca8e9 100%);
color: #fff;
border: none;
padding: 0 25px;
padding: 0 30px;
cursor: pointer;
transition: 0.3s;
transition: all 0.3s ease;
font-size: 18px;
}
.search-box button:hover {
background: var(--secondary);
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
}
/* ===== HORIZONTAL COURSE CARDS ===== */
.course-card {
border: 1px solid var(--card-border);
border-radius: 20px;
overflow: hidden;
background: #fff;
transition: transform 0.3s ease, box-shadow 0.3s ease;
box-shadow: none;
scale: .99;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.course-card:hover {
transform: translateY(-5px);
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
transform: translateY(-6px);
}
.course-image-wrapper {
padding: 16px;
padding: 20px;
height: 100%;
}
.course-card img {
height: 200px;
height: 220px;
width: 100%;
object-fit: cover;
/* border-radius: 14px; */
transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.course-card:hover img {
transform: scale(1.04);
}
.course-card .card-body {
padding: 24px;
padding: 32px 32px 32px 10px;
display: flex;
flex-direction: column;
}
@media (max-width: 767px) {
.course-card .card-body {
padding: 0 24px 24px 24px;
}
}
.course-title {
font-size: 21px;
font-weight: 700;
font-size: 23px;
font-weight: 750;
line-height: 1.3;
color: #1c1d1f;
color:#2B2B2B;
margin-bottom: 8px;
transition: color 0.3s ease;
}
.course-card:hover .course-title {
color: var(--secondary);
}
.course-author {
font-size: 14px;
color: var(--text-muted);
margin-bottom: 12px;
font-weight: 600;
color: #910909;
margin-bottom: 14px;
}
.course-short-desc {
font-size: 14px;
color: #4f5357;
margin-bottom: 16px;
line-height: 1.5;
font-size: 14.5px;
color: #556575;
margin-bottom: 20px;
line-height: 1.6;
}
.course-meta-row {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 8px;
margin-bottom: 14px;
gap: 12px;
margin-bottom: 18px;
}
.badge-bestseller {
background-color: #ece3f1;
color: var(--primary);
background: linear-gradient(135deg, var(--secondary) 0%, var(--accent-orange) 100%);
color: #fff;
font-weight: 700;
font-size: 11px;
padding: 3px 10px;
border-radius: 4px;
font-size: 10.5px;
padding: 4px 12px;
border-radius: 30px;
text-transform: uppercase;
letter-spacing: 0.05em;
box-shadow: 0 4px 10px rgba(188, 26, 26, 0.2);
}
.rating-star {
color: #b4690e;
color: #f39c12;
font-weight: 700;
font-size: 14px;
display: flex;
@ -157,20 +187,21 @@ body {
.rating-count {
color: var(--text-muted);
font-size: 13px;
font-size: 13.5px;
font-weight: 500;
}
.course-features {
display: flex;
gap: 15px;
font-size: 13px;
gap: 20px;
font-size: 13.5px;
color: var(--success-green);
margin-bottom: 20px;
font-weight: 500;
margin-bottom: 24px;
font-weight: 600;
}
.course-features span i {
margin-right: 4px;
margin-right: 6px;
}
.course-footer {
@ -178,116 +209,129 @@ body {
}
.read-btn {
background: var(--primary);
background: #822424;
color: #fff;
padding: 12px 20px;
padding: 13px 28px;
font-weight: 600;
border-radius: 8px;
font-size: 15px;
transition: 0.2s;
border: none;
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
border: 2px solid transparent;
text-decoration: none;
display: block;
text-align: center;
box-shadow: 0 4px 12px rgba(10, 103, 223, 0.2);
}
.read-btn:hover {
background: var(--secondary);
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
color: #fff;
transform: translateY(-2px);
box-shadow: 0 6px 18px rgba(188, 26, 26, 0.3);
}
/* --- Modernized Why Study With Us Section --- */
/* --- Features Section --- */
.features-section {
background-color: #f8f9fa;
border-radius: 24px;
padding: 60px 40px;
margin-bottom: 60px;
background-color: var(--bg-light);
padding: 80px 40px;
margin-bottom: 40px;
background-image: radial-gradient(rgba(62, 81, 184, 0.04) 1px, transparent 0);
background-size: 20px 20px;
}
.features-section h2 {
font-size: 32px;
font-weight: 700;
color: #1c1d1f;
margin-bottom: 40px;
font-size: 45px;
font-weight: 800;
color: #ffffff;
margin-bottom: 54px;
}
.feature-box {
background: #fff;
padding: 30px 24px;
border-radius: 16px;
padding: 40px 28px;
border-radius: 24px;
height: 100%;
transition: all 0.3s ease;
border: 1px solid #efeff4;
text-align: left;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
border: 1px solid var(--card-border);
text-align: center;
box-shadow: 0 6px 20px rgba(62, 81, 184, 0.02);
}
.feature-icon-wrapper {
width: 50px;
height: 50px;
background-color: #ece3f1;
width: 58px;
height: 58px;
background-color: rgba(62, 81, 184, 0.08);
color: var(--primary);
border-radius: 12px;
border-radius: 16px;
display: flex;
align-items: center;
justify-content: center;
font-size: 22px;
margin-bottom: 20px;
transition: transform 0.5s ease;
font-size: 24px;
margin-bottom: 24px;
transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
margin-left: 38%;
}
.feature-box:hover {
transform: translateY(-5px);
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
border-color: var(--primary);
.feature-box:hover {
transform: translateY(-8px);
box-shadow: 0 15px 35px rgba(62, 81, 184, 0.12);
border-color: rgba(188, 26, 26, 0.2);
color:#6a2525 ;
}
.feature-box:hover .feature-icon-wrapper i {
transform: rotate(360deg);
.feature-box:hover .feature-icon-wrapper {
background: linear-gradient(135deg, var(--secondary) 0%, var(--accent-orange) 100%);
color: #fff;
transform: rotateY(180deg);
box-shadow: 0 8px 15px rgba(188, 26, 26, 0.25);
}
.feature-icon-wrapper i {
transition: transform 0.5s ease;
transition: transform 0.4s ease;
}
.feature-box:hover .feature-icon-wrapper i {
transform: rotateY(-180deg);
}
.feature-box h5 {
font-size: 18px;
font-size: 19px;
font-weight: 700;
color: #1c1d1f;
margin-bottom: 10px;
color: #181818;
margin-bottom: 12px;
}
.feature-box h5:hover {
color: #822424 ;
}
.feature-box p {
font-size: 14px;
font-size: 14.5px;
color: var(--text-muted);
margin-bottom: 0;
line-height: 1.5;
line-height: 1.6;
}
#noResults {
font-size: 18px;
font-weight: bold;
color: #666;
margin-top: 20px;
color: var(--text-muted);
margin-top: 30px;
}
/* ========================================================
Custom Pure CSS Animations (Scroll Animations)
======================================================== */
/* .animate-on-scroll {
/* Animations */
.animate-on-scroll {
opacity: 0;
transition: all 0.8s ease-out;
transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
}
.fade-up-init {
transform: translateY(30px);
transform: translateY(40px);
}
.animate-on-scroll.animated {
opacity: 1;
transform: translateY(0);
} */
}
</style>
{{-- Hero --}}
@ -313,77 +357,6 @@ body {
</div>
</section>
@php
$courses=[
[
'image'=>'https://images.unsplash.com/photo-1486262715619-67b85e0b08d3?auto=format&fit=crop&w=900&q=80',
'title'=>'Diploma in Automotive Engineering',
'duration'=>'2 Years',
'level'=>'Diploma',
'author'=>'Automotive Engineering Dept.',
'desc'=>'Master engine diagnostics, modern hybrid vehicle maintenance, and advanced automotive electrical systems with hands-on labs.',
'students'=>'1,240 students enrolled',
'rating'=>'4.9',
'badge'=>'Popular'
],
[
'image'=>'https://images.unsplash.com/photo-1503376780353-7e6692767b70?auto=format&fit=crop&w=900&q=80',
'title'=>'Mechanical Systems Technology',
'duration'=>'18 Months',
'level'=>'Certificate',
'author'=>'Tech & Service Campus',
'desc'=>'Comprehensive training on vehicle suspension, transmissions, steering, braking mechanisms, and professional repair workshop skills.',
'students'=>'850 students enrolled',
'rating'=>'4.7',
'badge'=>'Bestseller'
],
[
'image'=>'https://images.unsplash.com/photo-1502877338535-766e1452684a?auto=format&fit=crop&w=900&q=80',
'title'=>'Electric Vehicle Technology',
'duration'=>'1 Year',
'level'=>'Advanced',
'author'=>'EV Research Institute',
'desc'=>'Dive into the future of mobility. Learn about smart EV battery packs, fast charging infrastructures, and high-voltage safety.',
'students'=>'640 students enrolled',
'rating'=>'4.8',
'badge'=>'New'
],
[
'image'=>'https://images.unsplash.com/photo-1616788494707-ec28f08d05a1?auto=format&fit=crop&w=900&q=80',
'title'=>'Advanced EFI Engine Tuning & Diagnostic',
'duration'=>'6 Months',
'level'=>'Expert',
'author'=>'Performance Tuning Lab',
'desc'=>'Learn professional ECU remapping, electronic fuel injection (EFI) tuning, sensor calibration, and master high-end oscilloscope diagnostics.',
'students'=>'420 students enrolled',
'rating'=>'4.9',
'badge'=>'Hot & New'
],
[
'image'=>'https://images.unsplash.com/photo-1568605117036-5fe5e7bab0b7?auto=format&fit=crop&w=900&q=80',
'title'=>'Hybrid & Plug-in Hybrid Masterclass',
'duration'=>'8 Months',
'level'=>'Professional',
'author'=>'Automotive Engineering Dept.',
'desc'=>'Specialized training in Toyota/Honda Hybrid Synergy Drive systems, inverter repairs, planetary gearboxes, and live diagnostic scanner masterclass.',
'students'=>'980 students enrolled',
'rating'=>'4.8',
'badge'=>'Top Rated'
],
[
'image'=>'https://images.unsplash.com/photo-1517524008697-84bbe3c3fd98?auto=format&fit=crop&w=900&q=80',
'title'=>'Automotive Body Electronics & Comfort Systems',
'duration'=>'1 Year',
'level'=>'Diploma',
'author'=>'Tech & Service Campus',
'desc'=>'Covering modern CAN-bus/LIN-bus communication networks, SRS airbag systems, ABS/ESP braking electronics, and smart climate control.',
'students'=>'510 students enrolled',
'rating'=>'4.6',
'badge'=>'Trending'
],
];
@endphp
<section class="py-5">
<div class="container">
@ -392,35 +365,52 @@ $courses=[
</div>
<div class="row g-4" id="courseContainer">
@foreach($courses as $index => $course)
@forelse($courses as $index => $course)
<div class="col-12 course-item animate-on-scroll fade-up-init" style="transition-delay: {{ $index * 100 }}ms;">
<div class="card course-card h-100">
<div class="row g-0 align-items-center">
{{-- Course Image --}}
<div class="col-md-4">
<div class="course-image-wrapper">
<img src="{{ $course['image'] }}" alt="{{ $course['title'] }}">
<img src="{{ $course->image }}" alt="{{ $course->title }}">
</div>
</div>
{{-- Course Details --}}
<div class="col-md-8">
<div class="card-body">
<h4 class="course-title">{{ $course['title'] }}</h4>
<div class="course-author">{{ $course['author'] }}</div>
<h4 class="course-title">{{ $course->title }}</h4>
<p class="course-short-desc">{{ $course['desc'] }}</p>
@if($course->author)
<div class="course-author">
<i class="fa-solid fa-user-gear me-1"></i> {{ $course->author }}
</div>
@endif
<p class="course-short-desc">{{ $course->desc }}</p>
<div class="course-meta-row">
<span class="badge-bestseller">{{ $course['badge'] }}</span>
<span class="rating-star">
<i class="fas fa-star"></i> {{ $course['rating'] }}
</span>
<span class="rating-count">({{ $course['students'] }})</span>
@if($course->badge)
<span class="badge-bestseller">{{ $course->badge }}</span>
@endif
@if($course->rating)
<span class="rating-star">
<i class="fas fa-star"></i> {{ $course->rating }}
</span>
@endif
@if($course->student)
<span class="rating-count">({{ $course->student }} students enrolled)</span>
@endif
</div>
<div class="course-features">
<span><i class="fas fa-tools"></i> Practical Labs</span>
<span><i class="fas fa-certificate"></i> Verified ({{ $course['duration'] }})</span>
<span><i class="fas fa-tools"></i> Level: {{ $course->level ?? 'General' }}</span>
@if($course->duration)
<span><i class="fas fa-certificate"></i> Duration: {{ $course->duration }}</span>
@endif
</div>
<div class="course-footer" style="max-width: 200px;">
@ -432,16 +422,24 @@ $courses=[
</div>
</div>
</div>
@endforeach
@empty
<div class="col-12 text-center py-5">
<h4>No courses available at the moment.</h4>
</div>
@endforelse
</div>
</div>
</section>
{{-- Why Study With Us Section --}}
<section class="pb-5">
<section class="pb-5 why-study-section">
<div class="container">
<div class="features-section text-center animate-on-scroll fade-up-init">
<div class="features-section text-center animate-on-scroll fade-up-init"
style="background-image: linear-gradient(rgba(77, 103, 169, 0.61), rgba(0, 0, 0, 0.9)), url('https://images.pexels.com/photos/4489749/pexels-photo-4489749.jpeg?auto=compress&cs=tinysrgb&w=1600');
background-size: cover;
background-position: center;
background-repeat: no-repeat;">
<h2>Why Study With Us?</h2>
<div class="row g-4">
@ -499,8 +497,8 @@ document.addEventListener('DOMContentLoaded', function () {
let hasResults = false;
courseItems.forEach(function(item) {
let title = item.querySelector('.course-title').textContent.toLowerCase();
let desc = item.querySelector('.course-short-desc').textContent.toLowerCase();
let title = item.querySelector('.course-title') ? item.querySelector('.course-title').textContent.toLowerCase() : '';
let desc = item.querySelector('.course-short-desc') ? item.querySelector('.course-short-desc').textContent.toLowerCase() : '';
if (title.includes(filter) || desc.includes(filter)) {
item.style.setProperty('display', '', 'important');

View File

@ -0,0 +1,437 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Password Recovery</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
background: #f4f6f9;
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
}
.container-box {
background: #ffffff;
width: 100%;
max-width: 420px;
border-radius: 16px;
padding: 40px 36px;
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.15);
}
.icon-wrap {
width: 64px;
height: 64px;
background: #943835e3;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 20px;
}
.icon-wrap i { font-size: 24px; color: #eeff8f; }
h1 { font-size: 22px; color: #1f2937; text-align: center; margin-bottom: 8px; font-weight: 700; }
p.subtitle { text-align: center; color: #6b7280; font-size: 14px; margin-bottom: 28px; line-height: 1.5; }
.form-group { margin-bottom: 20px; position: relative; }
label { display: block; font-size: 13px; font-weight: 600; color: #374151; margin-bottom: 6px; }
input[type="email"], input[type="text"], input[type="password"] {
width: 100%; padding: 12px 14px; border: 1.5px solid #e5e7eb;
border-radius: 10px; font-size: 14px; color: #1f2937; outline: none;
transition: all 0.2s ease;
}
input:focus { border-color: #943835e3; box-shadow: 0 0 0 3px rgba(148, 56, 53, 0.15); }
.toggle-password { position: absolute; right: 14px; top: 38px; cursor: pointer; color: #6b7280; }
.err, .error { color: #dc2626; font-size: 12.5px; margin-top: 6px; display: block; }
.otp-input { letter-spacing: 4px; text-align: center; font-size: 20px; font-weight: 700; }
button[type="submit"] {
width: 100%; padding: 13px; background: #943835e3; color: #fff;
border: none; border-radius: 10px; font-size: 15px; font-weight: 600;
cursor: pointer; margin-top: 10px; transition: transform 0.15s ease;
}
button[type="submit"]:hover { transform: translateY(-1px); box-shadow: 0 8px 20px rgba(148, 56, 53, 0.35); }
button[type="submit"]:disabled { background: #94383580; cursor: not-allowed; }
.back-link { display: block; text-align: center; margin-top: 22px; font-size: 13.5px; color: #6b7280; }
.back-link a { color: #231d77e3; font-weight: 600; text-decoration: none; }
.powered { text-align: center; margin-top: 20px; font-size: 12px; color: #9ca3af; }
.otp-container {
display: flex;
justify-content: space-between;
gap: 8px;
margin-top: 10px;
margin-bottom: 10px;
}
.otp-box {
width: 48px;
height: 52px;
text-align: center;
font-size: 22px;
font-weight: 700;
border: 1.5px solid #e5e7eb;
border-radius: 10px;
outline: none;
transition: all 0.2s ease;
}
.otp-box:focus {
border-color: #943835e3;
box-shadow: 0 0 0 3px rgba(148, 56, 53, 0.15);
}
.success-icon-wrap {
font-size: 60px;
color: #10b981; /* Green color */
margin-bottom: 15px;
}
.login-btn-link {
display: block;
width: 100%;
padding: 13px;
background: #943835e3;
color: #fff;
text-decoration: none;
border-radius: 10px;
font-size: 15px;
font-weight: 600;
margin-top: 20px;
transition: transform 0.15s ease;
}
.login-btn-link:hover {
color: #fff;
transform: translateY(-1px);
box-shadow: 0 8px 20px rgba(148, 56, 53, 0.35);
}
</style>
</head>
<body>
<div class="container-box">
<div class="icon-wrap" id="main-icon">
<i class="fa-solid fa-key"></i>
</div>
<!-- Step 1: Email Form -->
<form class="login-form" name="login-form" action="{{ route('password.email') }}" method="post" id="login-form">
@csrf
<h1>Recover Password</h1>
<p class="subtitle">Enter your registered email address to receive an OTP code.</p>
<div class="form-group">
<label for="email-login">Email Address</label>
<input type="email" name="email" id="email-login" placeholder="name@example.com" required>
<span id="email-err" class="err"></span>
@if ($errors->has('email'))
<span class="err">{{ $errors->first('email') }}</span>
@endif
</div>
<button type="submit" id="verify-btn" onclick="validateEmail(event)">Verify Email</button>
<div class="back-link">
Remember the password? <a href="/signin">Please Login</a>
</div>
</form>
<!-- Step 2: OTP Verification Form -->
<div id="otp_sec" style="display: none;">
<h1>Enter OTP Code</h1>
<p class="subtitle">Please check your email and enter the 6-digit verification code.</p>
<form name="emailOtpForm" id="emailOtpForm">
@csrf
<div class="form-group">
<label>Verification Code</label>
<div class="otp-container">
<input type="text" class="otp-box" maxlength="1" pattern="\d*" inputmode="numeric" required>
<input type="text" class="otp-box" maxlength="1" pattern="\d*" inputmode="numeric" required>
<input type="text" class="otp-box" maxlength="1" pattern="\d*" inputmode="numeric" required>
<input type="text" class="otp-box" maxlength="1" pattern="\d*" inputmode="numeric" required>
<input type="text" class="otp-box" maxlength="1" pattern="\d*" inputmode="numeric" required>
<input type="text" class="otp-box" maxlength="1" pattern="\d*" inputmode="numeric" required>
</div>
<input type="hidden" id="otp" name="otpm">
<span id="otpm_err" class="err"></span>
</div>
<button type="submit" onclick="showPassword(event)">Submit Code</button>
</form>
</div>
<!-- Step 3: Password Reset Form -->
<div id="password_sec" style="display: none;">
<h1>Reset Password</h1>
<p class="subtitle">Create a new password for your account.</p>
<form class="login-form" name="reset-password-form" id="reset-password-form" action="{{ route('password.update') }}" method="post" onsubmit="handlePasswordReset(event)">
@csrf
<input type="hidden" name="email" value="" id="hidden_email">
<div class="form-group">
<label for="password-m">New Password</label>
<input type="password" name="password_mo" id="password-m" placeholder="••••••••" required>
<i class="fa-solid fa-eye toggle-password" id="view1" onclick="togglePassword('password-m', 'view1', 'no-view1')"></i>
<i class="fa-solid fa-eye-slash toggle-password" id="no-view1" onclick="togglePassword('password-m', 'view1', 'no-view1')" style="display:none;"></i>
</div>
<div class="form-group">
<label for="confirm_password">Confirm Password</label>
<input type="password" name="password_mo_confirmation" id="confirm_password" placeholder="••••••••" required>
<i class="fa-solid fa-eye toggle-password" id="view-con1" onclick="togglePassword('confirm_password', 'view-con1', 'no-view-con1')"></i>
<i class="fa-solid fa-eye-slash toggle-password" id="no-view-con1" onclick="togglePassword('confirm_password', 'view-con1', 'no-view-con1')" style="display:none;"></i>
<span id="con-pass-err" class="error"></span>
</div>
<button type="submit" id="reset-btn">Reset Password</button>
<div class="back-link">
Remember password? <a href="/signin">Please Login</a>
</div>
</form>
</div>
<!-- Step 4: Success Message Screen -->
<div id="success_sec" style="display: none; text-align: center;">
<div class="success-icon-wrap">
<i class="fa-solid fa-circle-check"></i>
</div>
<h1>Password Reset Successful!</h1>
<p class="subtitle">Your password has been reset successfully. You can now log in with your new password.</p>
<a href="/signin" class="login-btn-link">Proceed to Login</a>
</div>
<p class="powered">Powered by <a href="#" style="color: #6b7280; text-decoration: none; font-weight: 600;">GPiT</a></p>
</div>
<script>
function validateEmail(event) {
event.preventDefault();
var email = document.getElementById('email-login').value;
var emailErr = document.getElementById('email-err');
var csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
var verifyBtn = document.getElementById('verify-btn');
emailErr.textContent = '';
if (email.trim() === '') {
emailErr.textContent = 'Please enter your email';
return;
}
verifyBtn.disabled = true;
verifyBtn.textContent = 'Please Wait...';
fetch("{{ route('password.email') }}", {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
'X-CSRF-TOKEN': csrfToken
},
body: JSON.stringify({ email: email })
})
.then(async response => {
const text = await response.text();
try {
return JSON.parse(text);
} catch (e) {
console.error("SERVER ERROR DETAILS:", text);
throw new Error("Server returned HTML response instead of JSON.");
}
})
.then(data => {
if (data.success) {
document.getElementById("hidden_email").value = email;
document.getElementById("login-form").style.display = "none";
document.getElementById("otp_sec").style.display = "block";
} else {
if (data.errors && data.errors.email) {
emailErr.textContent = data.errors.email[0];
} else {
emailErr.textContent = data.message || 'Email not found in our records.';
}
}
})
.catch(error => {
console.error('Error:', error);
emailErr.textContent = 'An error occurred. Check browser console (F12) for details.';
})
.finally(() => {
verifyBtn.disabled = false;
verifyBtn.textContent = 'Verify Email';
});
}
function showPassword(event) {
event.preventDefault();
const otp = document.getElementById('otp').value;
const otpm_err = document.getElementById('otpm_err');
const token = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
otpm_err.innerText = '';
if (otp.trim() === '' || otp.length < 6) {
otpm_err.innerText = 'Please enter a valid 6-digit OTP code.';
return;
}
fetch("{{ route('password.verify.otp') }}", {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'X-CSRF-TOKEN': token
},
body: JSON.stringify({ otp: otp })
})
.then(response => response.json())
.then(data => {
if (data.success) {
document.getElementById("otp_sec").style.display = "none";
document.getElementById("password_sec").style.display = "block";
} else {
otpm_err.innerText = data.message || 'Invalid OTP code';
}
})
.catch(error => {
console.error('Error:', error);
otpm_err.innerText = 'Verification failed. Try again.';
});
}
function handlePasswordReset(event) {
event.preventDefault();
const form = document.getElementById('reset-password-form');
const formData = new FormData(form);
const resetBtn = document.getElementById('reset-btn');
const passErr = document.getElementById('con-pass-err');
const pass = document.getElementById('password-m').value;
const confirmPass = document.getElementById('confirm_password').value;
if (pass !== confirmPass) {
passErr.innerText = "Passwords do not match!";
passErr.style.color = "#dc2626";
return;
}
resetBtn.disabled = true;
resetBtn.textContent = 'Resetting...';
fetch(form.action, {
method: 'POST',
headers: {
'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
'Accept': 'application/json'
},
body: formData
})
.then(async response => {
const data = await response.json();
if (response.ok || data.success) {
document.getElementById("main-icon").style.display = "none";
document.getElementById("password_sec").style.display = "none";
document.getElementById("success_sec").style.display = "block";
} else {
passErr.innerText = data.message || 'Failed to reset password.';
passErr.style.color = "#dc2626";
}
})
.catch(error => {
console.error('Error:', error);
// Unexpected redirect/success response handling
document.getElementById("main-icon").style.display = "none";
document.getElementById("password_sec").style.display = "none";
document.getElementById("success_sec").style.display = "block";
})
.finally(() => {
resetBtn.disabled = false;
resetBtn.textContent = 'Reset Password';
});
}
$('#password-m, #confirm_password').on('keyup', function() {
if ($('#password-m').val() !== '' && $('#password-m').val() === $('#confirm_password').val()) {
$('#con-pass-err').html('Passwords match').css('color', '#047857');
} else if ($('#confirm_password').val() !== '') {
$('#con-pass-err').html('Passwords do not match').css('color', '#dc2626');
}
});
function togglePassword(inputId, eyeId, eyeSlashId) {
var field = document.getElementById(inputId);
var eye = document.getElementById(eyeId);
var eyeSlash = document.getElementById(eyeSlashId);
if (field.type === "password") {
field.type = "text";
eye.style.display = "none";
eyeSlash.style.display = "block";
} else {
field.type = "password";
eye.style.display = "block";
eyeSlash.style.display = "none";
}
}
document.addEventListener("DOMContentLoaded", function () {
const inputs = document.querySelectorAll(".otp-box");
const hiddenOtpInput = document.getElementById("otp");
inputs.forEach((input, index) => {
input.addEventListener("input", (e) => {
input.value = input.value.replace(/\D/g, '');
if (input.value && index < inputs.length - 1) {
inputs[index + 1].focus();
}
updateHiddenOtp();
});
input.addEventListener("keydown", (e) => {
if (e.key === "Backspace" && !input.value && index > 0) {
inputs[index - 1].focus();
}
});
input.addEventListener("paste", (e) => {
e.preventDefault();
const pasteData = e.clipboardData.getData("text").trim().replace(/\D/g, '');
if (pasteData.length === 6) {
pasteData.split("").forEach((char, i) => {
if (inputs[i]) inputs[i].value = char;
});
inputs[5].focus();
updateHiddenOtp();
}
});
});
function updateHiddenOtp() {
let fullOtp = "";
inputs.forEach(input => fullOtp += input.value);
hiddenOtpInput.value = fullOtp;
}
});
</script>
</body>
</html>

View File

@ -0,0 +1,466 @@
<!-- feedback controller function -->
<!-- use Illuminate\Http\Request;
use App\Models\Feedback;
use App\Models\user; -->
<!-- // public function feedback(Request $request)
// {
// $request->validate([
// 'feedback_type' => 'required',
// 'subject' => 'required|string|max:255',
// 'feedback_text' => 'required|string',
// ]);
// Feedback::create([
// 'student_id' => auth()->id(),
// 'feedback_type' => $request->feedback_type,
// 'subject' => $request->subject,
// 'feedback_text' => $request->feedback_text,
// 'status' => 'Pending',
// ]);
// return redirect()->back()->with('success', 'Feedback submitted successfully!');
// }
// public function feedback(Request $request)
// {
// $request->validate([
// 'feedback_type' => 'required',
// 'subject' => 'required|string|max:255',
// 'feedback_text' => 'required|string',
// ]);
// $studentLogId = session('student_portal_log_id');
// if (!$studentLogId) {
// return redirect('/students')->with('error', 'Please login first to submit feedback!');
// }
// Feedback::create([
// 'student_id' => $studentLogId,
// 'feedback_type' => $request->feedback_type,
// 'subject' => $request->subject,
// 'feedback_text' => $request->feedback_text,
// 'status' => 'Pending',
// ]);
// return redirect('/Feedback&Complain')->back()->with('success', 'Feedback submitted successfully!');}
// -->
########### ########### ########### ########### ########### ########### ########### ###########
<!-- js table data view -->
<!-- JavaScript to handle Submissions -->
<!-- <script>
document.addEventListener('DOMContentLoaded', function() {
const tableBody = document.getElementById('historyTableBody');
function getFormattedDate() {
const options = { day: '2-digit', month: 'long', year: 'numeric' };
return new Date().toLocaleDateString('en-GB', options);
}
document.getElementById('feedbackForm').addEventListener('submit', function(e) {
e.preventDefault();
const subject = document.getElementById('feedbackSubject').value;
const date = getFormattedDate();
const newRow = document.createElement('tr');
newRow.innerHTML = `
<td>Feedback</td>
<td>${subject}</td>
<td>${date}</td>
<td><span class="badge-status pending"> Pending </span></td>
`;
tableBody.insertBefore(newRow, tableBody.firstChild);
this.reset();
alert('Feedback submitted successfully!');
});
// 2. Complaint Form Submission
document.getElementById('complaintForm').addEventListener('submit', function(e) {
e.preventDefault();
const title = document.getElementById('complaintTitle').value;
const date = getFormattedDate();
const newRow = document.createElement('tr');
newRow.innerHTML = `
<td>Complaint</td>
<td>${title}</td>
<td>${date}</td>
<td><span class="badge-status pending"> Pending </span></td>
`;
tableBody.insertBefore(newRow, tableBody.firstChild);
this.reset();
alert('Complaint submitted successfully!');
});
});
</script> -->
########### ########### ########### ########### ########### ########### ########### ###########
<!-- student view profile blade -->
<!-- @extends('layouts.studentportalnav')
@section('title', 'Student Profile')
@section('content')
<style>
body{
background:#f6f7fb;
}
/* Header */
.profile-header{
background:linear-gradient(135deg,#5E244E,#4a1c3e);
color:#fff;
border-radius:20px;
padding:40px;
margin-bottom:35px;
box-shadow:0 15px 35px rgba(0,0,0,.15);
}
.profile-header h2{
font-weight:700;
}
.profile-header p{
color:#ddd;
}
/* Profile Card */
.profile-card{
background:#fff;
border-radius:20px;
padding:30px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
height:100%;
}
/* Student Image */
.profile-image{
width:150px;
height:150px;
border-radius:50%;
object-fit:cover;
border:6px solid #d4af37;
}
.student-name{
color:#5E244E;
font-weight:700;
margin-top:15px;
}
.student-id{
background:#5E244E;
color:#fff;
padding:8px 20px;
border-radius:50px;
display:inline-block;
font-size:14px;
}
/* Information */
.info-title{
color:#5E244E;
font-weight:700;
border-bottom:2px solid #d4af37;
padding-bottom:10px;
margin-bottom:20px;
}
.info-row{
display:flex;
justify-content:space-between;
padding:12px 0;
border-bottom:1px solid #eee;
}
.label{
color:#777;
}
.value{
font-weight:600;
color:#333;
}
/* Course */
.course-box{
background:#5E244E;
color:#fff;
padding:25px;
border-radius:20px;
}
.course-box h4{
color:#d4af37;
font-weight:700;
}
.course-item{
margin-top:12px;
}
.course-item i{
color:#d4af37;
width:25px;
}
/* Button */
.edit-btn{
background:#d4af37;
color:white;
border:none;
border-radius:50px;
padding:12px 30px;
font-weight:600;
}
.edit-btn:hover{
background:#c49d20;
color:#fff;
}
</style>
<div class="container py-4">
Header -->
<!-- <div class="profile-header">
<h2> <i class="fas fa-user-graduate"></i>Student Profile </h2>
<p>Manage your personal information and academic details. </p>
</div>
<div class="col-lg-4">
<div class="profile-card text-center">
<img src="{{ !empty($student->image) ? asset($student->image) : 'https://i.pravatar.cc/300' }}"
class="profile-image" alt="Profile Image">
<h3 class="student-name">{{ $student->full_name }}</h3>
<span class="student-id">
Student ID : {{ $student->student_id }}
</span>
<hr>
<button class="edit-btn mt-3">
<i class="fas fa-edit"></i> Edit Profile
</button>
</div>
</div>
Details -->
<!-- <div class="col-lg-8">
<div class="profile-card">
<h4 class="info-title">
<i class="fas fa-user"></i>
Personal Information
</h4>
<div class="info-row">
<span class="label">Full Name</span>
<span class="value">{{ $student->full_name }}</span>
</div>
<div class="info-row">
<span class="label">NIC / Passport</span>
<span class="value">{{ $student->nic_passport }}</span>
</div>
<div class="info-row">
<span class="label">Date of Birth</span>
<span class="value">
{{ date('d F Y', strtotime($student->date_of_birth)) }}
</span>
</div>
<div class="info-row">
<span class="label">Gender</span>
<span class="value">{{ $student->gender }}</span>
</div>
<div class="info-row">
<span class="label">Email</span>
<span class="value">{{ $student->email }}</span>
</div>
<div class="info-row">
<span class="label">Phone</span>
<span class="value">{{ $student->phone }}</span>
</div>
</div>
</div>
<div class="row g-4 mt-1"> -->
<!-- Education -->
<!-- <div class="col-lg-6">
<div class="profile-card">
<h4 class="info-title">
<i class="fas fa-graduation-cap"></i>
Educational Background
</h4>
<div class="info-row">
<span class="label">Qualification</span>
<span class="value">{{ $student->qualification }}</span>
</div>
<div class="info-row">
<span class="label">Institute</span>
<span class="value">{{ $student->institute }}</span>
</div>
<div class="info-row">
<span class="label">Year Completed</span>
<span class="value">{{ $student->year_completed }}</span>
</div>
</div>
</div> -->
<!-- Course Details -->
<!-- <div class="col-lg-6">
<div class="course-box">
<h4><i class="fas fa-car"></i>Course Details</h4>
<div class="course-item">
<i class="fas fa-book"></i> {{ $student->course_name }}
</div>
<div class="course-item">
<i class="fas fa-calendar"></i> Duration : {{ $student->duration }}
</div>
<div class="course-item">
<i class="fas fa-layer-group"></i> Current Semester : {{ $student->current_semester }}
</div>
<div class="course-item">
<i class="fas fa-user-tie"></i> Trainer : {{ $student->trainer_name }}
</div>
</div>
</div>
</div>
@endsection -->
########### ########### ########### ########### ########### ########### ########### ###########
<!-- // Home Page
Route::get('/', function () {
return view('welcome');
});
// Route::get('/StudentProfile', [studentsController::class, 'showProfile'])->name('StudentProfile');
Route::post('/studentlogout', [studentportalnavController::class, 'logout']);
// Route::post('/feedback', [FeedbackController ::class, 'feedback'])->name('feedback.store'); -->
<!--
Route::post('/feedback/store', [FeedbackController::class, 'feedback']) ->middleware('auth') ->name('feedback.store');
Route::post('/contact-submit', [ContactMsgController::class, 'store'])->name('contact.store'); -->

View File

@ -0,0 +1,368 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>@yield('title', 'Admin Portal - Automobile Academic')</title>
<!-- Font Awesome Icons & Bootstrap 5 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
:root {
--theme-navy: #2D355B;
--theme-footer-navy: #1F2541;
--theme-red: #822424;
--theme-red-hover: #df2c3e;
--theme-yellow: #FFEA85;
--theme-bg: #F6F6F6;
--sidebar-width: 260px;
--text-dark: #333333;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', sans-serif;
}
body {
background-color: var(--theme-bg);
color: var(--text-dark);
display: flex;
min-height: 100vh;
overflow-x: hidden;
}
.sidebar {
width: var(--sidebar-width);
height: 100vh;
background: var(--theme-navy);
color: #fff;
position: fixed;
top: 0;
left: 0;
padding: 24px 0;
transition: all 0.3s ease;
z-index: 1030;
display: flex;
flex-direction: column;
box-shadow: 2px 0 10px rgba(0,0,0,0.1);
}
.sidebar .brand {
padding: 0 24px 20px;
font-weight: 700;
font-size: 1.25rem;
color: #ffffff;
border-bottom: 1px solid rgba(255,255,255,.15);
margin-bottom: 12px;
display: flex;
align-items: center;
}
.sidebar .admin-badge {
background-color: var(--theme-red);
font-size: 0.7rem;
padding: 2px 8px;
border-radius: 4px;
margin-left: 8px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.sidebar .nav {
display: flex;
flex-direction: column;
flex-grow: 1;
overflow-y: auto;
}
.sidebar .nav-link {
color: rgba(255, 255, 255, 0.85);
padding: 14px 24px;
font-size: 0.95rem;
font-weight: 600;
display: flex;
align-items: center;
gap: 12px;
transition: all 0.2s ease;
border-left: 4px solid transparent;
text-decoration: none;
}
.sidebar .nav-link i {
width: 20px;
text-align: center;
}
.sidebar .nav-link:hover {
background: rgba(255, 255, 255, 0.08);
color: var(--theme-yellow) !important;
padding-left: 28px;
}
.sidebar .nav-link.active {
background: var(--theme-footer-navy);
color: var(--theme-yellow) !important;
border-left: 4px solid #F73F52;
font-weight: 700;
}
.sidebar-user-profile {
padding: 15px 24px;
border-top: 1px solid rgba(255,255,255,.15);
margin-top: auto;
background: var(--theme-footer-navy);
}
.sidebar-user-profile .user-dropdown-toggle {
display: flex;
align-items: center;
gap: 10px;
color: #fff;
text-decoration: none;
font-size: 0.95rem;
transition: color 0.2s ease;
}
.sidebar-user-profile .user-dropdown-toggle:hover {
color: var(--theme-yellow);
}
.main {
margin-left: var(--sidebar-width);
width: calc(100% - var(--sidebar-width));
min-height: 100vh;
padding: 40px;
background: var(--theme-bg);
transition: all 0.3s ease;
}
.mobile-header {
display: none;
background: var(--theme-navy);
color: #ffffff;
padding: 12px 20px;
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
align-items: center;
justify-content: space-between;
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 1020;
}
.sidebar-toggle {
background: none;
border: none;
font-size: 1.4rem;
cursor: pointer;
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
}
.sidebar-toggle:hover {
color: var(--theme-yellow);
}
.mobile-brand {
font-weight: 700;
font-size: 1.1rem;
color: #ffffff;
}
.sidebar-overlay {
display: none;
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background: rgba(0,0,0,0.5);
z-index: 1025;
opacity: 0;
transition: opacity 0.3s ease;
}
.sidebar-overlay.show {
display: block;
opacity: 1;
}
@media (max-width: 991px) {
.sidebar {
left: calc(-1 * var(--sidebar-width));
}
.sidebar.show {
left: 0;
}
.main {
margin-left: 0;
padding: 85px 20px 20px 20px;
width: 100%;
}
.mobile-header {
display: flex;
}
}
</style>
</head>
<body>
<!-- Mobile Top Navigation Bar -->
<header class="mobile-header">
<button class="sidebar-toggle" id="toggleBtn" aria-label="Toggle Sidebar">
<i class="fa-solid fa-bars"></i>
</button>
<div class="mobile-brand">
<i class="fa-solid fa-user-shield me-1"></i> Admin Panel
</div>
<div class="mobile-user-profile">
@if(session()->has('admin_id'))
<div class="dropdown">
<a class="text-white text-decoration-none dropdown-toggle d-flex align-items-center gap-2" href="#" role="button" id="userMenuMobile" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fa-solid fa-circle-user" style="font-size: 26px; color: var(--theme-yellow);"></i>
<span class="fw-semibold small">{{ session('admin_name', 'Admin') }}</span>
</a>
<ul class="dropdown-menu dropdown-menu-end shadow" aria-labelledby="userMenuMobile">
<li>
<a class="dropdown-item" href="{{ route('admin.profile') }}">
<i class="fa-solid fa-user-gear me-2"></i> Admin Profile
</a>
</li>
<li><hr class="dropdown-divider"></li>
<li>
<button type="button" onclick="submitAdminLogout()" class="dropdown-item text-danger w-100 text-start border-0 bg-transparent">
<i class="fa-solid fa-right-from-bracket me-2"></i> Logout
</button>
</li>
</ul>
</div>
@else
<a href="{{ route('admin.login') }}" class="btn btn-sm btn-outline-light"><i class="fa-solid fa-right-to-bracket me-1"></i> Sign In</a>
@endif
</div>
</header>
<div class="sidebar-overlay" id="sidebarOverlay"></div>
<!-- Sidebar Navigation -->
<aside class="sidebar" id="sidebar">
<div class="brand">
<i class="fa-solid fa-car-side me-2"></i> AutoEdu
<span class="admin-badge">Admin</span>
</div>
<nav class="nav">
<a href="/admin/dashboard" class="nav-link {{ request()->is('admin/dashboard*') ? 'active' : '' }}">
<i class="fa-solid fa-chart-line"></i> Admin Dashboard
</a>
<a href="{{ route('admin.mycourses') }}" class="nav-link {{ request()->is('admin/adminmycourses*') ? 'active' : '' }}">
<i class="fa-solid fa-book-bookmark"></i> Course Management
</a>
<a href="{{ route('admin.timetable') }}" class="nav-link {{ request()->is('admin/timetable*') ? 'active' : '' }}">
<i class="fa-solid fa-calendar-check"></i> Class Timetable
</a>
<a href="{{ route('admin.results') }}" class="nav-link {{ request()->is('admin/results*') ? 'active' : '' }}">
<i class="fa-solid fa-file-invoice-dollar"></i> Exam Results
</a>
<a href="{{ route('admin.profile') }}" class="nav-link {{ request()->is('admin/profile*') ? 'active' : '' }}">
<i class="fa-solid fa-user-gear"></i> Admin Profile
</a>
</nav>
<div class="sidebar-user-profile">
@if(session()->has('admin_id'))
<div class="dropdown dropup">
<a class="user-dropdown-toggle dropdown-toggle" href="#" role="button" id="userMenuDesktop" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fa-solid fa-circle-user" style="font-size: 24px; color: var(--theme-yellow);"></i>
<span class="text-truncate" style="max-width: 150px;">{{ session('admin_name', 'Admin') }}</span>
</a>
<ul class="dropdown-menu dropdown-menu-start shadow w-100" aria-labelledby="userMenuDesktop">
<li>
<a class="dropdown-item" href="{{ route('admin.profile') }}">
<i class="fa-solid fa-user-gear me-2"></i> Admin Profile
</a>
</li>
<li><hr class="dropdown-divider"></li>
<li>
<button type="button" onclick="submitAdminLogout()" class="dropdown-item text-danger border-0 bg-transparent w-100 text-start">
<i class="fa-solid fa-right-from-bracket me-2"></i> Logout
</button>
</li>
</ul>
</div>
@else
<div class="d-flex gap-2">
<a href="{{ route('admin.login') }}" class="btn btn-outline-light btn-sm w-100">Sign In</a>
</div>
@endif
</div>
</aside>
<main class="main">
@yield('content')
</main>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script>
// Sidebar Toggle Logic
const toggleBtn = document.getElementById('toggleBtn');
const sidebar = document.getElementById('sidebar');
const overlay = document.getElementById('sidebarOverlay');
if(toggleBtn) {
toggleBtn.addEventListener('click', () => {
sidebar.classList.toggle('show');
overlay.classList.toggle('show');
});
}
if(overlay) {
overlay.addEventListener('click', () => {
sidebar.classList.remove('show');
overlay.classList.remove('show');
});
}
// Admin Logout Logic
function submitAdminLogout() {
const tokenEl = document.querySelector('meta[name="csrf-token"]');
fetch('/admin/logout', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
'X-CSRF-TOKEN': tokenEl ? tokenEl.getAttribute('content') : ''
}
})
.then(res => res.json())
.then(data => {
if (data.success) {
window.location.href = '/adminlogin';
} else {
alert('Logout failed. Please try again.');
}
})
.catch(err => {
console.error('Error:', err);
alert('Server side error occurred during logout.');
});
}
</script>
</body>
</html>

View File

@ -12,13 +12,13 @@
<style>
body {
font-family: 'Segoe UI', sans-serif;
background: #f5f7fb;
background: #F6F6F6;
padding-top: 56px;
}
.navbar {
background: #5E244E;
background:#2D355B;
/* background: #3E51B8; */
z-index: 1000;
position: fixed;
top: 0;
@ -35,37 +35,39 @@
}
.navbar-brand:hover {
color: #ffc107;
color: #f4f4f8;
}
.nav-link {
color: rgba(255, 255, 255, 0.85) !important;
color: rgba(255, 255, 255, 0.9) !important;
margin-left: 20px;
transition: 0.2s ease;
font-weight:bold;
font-weight: bold;
font-size: 18px;
}
.nav-link:hover,
.nav-link.active-page {
color: #ffc107 !important;
font-weight:bold;
color: #FFEA85 !important;
/* color: #FF4040FC !important; */
font-weight: bold;
}
.site-footer {
background: #2F1027;
color: #f1e9ee;
background:#1F2541;
/* background: #182EA4; */
color: #ffffff;
padding: 60px 0 30px;
}
.site-footer h4 {
color: #fff;
color: #FFEA85;
font-weight: 700;
margin-bottom: 18px;
}
.site-footer p {
color: #d8c7d3;
color: #f1f3f9;
line-height: 1.6;
}
@ -80,7 +82,7 @@
}
.user-dropdown-toggle:hover {
color: #ffc107;
color: #FFEA85;
}
.user-profile-name {
@ -97,48 +99,61 @@
}
.footer-links a {
color: #d8c7d3;
color: #f1f3f9;
text-decoration: none;
transition: .2s;
}
.footer-links a:hover {
color: #FFC107;
color: #FFEA85;
padding-left: 4px;
}
.footer-contact li {
margin-bottom: 14px;
color: #d8c7d3;
color: #f1f3f9;
display: flex;
align-items: flex-start;
gap: 10px;
}
.footer-contact i {
color: #FFC107;
color: #FFEA85;
margin-top: 3px;
}
.footer-contact a {
color: #d8c7d3;
color: #f1f3f9;
text-decoration: none;
}
.footer-contact a:hover {
color: #FFC107;
color: #FFEA85;
}
.site-footer hr {
border-color: rgba(255,255,255,.15);
border-color: rgba(255,255,255,.2);
margin: 40px 0 20px;
}
.footer-bottom {
color: #b8a6b3;
color: #e2e5f3;
font-size: 14px;
}
/* Custom Theme Overrides for Buttons */
.btn-theme-register {
background-color: #F73F52;
color: white;
border: none;
transition: background-color 0.2s;
}
.btn-theme-register:hover {
background-color: #df2c3e;
color: white;
}
.animate {
animation-duration: 0.2s;
animation-fill-mode: both;
@ -160,10 +175,10 @@
}
@media (min-width: 1400px) {
.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
max-width: 1435px;
}
}
.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
max-width: 1435px;
}
}
</style>
</head>
<body>
@ -208,7 +223,7 @@
$displayName = Auth::user()->first_name . ' ' . Auth::user()->last_name;
@endphp
<div class="dropdown" style="padding-left:325px;">
<a class="user-dropdown-toggle text-white"
<a class="user-dropdown-toggle text-white"
href="#"
role="button"
id="userMenu"
@ -222,7 +237,7 @@
<ul class="dropdown-menu dropdown-menu-md-end shadow animate slideIn" aria-labelledby="userMenu">
<li>
<a class="dropdown-item" href="{{ route('profile.view') }}">
<i class="fa-solid fa-user "></i> Profile
<i class="fa-solid fa-user"></i> Profile
</a>
</li>
<li><hr class="dropdown-divider"></li>
@ -236,7 +251,8 @@
@else
<div class="d-flex gap-2" style="padding-left:214px;">
<a href="/signin" class="btn btn-outline-light btn-sm px-3">Sign In</a>
<a href="/signup" class="btn btn-warning btn-sm px-3">Register</a>
<!-- Swapped btn-warning for our new custom primary brand color button -->
<a href="/signup" class="btn btn-theme-register btn-sm px-3" style="background: #822424;border: 2px solid #FFF;">Register</a>
</div>
@endif
</li>
@ -245,13 +261,11 @@
</div>
</nav>
<main>
@yield('content')
</main>
<footer class="site-footer" role="contentinfo" >
<footer class="site-footer" role="contentinfo">
<div class="container">
<div class="row g-4">
<div class="col-md-4">

View File

@ -4,42 +4,43 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="csrf-token" content="{{ csrf_token() }}">
<title>Responsive Student Portal</title>
<title>@yield('title', 'Student Portal - Automobile Academic')</title>
<!-- Font Awesome Icons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Font Awesome Icons & Bootstrap 5 -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
<style>
/* Global Root Variables */
:root {
--primary: #000000;
--background: #f5f6fb;
--theme-navy: #2D355B;
--theme-footer-navy: #1F2541;
--theme-red: #822424;
--theme-red-hover: #df2c3e;
--theme-yellow: #FFEA85;
--theme-bg: #F6F6F6;
--sidebar-width: 260px;
--text-color: #333333;
--sidebar-bg: #5E244E;
--text-dark: #333333;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-family: 'Segoe UI', sans-serif;
}
body {
background-color: var(--background);
color: var(--text-color);
background-color: var(--theme-bg);
color: var(--text-dark);
display: flex;
min-height: 100vh;
overflow-x: hidden;
}
/* ---------- Sidebar Style ---------- */
.sidebar {
width: var(--sidebar-width);
height: 100vh;
background: var(--sidebar-bg);
background: var(--theme-navy);
color: #fff;
position: fixed;
top: 0;
@ -49,34 +50,20 @@
z-index: 1030;
display: flex;
flex-direction: column;
box-shadow: 2px 0 10px rgba(0,0,0,0.1);
}
.sidebar .brand {
padding: 0 24px 24px;
padding: 0 24px 20px;
font-weight: 700;
font-size: 1.2rem;
border-bottom: 1px solid rgba(255,255,255,.12);
font-size: 1.25rem;
color: #ffffff;
border-bottom: 1px solid rgba(255,255,255,.15);
margin-bottom: 12px;
display: flex;
align-items: center;
}
/* User Profile Section inside Sidebar */
.sidebar-user-profile {
padding: 15px 24px;
border-bottom: 1px solid rgba(255,255,255,.12);
margin-bottom: 15px;
}
.sidebar-user-profile .dropdown-toggle {
display: flex;
align-items: center;
gap: 10px;
color: #fff;
text-decoration: none;
font-size: 0.95rem;
}
.sidebar .nav {
display: flex;
flex-direction: column;
@ -85,14 +72,15 @@
}
.sidebar .nav-link {
color: rgba(255,255,255,.75);
color: rgba(255, 255, 255, 0.85);
padding: 14px 24px;
font-size: .95rem;
font-size: 0.95rem;
font-weight: 600;
display: flex;
align-items: center;
gap: 12px;
transition: .2s;
border-left: 3px solid transparent;
transition: all 0.2s ease;
border-left: 4px solid transparent;
text-decoration: none;
}
@ -102,43 +90,54 @@
}
.sidebar .nav-link:hover {
background: rgba(255,255,255,.06);
color: #fff;
background: rgba(255, 255, 255, 0.08);
color: var(--theme-yellow) !important;
padding-left: 28px;
}
.sidebar .nav-link.active {
background: rgba(255,255,255,.1);
color: #fff;
border-left: 3px solid #fff;
font-weight: 600;
background: var(--theme-footer-navy);
color: var(--theme-yellow) !important;
border-left: 4px solid #F73F52;
font-weight: 700;
}
.sidebar-user-profile {
padding: 15px 24px;
border-top: 1px solid rgba(255,255,255,.15);
margin-top: auto;
background: var(--theme-footer-navy);
}
.sidebar .logout-link {
color: rgba(255,255,255,.6);
margin-top: auto;
}
.sidebar .logout-link:hover {
.sidebar-user-profile .user-dropdown-toggle {
display: flex;
align-items: center;
gap: 10px;
color: #fff;
background: rgba(220,53,69,.25);
text-decoration: none;
font-size: 0.95rem;
transition: color 0.2s ease;
}
.sidebar-user-profile .user-dropdown-toggle:hover {
color: var(--theme-yellow);
}
/* ---------- Main Content Layout ---------- */
.main {
margin-left: var(--sidebar-width);
width: calc(100% - var(--sidebar-width));
min-height: 100vh;
padding: 40px;
background: var(--background);
background: var(--theme-bg);
transition: all 0.3s ease;
}
/* Mobile Header Toggle Bar */
.mobile-header {
display: none;
background: #fff;
padding: 15px 20px;
box-shadow: 0 2px 5px rgba(0,0,0,0.05);
background: var(--theme-navy);
color: #ffffff;
padding: 12px 20px;
box-shadow: 0 2px 8px rgba(0,0,0,0.15);
align-items: center;
justify-content: space-between;
position: fixed;
@ -151,21 +150,24 @@
.sidebar-toggle {
background: none;
border: none;
font-size: 1.5rem;
font-size: 1.4rem;
cursor: pointer;
color: var(--sidebar-bg);
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
}
.sidebar-toggle:hover {
color: var(--theme-yellow);
}
.mobile-brand {
font-weight: 700;
font-size: 1.1rem;
color: #333;
color: #ffffff;
}
/* Overlay Background when sidebar open on Mobile */
.sidebar-overlay {
display: none;
position: fixed;
@ -173,7 +175,7 @@
left: 0;
right: 0;
bottom: 0;
background: rgba(0,0,0,0.4);
background: rgba(0,0,0,0.5);
z-index: 1025;
opacity: 0;
transition: opacity 0.3s ease;
@ -184,7 +186,6 @@
opacity: 1;
}
/* ---------- Responsive Media Queries (Mobile & Tablets) ---------- */
@media (max-width: 991px) {
.sidebar {
left: calc(-1 * var(--sidebar-width));
@ -196,7 +197,7 @@
.main {
margin-left: 0;
padding: 90px 20px 20px 20px;
padding: 85px 20px 20px 20px;
width: 100%;
}
@ -213,22 +214,23 @@
<button class="sidebar-toggle" id="toggleBtn" aria-label="Toggle Sidebar">
<i class="fa-solid fa-bars"></i>
</button>
<div class="mobile-brand">Student Portal</div>
<div class="mobile-brand">
<i class="fa-solid fa-car-side me-1"></i> AutoEdu Portal
</div>
<!-- Mobile View User Profile Header Dropdown -->
<div class="mobile-user-profile">
@if(Auth::check())
@if(session()->has('student_id'))
<div class="dropdown">
<a class="text-dark no-toggle-icon" href="#" role="button" id="userMenuMobile" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fa-solid fa-circle-user" style="font-size: 35px; color: var(--sidebar-bg);"></i>
<strong>{{ Auth::user()->first_name }}</strong>
<a class="text-white text-decoration-none dropdown-toggle d-flex align-items-center gap-2" href="#" role="button" id="userMenuMobile" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fa-solid fa-circle-user" style="font-size: 26px; color: var(--theme-yellow);"></i>
<span class="fw-semibold small">{{ session('student_name') }}</span>
</a>
<ul class="dropdown-menu dropdown-menu-end shadow" aria-labelledby="userMenuMobile">
<li class="px-3 py-2 ">
<!-- <small class="text-muted">Signed in as</small><br> -->
<!-- <strong>{{ Auth::user()->first_name }}</strong> -->
<li>
<a class="dropdown-item" href="{{ route('StudentProfile') }}">
<i class="fa-solid fa-user me-2"></i> Profile
</a>
</li>
<li><a class="dropdown-item mt-1" href="/StudentProfile"><i class="fa-solid fa-user me-2"></i> Profile</a></li>
<li><hr class="dropdown-divider"></li>
<li>
<button type="button" onclick="submitLogout()" class="dropdown-item text-danger w-100 text-start border-0 bg-transparent">
@ -238,145 +240,124 @@
</ul>
</div>
@else
<a href="/signin" class="btn btn-sm btn-outline-dark"><i class="fa-solid fa-right-to-bracket"></i></a>
<a href="/" class="btn btn-sm btn-outline-light"><i class="fa-solid fa-right-to-bracket me-1"></i> Sign In</a>
@endif
</div>
</header>
<!-- Overlay dim background element -->
<div class="sidebar-overlay" id="sidebarOverlay"></div>
<!-- Sidebar Navigation -->
<aside class="sidebar" id="sidebar">
<div class="brand">
<i class="fa-solid fa-graduation-cap"></i>&nbsp;&nbsp;Student Portal
<i class="fa-solid fa-car-side me-2"></i> AutoEdu
</div>
<!-- Sidebar Active User Profile Details (Desktop View) -->
<nav class="nav">
<a href="/Dashboard" class="nav-link ">
<i class="fa-solid fa-gauge"></i>Dashboard
<a href="/Dashboard" class="nav-link {{ request()->is('Dashboard*') ? 'active' : '' }}">
<i class="fa-solid fa-gauge"></i> Dashboard
</a>
<a href="/mycourse" class="nav-link">
<i class="fa-solid fa-book"></i>My Courses
<a href="/mycourse" class="nav-link {{ request()->is('mycourse*') ? 'active' : '' }}">
<i class="fa-solid fa-book"></i> My Courses
</a>
<a href="/timetable" class="nav-link">
<i class="fa-solid fa-calendar-days"></i>Class Timetable
<a href="/timetable" class="nav-link {{ request()->is('timetable*') ? 'active' : '' }}">
<i class="fa-solid fa-calendar-days"></i> Class Timetable
</a>
<!-- <a href="/Assignments" class="nav-link">
<i class="fa-solid fa-file-lines"></i>Assignments
</a> -->
<a href="/results" class="nav-link">
<i class="fa-solid fa-square-poll-vertical"></i>Exam Results
<a href="/results" class="nav-link {{ request()->is('results*') ? 'active' : '' }}">
<i class="fa-solid fa-square-poll-vertical"></i> Exam Results
</a>
<a href="/Studentguidelines" class="nav-link">
<i class="fa-solid fa-book-open"></i>Student Guidelines
<a href="/Studentguidelines" class="nav-link {{ request()->is('Studentguidelines*') ? 'active' : '' }}">
<i class="fa-solid fa-book-open"></i> Student Guidelines
</a>
<a href="/Feedback&Complain" class="nav-link">
<i class="fa-solid fa-comments"></i>Feedback & Complain
<a href="/Feedback&Complain" class="nav-link {{ request()->is('Feedback&Complain*') ? 'active' : '' }}">
<i class="fa-solid fa-comments"></i> Feedback & Complain
</a>
<a href="/StudentProfile" class="nav-link">
<i class="fa-solid fa-user"></i>Student Profile
<a href="{{ route('StudentProfile') }}" class="nav-link {{ request()->routeIs('StudentProfile') ? 'active' : '' }}">
<i class="fa-solid fa-user"></i> Student Profile
</a>
</nav>
<div class="sidebar-user-profile">
@if(Auth::check())
@php
$displayName = Auth::user()->first_name . ' ' . Auth::user()->last_name;
@endphp
<div class="dropdown">
<a class="dropdown-toggle" href="#" role="button" id="userMenuDesktop" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fa-solid fa-circle-user" style="font-size: 24px;"></i>
<span class="user-profile-name text-truncate" style="max-width: 160px;">{{ $displayName }}</span>
<div class="sidebar-user-profile">
@if(session()->has('student_id'))
<div class="dropdown dropup">
<a class="user-dropdown-toggle dropdown-toggle" href="#" role="button" id="userMenuDesktop" data-bs-toggle="dropdown" aria-expanded="false">
<i class="fa-solid fa-circle-user" style="font-size: 24px; color: var(--theme-yellow);"></i>
<span class="text-truncate" style="max-width: 150px;">{{ session('student_name') }}</span>
</a>
<ul class="dropdown-menu dropdown-menu-start shadow w-100" aria-labelledby="userMenuDesktop">
<li>
<a class="dropdown-item" href="/StudentProfile">
<a class="dropdown-item" href="{{ route('StudentProfile') }}">
<i class="fa-solid fa-user me-2"></i> Profile
</a>
</li>
<li><hr class="dropdown-divider"></li>
<li>
<a href="#" onclick="submitLogout(); return false;" class="nav-link logout-link mt-auto" style="color:black;">
<i class="fa-solid fa-right-from-bracket"></i>Logout
</a>
<button type="button" onclick="submitLogout()" class="dropdown-item text-danger border-0 bg-transparent w-100 text-start">
<i class="fa-solid fa-right-from-bracket me-2"></i> Logout
</button>
</li>
</ul>
</div>
@else
<div class="d-flex gap-2 px-2">
<a href="/signin" class="btn btn-outline-light btn-sm w-50">Sign In</a>
<a href="/signup" class="btn btn-warning btn-sm w-50">Register</a>
<div class="d-flex gap-2">
<a href="/" class="btn btn-outline-light btn-sm w-100">Sign In</a>
</div>
@endif
</div>
</aside>
<!-- Main Content Area -->
<main class="main">
@yield('content')
</main>
<!-- Sidebar Toggle JavaScript -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script>
// Sidebar Toggle Logic
const toggleBtn = document.getElementById('toggleBtn');
const sidebar = document.getElementById('sidebar');
const overlay = document.getElementById('sidebarOverlay');
// Function to toggle sidebar view
toggleBtn.addEventListener('click', () => {
sidebar.classList.toggle('show');
overlay.classList.toggle('show');
});
if(toggleBtn) {
toggleBtn.addEventListener('click', () => {
sidebar.classList.toggle('show');
overlay.classList.toggle('show');
});
}
// Close sidebar if user clicks outside of it
overlay.addEventListener('click', () => {
sidebar.classList.remove('show');
overlay.classList.remove('show');
});
if(overlay) {
overlay.addEventListener('click', () => {
sidebar.classList.remove('show');
overlay.classList.remove('show');
});
}
// Logout Logic
function submitLogout() {
const tokenEl = document.querySelector('meta[name="csrf-token"]');
fetch('/studentlogout', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
'X-CSRF-TOKEN': tokenEl ? tokenEl.getAttribute('content') : ''
}
})
.then(res => res.json())
.then(data => {
if (data.success) {
window.location.href = '/';
} else {
alert('Logout failed. Please try again.');
}
})
.catch(err => {
console.error('Error:', err);
alert('Server side error occurred during logout.');
});
}
</script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script>
function submitLogout() {
const tokenEl = document.querySelector('meta[name="csrf-token"]');
fetch('/studentlogout', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
'X-CSRF-TOKEN': tokenEl ? tokenEl.getAttribute('content') : ''
}
})
.then(res => {
if (!res.ok) {
return res.text().then(text => { throw new Error(text) });
}
return res.json();
})
.then(data => {
if (data.success) {
alert('Logged out successfully!');
window.location.href = '/students';
} else {
alert('Logout failed. Please try again.');
}
})
.catch(err => {
console.error('Error:', err);
alert('Server side error occurred during logout.');
});
}
</script>
</body>
</html>

View File

@ -0,0 +1,83 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Password Reset OTP - Academy</title>
<style>
body, table, td, a { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
table, td { mso-table-lspace: 0pt; mso-table-rspace: 0pt; }
img { -ms-interpolation-mode: bicubic; border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; }
body { height: 100% !important; margin: 0 !important; padding: 0 !important; width: 100% !important; background-color: #f4f7f6; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; }
</style>
</head>
<body style="margin: 0; padding: 0; background-color: #f4f7f6;">
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="center" style="padding: 40px 10px;">
<!-- Main Container -->
<table border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width: 550px; background-color: #ffffff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.05);">
<!-- Header / Logo Area -->
<tr>
<td align="center" style="padding: 30px 20px; background-color: #1a2b4c;">
<!-- Academy Logo / Branding -->
<h2 style="color: #ffffff; margin: 0; font-size: 24px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase;">
ACADEMY
</h2>
</td>
</tr>
<!-- Body Content -->
<tr>
<td style="padding: 40px 30px; text-align: center;">
<h1 style="color: #20396b; font-size: 22px; font-weight: 700; margin-top: 0; margin-bottom: 12px;">
Reset Your Password
</h1>
<p style="color: #683636; font-size: 15px; line-height: 22px; margin-bottom: 25px;">
Hello,<br>
We received a request to reset the password for your Academy account. Use the Verification Code (OTP) below to proceed.
</p>
<!-- OTP Box -->
<div style="background-color: #f0f4f9; border: 2px dashed #0236b9; border-radius: 8px; padding: 18px; margin: 20px 0; display: inline-block; width: 80%;">
<span style="font-size: 32px; font-weight: 800; color: #0236b9; letter-spacing: 6px; font-family: 'Courier New', Courier, monospace;">
{{ $otp }}
</span>
</div>
<p style="color: #888888; font-size: 13px; line-height: 18px; margin-top: 25px;">
This OTP is valid for <strong>10 minutes</strong>. If you did not request a password reset, please ignore this email.
</p>
</td>
</tr>
<!-- Divider -->
<tr>
<td style="padding: 0 30px;">
<hr style="border: none; border-top: 1px solid #eeeeee; margin: 0;">
</td>
</tr>
<!-- Footer -->
<tr>
<td style="padding: 25px 30px; text-align: center; background-color: #fafafa;">
<p style="color: #999999; font-size: 12px; margin: 0 0 8px 0;">
Regards,<br>
<strong>Academy Learning Team</strong>
</p>
<p style="color: #cccccc; font-size: 11px; margin: 0;">
&copy; {{ date('Y') }} Academy. All rights reserved.
</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>

View File

@ -0,0 +1,219 @@
@extends('layouts.studentportalnav')
@section('title', 'Module Details')
@section('content')
<style>
:root {
--theme-navy: #2D355B;
--theme-navy-dark: #1F2541;
--theme-red: #822424;
--theme-red-hover: #df2c3e;
--theme-yellow: #FFEA85;
--bg-light: #F6F6F6;
--white: #ffffff;
}
body {
background: var(--bg-light);
font-family: 'Segoe UI', sans-serif;
}
.main-portal-content {
padding: 10px 5px;
min-height: 100vh;
}
/* Header styling */
.module-header {
background: var(--theme-navy);
color: var(--white);
border-radius: 16px;
padding: 25px 30px;
margin-bottom: 25px;
border-left: 5px solid var(--theme-red);
}
/* Video Wrapper */
.video-container {
position: relative;
padding-bottom: 56.25%; /* 16:9 Aspect Ratio */
height: 0;
overflow: hidden;
border-radius: 14px;
background: #000;
box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}
.video-container iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: 0;
}
/* Card Styling */
.content-card {
border: 1px solid #e2e8f0;
border-radius: 14px;
background: var(--white);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
margin-bottom: 20px;
}
/* Lesson List */
.lesson-list .list-group-item {
border: none;
border-bottom: 1px solid #f1f5f9;
padding: 14px 20px;
transition: all 0.2s;
}
.lesson-list .list-group-item:hover {
background-color: #f8fafc;
}
.lesson-list .list-group-item.active {
background-color: rgba(130, 36, 36, 0.08);
color: var(--theme-red);
font-weight: 600;
border-left: 4px solid var(--theme-red);
}
.btn-theme-red {
background-color: var(--theme-red) !important;
border-color: var(--theme-red) !important;
color: #fff !important;
border-radius: 8px;
font-weight: 600;
}
.btn-theme-red:hover {
background-color: var(--theme-red-hover) !important;
}
@media (min-width: 768px) {
.main-portal-content { padding: 15px; }
}
</style>
<div class="main-portal-content">
<div class="container-fluid">
<!-- Back Button & Header -->
<div class="mb-3">
<a href="{{ route('mycourse') }}" class="text-decoration-none text-muted small fw-semibold">
<i class="fa fa-arrow-left me-1"></i> Back to My Course
</a>
</div>
<div class="module-header d-flex flex-wrap align-items-center justify-content-between gap-3">
<div>
<span class="badge bg-danger mb-2">Module {{ $moduleId ?? 1 }}</span>
<h2 class="fw-bold mb-1">Introduction & Fundamentals</h2>
<p class="mb-0 opacity-75 small">Learn the basic concepts, core principles, and foundational theories.</p>
</div>
<div>
<button class="btn btn-outline-light btn-sm px-3">
<i class="fa-solid fa-check-circle me-1"></i> Mark as Complete
</button>
</div>
</div>
<!-- Main Content Area -->
<div class="row g-4">
<!-- LEFT: Video Player & Module Details -->
<div class="col-lg-8 col-12">
<!-- Video Container -->
<div class="content-card p-2">
<div class="video-container">
<!-- Sample Video URL (replace with actual video stream/iframe) -->
<iframe src="https://www.youtube.com/embed/dQw4w9WgXcQ" title="Lesson Video" allowfullscreen></iframe>
</div>
</div>
<!-- Module Description Card -->
<div class="content-card p-4">
<h4 class="fw-bold mb-3" style="color: var(--theme-navy);">Overview & Description</h4>
<p class="text-secondary lh-base">
In this module, you will explore the essential foundational topics. We will cover step-by-step concepts to help you build a strong understanding before moving on to the advanced practical modules.
</p>
<hr class="my-4" style="color: #cbd5e1;">
<h5 class="fw-bold mb-3" style="color: var(--theme-navy);">Resources & Downloads</h5>
<div class="d-flex flex-wrap gap-2">
<a href="#" class="btn btn-light border btn-sm text-dark">
<i class="fa-solid fa-file-pdf text-danger me-2"></i> Lecture Notes.pdf
</a>
<a href="#" class="btn btn-light border btn-sm text-dark">
<i class="fa-solid fa-file-lines text-primary me-2"></i> Assignment Guide.docx
</a>
</div>
</div>
<!-- Navigation Buttons -->
<div class="d-flex justify-content-between align-items-center mb-4">
<button class="btn btn-secondary btn-sm px-4 py-2" disabled>
<i class="fa fa-chevron-left me-1"></i> Previous Module
</button>
<a href="#" class="btn btn-theme-red btn-sm px-4 py-2">
Next Module <i class="fa fa-chevron-right ms-1"></i>
</a>
</div>
</div>
<!-- RIGHT: Lesson Playlist Sidebar -->
<div class="col-lg-4 col-12">
<div class="content-card overflow-hidden">
<div class="p-3 border-bottom bg-light">
<h6 class="fw-bold mb-0" style="color: var(--theme-navy);">
<i class="fa-solid fa-list-ul me-2" style="color: var(--theme-red);"></i> Course Playlist
</h6>
</div>
<ul class="list-group list-group-flush lesson-list">
<li class="list-group-item active d-flex justify-content-between align-items-center">
<div>
<i class="fa-solid fa-circle-play me-2"></i>
<span>1. Introduction to Course</span>
</div>
<span class="badge bg-danger rounded-pill">10 mins</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-center">
<div>
<i class="fa-regular fa-circle-play me-2 text-muted"></i>
<span>2. Core Concepts Explained</span>
</div>
<span class="badge bg-secondary rounded-pill">15 mins</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-center">
<div>
<i class="fa-regular fa-circle-play me-2 text-muted"></i>
<span>3. Practical Application</span>
</div>
<span class="badge bg-secondary rounded-pill">20 mins</span>
</li>
<li class="list-group-item d-flex justify-content-between align-items-center">
<div>
<i class="fa-solid fa-lock me-2 text-muted"></i>
<span class="text-muted">4. Summary & Quiz</span>
</div>
<span class="badge bg-light text-dark border">Locked</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
@endsection

View File

@ -4,46 +4,39 @@
@section('content')
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
:root {
--purple-main: #5E244E;
--purple-dark: #4a1c3e;
--purple-light: #744a68;
--gold-accent: #D4AF37;
--gold-hover: #b8972e;
--bg-light: #f8fafc;
--theme-navy: #2D355B; /* Primary Navy */
--theme-navy-dark: #1F2541; /* Dark Navy */
--theme-red: #822424; /* Primary Accent Red */
--theme-red-hover: #df2c3e; /* Red Hover */
--theme-yellow: #FFEA85; /* Accent Yellow/Gold */
--bg-light: #F6F6F6; /* Page Background */
--white: #ffffff;
}
body {
background: var(--bg-light);
font-family: 'Poppins', sans-serif;
font-family: 'Segoe UI', sans-serif;
}
.main-portal-content {
padding: 20px 15px;
padding: 10px 5px;
min-height: 100vh;
transition: all 0.3s ease;
}
/* Premium Hero Section */
.hero {
background: linear-gradient(135deg, var(--purple-main) 0%, var(--purple-dark) 100%) !important;
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
color: var(--white) !important;
border-radius: 20px;
padding: 30px 20px;
border-radius: 16px;
padding: 35px 30px;
margin-bottom: 30px;
box-shadow: 0 10px 30px rgba(74, 28, 62, 0.15);
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
position: relative;
overflow: hidden;
border-left: 5px solid var(--theme-red);
}
.hero::after {
@ -60,33 +53,34 @@ body {
/* Course Card */
.course-card {
border: none !important;
border-radius: 20px !important;
border: 1px solid #e2e8f0 !important;
border-radius: 16px !important;
overflow: hidden;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
background: var(--white);
margin-bottom: 30px;
}
.course-card img {
height: 200px;
height: 240px;
object-fit: cover;
width: 100%;
}
/* Sidebar Info Boxes */
.info-box {
border-radius: 16px !important;
border-radius: 12px !important;
padding: 20px 24px;
background: var(--white);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
border: 1px solid rgba(94, 36, 78, 0.05) !important;
box-shadow: 0 4px 12px rgba(219, 240, 99, 0.04) !important;
border: 1px solid #e2e8f0 !important;
transition: all 0.3s ease;
}
.info-box:hover {
transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06) !important;
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08) !important;
border-color: var(--theme-navy) !important;
}
.stat-icon {
@ -95,277 +89,270 @@ body {
display: flex;
align-items: center;
justify-content: center;
border-radius: 12px;
border-radius: 10px;
font-size: 18px;
background: rgba(94, 36, 78, 0.08);
color: var(--purple-main);
background: var(--theme-red) !important;
color: #ffff8d;
}
/* Modules Card */
.module-card {
border: 1px solid rgba(94, 36, 78, 0.06) !important;
border-radius: 16px !important;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
border: 1px solid #e2e8f0 !important;
border-radius: 14px !important;
transition: all 0.3s ease;
background: var(--white);
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important;
}
.module-card:hover {
transform: translateY(-5px);
box-shadow: 0 12px 25px rgba(0, 0, 0, 0.08) !important;
border-color: var(--purple-light) !important;
transform: translateY(-4px);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08) !important;
border-color: var(--theme-red) !important;
}
/* Progress bar customizations */
.progress {
height: 10px !important;
border-radius: 50px !important;
background-color: #f1f5f9 !important;
background-color: #e2e8f0 !important;
}
.progress-bar {
border-radius: 50px !important;
background: linear-gradient(90deg, var(--gold-accent), #f4d05e) !important;
background: linear-gradient(90deg, var(--theme-red), var(--theme-red-hover)) !important;
}
/* Status Badges */
.status {
font-size: 11px;
font-weight: 600;
padding: 5px 14px;
font-weight: 700;
padding: 6px 14px;
border-radius: 50px;
text-transform: uppercase;
letter-spacing: 0.5px;
}
.completed { background: rgba(94, 36, 78, 0.1); color: var(--purple-main); }
.progressing { background: rgba(212, 175, 55, 0.15); color: #9c7e1c; }
.locked { background: #f1f5f9; color: #64748b; }
.completed { background: rgba(45, 53, 91, 0.12); color: var(--theme-navy); }
.progressing { background: rgba(247, 63, 82, 0.15); color: var(--theme-red); }
.locked { background: #e2e8f0; color: #64748b; }
/* Custom Buttons */
.btn-gold {
background-color: var(--gold-accent) !important;
border-color: var(--gold-accent) !important;
.btn-theme-red {
background-color: var(--theme-red) !important;
border-color: var(--theme-red) !important;
color: #fff !important;
border-radius: 10px;
border-radius: 8px;
font-weight: 600;
transition: all 0.2s ease;
}
.btn-theme-red:hover {
background-color: var(--theme-red-hover) !important;
border-color: var(--theme-red-hover) !important;
}
.btn-gold:hover { background-color: var(--gold-hover) !important; }
.btn-purple {
background-color: var(--purple-main) !important;
border-color: var(--purple-main) !important;
.btn-theme-navy {
background-color: var(--theme-navy) !important;
border-color: var(--theme-navy) !important;
color: #fff !important;
border-radius: 10px;
font-weight: 500;
border-radius: 8px;
font-weight: 600;
transition: all 0.2s ease;
}
.btn-theme-navy:hover {
background-color: var(--theme-navy-dark) !important;
}
.btn-purple:hover { background-color: var(--purple-dark) !important; }
.btn-continue {
background-color: #fff !important;
color: var(--purple-main) !important;
border-radius: 10px;
background-color: var(--theme-red) !important;
color: #ffffff !important;
border-radius: 8px;
transition: all 0.2s ease;
}
.btn-continue:hover {
background-color: var(--theme-red-hover) !important;
}
/* Section Title Indicator */
.section-title-wrapper {
display: flex;
align-items: center;
gap: 10px;
margin: 30px 0 20px;
}
.section-title-wrapper::before {
content: '';
display: inline-block;
width: 5px;
height: 24px;
background-color: var(--theme-red);
border-radius: 2px;
}
.btn-continue:hover { background-color: #f1f5f9 !important; }
/* Responsive Media Queries */
@media (min-width: 768px) {
.main-portal-content {
padding: 34px;
}
.hero {
padding: 45px;
}
.course-card img {
height: 280px;
}
}
@media (min-width: 992px) {
.main-portal-content {
margin-left: 18px;
}
.main-portal-content { padding: 10px; }
.hero { padding: 40px; }
.course-card img { height: 280px; }
}
</style>
<div class="main-portal-content">
<div class="container-fluid">
<!-- Hero Section -->
<div class="hero">
<div class="row align-items-center">
<div class="col-lg-9 col-md-8 text-start">
<h1 class="fw-bold display-6 mb-2">Diploma in Automotive Engineering</h1>
<p class="lead mb-4 small opacity-75">Welcome back! Continue your learning journey and complete all modules.</p>
<a href="#" class="btn btn-continue px-4 py-2 fw-semibold shadow-sm">
<i class="fa fa-play me-2"></i> Continue Learning
</a>
</div>
<div class="col-lg-3 col-md-4 text-center d-none d-md-block">
<i class="fa-solid fa-car-side" style="font-size:100px; opacity:.2; color: var(--gold-accent);"></i>
@if($course)
{{-- Dynamic Image URL Handler --}}
@php
$imageSrc = Str::startsWith($course->image, ['http://', 'https://'])
? $course->image
: asset('storage/' . $course->image);
@endphp
<!-- Hero Section -->
<div class="hero">
<div class="row align-items-center">
<div class="col-lg-9 col-md-8 text-start">
<h1 class="fw-bold display-6 mb-2">{{ $course->title }}</h1>
<p class="lead mb-4 small opacity-75">Welcome back! Continue your learning journey and complete all modules.</p>
<a href="#" class="btn btn-continue px-4 py-2 fw-semibold shadow-sm">
<i class="fa fa-play me-2"></i> Continue Learning
</a>
</div>
<div class="col-lg-3 col-md-4 text-center d-none d-md-block">
<i class="fa-solid fa-graduation-cap" style="font-size: 140px; opacity: 0.35; color: #8C080F;"></i>
</div>
</div>
</div>
</div>
<!-- Main Content Grid -->
<div class="row g-4">
<!-- LEFT COLUMN: Course details & Modules -->
<div class="col-lg-8 col-12">
<!-- Main Content Grid -->
<div class="row g-4">
<!-- Main Course Card -->
<div class="card course-card">
<img src="https://images.unsplash.com/photo-1486262715619-67b85e0b08d3?auto=format&fit=crop&w=1200&q=80" alt="Course Image">
<div class="card-body p-4">
<div class="d-flex flex-wrap justify-content-between align-items-start gap-2 mb-3">
<div>
<h3 class="fw-bold text-dark mb-1">AE101</h3>
<p class="text-muted small mb-0">
<i class="fa-solid fa-building me-1" style="color: var(--purple-light);"></i> Automotive Engineering Department
</p>
<!-- LEFT COLUMN: Course details & Modules -->
<div class="col-lg-8 col-12">
<!-- Main Course Card -->
<div class="card course-card">
<img src="{{ $imageSrc }}" alt="{{ $course->title }}" onerror="this.onerror=null;this.src='https://images.unsplash.com/photo-1486262715619-67b85e0b08d3?auto=format&fit=crop&w=1200&q=80';">
<div class="card-body p-4">
<div class="d-flex flex-wrap justify-content-between align-items-start gap-2 mb-3">
<div>
<h3 class="fw-bold mb-1" style="color: var(--theme-navy);">{{ $course->course_code ?? $course->title }}</h3>
<p class="text-muted small mb-0">
<i class="fa-solid fa-user me-1" style="color: var(--theme-red);"></i> {{ $course->author ?? 'Instructor' }}
</p>
</div>
<span class="badge px-3 py-2 rounded-pill" style="background-color: var(--theme-navy); color: var(--theme-yellow);">
{{ $course->badge ?? 'Active Course' }}
</span>
</div>
<span class="badge bg-dark px-3 py-2 rounded-pill">Diploma</span>
</div>
<p class="text-secondary small lh-base">
Master engine diagnostics, suspension systems, transmission technology, electrical systems and hybrid vehicle maintenance.
</p>
<p class="text-secondary small lh-base">
{{ $course->desc ?? 'No description available for this course.' }}
</p>
<div class="mt-4">
<div class="d-flex justify-content-between mb-2 small">
<span class="text-dark fw-semibold">Overall Progress</span>
<span class="fw-bold" style="color: var(--purple-main);">55%</span>
</div>
<div class="progress">
<div class="progress-bar" style="width:55%"></div>
<div class="mt-4">
<div class="d-flex justify-content-between mb-2 small">
<span class="fw-semibold" style="color: var(--theme-navy);">Overall Progress</span>
<span class="fw-bold" style="color: var(--theme-red);">0%</span>
</div>
<div class="progress">
<div class="progress-bar" style="width:0%"></div>
</div>
</div>
</div>
</div>
<!-- Modules Header -->
<div class="section-title-wrapper">
<h4 class="fw-bold mb-0" style="color: var(--theme-navy);">
Course Modules
</h4>
</div>
<!-- Modules Sub-Grid (Sample Modules Interface) -->
<div class="row g-4">
<div class="col-md-6 col-12">
<div class="card module-card h-100">
<div class="card-body p-4 d-flex flex-column justify-content-between">
<div>
<div class="d-flex justify-content-between align-items-start gap-2 mb-2">
<h6 class="fw-bold mb-0" style="color: var(--theme-navy);">Introduction & Fundamentals</h6>
<span class="status progressing">In Progress</span>
</div>
<p class="text-muted small mb-0">Basic concepts and core theories.</p>
</div>
<div class="mt-4">
<button type="button" onclick="goToModule(1)" class="btn btn-theme-red w-100 btn-sm py-2">
Continue Learning
</button>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Modules Header -->
<div class="my-4">
<h4 class="fw-bold text-dark">
<i class="fa-solid fa-list-check me-2" style="color: var(--gold-accent);"></i> Course Modules
</h4>
</div>
<!-- Modules Sub-Grid -->
<div class="row g-4">
<!-- Module 1 -->
<div class="col-md-6 col-12">
<div class="card module-card h-100">
<div class="card-body p-4 d-flex flex-column justify-content-between">
<div>
<div class="d-flex justify-content-between align-items-start gap-2 mb-2">
<h6 class="fw-bold text-dark mb-0">Engine Fundamentals</h6>
<span class="status completed">Completed</span>
</div>
<p class="text-muted small">Learn engine parts and working principles.</p>
</div>
<div class="mt-3">
<button class="btn btn-purple w-100 btn-sm py-2">Review Module</button>
<!-- RIGHT COLUMN: Sidebar Statistics -->
<div class="col-lg-4 col-12">
<div class="row g-3">
<div class="col-12">
<div class="info-box d-flex align-items-center">
<div class="stat-icon"><i class="fa fa-layer-group"></i></div>
<div class="ms-3">
<h5 class="fw-bold mb-0" style="color: var(--theme-navy);">{{ $course->level ?? 'General' }}</h5>
<span class="text-muted small">Course Level</span>
</div>
</div>
</div>
</div>
<!-- Module 2 -->
<div class="col-md-6 col-12">
<div class="card module-card h-100">
<div class="card-body p-4 d-flex flex-column justify-content-between">
<div>
<div class="d-flex justify-content-between align-items-start gap-2 mb-2">
<h6 class="fw-bold text-dark mb-0">Transmission Systems</h6>
<span class="status progressing">In Progress</span>
</div>
<p class="text-muted small">Manual & Automatic transmission systems.</p>
</div>
<div class="mt-3">
<button class="btn btn-gold w-100 btn-sm py-2">Continue Learning</button>
<div class="col-12">
<div class="info-box d-flex align-items-center">
<div class="stat-icon"><i class="fa fa-clock"></i></div>
<div class="ms-3">
<h5 class="fw-bold mb-0" style="color: var(--theme-navy);">{{ $course->duration ?? 'N/A' }}</h5>
<span class="text-muted small">Course Duration</span>
</div>
</div>
</div>
</div>
<!-- Module 3 -->
<div class="col-md-6 col-12">
<div class="card module-card h-100">
<div class="card-body p-4 d-flex flex-column justify-content-between">
<div>
<div class="d-flex justify-content-between align-items-start gap-2 mb-2">
<h6 class="fw-bold text-secondary mb-0">Brake Systems</h6>
<span class="status locked"><i class="fa fa-lock me-1"></i> Locked</span>
</div>
<p class="text-muted small">Complete previous module to unlock.</p>
</div>
<div class="mt-3">
<button class="btn btn-secondary w-100 btn-sm py-2" disabled>Locked</button>
</div>
</div>
</div>
</div>
<!-- Module 4 -->
<div class="col-md-6 col-12">
<div class="card module-card h-100">
<div class="card-body p-4 d-flex flex-column justify-content-between">
<div>
<div class="d-flex justify-content-between align-items-start gap-2 mb-2">
<h6 class="fw-bold text-secondary mb-0">Hybrid Technology</h6>
<span class="status locked"><i class="fa fa-lock me-1"></i> Locked</span>
</div>
<p class="text-muted small">Learn EV and Hybrid systems.</p>
</div>
<div class="mt-3">
<button class="btn btn-secondary w-100 btn-sm py-2" disabled>Locked</button>
<div class="col-12">
<div class="info-box d-flex align-items-center">
<div class="stat-icon"><i class="fa fa-award"></i></div>
<div class="ms-3">
<h5 class="fw-bold mb-0" style="color: var(--theme-navy);">{{ $course->status ?? 'Enrolled' }}</h5>
<span class="text-muted small">Status</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div> <!-- End Row -->
<!-- RIGHT COLUMN: Sidebar Statistics -->
<div class="col-lg-4 col-12">
<div class="row g-3">
<div class="col-12">
<div class="info-box d-flex align-items-center">
<div class="stat-icon"><i class="fa fa-book"></i></div>
<div class="ms-3">
<h5 class="fw-bold mb-0" style="color: var(--purple-dark);">12</h5>
<span class="text-muted small">Modules Available</span>
</div>
</div>
</div>
@else
<div class="col-12">
<div class="info-box d-flex align-items-center">
<div class="stat-icon"><i class="fa fa-clock"></i></div>
<div class="ms-3">
<h5 class="fw-bold mb-0" style="color: var(--purple-dark);">2 Years</h5>
<span class="text-muted small">Course Duration</span>
</div>
</div>
</div>
<div class="col-12">
<div class="info-box d-flex align-items-center">
<div class="stat-icon"><i class="fa fa-award"></i></div>
<div class="ms-3">
<h5 class="fw-bold mb-0" style="color: var(--purple-dark);">NVQ Level 5</h5>
<span class="text-muted small">Qualification</span>
</div>
</div>
<!-- Empty State: When no course is assigned -->
<div class="row justify-content-center py-5">
<div class="col-md-8 text-center">
<div class="p-5 rounded-4 shadow-sm bg-white border">
<i class="fas fa-graduation-cap fa-4x text-muted mb-3"></i>
<h3 class="fw-bold text-dark mb-2">No Assigned Course Found</h3>
<p class="text-muted mb-0">You do not have any course assigned to your profile yet. Please contact the administration for assistance.</p>
</div>
</div>
</div>
</div> <!-- End Row -->
@endif
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script>
function goToModule(moduleId) {
window.location.href = "{{ url('/module') }}/" + moduleId;
}
</script>
@endsection

View File

@ -2,89 +2,144 @@
@section('content')
<style>
:root {
--primary-navy: #0F2C59;
--accent-red: #822424;
--accent-red-hover: #6a2525;
--bg-light: #F4F6F9;
--text-main: #1E293B;
--text-muted: #64748B;
--border-color: rgba(15, 44, 89, 0.1);
}
.profile-card {
border: none;
border-radius: 12px;
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important;
border: 1px solid var(--border-color);
border-radius: 16px;
box-shadow: 0 10px 30px rgba(15, 44, 89, 0.08) !important;
background: #ffffff;
overflow: hidden;
}
.profile-header {
background: linear-gradient(135deg, #3d0c3d 0%, #5c1d5c 100%);
padding: 1.25rem 1.5rem;
border-top-left-radius: 12px !important;
border-top-right-radius: 12px !important;
background: linear-gradient(135deg, var(--primary-navy) 0%, #1a3d73 100%);
padding: 1.5rem 1.75rem;
border: none;
}
.profile-info-row {
padding: 0.9rem 0;
border-bottom: 1px solid #f1f1f4;
padding: 1.1rem 0;
border-bottom: 1px solid #f1f5f9;
transition: background 0.2s ease;
}
.profile-info-row:hover {
background-color: #f8fafc;
}
.profile-info-row:last-of-type {
border-bottom: none;
}
.profile-label {
color: #6c757d;
color: var(--text-muted);
font-weight: 600;
font-size: 0.95rem;
}
.profile-value {
color: #212529;
font-weight: 500;
font-size: 0.95rem;
color: var(--text-main);
font-weight: 600;
font-size: 1rem;
}
/* ===== Theme Buttons ===== */
.btn-edit {
background-color: #5c1d5c;
color: white;
border-radius: 6px;
padding: 0.5rem 1.5rem;
font-weight: 500;
transition: all 0.2s ease;
background-color: var(--accent-red);
color: #ffffff;
border-radius: 30px;
padding: 0.6rem 2rem;
font-weight: 600;
transition: all 0.3s ease;
border: none;
text-decoration: none;
}
.btn-edit:hover {
background-color: #3d0c3d;
color: white;
box-shadow: 0 4px 10px rgba(92, 29, 92, 0.3);
background-color: var(--accent-red-hover);
color: #ffffff;
box-shadow: 0 6px 15px rgba(130, 36, 36, 0.3);
transform: translateY(-2px);
}
.btn-save {
background-color: var(--accent-red);
color: #ffffff;
border-radius: 6px;
font-weight: 600;
padding: 0.5rem 1.5rem;
border: none;
transition: all 0.2s ease;
}
.btn-save:hover {
background-color: var(--accent-red-hover);
color: #ffffff;
}
/* Form & Input Enhancements */
.form-control:focus {
border-color: var(--primary-navy);
box-shadow: 0 0 0 0.25rem rgba(15, 44, 89, 0.15);
}
</style>
<div class="container mt-5 mb-5">
<div class="container py-5">
<div class="row justify-content-center">
<div class="col-md-8">
@if(session('success'))
<div class="alert alert-success alert-dismissible fade show mb-4" role="alert" style="border-radius: 8px;">
<i class="bi bi-check-circle-fill me-2"></i> {{ session('success') }}
{{-- Alert Success Message --}}
@if(session('success'))
<div class="alert alert-success alert-dismissible fade show mb-4 border-0 shadow-sm" role="alert" style="border-radius: 10px; background-color: #d1e7dd; color: #0f5132;">
<i class="fa-solid fa-circle-check me-2"></i> {{ session('success') }}
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>
@endif
{{-- Main Profile Card --}}
<div class="card profile-card">
<!-- Purple Header -->
<div class="card-header profile-header text-white">
<h4 class="mb-0 fw-bold" style="font-size: 1.25rem;">User Profile Dashboard</h4>
<!-- Navy Header -->
<div class="card-header profile-header text-white d-flex align-items-center justify-content-between">
<h4 class="mb-0 fw-bold" style="font-size: 1.25rem; letter-spacing: 0.02em;">
<i class="fa-solid fa-user-gear me-2"></i>User Profile Dashboard
</h4>
<span class="badge bg-light text-dark fw-semibold px-3 py-2 rounded-pill small">Active Student</span>
</div>
<div class="card-body p-4">
<!-- Name -->
<div class="row profile-info-row align-items-center">
<div class="col-md-4 profile-label">Full Name:</div>
<div class="col-md-8 profile-value">{{ $user->first_name . ' ' . $user->last_name }}</div>
</div>
<div class="card-body p-4 p-md-5">
<!-- Email -->
<!-- Full Name -->
<div class="row profile-info-row align-items-center">
<div class="col-md-4 profile-label">Email Address:</div>
<div class="col-md-4 profile-label">
<i class="fa-solid fa-id-card me-2 " style="color: #822424;"></i>Full Name:
</div>
<div class="col-md-8 profile-value">{{ $user->first_name . ' ' . $user->last_name }}</div>
</div>
<!-- Email Address -->
<div class="row profile-info-row align-items-center">
<div class="col-md-4 profile-label">
<i class="fa-solid fa-envelope me-2 " style="color: #822424;"></i>Email Address:
</div>
<div class="col-md-8 profile-value">{{ $user->email }}</div>
</div>
<!-- Phone -->
<!-- Phone Number -->
<div class="row profile-info-row align-items-center">
<div class="col-md-4 profile-label">Phone Number:</div>
<div class="col-md-4 profile-label">
<i class="fa-solid fa-phone me-2 " style="color: #822424;"></i>Phone Number:
</div>
<div class="col-md-8 profile-value">
{{ $user->phone ?? 'Not Provided' }}
</div>
@ -92,7 +147,9 @@
<!-- Created At -->
<div class="row profile-info-row align-items-center">
<div class="col-md-4 profile-label">Account Created:</div>
<div class="col-md-4 profile-label">
<i class="fa-solid fa-calendar-plus me-2 t " style="color: #822424;"></i>Account Created:
</div>
<div class="col-md-8 profile-value text-muted">
{{ $user->created_at ? $user->created_at->format('Y-m-d H:i') : 'N/A' }}
</div>
@ -100,44 +157,42 @@
<!-- Updated At -->
<div class="row profile-info-row align-items-center">
<div class="col-md-4 profile-label">Last Updated:</div>
<div class="col-md-4 profile-label">
<i class="fa-solid fa-clock-rotate-left me-2 " style="color: #822424;"></i>Last Updated:
</div>
<div class="col-md-8 profile-value text-muted">
{{ $user->updated_at ? $user->updated_at->format('Y-m-d H:i') : 'N/A' }}
</div>
</div>
<!-- Edit Button -->
<div class="mt-4 text-end">
<!-- <a href="#" class="btn btn-edit">Edit Profile</a> -->
<div class="mt-4 text-end">
<button type="button" class="btn btn-edit" data-bs-toggle="modal" data-bs-target="#editProfileModal">
Edit Profile
</button>
</div>
<!-- Edit Profile Trigger Button -->
<div class="mt-4 pt-2 text-end">
<button type="button" class="btn btn-edit shadow-sm" data-bs-toggle="modal" data-bs-target="#editProfileModal">
<i class="fa-solid fa-pen-to-square me-2"></i>Edit Profile
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
@endsection
{{-- ===================== EDIT PROFILE MODAL ===================== --}}
<div class="modal fade" id="editProfileModal" tabindex="-1" aria-labelledby="editProfileModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content" style="border-radius: 12px; overflow: hidden;">
<div class="modal-content border-0 shadow-lg" style="border-radius: 16px; overflow: hidden;">
<!-- Modal Header (Oyage purple theme ekata match kala) -->
<div class="modal-header text-white" style="background: linear-gradient(135deg, #3d0c3d 0%, #5c1d5c 100%);">
<h5 class="modal-title fw-bold" id="editProfileModalLabel">Update Profile Details</h5>
<!-- Modal Header (Navy Theme) -->
<div class="modal-header text-white" style="background: linear-gradient(135deg, #0F2C59 0%, #1a3d73 100%);">
<h5 class="modal-title fw-bold fs-6" id="editProfileModalLabel">
<i class="fa-solid fa-user-pen me-2"></i>Update Profile Details
</h5>
<button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<!-- Update Form -->
<form action="{{ route('profile.update') }}" method="POST">
@csrf
@method('PUT')
@ -146,31 +201,32 @@
<!-- First Name Input -->
<div class="mb-3">
<label for="first_name" class="form-label fw-bold" style="color: #6c757d;">First Name</label>
<input type="text" class="form-control" id="first_name" name="first_name" value="{{ $user->first_name }}" required>
<label for="first_name" class="form-label fw-semibold small" style="color: var(--text-muted);">First Name</label>
<input type="text" class="form-control form-control-lg fs-6" id="first_name" name="first_name" value="{{ $user->first_name }}" required>
</div>
<!-- Last Name Input -->
<div class="mb-3">
<label for="last_name" class="form-label fw-bold" style="color: #6c757d;">Last Name</label>
<input type="text" class="form-control" id="last_name" name="last_name" value="{{ $user->last_name }}" required>
<label for="last_name" class="form-label fw-semibold small" style="color: var(--text-muted);">Last Name</label>
<input type="text" class="form-control form-control-lg fs-6" id="last_name" name="last_name" value="{{ $user->last_name }}" required>
</div>
<!-- Phone Input -->
<div class="mb-3">
<label for="phone" class="form-label fw-bold" style="color: #6c757d;">Phone Number</label>
<input type="text" class="form-control" id="phone" name="phone" value="{{ $user->phone }}">
<label for="phone" class="form-label fw-semibold small" style="color: var(--text-muted);">Phone Number</label>
<input type="text" class="form-control form-control-lg fs-6" id="phone" name="phone" value="{{ $user->phone }}">
</div>
</div>
<!-- Modal Footer Buttons -->
<div class="modal-footer bg-light">
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn text-white" style="background-color: #5c1d5c;">Save Changes</button>
<!-- Modal Footer -->
<div class="modal-footer bg-light px-4">
<button type="button" class="btn btn-secondary border-0 rounded-3" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-save rounded-3">Save Changes</button>
</div>
</form>
</div>
</div>
</div>
</div>
@endsection

View File

@ -4,525 +4,420 @@
@section('content')
<style>
<!-- Bootstrap 5 -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
body{
background:#f6f7fb;
<!-- Font Awesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
<!-- Google Font -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<!-- html2pdf Library for Client-side PDF Generation -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js"></script>
<style>
:root {
--theme-navy: #2D355B; /* Primary Navy */
--theme-navy-dark: #1F2541; /* Dark Navy */
--theme-red: #822424; /* Primary Accent Red */
--theme-red-hover: #df2c3e; /* Red Hover */
--theme-yellow: #FFEA85; /* Accent Yellow/Gold */
--bg-light: #F6F6F6; /* Page Background */
--white: #ffffff;
}
body {
font-family: 'Poppins', sans-serif;
background: var(--bg-light);
}
/* =======================
Hero
Hero Section
======================= */
.result-hero{
background:linear-gradient(135deg,#5E244E,#4a1c3e);
color:#fff;
border-radius:20px;
padding:40px;
margin-bottom:30px;
box-shadow:0 15px 35px rgba(0,0,0,.15);
.result-hero {
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
color: var(--white);
border-radius: 16px;
padding: 35px 30px;
margin-bottom: 30px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
border-left: 5px solid var(--theme-red);
}
.result-hero h2{
font-weight:700;
.result-hero h2 {
font-weight: 700;
}
.result-hero p{
color:#ddd;
margin-bottom:0;
.result-hero p {
color: rgba(255, 255, 255, 0.85);
margin-bottom: 0;
}
/* =======================
Summary Cards
======================= */
.summary-card{
background:#fff;
border:none;
border-radius:20px;
padding:25px;
text-align:center;
box-shadow:0 10px 25px rgba(0,0,0,.08);
transition:.3s;
.summary-card {
background: var(--white);
border: 1px solid #e2e8f0;
border-radius: 16px;
padding: 25px;
text-align: center;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
transition: all 0.3s ease;
}
.summary-card:hover{
transform:translateY(-5px);
.summary-card:hover {
transform: translateY(-4px);
border-color: var(--theme-navy);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
}
.summary-card i{
font-size:40px;
color:#5E244E;
margin-bottom:15px;
.summary-card i {
font-size: 36px;
color: var(--theme-red);
margin-bottom: 12px;
}
.summary-card h3{
color:#5E244E;
font-weight:700;
.summary-card h3 {
color: var(--theme-navy);
font-weight: 700;
margin-bottom: 4px;
}
.summary-card small{
color:#777;
.summary-card small {
color: #64748b;
font-weight: 500;
}
/* =======================
Result Table
======================= */
.result-card{
margin-top:35px;
background:#fff;
border-radius:20px;
overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,.08);
.result-card {
margin-top: 30px;
background: var(--white);
border: 1px solid #e2e8f0;
border-radius: 16px;
overflow: hidden;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
}
.table-head{
background:#5E244E;
color:#fff;
padding:18px 25px;
.table-head {
background: var(--theme-navy);
color: var(--white);
padding: 18px 25px;
}
.table{
margin-bottom:0;
.table {
margin-bottom: 0;
}
.table th{
background:#744a68;
color:#fff;
border:none;
.table th {
background: #f8fafc;
color: var(--theme-navy);
font-weight: 600;
border-bottom: 2px solid #e2e8f0;
padding: 14px 20px;
}
.table td{
vertical-align:middle;
.table td {
vertical-align: middle;
padding: 14px 20px;
}
.grade{
padding:7px 15px;
border-radius:30px;
font-weight:600;
color:#fff;
display:inline-block;
.grade {
padding: 5px 14px;
border-radius: 30px;
font-weight: 600;
font-size: 13px;
color: var(--white);
display: inline-block;
}
.a{
background:#28a745;
.grade.a {
background: var(--theme-navy);
}
.b{
background:#17a2b8;
.grade.b {
background: var(--theme-red);
}
.c{
background:#ffc107;
color:#222;
.grade.c {
background: #e67e22;
}
.fail{
.grade.fail {
background: #dc3545;
}
background:#dc3545;
.status-pass {
color: #198754;
font-weight: 600;
}
.status-fail {
color: #dc3545;
font-weight: 600;
}
/* =======================
Progress
======================= */
.progress {
height: 10px;
border-radius: 20px;
background-color: #e2e8f0;
}
.progress{
.progress-bar-navy {
background-color: var(--theme-navy) !important;
}
height:10px;
border-radius:20px;
.progress-bar-red {
background-color: var(--theme-red) !important;
}
.align-items-stretch {
align-items: stretch !important;
padding-top: 38px;
}
/* =======================
Download
Download Card
======================= */
.download-card{
margin-top:30px;
background:#4a1c3e;
color:#fff;
border-radius:20px;
padding:30px;
display:flex;
justify-content:space-between;
align-items:center;
flex-wrap:wrap;
.download-card {
margin-top: 30px;
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
color: var(--white);
border-radius: 16px;
padding: 30px;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 15px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
}
.download-card h4{
color:#d4af37;
font-weight:700;
.download-card h4 {
color: var(--theme-yellow);
font-weight: 700;
margin-bottom: 6px;
}
.btn-result{
background:#d4af37;
color:#fff;
border:none;
border-radius:50px;
padding:12px 30px;
font-weight:600;
.btn-result {
background-color: var(--theme-red) !important;
color: var(--white) !important;
border: none;
border-radius: 8px;
padding: 10px 24px;
font-weight: 600;
transition: all 0.2s ease;
}
.btn-result:hover{
background:#c49d20;
color:#fff;
.btn-result:hover {
background-color: var(--theme-red-hover) !important;
color: var(--white) !important;
}
@media(max-width:768px) {
.result-hero {
padding: 25px;
}
}
</style>
<div class="container py-4">
<!-- Hero -->
<div class="result-hero">
<h2>
<i class="fas fa-award"></i>
Academic Results
</h2>
<p>
View your examination results and academic performance.
</p>
</div>
<!-- Summary -->
<div class="row">
<div class="col-md-4 mb-4">
<div class="summary-card">
<i class="fas fa-chart-line"></i>
<h3>82%</h3>
<small>Overall Average</small>
</div>
</div>
<div class="col-md-4 mb-4">
<div class="summary-card">
<i class="fas fa-medal"></i>
<h3>3.65</h3>
<small>Current GPA</small>
</div>
</div>
<div class="col-md-4 mb-4">
<div class="summary-card">
<i class="fas fa-book"></i>
<h3>6 / 6</h3>
<small>Modules Passed</small>
</div>
</div>
</div>
<!-- Result Table -->
<div class="result-card">
<div class="table-head">
<h4 class="mb-0">
Semester Results
</h4>
</div>
<table class="table table-hover">
<thead>
<tr>
<th>Module</th>
<th>Marks</th>
<th>Grade</th>
<th>Status</th>
</tr>
</thead>
<tbody>
<tr>
<td>Engine Technology</td>
<td>91</td>
<td>
<span class="grade a">
A+
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Brake Systems</td>
<td>84</td>
<td>
<span class="grade a">
A
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Electrical Systems</td>
<td>79</td>
<td>
<span class="grade b">
B+
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Transmission Systems</td>
<td>74</td>
<td>
<span class="grade b">
B
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Workshop Practice</td>
<td>88</td>
<td>
<span class="grade a">
A
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Industrial Safety</td>
<td>81</td>
<td>
<span class="grade a">
A-
</span>
</td>
<td>Pass</td>
</tr>
</tbody>
</table>
</div>
<!-- Performance -->
<div class="result-card mt-4">
<div class="table-head">
<h4 class="mb-0">
Overall Performance
</h4>
</div>
<div class="p-4">
<p class="mb-2">
Course Completion
<!-- Printable Area Container -->
<div id="pdf-download-area">
<!-- Hero Section -->
<div class="result-hero">
<h2>
<i class="fas fa-award me-2" style="color: var(--theme-yellow);"></i>
Academic Results
</h2>
<p>
View your examination results and overall academic performance.
</p>
</div>
<div class="progress mb-4">
<!-- Summary Cards -->
<div class="row g-4">
<div class="col-md-4">
<div class="summary-card">
<i class="fas fa-chart-line"></i>
<h3>{{ $averageMarks ?? 0 }}%</h3>
<small>Overall Average</small>
</div>
</div>
<div class="progress-bar bg-success"
<div class="col-md-4">
<div class="summary-card">
<i class="fas fa-medal"></i>
<h3>{{ $gpa ?? '3.65' }}</h3>
<small>Current GPA</small>
</div>
</div>
style="width:82%">
<div class="col-md-4">
<div class="summary-card">
<i class="fas fa-book-open"></i>
<h3>{{ $passedModules ?? 0 }} / {{ $totalModules ?? 0 }}</h3>
<small>Modules Passed</small>
</div>
</div>
</div>
<!-- Result Table -->
<div class="result-card">
<div class="table-head d-flex justify-content-between align-items-center">
<h5 class="mb-0 fw-bold">
Semester Results
</h5>
@if(isset($results) && $results->isNotEmpty())
<span class="badge bg-light text-dark">
{{ optional($results->first())->academic_year }} | {{ optional($results->first())->semester }}
</span>
@endif
</div>
<div class="table-responsive">
<table class="table table-hover align-middle">
<thead>
<tr>
<th>Module Code</th>
<th>Module Name</th>
<th>Marks</th>
<th>Grade</th>
<th>Status</th>
</tr>
</thead>
<tbody>
@forelse ($results ?? [] as $item)
<tr>
<td class="fw-bold" style="color: var(--theme-navy);">{{ $item->module_code }}</td>
<td class="fw-semibold">{{ $item->module_name }}</td>
<td>{{ $item->marks }}</td>
<td>
@php
$gradeClass = 'b';
$upperGrade = strtoupper($item->grade ?? '');
if(str_contains($upperGrade, 'A')) {
$gradeClass = 'a';
} elseif(str_contains($upperGrade, 'F')) {
$gradeClass = 'fail';
} elseif(str_contains($upperGrade, 'C')) {
$gradeClass = 'c';
}
@endphp
<span class="grade {{ $gradeClass }}">{{ $item->grade }}</span>
</td>
<td>
@if(strtolower($item->status ?? '') == 'pass')
<span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span>
@else
<span class="status-fail"><i class="fas fa-times-circle me-1"></i>Fail</span>
@endif
</td>
</tr>
@empty
<tr>
<td colspan="5" class="text-center py-4 text-muted">
<i class="fas fa-info-circle me-1"></i> No result records found for your account.
</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
<!-- Performance & Download Section (Side by Side) -->
<div class="row g-4 align-items-stretch">
<!-- Overall Performance Card -->
<div class="col-md-6">
<div class="result-card h-100 mt-0">
<div class="table-head">
<h5 class="mb-0 fw-bold">
Overall Performance
</h5>
</div>
<div class="p-4 d-flex flex-column justify-content-center">
<div class="d-flex justify-content-between mb-2">
<span class="fw-semibold" style="color: var(--theme-navy);">Course Completion</span>
<span class="fw-bold" style="color: var(--theme-navy);">{{ $averageMarks ?? 0 }}%</span>
</div>
<div class="progress mb-4">
<div class="progress-bar progress-bar-navy" style="width: {{ $averageMarks ?? 0 }}%"></div>
</div>
<div class="d-flex justify-content-between mb-2">
<span class="fw-semibold" style="color: var(--theme-navy);">Attendance Score</span>
<span class="fw-bold" style="color: var(--theme-red);">90%</span>
</div>
<div class="progress">
<div class="progress-bar progress-bar-red" style="width: 90%"></div>
</div>
</div>
</div>
</div>
<p class="mb-2">
Attendance Score
</p>
<div class="progress">
<div class="progress-bar bg-warning"
style="width:90%">
<!-- Download Section Card -->
<div class="col-md-6">
<div class="download-card h-100 mt-0 flex-column justify-content-between align-items-start text-start">
<div>
<h4 class="mb-3">Download Official Result Sheet</h4>
<p class="mb-4">
Get your latest semester examination results in official PDF format.
</p>
</div>
<button id="download-pdf-btn" onclick="generatePDF()" class="btn btn-result shadow-sm w-100">
<i class="fas fa-download me-2"></i>Download PDF
</button>
</div>
</div>
</div>
<!-- Download -->
<div class="download-card">
<div>
<h4>
Download Official Result Sheet
</h4>
<p class="mb-0">
Download your latest semester examination results in PDF format.
</p>
</div>
<button class="btn btn-result">
<i class="fas fa-download"></i>
Download PDF
</button>
</div>
</div>
<!-- JavaScript to handle PDF Download -->
<script>
function generatePDF() {
const element = document.getElementById('pdf-download-area');
const button = document.getElementById('download-pdf-btn');
button.disabled = true;
button.innerHTML = '<i class="fas fa-spinner fa-spin me-2"></i>Generating PDF...';
const options = {
margin: [10, 10, 10, 10],
filename: 'Official_Result_Sheet.pdf',
image: { type: 'jpeg', quality: 0.98 },
html2canvas: { scale: 2, useCORS: true },
jsPDF: { unit: 'mm', format: 'a4', orientation: 'portrait' }
};
html2pdf().set(options).from(element).save().then(() => {
button.disabled = false;
button.innerHTML = '<i class="fas fa-download me-2"></i>Download PDF';
}).catch(err => {
console.error(err);
button.disabled = false;
button.innerHTML = '<i class="fas fa-download me-2"></i>Download PDF';
});
}
</script>
@endsection

View File

@ -3,26 +3,50 @@
@section('title', 'Student Login')
@push('styles')
<!-- Google Font -->
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
body {
background: #f5f7fb;
:root {
--theme-navy: #2D355B; /* Primary Navy */
--theme-navy-dark: #1F2541; /* Dark Navy */
--theme-red: #822424; /* Primary Accent Red */
--theme-red-hover: #df2c3e; /* Red Hover */
--theme-yellow: #FFEA85; /* Accent Yellow/Gold */
--bg-light: #F6F6F6; /* Page Background */
--white: #ffffff;
}
* {
font-family: 'Arial', Helvetica, sans-serif;
transform: scale(0.95);
body {
background: var(--bg-light);
font-family: 'Poppins', sans-serif;
}
/* LEFT PANEL */
.left-panel {
min-height: 100vh;
background: #f8f9fa;
background: linear-gradient(135deg, var(--theme-navy) 0%, var(--theme-navy-dark) 100%);
display: flex;
justify-content: center;
align-items: center;
color: var(--white);
border-right: 5px solid var(--theme-red);
}
.left-panel img {
max-width: 450px;
max-width: 400px;
filter: drop-shadow(0 10px 15px rgba(0,0,0,0.3));
}
.left-panel h2 {
color: var(--white);
font-size: 28px;
margin-top: 20px;
}
.left-panel p {
color: rgba(255, 255, 255, 0.8);
font-size: 15px;
}
/* RIGHT PANEL */
@ -32,106 +56,103 @@
justify-content: center;
align-items: center;
padding: 40px;
background: var(--bg-light);
scale: 0.7;
}
/* LOGIN BOX */
.box {
width: 100%;
max-width: 500px;
background: #ffffff;
padding: 45px;
border-radius: 18px;
box-shadow: 0 15px 40px rgba(0,0,0,0.12);
max-width: 480px;
background: var(--white);
padding: 45px 40px;
border-radius: 16px;
box-shadow: 0 10px 30px rgba(31, 37, 65, 0.08);
border: 1px solid #e2e8f0;
}
/* TITLE */
.headline {
text-align: center;
font-size: 32px;
font-size: 28px;
font-weight: 700;
color: #222;
color: var(--theme-navy);
margin-bottom: 35px;
}
/* INPUT */
/* INPUT CONTAINER */
.input-container {
position: relative;
margin-bottom: 25px;
font-size: 22px;
font-family: arial;
margin-bottom: 28px;
}
.input-container input {
width: 100%;
height: 50px;
padding: 12px 0;
height: 48px;
padding: 10px 0 5px 0;
border: none;
border-bottom: 2px solid #ddd;
border-bottom: 2px solid #cbd5e1;
background: transparent;
outline: none;
font-size: 22px;
font-family: arial;
font-size: 16px;
color: #1e293b;
transition: all 0.3s ease;
}
.input-container label {
position: absolute;
top: 15px;
top: 12px;
left: 0;
color: #744a68;
transition: .3s;
color: #64748b;
transition: 0.3s ease;
pointer-events: none;
font-size: 22px;
font-family: arial;
font-size: 15px;
}
/* FLOATING LABEL & VALIDATION STATES */
.input-container input:focus,
.input-container input:valid {
border-bottom-color: #744a68;
font-size: 20px;
font-family: arial;
.input-container input:focus {
border-bottom-color: var(--theme-navy);
}
.input-container input:focus + label,
.input-container input:not(:placeholder-shown) + label {
top: -12px;
font-size: 12px;
color: #744a68;
color: var(--theme-navy);
font-weight: 600;
}
/* FORGOT PASSWORD */
.forgot-link {
color: #744a68;
font-size: 16px;
color: var(--theme-red);
font-size: 14px;
text-decoration: none;
font-weight: 500;
padding-left: 37%;
transition: color 0.2s ease-in-out;
}
.forgot-link:hover {
text-decoration: underline;
color: #5E244E;
color: var(--theme-red-hover);
}
/* BUTTON */
.btn-primary {
height: 50px;
height: 48px;
width: 100%;
font-size: 16px;
font-weight: 600;
background: #5E244E;
background: var(--theme-red) !important;
border: none;
color: white;
/* border-radius: 8px; */
transition: background 0.2s ease-in-out, transform 0.1s ease;
color: var(--white) !important;
border-radius: 8px;
transition: all 0.2s ease;
}
.btn-primary:hover, .btn-primary:focus {
background: #4a1c3e;
color: white;
background: #822424 !important;
box-shadow: 0 4px 12px rgba(130, 36, 36, 0.3);
}
.btn-primary:active {
@ -141,22 +162,25 @@
/* BOTTOM TEXT */
.dontacc {
text-align: center;
margin-top: 15px;
}
.dontacc p {
color: #666;
color: #64748b;
font-size: 14px;
}
.dontacc a {
color: #744a68;
color: var(--theme-navy);
text-decoration: none;
font-weight: 600;
font-size: 16px;
font-family: arial;
font-size: 15px;
transition: color 0.2s ease;
}
.dontacc a:hover {
text-decoration: underline;
color: var(--theme-navy-dark);
}
/* RESPONSIVE DESIGN */
@ -171,14 +195,11 @@
}
.box {
padding: 30px;
padding: 35px 25px;
}
.headline {
font-size: 28px;
color: #5E244E;
font-weight: bold;
font-family: Arial;
font-size: 24px;
}
}
</style>
@ -188,17 +209,9 @@
<div class="container-fluid">
<div class="row min-vh-100">
<!-- <div class="col-lg-6 left-panel">
<div class="text-center">
<img src="{{ asset('images/login-banner.png') }}" class="img-fluid mb-4" alt="Automobile Engineering Academy">
<h2 class="fw-bold">Automobile Engineering Academy</h2>
<p class="text-muted px-5">
Driving Innovation Through Education, Research and Technology.
</p>
</div>
</div> -->
<div class="col-lg-6 right-panel">
<div class="col-lg-6 right-panel col-12 mx-auto">
<div class="box">
<h2 class="headline">Student Sign In</h2>
@ -221,17 +234,16 @@
@enderror
</div>
<button type="submit" class="btn btn-primary mb-4">
<button type="submit" class="btn btn-primary mb-4 shadow-sm">
Sign In
</button>
<div class="d-flex justify-content-end mb-4" style="gap: 10px;padding-top: 10px; padding-left: 190px;">
<div class="d-flex justify-content-end mb-4">
<a href="{{ url('/password/reset') }}" class="forgot-link">Forgot Password?</a>
</div>
<div class="dontacc" style="padding-top: 10px; " >
<div class="dontacc">
<!-- <p class="mb-1">Don't have an account?</p> -->
<a href="{{ url('/signup') }}">Create Student Account</a>
</div>

View File

@ -37,6 +37,7 @@
padding: 45px;
border-radius: 18px;
box-shadow: 0 15px 40px rgba(0,0,0,0.12);
scale : 0.72
}
/* TITLE */
@ -109,14 +110,14 @@
width: 100%;
font-size: 16px;
font-weight: 600;
background: #5E244E;
background: #822424;
border: none;
color: white;
transition: background 0.2s ease-in-out, transform 0.1s ease;
}
.btn-primary:hover, .btn-primary:focus {
background: #4a1c3e;
background: #822424;
color: white;
}

View File

@ -5,74 +5,93 @@
@section('content')
<style>
:root{
--primary:#5E244E;
--secondary:#8B3A74;
--light:#f8f4f7;
:root {
/* Premium Modern Automotive Palette matched from previous page */
--primary: #3E51B8; /* Tech Blue */
--primary-light: #0a67df; /* Vibrant Electric Blue */
--secondary: #BC1A1A; /* Deep Racing Red */
--secondary-hover: #822424; /* Dark Burnt Red */
--accent-dark: #753939; /* Muted Crimson */
--accent-orange: #e36414; /* Warning/Industrial Orange */
--accent-yellow: #FFE618; /* High-Visibility Electric Yellow */
--bg-light: #F8FAFC; /* Soft slate light gray */
/* Semantic Adjustments */
--text-main: #1E293B; /* Slate dark grey */
--text-muted: #64748B; /* Neutral gray */
--card-border: rgba(62, 81, 184, 0.1);
}
body {
font-family: Arial, Helvetica, sans-serif;
font-family: 'Segoe UI', Arial, sans-serif;
color: var(--text-main);
}
.hero{
background:linear-gradient(rgba(0,0,0,.65),rgba(0,0,0,.65)),
.hero {
background: linear-gradient(rgba(214, 218, 238, 0.85), rgba(0, 0, 0, 0.6)),
url('https://images.pexels.com/photos/3802510/pexels-photo-3802510.jpeg');
background-size:cover;
background-position:center;
color:#fff;
padding:80px 0;
text-align:center;
background-size: cover;
background-position: center;
color: #fff;
padding: 80px 0;
text-align: center;
height: 480px;
}
.portal-card{
border:none;
border-radius:15px;
transition:.4s cubic-bezier(0.165, 0.84, 0.44, 1);
box-shadow:0 5px 20px rgba(0,0,0,.08);
border: 1px solid #efeff4;
.portal-card {
border: none;
border-radius: 15px;
transition: .4s cubic-bezier(0.165, 0.84, 0.44, 1);
box-shadow: 0 5px 20px rgba(0,0,0,.04);
border: 1px solid var(--card-border);
cursor: pointer;
}
.portal-card:hover{
transform:translateY(-8px);
border-color: var(--primary);
box-shadow: 0 15px 30px rgba(94, 36, 78, 0.1);
.portal-card:hover {
transform: translateY(-8px);
border-color: #5f3131;
box-shadow: 0 15px 30px rgba(62, 81, 184, 0.12);
}
.portal-icon{
width:70px;
height:70px;
background:#5E244E;
color:#fff;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:28px;
margin:auto;
.portal-icon {
width: 70px;
height: 70px;
background: #822a32;
color: #fcfcfc;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
font-size: 28px;
margin: auto;
transition: 0.4s ease;
}
.portal-card:hover .portal-icon {
background: var(--secondary);
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
transform: scale(1.1);
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.3);
color: #ffed8b;
}
.btn-portal{
background:#5E244E;
color:#fff;
padding:12px 35px;
border: none;
.btn-portal {
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
color: #fff;
padding: 12px 35px;
border-radius: 8px;
font-weight: 600;
transition: all 0.3s ease;
}
.btn-portal:hover{
background:#8B3A74;
color:#fff;
.btn-portal:hover {
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
color: #f4ff8d;
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(94, 36, 78, 0.3);
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.3);
}
.btn:hover {
border-color: rgba(255, 255, 255, 0.98);
}
.modal-content {
@ -81,8 +100,6 @@ body {
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
}
.modal.fade .modal-dialog {
transform: scale(0.85);
transition: transform 0.3s ease-out;
@ -131,14 +148,14 @@ body {
}
.form-control:focus {
border-color: var(--secondary);
box-shadow: 0 0 0 4px rgba(139, 58, 116, 0.12);
border-color: var(--primary-light);
box-shadow: 0 0 0 4px rgba(10, 103, 223, 0.15);
outline: 0;
}
.input-group:focus-within .input-group-text {
border-color: var(--secondary);
color: var(--secondary);
border-color: var(--primary-light);
color: var(--primary-light);
}
.modal-footer {
@ -170,22 +187,29 @@ body {
border: none;
font-weight: 600;
padding: 10px 0;
box-shadow: 0 4px 12px rgba(94, 36, 78, 0.2);
box-shadow: 0 4px 12px rgba(62, 81, 184, 0.2);
transition: all 0.2s;
width: 100%;
border-radius: 8px;
}
.btn-modal-login:hover {
background: var(--secondary);
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%);
color: #fff;
transform: translateY(-1px);
box-shadow: 0 6px 15px rgba(94, 36, 78, 0.3);
box-shadow: 0 6px 15px rgba(188, 26, 26, 0.3);
}
/* ========================================================
Custom CSS Scroll Animations
======================================================== */
.bg-light {
background: linear-gradient(rgba(162, 190, 255, 0.49), rgba(237, 235, 255, 0.9)), url('https://images.pexels.com/photos/3807277/pexels-photo-3807277.jpeg?auto=compress&cs=tinysrgb&w=1600');
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
color: white;
}
/* Scroll Animations */
.animate-item {
opacity: 0;
will-change: transform, opacity;
@ -210,8 +234,9 @@ body {
}
</style>
<!-- HERO SECTION -->
<section class="hero">
<div class="container">
<div class="container" style="padding-top: 46px;">
<div class="animate-item animated fade-up-init">
<h1 class="fw-bold display-5">Student Portal</h1>
<p class="mt-3 fs-5" style="max-width: 700px; margin: auto;">
@ -236,7 +261,6 @@ body {
</p>
</div>
<div class="row g-4 animate-item fade-in-init">
<div class="col-md-4">
<div class="card portal-card h-100 text-center p-4" onclick="studentlogin()">
@ -301,25 +325,112 @@ body {
</div>
</section>
<!-- QUICK LINKS -->
<section class="py-5 bg-light overflow-hidden">
<div class="container">
<div class="text-center mb-5 animate-item fade-up-init" onclick="studentlogin()">
<h2 class="fw-bold">Quick Links</h2>
</div>
<!-- QUICK LINKS (FIXED WITH FONTAWESOME ICONS & RESPONSIVE LAYOUT) -->
<section class="py-5 position-relative overflow-hidden"
style=" background-size: cover; background-position: center; background-repeat: no-repeat; background-attachment: fixed; min-height: 25vh; display: flex; align-items: center;">
<div class="container py-4">
<div class="row justify-content-center">
<div class="col-12 col-md-8 col-lg-6" style="width:100%">
<!-- Main Container Card (White Box with Blur) -->
<div class="p-4 p-md-5 rounded-4 shadow-lg text-dark"
style="background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(15px); border: 1px solid rgba(255, 255, 255, 0.5);">
<!-- Header Area -->
<div class="d-flex justify-content-between align-items-center mb-4 pb-2 border-bottom">
<div>
<h3 class="fw-bold m-0 text-dark">Quick Links</h3>
<p class="text-muted small m-0">Access important student portals and resources</p>
</div>
</div>
<div class="row text-center animate-item slide-right-init" onclick="studentlogin()">
<div class="col-md-3 mb-3">
<a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Academic Calendar</a>
</div>
<div class="col-md-3 mb-3">
<a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Student Handbook</a>
</div>
<div class="col-md-3 mb-3">
<a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Examination Notices</a>
</div>
<div class="col-md-3 mb-3">
<a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Contact Support</a>
<!-- Links List Container -->
<div class="d-flex flex-column gap-3">
<!-- Item 1 -->
<a href="#" class="text-decoration-none text-dark p-3 rounded-3 d-flex align-items-center justify-content-between transition-all custom-list-item"
style="background: rgba(255, 255, 255, 0.7); border: 1px solid rgba(0, 0, 0, 0.05); transition: all 0.3s ease;"
onmouseover="this.style.background='#ffffff'; this.style.transform='translateX(5px)'; this.style.boxShadow='0 5px 15px rgba(0,0,0,0.08)';"
onmouseout="this.style.background='rgba(255, 255, 255, 0.7)'; this.style.transform='translateX(0)'; this.style.boxShadow='none';" onclick="studentlogin()">
<div class="d-flex align-items-center gap-3">
<div class="rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
style="width: 48px; height: 48px; background-color: rgb(108, 55, 55); color: #fff;">
<i class="fa-solid fa-calendar-days fs-5"></i>
</div>
<div>
<h6 class="fw-bold mb-0 text-dark">Academic Calendar</h6>
<small class="text-muted">Schedules & important dates</small>
</div>
</div>
<span class="btn btn-sm btn-outline-dark rounded-pill px-3 ms-2">Open</span>
</a>
<!-- Item 2 -->
<a href="#" class="text-decoration-none text-dark p-3 rounded-3 d-flex align-items-center justify-content-between transition-all custom-list-item"
style="background: rgba(255, 255, 255, 0.7); border: 1px solid rgba(0, 0, 0, 0.05); transition: all 0.3s ease;"
onmouseover="this.style.background='#ffffff'; this.style.transform='translateX(5px)'; this.style.boxShadow='0 5px 15px rgba(0,0,0,0.08)';"
onmouseout="this.style.background='rgba(255, 255, 255, 0.7)'; this.style.transform='translateX(0)'; this.style.boxShadow='none';" onclick="studentlogin()">
<div class="d-flex align-items-center gap-3">
<div class="rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
style="width: 48px; height: 48px; background-color: rgb(108, 55, 55); color: #fff;">
<i class="fa-solid fa-book-bookmark fs-5"></i>
</div>
<div>
<h6 class="fw-bold mb-0 text-dark">Student Handbook</h6>
<small class="text-muted">Rules, guidelines & policies</small>
</div>
</div>
<span class="btn btn-sm btn-outline-dark rounded-pill px-3 ms-2">View</span>
</a>
<!-- Item 3 -->
<a href="#" class="text-decoration-none text-dark p-3 rounded-3 d-flex align-items-center justify-content-between transition-all custom-list-item"
style="background: rgba(255, 255, 255, 0.7); border: 1px solid rgba(0, 0, 0, 0.05); transition: all 0.3s ease;"
onmouseover="this.style.background='#ffffff'; this.style.transform='translateX(5px)'; this.style.boxShadow='0 5px 15px rgba(0,0,0,0.08)';"
onmouseout="this.style.background='rgba(255, 255, 255, 0.7)'; this.style.transform='translateX(0)'; this.style.boxShadow='none';" onclick="studentlogin()">
<div class="d-flex align-items-center gap-3">
<div class="rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
style="width: 48px; height: 48px; background-color: rgb(108, 55, 55); color: #fff;">
<i class="fa-solid fa-file-lines fs-5"></i>
</div>
<div>
<h6 class="fw-bold mb-0 text-dark">Examination Notices</h6>
<small class="text-muted">Timetables & results</small>
</div>
</div>
<span class="btn btn-sm btn-outline-dark rounded-pill px-3 ms-2">Check</span>
</a>
<!-- Item 4 -->
<a href="#" class="text-decoration-none text-dark p-3 rounded-3 d-flex align-items-center justify-content-between transition-all custom-list-item"
style="background: rgba(255, 255, 255, 0.7); border: 1px solid rgba(0, 0, 0, 0.05); transition: all 0.3s ease;"
onmouseover="this.style.background='#ffffff'; this.style.transform='translateX(5px)'; this.style.boxShadow='0 5px 15px rgba(0,0,0,0.08)';"
onmouseout="this.style.background='rgba(255, 255, 255, 0.7)'; this.style.transform='translateX(0)'; this.style.boxShadow='none';" onclick="studentlogin()">
<div class="d-flex align-items-center gap-3">
<div class="rounded-circle d-flex align-items-center justify-content-center flex-shrink-0"
style="width: 48px; height: 48px; background-color: rgb(108, 55, 55); color: #fff;">
<i class="fa-solid fa-headset fs-5"></i>
</div>
<div>
<h6 class="fw-bold mb-0 text-dark">Contact Support</h6>
<small class="text-muted">Get help & support</small>
</div>
</div>
<span class="btn btn-sm btn-outline-dark rounded-pill px-3 ms-2">Help</span>
</a>
</div>
</div>
</div>
</div>
</div>
@ -354,7 +465,7 @@ body {
<div class="mb-3">
<label for="username" class="form-label">Username / Student ID</label>
<div class="input-group">
<span class="input-group-text"><i class="fa-solid fa-user-graduate"></i></span>
<span class="input-group-text"> <i class="fa-solid fa-user-graduate"></i></span>
<input type="text" name="username" id="username" class="form-control" placeholder="Enter your student ID" required>
</div>
</div>
@ -378,7 +489,7 @@ body {
<div class="modal-footer d-flex gap-2 justify-content-center">
<button type="button" class="btn btn-modal-cancel" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-modal-login"> Login </button>
<button type="submit" class="btn btn-modal-login" style="color: #fff; background-color: #5a212af5; border-color: #007bff;"> Login </button>
</div>
</form>
</div>
@ -409,6 +520,4 @@ document.addEventListener('DOMContentLoaded', function () {
});
</script>
@endsection

View File

@ -14,372 +14,330 @@
<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
<style>
body{
font-family:'Poppins',sans-serif;
background:#f4f7fc;
:root {
--theme-navy: #2D355B; /* Primary Navy */
--theme-navy-dark: #1F2541; /* Dark Navy */
--theme-red: #822424; /* Primary Accent Red */
--theme-red-hover: #df2c3e; /* Red Hover */
--theme-yellow: #FFEA85; /* Accent Yellow/Gold */
--bg-light: #F6F6F6; /* Page Background */
--white: #ffffff;
}
.page-header{
background:linear-gradient(135deg,#9954b8,#4f3d5b));
color:#fff;
padding:45px;
border-radius:20px;
background-color: #5E244E;
margin-bottom:30px;
body {
font-family: 'Poppins', sans-serif;
background: var(--bg-light);
}
.page-header h2{
font-weight:700;
/* Page Header Hero Section */
.page-header {
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
color: var(--white);
padding: 35px 30px;
border-radius: 16px;
margin-bottom: 30px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
border-left: 5px solid var(--theme-red);
}
.page-header p{
opacity:.9;
.page-header h2 {
font-weight: 700;
}
.info-card{
border:none;
border-radius:15px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
.page-header p {
opacity: .85;
}
.table-card{
background:#fff;
border-radius:20px;
box-shadow:0 10px 30px rgba(0,0,0,.08);
overflow:hidden;
/* Info Cards & Wrapper */
.info-card {
background: var(--white);
border: 1px solid #e2e8f0;
border-radius: 16px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
}
.table thead{
background:#0d6efd;
color:#fff;
.today-card {
background: var(--white);
border: 1px solid #e2e8f0;
border-radius: 16px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
padding: 25px;
height: 100%;
}
.today-card h5,
.info-card h5 {
font-weight: 600;
color: var(--theme-navy);
}
/* Timetable Card Section */
.table-card {
background: var(--white);
border: 1px solid #e2e8f0;
border-radius: 16px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
overflow: hidden;
}
.table thead {
background: var(--theme-navy);
color: var(--white);
}
.table thead th {
font-weight: 600;
padding: 15px 10px;
}
.table td,
.table th{
text-align:center;
vertical-align:middle;
min-width:140px;
.table th {
text-align: center;
vertical-align: middle;
min-width: 140px;
}
.badge-theory{
background:#0d6efd;
.table tbody th {
background-color: #f8fafc;
color: var(--theme-navy);
font-weight: 600;
}
.badge-practical{
background:#198754;
/* Updated Status Badges */
.badge-theory {
background: var(--theme-navy) !important;
color: var(--white) !important;
}
.badge-workshop{
background:#fd7e14;
.badge-practical {
background: var(--theme-red) !important;
color: var(--white) !important;
}
.badge-break{
background:#ffc107;
color:#000;
.badge-workshop {
background: #e67e22 !important; /* Workshop Accent */
color: var(--white) !important;
}
.table tbody tr:hover{
background:#f8fbff;
transition:.3s;
.badge-break {
background: var(--theme-yellow) !important;
color: var(--theme-navy-dark) !important;
font-weight: 600;
}
.legend span{
margin-right:15px;
.table tbody tr:hover {
background: rgba(45, 53, 91, 0.02);
transition: .3s;
}
.legend .badge{
padding:8px 12px;
.lunch-row {
background-color: rgba(255, 234, 133, 0.25) !important;
color: var(--theme-navy-dark);
font-weight: 600;
}
.today-card{
background:white;
border-radius:15px;
box-shadow:0 10px 25px rgba(0,0,0,.08);
padding:25px;
height:100%;
.legend span {
margin-right: 12px;
display: inline-block;
margin-bottom: 8px;
}
.today-card h5{
font-weight:600;
.legend .badge {
padding: 8px 14px;
font-size: 12px;
}
.download-btn{
border-radius:50px;
padding:10px 25px;
/* Custom Buttons */
.download-btn {
border-radius: 8px;
padding: 10px 22px;
background-color: var(--theme-red) !important;
color: var(--white) !important;
border: none;
font-weight: 500;
transition: all 0.2s ease;
}
@media(max-width:768px){
.table td,
.table th{
font-size:13px;
min-width:120px;
.download-btn:hover {
background-color: var(--theme-red-hover) !important;
color: var(--white) !important;
}
.page-header{
padding:25px;
}
@media(max-width:768px) {
.table td,
.table th {
font-size: 13px;
min-width: 120px;
}
.page-header {
padding: 25px;
}
}
</style>
<div class="container py-4">
<!-- Header -->
<div class="page-header">
<div class="d-flex justify-content-between align-items-center flex-wrap">
<div class="d-flex justify-content-between align-items-center flex-wrap gap-3">
<div>
<h2><i class="fas fa-calendar-alt me-2"></i>My Class Timetable</h2>
<h2 class="mb-1"><i class="fas fa-calendar-alt me-2" style="color: var(--theme-yellow);"></i>My Class Timetable</h2>
<p class="mb-0">
Automobile Engineering Academy Student Portal
</p>
</div>
<button class="btn btn-light download-btn" onclick="window.print()">
<i class="fas fa-print me-2"></i>Print
<button class="btn download-btn shadow-sm" onclick="window.print()">
<i class="fas fa-print me-2"></i>Print Timetable
</button>
</div>
</div>
<!-- Top Grid Info -->
<div class="row g-4 mb-4">
<!-- Today's Schedule Card -->
<div class="col-lg-4">
<div class="today-card">
<h5 class="mb-3">
<i class="fas fa-clock text-primary me-2"></i>
Today's Classes
<i class="fas fa-clock me-2" style="color: var(--theme-red);"></i>
Today's Schedule ({{ $todayName ?? 'Today' }})
</h5>
<div class="mb-3">
@forelse($todaySchedule ?? [] as $todayItem)
@php
$borderStyle = 'var(--theme-navy)';
$badgeClass = 'badge-theory';
if(strtolower($todayItem->type) == 'practical') {
$borderStyle = 'var(--theme-red)';
$badgeClass = 'badge-practical';
} elseif(strtolower($todayItem->type) == 'workshop') {
$borderStyle = '#e67e22';
$badgeClass = 'badge-workshop';
}
@endphp
<strong>08:30 - 10:30</strong><br>
<div class="mb-3 p-2 rounded" style="background: #f8fafc; border-left: 3px solid {{ $borderStyle }};">
<strong>{{ $todayItem->time_slot }}</strong><br>
<span class="badge {{ $badgeClass }} me-1">{{ $todayItem->type }}</span>
<span>{{ $todayItem->subject_name }}</span>
</div>
@empty
<div class="p-3 text-center text-muted border rounded">
<i class="fas fa-coffee me-1"></i> No classes scheduled for today!
</div>
@endforelse
</div>
</div>
<span class="badge badge-theory">
Theory
</span>
Engine Fundamentals
</div>
<div class="mb-3">
<strong>10:45 - 12:30</strong><br>
<span class="badge badge-workshop">
Workshop
</span>
Practical Session
<!-- Legend Card -->
<div class="col-lg-8">
<div class="info-card p-4 h-100 d-flex flex-column justify-content-between">
<div>
<h5 class="mb-3">
<i class="fas fa-info-circle me-2" style="color: var(--theme-navy);"></i>
Timetable Legend
</h5>
<div class="legend mb-2">
<span>
<span class="badge badge-theory">Theory</span>
</span>
<span>
<span class="badge badge-practical">Practical</span>
</span>
<span>
<span class="badge badge-workshop">Workshop</span>
</span>
<span>
<span class="badge badge-break">Break</span>
</span>
</div>
</div>
<div>
<strong>01:30 - 03:30</strong><br>
<span class="badge badge-practical">
Practical
</span>
Electrical System
<hr class="text-muted">
<p class="mb-0 text-muted small">
<i class="fas fa-exclamation-circle me-1" style="color: var(--theme-red);"></i>
Please arrive at least 15 minutes before each class. Attendance is compulsory for all practical sessions.
</p>
</div>
</div>
</div>
<div class="col-lg-8">
<div class="info-card p-4 h-100">
<h5 class="mb-3">
<i class="fas fa-info-circle text-primary me-2"></i>
Timetable Legend
</h5>
<div class="legend">
<span>
<span class="badge badge-theory">Theory</span>
</span>
<span>
<span class="badge badge-practical">Practical</span>
</span>
<span>
<span class="badge badge-workshop">Workshop</span>
</span>
<span>
<span class="badge badge-break">Break</span>
</span>
</div>
<hr>
<p class="mb-0 text-muted">
Please arrive at least 15 minutes before each class.
Attendance is compulsory for all practical sessions.
</p>
</div>
</div>
</div>
<!-- Timetable -->
<!-- Timetable Grid -->
<div class="table-card">
<div class="table-responsive">
<table class="table table-bordered align-middle mb-0">
<thead>
<tr>
<th>Time</th>
<th>Monday</th>
<th>Tuesday</th>
<th>Wednesday</th>
<th>Thursday</th>
<th>Friday</th>
</tr>
<tr>
<th>Time</th>
@foreach($days as $day)
<th class="{{ ($todayName ?? '') == $day ? 'bg-danger text-white' : '' }}">
{{ $day }} {{ ($todayName ?? '') == $day ? '(Today)' : '' }}
</th>
@endforeach
</tr>
</thead>
<tbody>
@forelse($timeSlots as $slot)
@php
// Lunch/Break Check
$isBreakRow = false;
foreach($days as $d) {
if(isset($schedule[$slot][$d]) && strtolower($schedule[$slot][$d]->type) == 'break') {
$isBreakRow = true;
break;
}
}
@endphp
<tr>
<th>08:30 - 10:30</th>
<td>
<span class="badge badge-theory">Theory</span><br>
Engine Fundamentals
</td>
<td>
<span class="badge badge-practical">Practical</span><br>
Engine Lab
</td>
<td>
<span class="badge badge-theory">Theory</span><br>
Transmission
</td>
<td>
<span class="badge badge-workshop">Workshop</span><br>
Engine Repair
</td>
<td>
<span class="badge badge-theory">Theory</span><br>
Vehicle Safety
</td>
</tr>
<tr>
<th>10:45 - 12:30</th>
<td>
<span class="badge badge-workshop">Workshop</span><br>
Service Practice
</td>
<td>
<span class="badge badge-theory">Theory</span><br>
Electrical
</td>
<td>
<span class="badge badge-practical">Practical</span><br>
Diagnostics
</td>
<td>
<span class="badge badge-theory">Theory</span><br>
Fuel System
</td>
<td>
<span class="badge badge-workshop">Workshop</span><br>
Engine Assembly
</td>
</tr>
<tr class="table-warning">
<th>12:30 - 01:30</th>
<td colspan="5">
🍴 LUNCH BREAK
</td>
</tr>
<tr>
<th>01:30 - 03:30</th>
<td>
<span class="badge badge-practical">Practical</span><br>
Electrical System
</td>
<td>
<span class="badge badge-workshop">Workshop</span><br>
Welding
</td>
<td>
<span class="badge badge-theory">Theory</span><br>
Auto Electronics
</td>
<td>
<span class="badge badge-practical">Practical</span><br>
Brake System
</td>
<td>
<span class="badge badge-theory">Theory</span><br>
Revision
</td>
</tr>
@if($isBreakRow)
<tr class="lunch-row">
<th>{{ $slot }}</th>
<td colspan="5">
🍴 LUNCH BREAK / REST TIME
</td>
</tr>
@else
<tr>
<th>{{ $slot }}</th>
@foreach($days as $day)
<td>
@if(isset($schedule[$slot][$day]))
@php
$cell = $schedule[$slot][$day];
$typeClass = 'badge-theory';
if(strtolower($cell->type) == 'practical') {
$typeClass = 'badge-practical';
} elseif(strtolower($cell->type) == 'workshop') {
$typeClass = 'badge-workshop';
}
@endphp
<span class="badge {{ $typeClass }} mb-1">{{ $cell->type }}</span><br>
{{ $cell->subject_name }}
@else
<span class="text-muted">-</span>
@endif
</td>
@endforeach
</tr>
@endif
@empty
<tr>
<td colspan="6" class="text-center py-4 text-muted">
<i class="fas fa-info-circle me-1"></i> No timetable data available right now.
</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>

File diff suppressed because it is too large Load Diff

View File

@ -6,73 +6,157 @@ use App\Http\Controllers\StudentPortalController;
use App\Http\Controllers\ContactMsgController;
use App\Http\Controllers\FeedbackController;
use App\Http\Controllers\studentportalnavController;
use App\Http\Controllers\Auth\ForgotPasswordController;
use App\Http\Controllers\coursesController;
use App\Http\Controllers\ApplyController;
use App\Http\Controllers\ResultsController;
use App\Http\Controllers\TimetableController;
use App\Http\Controllers\CoureseAssignController;
use App\Http\Controllers\AdminAuthController;
use App\Http\Controllers\adminmycoursesController;
use App\Http\Controllers\AdminResultsController;
use App\Http\Controllers\AdminProfileController;
use App\Http\Controllers\AdminTimetableController;
use App\Http\Controllers\AdminDashboardController;
/*
|--------------------------------------------------------------------------
| Web Routes
| Public Routes & General Pages
|--------------------------------------------------------------------------
*/
// Home Page
Route::get('/', function () {
return view('welcome');
});
Route::post('/studentlogout', [studentportalnavController::class, 'logout']);
Route::post('/feedback/store', [FeedbackController::class, 'feedback']) ->middleware('auth') ->name('feedback.store');
Route::post('/contact-submit', [ContactMsgController::class, 'store'])->name('contact.store');
Route::put('/profile/update', [AuthController::class, 'update'])->name('profile.update')->middleware('auth');
Route::middleware(['auth'])->group(function () {
Route::get('/profile', [AuthController::class, 'profilview'])->name('profile.view');
});
// Authentication Routes
Route::post('/signuppage', [AuthController::class, 'register']);
Route::post('/signin', [AuthController::class, 'login']);
Route::post('/custom-logout', [AuthController::class, 'logout']);
// --- STUDENT PORTAL SYSTEM ROUTES ---
Route::post('/student-login', [StudentPortalController::class, 'studentlogin'])->name('student.login.submit');
// Route::get('/student-login', [StudentPortalController::class, 'studentlogin'])->name('student.login.submit');
Route::get('/student-portal', function () {
if (!session()->has('student_id')) {
return redirect()->back()->with('error', 'Please login first!');
}
return view('StudentPortal');
})->name('student.portal');
// Route::get('/student-logout', function () {
// session()->forget('student_id');
// return redirect()->to('/students')->with('success', 'Logged out successfully!');
// })->name('student.logout');
Route::view('/apply', 'apply')->name('apply');
Route::view('/courses', 'courses')->name('courses');
Route::get('/courses', [coursesController::class, 'index'])->name('courses.index');
Route::view('/students', 'students')->name('students');
Route::view('/abouts', 'abouts')->name('abouts');
Route::view('/contact', 'contacts')->name('contact');
Route::view('/signin', 'signin')->name('signin');
Route::view('/signup', 'signup')->name('signup');
//student protal
Route::view('/Dashboard','StudentPortal')->name('Dashboard');
Route::view('/mycourse', 'mycourse')->name('mycourse');
Route::view('/timetable','timetable')->name('timetable');
Route::view('/Assignments','Assignments')->name('Assignments');
Route::view('/Studentguidelines','Studentguidelines')->name('Studentguidelines');
Route::view('/results','results')->name('results');
Route::view('/Feedback&Complain','Feedback&Complain')->name('Feedback&Complain');
Route::view('/StudentProfile','StudentProfile')->name('StudentProfile');
/*
|--------------------------------------------------------------------------
| System Auth & Contact Routes (POST)
|--------------------------------------------------------------------------
*/
Route::post('/signuppage', [AuthController::class, 'register']);
Route::post('/signin', [AuthController::class, 'login']);
Route::post('/custom-logout', [AuthController::class, 'logout']);
Route::post('/contact-submit', [ContactMsgController::class, 'store'])->name('contact.store');
/*
|--------------------------------------------------------------------------
| Password Reset Routes
|--------------------------------------------------------------------------
*/
Route::middleware('guest')->group(function () {
Route::get('/password/reset', [ForgotPasswordController::class, 'index'])->name('password.request');
Route::post('/resetEmail', [ForgotPasswordController::class, 'resetEmail'])->name('password.email');
Route::post('/verify-otp', [ForgotPasswordController::class, 'verifyOtpEmail'])->name('password.verify.otp');
Route::post('/update-password', [ForgotPasswordController::class, 'updatePassword'])->name('password.update');
});
/*
|--------------------------------------------------------------------------
| Regular Auth Protected Routes
|--------------------------------------------------------------------------
*/
Route::middleware(['auth'])->group(function () {
Route::get('/apply', [ApplyController::class, 'index'])->name('apply.index');
Route::post('/apply', [ApplyController::class, 'store'])->name('apply.store');
Route::put('/profile/update', [AuthController::class, 'update'])->name('profile.update');
Route::get('/profile', [AuthController::class, 'profilview'])->name('profile.view');
});
/*
|--------------------------------------------------------------------------
| STUDENT PORTAL ROUTES
|--------------------------------------------------------------------------
*/
Route::post('/student-login', [StudentPortalController::class, 'studentlogin'])->name('student.login.submit');
Route::post('/studentlogout', [StudentPortalController::class, 'studentlogout'])->name('student.logout');
Route::middleware(['web'])->group(function () {
Route::get('/student-portal', function () {
if (!session()->has('student_id') && !session()->has('student_log_id')) {
return redirect('/signin')->with('error', 'Please login first!');
}
return view('StudentPortal');
})->name('student.portal');
Route::get('/StudentProfile', [StudentPortalController::class, 'showProfile'])->name('StudentProfile');
Route::get('/results', [ResultsController::class, 'index'])->name('results');
Route::get('/Dashboard', function () {
if (!session()->has('student_id') && !session()->has('student_log_id')) {
return redirect('/signin')->with('error', 'Please login first!');
}
return view('StudentPortal');
})->name('Dashboard');
Route::get('/timetable', [TimetableController::class, 'index'])->name('timetable');
Route::get('/Assignments', function () {
if (!session()->has('student_id') && !session()->has('student_log_id')) {
return redirect('/signin')->with('error', 'Please login first!');
}
return view('Assignments');
})->name('Assignments');
Route::get('/Studentguidelines', function () {
if (!session()->has('student_id') && !session()->has('student_log_id')) {
return redirect('/signin')->with('error', 'Please login first!');
}
return view('Studentguidelines');
})->name('Studentguidelines');
Route::get('/Feedback&Complain', [FeedbackController::class, 'index'])->name('feedback.index');
Route::post('/Feedback&Complain/store', [FeedbackController::class, 'store'])->name('feedback.store');
Route::get('/mycourse', [CoureseAssignController::class, 'showMyCourse'])->name('mycourse');
Route::get('/module/{id}', [CoureseAssignController::class, 'showModule'])->name('module.show');
});
/*
|--------------------------------------------------------------------------
| ADMIN PORTAL ROUTES
|--------------------------------------------------------------------------
*/
Route::get('/admin/login', [AdminAuthController::class, 'showLoginForm'])->name('admin.login');
Route::post('/admin/login', [AdminAuthController::class, 'login']);
Route::post('/admin/logout', [AdminAuthController::class, 'logout'])->name('admin.logout');
Route::middleware(['web'])->prefix('admin')->group(function () {
// Admin Dashboard Routes
Route::get('/dashboard', [AdminDashboardController::class, 'index'])->name('admin.admindashboard');
Route::post('/notifications/read/{id}', [AdminDashboardController::class, 'markAsRead'])->name('admin.notifications.read');
// Admin Courses
Route::get('/adminmycourses', [adminmycoursesController::class, 'index'])->name('admin.mycourses');
Route::post('/adminmycourses/store', [adminmycoursesController::class, 'store'])->name('admin.courses.store');
Route::post('/adminmycourses/update/{id}', [adminmycoursesController::class, 'update'])->name('admin.courses.update');
Route::delete('/admin/courses/{id}', [adminmycoursesController::class, 'destroy'])->name('admin.courses.delete');
// Admin Timetable Routes
Route::get('/timetable', [AdminTimetableController::class, 'index'])->name('admin.timetable');
Route::post('/timetable/store', [AdminTimetableController::class, 'store'])->name('admin.timetable.store');
Route::put('/timetable/update/{id}', [AdminTimetableController::class, 'update'])->name('admin.timetable.update');
Route::delete('/timetable/delete/{id}', [AdminTimetableController::class, 'destroy'])->name('admin.timetable.delete');
// Admin Results
Route::get('/results', [AdminResultsController::class, 'index'])->name('admin.results');
Route::post('/results/store', [AdminResultsController::class, 'store'])->name('admin.results.store');
Route::put('/results/update/{id}', [AdminResultsController::class, 'update'])->name('admin.results.update');
Route::delete('/results/delete/{id}', [AdminResultsController::class, 'destroy'])->name('admin.results.delete');
// Admin Profile
Route::get('/profile', [AdminProfileController::class, 'index'])->name('admin.profile');
Route::put('/profile/update', [AdminProfileController::class, 'update'])->name('admin.profile.update');
Route::put('/profile/password', [AdminProfileController::class, 'updatePassword'])->name('admin.profile.password');
});