Compare commits

..

No commits in common. "devcopy" and "main" have entirely different histories.

61 changed files with 3064 additions and 7973 deletions

View File

@ -1,75 +0,0 @@
<?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

@ -1,43 +0,0 @@
<?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

@ -1,60 +0,0 @@
<?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

@ -1,60 +0,0 @@
<?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

@ -1,75 +0,0 @@
<?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

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

View File

@ -1,35 +0,0 @@
<?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,90 +4,58 @@ namespace App\Http\Controllers;
use Illuminate\Http\Request; use Illuminate\Http\Request;
use Illuminate\Support\Facades\DB; use Illuminate\Support\Facades\DB;
use App\Models\StudentPortalLog ;
use Illuminate\Support\Facades\Hash; use Illuminate\Support\Facades\Hash;
class StudentPortalController extends Controller class StudentPortalController extends Controller
{ {
public function studentlogin(Request $request)
public function studentlogin(Request $request) {
{ $request->validate([
'username' => 'required',
$request->validate([ 'password' => 'required',
'username' => 'required|string', 'pin' => 'required|numeric',
'password' => 'required|string', ]);
'pin' => 'required|numeric',
]);
$student = DB::table('student_portal_logs')
$student = DB::table('student_portal_logs') ->where('email', $request->username)
->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(); ->first();
if ($student && Hash::check($request->password, $student->password) && $student->pin == $request->pin) {
if (!$student) { if ($student->status !== 'active' && $student->status !== '') {
return redirect()->route('student.portal')->with('error', 'Student details not found in database!'); return redirect('/')->with('error', 'Your account is inactive!');
}
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();
return response()->json(['success' => true]); // public function showProfile(Request $request)
} // {
// $log_id = $request->session()->get('student_id');
} // 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

@ -1,42 +0,0 @@
<?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

@ -1,123 +0,0 @@
<?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,60 +2,9 @@
namespace App\Http\Controllers; namespace App\Http\Controllers;
use App\Models\Application;
use Illuminate\Http\Request; 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

@ -1,112 +0,0 @@
<?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,16 +2,9 @@
namespace App\Http\Controllers; namespace App\Http\Controllers;
use App\Models\courses;
use Illuminate\Http\Request; use Illuminate\Http\Request;
class coursesController extends Controller class coursesController extends Controller
{ {
public function index() //
{ }
$courses = courses::all();
return view('courses', compact('courses'));
}
}

View File

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

View File

@ -1,56 +0,0 @@
<?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

@ -1,48 +0,0 @@
<?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

@ -1,20 +0,0 @@
<?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',
];
}

View File

@ -1,25 +0,0 @@
<?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',
];
}

View File

@ -1,22 +0,0 @@
<?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,7 +24,6 @@ class User extends Authenticatable
'email', 'email',
'phone', 'phone',
'password', 'password',
'email_otp',
]; ];
/** /**

View File

@ -1,19 +0,0 @@
<?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,39 +2,9 @@
namespace App\Models; namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model; use Illuminate\Database\Eloquent\Model;
class courses extends 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

@ -1,57 +0,0 @@
<?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,8 +3,6 @@
namespace App\Providers; namespace App\Providers;
use Illuminate\Support\ServiceProvider; use Illuminate\Support\ServiceProvider;
use App\Models\User;
use App\Observers\UserObserver;
class AppServiceProvider extends ServiceProvider class AppServiceProvider extends ServiceProvider
{ {
@ -21,6 +19,6 @@ class AppServiceProvider extends ServiceProvider
*/ */
public function boot(): void public function boot(): void
{ {
User::observe(UserObserver::class); //
} }
} }

View File

@ -1,28 +0,0 @@
<?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

@ -1,59 +0,0 @@
<?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

@ -1,35 +0,0 @@
<?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

@ -1,33 +0,0 @@
<?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

@ -1,29 +0,0 @@
<?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

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

View File

@ -1,295 +1,310 @@
@extends('layouts.studentportalnav') @extends('layouts.studentportalnav')
@section('title', 'Dashboard') @section('title','Dashboard')
@section('content') @section('content')
<style> <style>
:root { :root{
--theme-navy: #2D355B; /* Primary Dark Navy */ --primary:#5E244E;
--theme-footer-navy: #1F2541; /* Darker Navy */ --secondary:#8B3A74;
--theme-red: #822424; /* Primary Accent Red */ --light:#f5f6fb;
--theme-red-hover: #df2c3e; /* Red Hover State */ --dark:#2d2d2d;
--theme-yellow: #FFEA85; /* Accent Gold/Yellow */
--theme-bg: #F6F6F6; /* Page Background */
--text-dark: #333333;
} }
body { body{
background-color: var(--theme-bg); background:var(--light);
color: var(--text-dark);
} }
/* Header */ /* Header */
.dashboard-header { .dashboard-header{
display: flex; display:flex;
justify-content: space-between; justify-content:space-between;
align-items: center; align-items:center;
margin-bottom: 30px; margin-bottom:30px;
padding-bottom: 15px;
border-bottom: 2px solid #e2e8f0;
} }
.dashboard-header h2 { .dashboard-header h2{
font-weight: 700; font-weight:700;
color: var(--theme-navy); color:var(--dark);
margin-bottom: 5px;
} }
.dashboard-header p { .dashboard-header p{
color: #6c757d; color:#777;
margin: 0; margin:0;
font-size: 0.95rem;
} }
.avatar { .avatar{
width: 55px; width:55px;
height: 55px; height:55px;
border-radius: 50%; border-radius:50%;
background: var(--theme-navy); background:var(--primary);
color: var(--theme-yellow); color:#fff;
display: flex; display:flex;
align-items: center; align-items:center;
justify-content: center; justify-content:center;
font-weight: bold; font-weight:bold;
font-size: 20px; font-size:20px;
box-shadow: 0 4px 10px rgba(0,0,0,0.1);
} }
/* Statistic Cards */ /* Statistic Cards */
.stat-card {
background: #ffffff; .stat-card{
border-radius: 12px; background:#fff;
padding: 24px; border-radius:15px;
box-shadow: 0 4px 12px rgba(0,0,0,0.05); padding:25px;
transition: all 0.3s ease; box-shadow:0 8px 20px rgba(0,0,0,.08);
height: 100%; transition:.3s;
border: 1px solid #e2e8f0; height:100%;
} }
.stat-card:hover { .stat-card:hover{
transform: translateY(-5px); transform:translateY(-6px);
box-shadow: 0 8px 20px rgba(45, 53, 91, 0.12);
border-color: var(--theme-navy);
} }
.stat-icon { .stat-icon{
width: 55px; width:60px;
height: 55px; height:60px;
border-radius: 10px; border-radius:12px;
display: flex; display:flex;
justify-content: center; justify-content:center;
align-items: center; align-items:center;
color: #ffffff; color:#fff;
font-size: 22px; font-size:22px;
margin-bottom: 16px; margin-bottom:20px;
} }
.stat-card h3 { .stat-card h3{
font-weight: 700; font-weight:700;
color: var(--theme-navy); margin-bottom:5px;
margin-bottom: 4px;
} }
.stat-card p { .stat-card p{
color: #6c757d; color:#777;
font-size: 0.9rem; margin:0;
font-weight: 600;
margin: 0;
} }
/* Services */ /* Services */
.section-title {
font-size: 22px; .section-title{
font-weight: 700; font-size:24px;
color: var(--theme-navy); font-weight:bold;
margin: 40px 0 20px; margin:40px 0 20px;
display: flex;
align-items: center;
gap: 10px;
} }
.section-title::before { .service-card{
content: ''; background:#fff;
display: inline-block; border-radius:15px;
width: 5px; padding:30px;
height: 24px; text-align:center;
background-color: var(--theme-red); transition:.3s;
border-radius: 2px; box-shadow:0 8px 20px rgba(0,0,0,.08);
height:100%;
} }
.service-card { .service-card:hover{
background: #ffffff; transform:translateY(-8px);
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:hover { .service-card i{
transform: translateY(-6px); font-size:45px;
box-shadow: 0 8px 22px rgba(0,0,0,0.1); color:var(--primary);
border-color: var(--theme-red); margin-bottom:20px;
} }
.service-card i { .service-card h5{
font-size: 40px; font-weight:700;
color: var(--theme-red);
margin-bottom: 16px;
transition: transform 0.3s ease, color 0.3s ease;
} }
.service-card:hover i { .service-card p{
transform: scale(1.1); color:#777;
color: var(--theme-red-hover); font-size:14px;
}
.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> </style>
<div class="container-fluid"> <div class="container-fluid">
<!-- Dashboard Header --> <div class="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>
<div class="avatar" title="{{ Auth::user()->first_name }}"> <h2>Welcome Back, student
{{ strtoupper(substr(Auth::user()->first_name, 0, 1)) }} <p>Manage your academic activities from your dashboard.</p>
</div> </div>
@endif
</div>
<!-- Statistics Cards --> <!-- <div class="avatar">
<div class="row g-4"> S
</div> -->
<div class="col-lg-3 col-md-6"> </div>
<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"> <!-- Statistics -->
<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="row g-4">
<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="col-lg-3 col-md-6">
<div class="stat-card"> <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> <div class="stat-icon" style="background:#5E244E;">
<i class="fa-solid fa-book"></i>
</div>
<!-- Student Services Section --> <h3>6</h3>
<div class="section-title"> <p>Enrolled Courses</p>
Student Services
</div>
<div class="row g-4"> </div>
</div>
<div class="col-lg-4 col-md-6"> <div class="col-lg-3 col-md-6">
<a href="/mycourse" class="text-decoration-none"> <div class="stat-card">
<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"> <div class="stat-icon" style="background:#0d9488;">
<a href="/timetable" class="text-decoration-none"> <i class="fa-solid fa-file-lines"></i>
<div class="service-card"> </div>
<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"> <h3>3</h3>
<a href="/results" class="text-decoration-none"> <p>Assignments</p>
<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"> </div>
<a href="/Studentguidelines" class="text-decoration-none"> </div>
<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"> <div class="col-lg-3 col-md-6">
<a href="/Feedback&Complain" class="text-decoration-none"> <div class="stat-card">
<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"> <div class="stat-icon" style="background:#d97706;">
<a href="/StudentProfile" class="text-decoration-none"> <i class="fa-solid fa-chart-column"></i>
<div class="service-card"> </div>
<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> <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>
</div> </div>

View File

@ -4,289 +4,383 @@
@section('content') @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> <style>
:root {
--theme-navy: #2D355B; /* Primary Navy */ body{
--theme-navy-dark: #1F2541; /* Dark Navy */ background:#f6f7fb;
--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 */ /* Header */
.profile-header {
background: linear-gradient(135deg, var(--theme-navy) 0%, var(--theme-navy-dark) 100%) !important; .profile-header{
color: var(--white);
border-radius: 16px; background:linear-gradient(135deg,#5E244E,#4a1c3e);
padding: 35px 30px; color:#fff;
margin-bottom: 30px; border-radius:20px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15); padding:40px;
border-left: 5px solid var(--theme-red); margin-bottom:35px;
box-shadow:0 15px 35px rgba(0,0,0,.15);
} }
.profile-header h2 {
font-weight: 700; .profile-header h2{
font-weight:700;
} }
.profile-header p {
color: rgba(255, 255, 255, 0.85); .profile-header p{
margin-bottom: 0;
color:#ddd;
} }
/* Profile Card */ /* Profile Card */
.profile-card {
background: var(--white); .profile-card{
border-radius: 16px;
padding: 30px; background:#fff;
border: 1px solid #e2e8f0; border-radius:20px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04); padding:30px;
height: 100%; box-shadow:0 10px 30px rgba(0,0,0,.08);
height:100%;
} }
/* Student Image */ /* Student Image */
.profile-image {
width: 140px; .profile-image{
height: 140px;
border-radius: 50%; width:150px;
object-fit: cover; height:150px;
border: 4px solid var(--theme-navy); border-radius:50%;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); object-fit:cover;
border:6px solid #d4af37;
} }
.student-name {
color: var(--theme-navy); .student-name{
font-weight: 700;
margin-top: 15px; color:#5E244E;
font-weight:700;
margin-top:15px;
} }
.student-id {
background: var(--theme-navy); .student-id{
color: var(--white);
padding: 8px 20px; background:#5E244E;
border-radius: 50px; color:#fff;
display: inline-block; padding:8px 20px;
font-size: 13px; border-radius:50px;
font-weight: 600; display:inline-block;
letter-spacing: 0.5px; font-size:14px;
} }
/* Information */ /* Information */
.info-title {
color: var(--theme-navy); .info-title{
font-weight: 700;
border-bottom: 2px solid var(--theme-yellow); color:#5E244E;
padding-bottom: 10px; font-weight:700;
margin-bottom: 20px; border-bottom:2px solid #d4af37;
padding-bottom:10px;
margin-bottom:20px;
} }
.info-title i {
color: var(--theme-red); .info-row{
margin-right: 8px;
display:flex;
justify-content:space-between;
padding:12px 0;
border-bottom:1px solid #eee;
} }
.info-row {
display: flex; .label{
justify-content: space-between;
padding: 12px 0; color:#777;
border-bottom: 1px solid #f1f5f9;
} }
.info-row:last-child {
border-bottom: none; .value{
font-weight:600;
color:#333;
} }
.label {
color: #64748b;
font-weight: 500; /* Course */
.course-box{
background:#5E244E;
color:#fff;
padding:25px;
border-radius:20px;
} }
.value {
font-weight: 600; .course-box h4{
color: #1e293b;
color:#d4af37;
font-weight:700;
} }
/* Course Box */
.course-box { .course-item{
background: linear-gradient(135deg, var(--theme-navy) 0%, var(--theme-navy-dark) 100%);
color: var(--white); margin-top:12px;
padding: 30px;
border-radius: 16px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15);
height: 100%;
} }
.course-box h4 {
color: var(--theme-yellow); .course-item i{
font-weight: 700;
margin-bottom: 20px; color:#d4af37;
border-bottom: 1px solid rgba(255, 255, 255, 0.15); width:25px;
padding-bottom: 10px;
} }
.course-item {
margin-top: 14px;
font-size: 15px; /* Button */
color: rgba(255, 255, 255, 0.9);
.edit-btn{
background:#d4af37;
color:white;
border:none;
border-radius:50px;
padding:12px 30px;
font-weight:600;
} }
.course-item i {
color: var(--theme-yellow); .edit-btn:hover{
width: 28px;
background:#c49d20;
color:#fff;
} }
/* 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> </style>
<div class="container py-4"> <div class="container py-4">
<!-- Header --> <!-- Header -->
<div class="profile-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> </div>
<!-- Main Profile Row -->
<div class="row g-4"> <div class="row g-4">
<!-- Profile Card -->
<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 }} <!-- Profile Left -->
<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>
<span class="student-id">
Student ID : AEA20260045
</span> </span>
<hr> <hr>
<button class="edit-btn mt-3"> <button class="edit-btn mt-3">
<i class="fas fa-edit"></i> Edit Profile <i class="fas fa-edit"></i> Edit Profile </button>
</button>
</div> </div>
</div> </div>
<!-- Personal Details -->
<!-- Details -->
<div class="col-lg-8"> <div class="col-lg-8">
<div class="profile-card"> <div class="profile-card">
<h4 class="info-title"> <h4 class="info-title">
<i class="fas fa-user"></i> Personal Information <i class="fas fa-user"></i>
Personal Information
</h4> </h4>
<div class="info-row"> <div class="info-row">
<span class="label">Full Name</span> <span class="label">
<span class="value">{{ $student->full_name }}</span> Full Name
</div> </span>
<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"> <span class="value">
{{ !empty($student->date_of_birth) ? date('d F Y', strtotime($student->date_of_birth)) : 'N/A' }} Kasuni Perera
</span> </span>
</div> </div>
<div class="info-row">
<span class="label">Gender</span>
<span class="value">{{ $student->gender }}</span>
</div>
<div class="info-row"> <div class="info-row">
<span class="label">Email</span> <span class="label">
<span class="value">{{ $student->email }}</span> NIC / Passport
</span>
<span class="value">
200012345678
</span>
</div> </div>
<div class="info-row"> <div class="info-row">
<span class="label">Phone</span> <span class="label">
<span class="value">{{ $student->phone }}</span> Date of Birth
</span>
<span class="value">
15 March 2000
</span>
</div> </div>
<div class="info-row">
<span class="label">
Gender
</span>
<span class="value">
Male
</span>
</div>
<div class="info-row">
<span class="label">
Email
</span>
<span class="value">
student@email.com
</span>
</div>
<div class="info-row">
<span class="label">
Phone
</span>
<span class="value">
+94 77 1234567
</span>
</div>
</div> </div>
</div> </div>
</div> </div>
<!-- Education & Course Details Row -->
<div class="row g-4 mt-1"> <div class="row g-4 mt-1">
<!-- Education --> <!-- Education -->
<div class="col-lg-6"> <div class="col-lg-6">
<div class="profile-card"> <div class="profile-card">
<h4 class="info-title"> <h4 class="info-title">
<i class="fas fa-graduation-cap"></i> Educational Background <i class="fas fa-graduation-cap"></i>
Educational Background
</h4> </h4>
<div class="info-row"> <div class="info-row">
<span class="label">Qualification</span> <span class="label">
<span class="value">{{ $student->qualification }}</span> Qualification
</span>
<span class="value">
NVQ Level 4
</span>
</div> </div>
<div class="info-row"> <div class="info-row">
<span class="label">Institute</span> <span class="label">
<span class="value">{{ $student->institute }}</span> Institute
</span>
<span class="value">
ABC Technical College
</span>
</div> </div>
<div class="info-row"> <div class="info-row">
<span class="label">Year Completed</span> <span class="label">
<span class="value">{{ $student->year_completed }}</span> Year Completed
</span>
<span class="value">
2025
</span>
</div> </div>
</div> </div>
</div> </div>
<!-- Course Details --> <!-- Course Details -->
<div class="col-lg-6"> <div class="col-lg-6">
<div class="course-box"> <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"> <div class="course-item">
<i class="fas fa-book"></i> {{ $student->course_name }} <i class="fas fa-book"></i> Diploma in Automobile Engineering </div>
</div> <div class="course-item"> <i class="fas fa-calendar"></i> Duration : 2 Years</div>
<div class="course-item">
<i class="fas fa-calendar"></i> Duration : {{ $student->duration }} <div class="course-item">
</div> <i class="fas fa-layer-group"></i>Current Semester : Semester 2
<div class="course-item"> </div>
<i class="fas fa-layer-group"></i> Current Semester : {{ $student->current_semester }}
</div> <div class="course-item">
<div class="course-item"> <i class="fas fa-user-tie"></i>
<i class="fas fa-user-tie"></i> Trainer : {{ $student->trainer_name }} Trainer : Mr. Nimal Silva
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
@endsection @endsection

View File

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

View File

@ -6,29 +6,16 @@
<style> <style>
:root{ :root{
/* Premium Modern Automotive Palette */ --primary:#5E244E;
--primary: #3E51B8; /* Tech Blue */ --secondary:#8B3A74;
--primary-light: #0a67df; /* Vibrant Electric Blue */ --light:#f8f4f7;
--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 { .hero-about{
font-family: 'Segoe UI', Arial, sans-serif;
color: var(--text-main);
}
/* .hero-about{
min-height:60vh; min-height:60vh;
background: background:
linear-gradient(rgba(185, 205, 253, 0.31), rgb(0, 0, 0)), url('https://images.pexels.com/photos/1595385/pexels-photo-1595385.jpeg'); linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),
url('https://images.pexels.com/photos/1595385/pexels-photo-1595385.jpeg');
background-size:cover; background-size:cover;
background-position:center; background-position:center;
display:flex; display:flex;
@ -36,17 +23,6 @@ body {
justify-content:center; justify-content:center;
text-align:center; text-align:center;
color:#fff; 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{ .section-title{
@ -58,22 +34,22 @@ body {
background:#fff; background:#fff;
border-radius:20px; border-radius:20px;
padding:35px 25px; padding:35px 25px;
box-shadow: 0 10px 30px rgba(0,0,0,.04); box-shadow:0 10px 30px rgba(0,0,0,.05);
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1);
border: 1px solid var(--card-border); border: 1px solid #efeff4;
} }
.about-box:hover { .about-box:hover {
transform: translateY(-10px) scale(1.02); transform: translateY(-10px) scale(1.02);
box-shadow: 0 20px 40px rgba(62, 81, 184, 0.12); box-shadow: 0 20px 40px rgba(94, 36, 78, 0.1);
border-color: var(--primary-light); border-color: var(--primary);
} }
.icon-circle { .icon-circle {
width:75px; width:75px;
height:75px; height:75px;
background: #6e3232; background:var(--primary);
color: #f6e983; color:#fff;
border-radius:50%; border-radius:50%;
display:flex; display:flex;
align-items:center; align-items:center;
@ -84,9 +60,8 @@ body {
} }
.about-box:hover .icon-circle { .about-box:hover .icon-circle {
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%); background: var(--secondary);
transform: rotateY(180deg); transform: rotateY(180deg); /* කාඩ් එක උඩට යද්දී අයිකන් එක කැරකෙනවා */
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.3);
} }
/* ======================================================== /* ========================================================
@ -98,36 +73,41 @@ body {
transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1); transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
} }
/* 1. පල්ලෙහා ඉඳන් උඩට එන ඇනිමේෂන් */
.fade-up-init { .fade-up-init {
transform: translateY(40px); transform: translateY(40px);
} }
/* 2. වමේ ඉඳන් දකුණට (රූපය සඳහා) */
.slide-left-init { .slide-left-init {
transform: translateX(-50px); transform: translateX(-50px);
} }
/* 3. දකුණේ ඉඳන් වමට (විස්තරය සඳහා) */
.slide-right-init { .slide-right-init {
transform: translateX(50px); transform: translateX(50px);
} }
/* 4. Zoom වෙලා bounce වෙන්න (කාඩ්ස් සඳහා) */
.zoom-in-init { .zoom-in-init {
transform: scale(0.85); transform: scale(0.85);
} }
/* Active Class (Scroll කරද්දී apply වේ) */
.animate-item.animated { .animate-item.animated {
opacity: 1; opacity: 1;
transform: translate(0) scale(1); transform: translate(0) scale(1);
} }
/* Automotive Theme Glow Pulse Button */ /* CTA බටන් එක ගැස්සෙන ඇනිමේෂන් එකක් */
@keyframes pulse-btn { @keyframes pulse-btn {
0% { box-shadow: 0 0 0 0 rgba(10, 103, 223, 0.4); } 0% { box-shadow: 0 0 0 0 rgba(94, 36, 78, 0.4); }
70% { box-shadow: 0 0 0 15px rgba(10, 103, 223, 0); } 70% { box-shadow: 0 0 0 15px rgba(94, 36, 78, 0); }
100% { box-shadow: 0 0 0 0 rgba(10, 103, 223, 0); } 100% { box-shadow: 0 0 0 0 rgba(94, 36, 78, 0); }
} }
.cta-btn { .cta-btn {
background: var(--primary-light); background: var(--primary);
color: #fff !important; color: #fff !important;
padding: 14px 35px; padding: 14px 35px;
border-radius: 50px; border-radius: 50px;
@ -138,249 +118,8 @@ body {
} }
.cta-btn:hover { .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);
}
/* .btn-view-courses {
background: var(--primary);
color: #fff;
transition: all 0.3s ease;
}
.btn-view-courses:hover {
background: var(--secondary); 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); 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> </style>
@ -401,12 +140,14 @@ body {
<section class="py-5 overflow-hidden"> <section class="py-5 overflow-hidden">
<div class="container"> <div class="container">
<div class="row align-items-center g-5"> <div class="row align-items-center g-5">
<!-- වමේ සිට දකුණට පැමිණේ -->
<div class="col-md-6 animate-item slide-left-init"> <div class="col-md-6 animate-item slide-left-init">
<img src="https://images.pexels.com/photos/3862130/pexels-photo-3862130.jpeg" <img src="https://images.pexels.com/photos/3862130/pexels-photo-3862130.jpeg"
class="img-fluid rounded shadow-lg" class="img-fluid rounded shadow-lg"
alt="About Image"> alt="About Image">
</div> </div>
<!-- දකුණේ සිට වමට පැමිණේ -->
<div class="col-md-6 animate-item slide-right-init"> <div class="col-md-6 animate-item slide-right-init">
<h2 class="fw-bold mb-3">Who We Are</h2> <h2 class="fw-bold mb-3">Who We Are</h2>
<p class="text-muted fs-5"> <p class="text-muted fs-5">
@ -418,7 +159,7 @@ body {
We focus on building skilled professionals who are ready for We focus on building skilled professionals who are ready for
the global automotive industry. the global automotive industry.
</p> </p>
<a href="/courses" class="btn btn-view-courses btn-lg px-4 rounded-pill shadow-sm"> <a href="{{ route('courses') }}" class="btn btn-dark btn-lg px-4 rounded-pill">
View Courses View Courses
</a> </a>
</div> </div>
@ -436,97 +177,7 @@ body {
</div> </div>
<div class="row g-4"> <div class="row g-4">
<div class="col-md-4 animate-item zoom-in-init" style="transition-delay: 100ms;"> <!-- කාඩ් එකින් එක Zoom-in වේ -->
<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="col-md-4 animate-item zoom-in-init" style="transition-delay: 100ms;">
<div class="about-box text-center"> <div class="about-box text-center">
<div class="icon-circle"> <div class="icon-circle">
@ -594,7 +245,7 @@ document.addEventListener('DOMContentLoaded', function () {
} }
}); });
}, { }, {
threshold: 0.15 threshold: 0.15 // Element එකෙන් 15%ක් පෙනෙද්දීම ඇනිමේෂන් එක පටන් ගනී
}); });
animatedElements.forEach(el => observer.observe(el)); animatedElements.forEach(el => observer.observe(el));

View File

@ -1,233 +0,0 @@
@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

@ -1,518 +0,0 @@
<!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

@ -1,126 +0,0 @@
@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

@ -1,221 +0,0 @@
@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

@ -1,296 +0,0 @@
@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

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

View File

@ -6,29 +6,20 @@
<style> <style>
:root{ :root{
/* Premium Modern Automotive Palette */ --primary:#5E244E;
--primary: #3E51B8; /* Tech Blue */ --secondary:#8B3A74;
--primary-light: #0a67df; /* Vibrant Electric Blue */ --light:#f8f4f7;
--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 { body {
font-family: 'Segoe UI', Arial, sans-serif; font-family: Arial, Helvetica, sans-serif;
color: var(--text-main);
} }
.hero-contact{ .hero-contact{
min-height:50vh; min-height:50vh;
background: background:
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'); linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),
url('https://images.pexels.com/photos/3184465/pexels-photo-3184465.jpeg');
background-size:cover; background-size:cover;
background-position:center; background-position:center;
display:flex; display:flex;
@ -42,39 +33,37 @@ body {
background:#fff; background:#fff;
border-radius:20px; border-radius:20px;
padding:35px; padding:35px;
box-shadow: 0 10px 30px rgba(0,0,0,.04); box-shadow: 0 10px 30px rgba(0,0,0,.05);
border: 1px solid var(--card-border); border: 1px solid #efeff4;
} }
.form-control{ .form-control{
border-radius:10px; border-radius:10px;
padding:12px; padding:12px;
border: 1px solid #cbd5e1; border: 1px solid #ced4da;
transition: all 0.3s ease; transition: all 0.3s ease;
} }
.form-control:focus { .form-control:focus {
border-color: var(--primary-light); border-color: var(--primary);
box-shadow: 0 0 0 4px rgba(10, 103, 223, 0.15); box-shadow: 0 0 0 0.25rem rgba(94, 36, 78, 0.25);
outline: 0;
} }
.btn-contact{ .btn-contact{
background: #6a2525 ; background:var(--primary);
color:#fff; color:#fff;
border-radius:10px; border-radius:10px;
padding:12px 30px; padding:12px 30px;
font-weight: 600; font-weight: 600;
transition: all 0.3s ease; transition: all 0.3s ease;
border: none; border: none;
box-shadow: 0 4px 12px rgba(62, 81, 184, 0.2);
} }
.btn-contact:hover{ .btn-contact:hover{
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%); background:var(--secondary);
color:#fff; color:#fff;
transform: translateY(-2px); transform: translateY(-2px);
box-shadow: 0 6px 15px rgba(188, 26, 26, 0.3); box-shadow: 0 5px 15px rgba(94, 36, 78, 0.3);
} }
.info-card{ .info-card{
@ -83,23 +72,19 @@ body {
padding:20px; padding:20px;
text-align:center; text-align:center;
box-shadow: 0 5px 20px rgba(0,0,0,.04); box-shadow: 0 5px 20px rgba(0,0,0,.04);
border: 1px solid var(--card-border); border: 1px solid #efeff4;
transition:.3s; transition:.3s;
} }
.info-card:hover{ .info-card:hover{
transform:translateY(-5px); transform:translateY(-5px);
border-color: var(--primary-light); border-color: var(--primary);
box-shadow: 0 10px 25px rgba(62, 81, 184, 0.1); box-shadow: 0 10px 25px rgba(94, 36, 78, 0.08);
} }
.info-card i { .info-card i {
color: #861E28 !important; color: var(--primary) !important;
transition: color 0.3s ease;
}
.info-card:hover i {
color: var(--secondary) !important;
} }
/* ======================================================== /* ========================================================
@ -111,14 +96,17 @@ body {
transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1); transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1);
} }
.fade-up-init { .fade-up-init {
transform: translateY(30px); transform: translateY(30px);
} }
.slide-left-init { .slide-left-init {
transform: translateX(-40px); transform: translateX(-40px);
} }
.fade-in-init { .fade-in-init {
transform: scale(0.98); transform: scale(0.98);
} }
@ -135,7 +123,7 @@ body {
<div class="container"> <div class="container">
<div class="animate-item animated fade-up-init"> <div class="animate-item animated fade-up-init">
<h1 class="fw-bold display-4">Contact Us</h1> <h1 class="fw-bold display-4">Contact Us</h1>
<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> <p class="fs-5">We are here to help you. Reach us anytime.</p>
</div> </div>
</div> </div>
</section> </section>
@ -150,34 +138,37 @@ body {
<div class="col-md-6 animate-item slide-left-init"> <div class="col-md-6 animate-item slide-left-init">
<div class="contact-box"> <div class="contact-box">
<h3 class="mb-4 fw-bold" style="color: var(--text-main);">Send Message</h3> <h3 class="mb-4 fw-bold" style="color: #1c1d1f;">Send Message</h3>
@if(session('success')) @if(session('success'))
<div class="alert alert-success"> <div class="alert alert-success">
{{ session('success') }} {{ session('success') }}
</div> </div>
@endif @endif
<form action="{{ route('contact.store') }}" method="POST"> <form action="{{ route('contact.store') }}" method="POST">
@csrf @csrf
<div class="mb-3"> <div class="mb-3">
<label class="form-label fw-semibold text-secondary-emphasis">Name</label> <label class="form-label fw-semibold">Name</label>
<input type="text" name="name" class="form-control" placeholder="Your Name" required> <input type="text" name="name" class="form-control" placeholder="Your Name" required>
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label class="form-label fw-semibold text-secondary-emphasis">Email</label> <label class="form-label fw-semibold">Email</label>
<input type="email" name="email" class="form-control" placeholder="Your Email" required> <input type="email" name="email" class="form-control" placeholder="Your Email" required>
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label class="form-label fw-semibold text-secondary-emphasis">Subject</label> <label class="form-label fw-semibold">Subject</label>
<input type="text" name="subject" class="form-control" placeholder="Subject" required> <input type="text" name="subject" class="form-control" placeholder="Subject" required>
</div> </div>
<div class="mb-3"> <div class="mb-3">
<label class="form-label fw-semibold text-secondary-emphasis">Message</label> <label class="form-label fw-semibold">Message</label>
<textarea name="message" rows="5" class="form-control" placeholder="Your Message" required></textarea> <textarea name="message" rows="5" class="form-control" placeholder="Your Message" required></textarea>
</div> </div>
@ -190,7 +181,7 @@ Send Message
</div> </div>
</div> </div>
<!-- Info Cards -->
<div class="col-md-6 animate-item fade-in-init"> <div class="col-md-6 animate-item fade-in-init">
<div class="info-card mb-3"> <div class="info-card mb-3">
@ -225,18 +216,38 @@ Send Message
</section> </section>
<!-- MAP --> <!-- MAP -->
<section class="pb-5"> <section class="pb-5">
<div class="container animate-item fade-up-init"> <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> -->
<iframe <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" 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%" 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" height="350"
style="border:0;border-radius:20px; box-shadow: 0 10px 30px rgba(0,0,0,.04); border: 1px solid var(--card-border);" style="border:0;border-radius:20px; box-shadow: 0 10px 30px rgba(0,0,0,.05);"
allowfullscreen="" allowfullscreen=""
loading="lazy"> loading="lazy">
</iframe> </iframe>
</div> </div>
</section> </section> -->
<script> <script>
document.addEventListener('DOMContentLoaded', function () { document.addEventListener('DOMContentLoaded', function () {
@ -256,7 +267,5 @@ document.addEventListener('DOMContentLoaded', function () {
animatedElements.forEach(el => observer.observe(el)); animatedElements.forEach(el => observer.observe(el));
}); });
</script> </script>
|
@endsection @endsection

View File

@ -1,75 +1,60 @@
@extends('layouts.app') @extends('layouts.app')
@section('title', 'Our Courses') @section('title','Our Courses')
@section('content') @section('content')
<style> <style>
:root { :root{
/* Premium Modern Automotive Palette */ --primary:#5E244E;
--primary: #3E51B8; --secondary:#8B3A74;
--primary-light: #0a67df; --light:#f8f4f7;
--secondary: #BC1A1A; --card-border: #efeff4;
--secondary-hover: #822424; --text-muted: #6a6f73;
--accent-dark: #753939; --success-green: #1f8a4c;
--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 { body {
font-family: 'Segoe UI', Arial, sans-serif; font-family: Arial, Helvetica, sans-serif;
color: var(--text-main);
background-color: #ffffff;
} }
/* ===== Hero Section ===== */
.hero { .hero {
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-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-size: cover; background-size: cover;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
color: #ffffff; color: #ffffff;
padding: 130px 0; padding: 120px 0;
text-align: center; text-align: center;
} }
.hero h1 { .hero h1{
font-size: 55px; font-size:50px;
font-weight: 800; font-weight:700;
text-shadow: 0 2px 15px rgba(0,0,0,0.4);
} }
.hero p { .hero p{
max-width: 700px; max-width:700px;
margin: auto; margin:auto;
font-size: 19px; font-size:18px;
color: #F1F5F9;
} }
/* --- Premium Search Box Styling --- */ /* --- Search Box Styling --- */
.search-box { .search-box {
max-width: 550px; max-width: 500px;
margin: 35px auto 0 auto; margin: 30px auto 0 auto;
position: relative; position: relative;
display: flex; display: flex;
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25); box-shadow: 0 8px 25px rgba(0,0,0,0.1);
overflow: hidden; overflow: hidden;
background: #fff; background: #fff;
border-radius: 100px; border-radius: 100px;
border: 1px solid rgba(255, 255, 255, 0.1);
} }
.search-box input { .search-box input {
width: 100%; width: 100%;
padding: 16px 28px; padding: 15px 25px;
border: none; border: none;
outline: none; outline: none;
font-size: 16px; font-size: 16px;
@ -77,107 +62,92 @@ body {
} }
.search-box button { .search-box button {
background: linear-gradient(135deg, #13141A 0%, #8ca8e9 100%); background: var(--primary);
color: #fff; color: #fff;
border: none; border: none;
padding: 0 30px; padding: 0 25px;
cursor: pointer; cursor: pointer;
transition: all 0.3s ease; transition: 0.3s;
font-size: 18px; font-size: 18px;
} }
.search-box button:hover { .search-box button:hover {
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%); background: var(--secondary);
} }
/* ===== HORIZONTAL COURSE CARDS ===== */
.course-card { .course-card {
border: 1px solid var(--card-border);
border-radius: 20px;
overflow: hidden; overflow: hidden;
background: #fff; background: #fff;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); transition: transform 0.3s ease, box-shadow 0.3s ease;
box-shadow: none;
scale: .99;
} }
.course-card:hover { .course-card:hover {
transform: translateY(-6px); transform: translateY(-5px);
box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08);
} }
.course-image-wrapper { .course-image-wrapper {
padding: 20px; padding: 16px;
height: 100%;
} }
.course-card img { .course-card img {
height: 220px; height: 200px;
width: 100%; width: 100%;
object-fit: cover; object-fit: cover;
transition: transform 0.6s cubic-bezier(0.165, 0.84, 0.44, 1); /* border-radius: 14px; */
}
.course-card:hover img {
transform: scale(1.04);
} }
.course-card .card-body { .course-card .card-body {
padding: 32px 32px 32px 10px; padding: 24px;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
@media (max-width: 767px) {
.course-card .card-body {
padding: 0 24px 24px 24px;
}
}
.course-title { .course-title {
font-size: 23px; font-size: 21px;
font-weight: 750; font-weight: 700;
line-height: 1.3; line-height: 1.3;
color:#2B2B2B; color: #1c1d1f;
margin-bottom: 8px; margin-bottom: 8px;
transition: color 0.3s ease;
}
.course-card:hover .course-title {
color: var(--secondary);
} }
.course-author { .course-author {
font-size: 14px; font-size: 14px;
font-weight: 600; color: var(--text-muted);
color: #910909; margin-bottom: 12px;
margin-bottom: 14px;
} }
.course-short-desc { .course-short-desc {
font-size: 14.5px; font-size: 14px;
color: #556575; color: #4f5357;
margin-bottom: 20px; margin-bottom: 16px;
line-height: 1.6; line-height: 1.5;
} }
.course-meta-row { .course-meta-row {
display: flex; display: flex;
align-items: center; align-items: center;
flex-wrap: wrap; flex-wrap: wrap;
gap: 12px; gap: 8px;
margin-bottom: 18px; margin-bottom: 14px;
} }
.badge-bestseller { .badge-bestseller {
background: linear-gradient(135deg, var(--secondary) 0%, var(--accent-orange) 100%); background-color: #ece3f1;
color: #fff; color: var(--primary);
font-weight: 700; font-weight: 700;
font-size: 10.5px; font-size: 11px;
padding: 4px 12px; padding: 3px 10px;
border-radius: 30px; border-radius: 4px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.05em;
box-shadow: 0 4px 10px rgba(188, 26, 26, 0.2);
} }
.rating-star { .rating-star {
color: #f39c12; color: #b4690e;
font-weight: 700; font-weight: 700;
font-size: 14px; font-size: 14px;
display: flex; display: flex;
@ -187,21 +157,20 @@ body {
.rating-count { .rating-count {
color: var(--text-muted); color: var(--text-muted);
font-size: 13.5px; font-size: 13px;
font-weight: 500;
} }
.course-features { .course-features {
display: flex; display: flex;
gap: 20px; gap: 15px;
font-size: 13.5px; font-size: 13px;
color: var(--success-green); color: var(--success-green);
margin-bottom: 24px; margin-bottom: 20px;
font-weight: 600; font-weight: 500;
} }
.course-features span i { .course-features span i {
margin-right: 6px; margin-right: 4px;
} }
.course-footer { .course-footer {
@ -209,129 +178,116 @@ body {
} }
.read-btn { .read-btn {
background: #822424; background: var(--primary);
color: #fff; color: #fff;
padding: 13px 28px; padding: 12px 20px;
font-weight: 600; font-weight: 600;
border-radius: 8px;
font-size: 15px; font-size: 15px;
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); transition: 0.2s;
border: 2px solid transparent; border: none;
text-decoration: none; text-decoration: none;
display: block; display: block;
text-align: center; text-align: center;
box-shadow: 0 4px 12px rgba(10, 103, 223, 0.2);
} }
.read-btn:hover { .read-btn:hover {
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%); background: var(--secondary);
color: #fff; color: #fff;
transform: translateY(-2px);
box-shadow: 0 6px 18px rgba(188, 26, 26, 0.3);
} }
/* --- Features Section --- */ /* --- Modernized Why Study With Us Section --- */
.features-section { .features-section {
background-color: var(--bg-light); background-color: #f8f9fa;
padding: 80px 40px; border-radius: 24px;
margin-bottom: 40px; padding: 60px 40px;
background-image: radial-gradient(rgba(62, 81, 184, 0.04) 1px, transparent 0); margin-bottom: 60px;
background-size: 20px 20px;
} }
.features-section h2 { .features-section h2 {
font-size: 45px; font-size: 32px;
font-weight: 800; font-weight: 700;
color: #ffffff; color: #1c1d1f;
margin-bottom: 54px; margin-bottom: 40px;
} }
.feature-box { .feature-box {
background: #fff; background: #fff;
padding: 40px 28px; padding: 30px 24px;
border-radius: 24px; border-radius: 16px;
height: 100%; height: 100%;
transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 0.3s ease;
border: 1px solid var(--card-border); border: 1px solid #efeff4;
text-align: center; text-align: left;
box-shadow: 0 6px 20px rgba(62, 81, 184, 0.02);
} }
.feature-icon-wrapper { .feature-icon-wrapper {
width: 58px; width: 50px;
height: 58px; height: 50px;
background-color: rgba(62, 81, 184, 0.08); background-color: #ece3f1;
color: var(--primary); color: var(--primary);
border-radius: 16px; border-radius: 12px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
font-size: 24px; font-size: 22px;
margin-bottom: 24px; margin-bottom: 20px;
transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); transition: transform 0.5s ease;
margin-left: 38%;
} }
.feature-box:hover {
transform: translateY(-8px); .feature-box:hover {
box-shadow: 0 15px 35px rgba(62, 81, 184, 0.12); transform: translateY(-5px);
border-color: rgba(188, 26, 26, 0.2); box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
color:#6a2525 ; border-color: var(--primary);
} }
.feature-box:hover .feature-icon-wrapper {
background: linear-gradient(135deg, var(--secondary) 0%, var(--accent-orange) 100%); .feature-box:hover .feature-icon-wrapper i {
color: #fff; transform: rotate(360deg);
transform: rotateY(180deg);
box-shadow: 0 8px 15px rgba(188, 26, 26, 0.25);
} }
.feature-icon-wrapper i { .feature-icon-wrapper i {
transition: transform 0.4s ease; transition: transform 0.5s ease;
}
.feature-box:hover .feature-icon-wrapper i {
transform: rotateY(-180deg);
} }
.feature-box h5 { .feature-box h5 {
font-size: 19px; font-size: 18px;
font-weight: 700; font-weight: 700;
color: #181818; color: #1c1d1f;
margin-bottom: 12px; margin-bottom: 10px;
}
.feature-box h5:hover {
color: #822424 ;
} }
.feature-box p { .feature-box p {
font-size: 14.5px; font-size: 14px;
color: var(--text-muted); color: var(--text-muted);
margin-bottom: 0; margin-bottom: 0;
line-height: 1.6; line-height: 1.5;
} }
#noResults { #noResults {
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
color: var(--text-muted); color: #666;
margin-top: 30px; margin-top: 20px;
} }
/* Animations */ /* ========================================================
.animate-on-scroll { Custom Pure CSS Animations (Scroll Animations)
======================================================== */
/* .animate-on-scroll {
opacity: 0; opacity: 0;
transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1); transition: all 0.8s ease-out;
} }
.fade-up-init { .fade-up-init {
transform: translateY(40px); transform: translateY(30px);
} }
.animate-on-scroll.animated { .animate-on-scroll.animated {
opacity: 1; opacity: 1;
transform: translateY(0); transform: translateY(0);
} } */
</style> </style>
{{-- Hero --}} {{-- Hero --}}
@ -357,6 +313,77 @@ body {
</div> </div>
</section> </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"> <section class="py-5">
<div class="container"> <div class="container">
@ -365,52 +392,35 @@ body {
</div> </div>
<div class="row g-4" id="courseContainer"> <div class="row g-4" id="courseContainer">
@forelse($courses as $index => $course) @foreach($courses as $index => $course)
<div class="col-12 course-item animate-on-scroll fade-up-init" style="transition-delay: {{ $index * 100 }}ms;"> <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="card course-card h-100">
<div class="row g-0 align-items-center"> <div class="row g-0 align-items-center">
{{-- Course Image --}}
<div class="col-md-4"> <div class="col-md-4">
<div class="course-image-wrapper"> <div class="course-image-wrapper">
<img src="{{ $course->image }}" alt="{{ $course->title }}"> <img src="{{ $course['image'] }}" alt="{{ $course['title'] }}">
</div> </div>
</div> </div>
{{-- Course Details --}}
<div class="col-md-8"> <div class="col-md-8">
<div class="card-body"> <div class="card-body">
<h4 class="course-title">{{ $course->title }}</h4> <h4 class="course-title">{{ $course['title'] }}</h4>
<div class="course-author">{{ $course['author'] }}</div>
@if($course->author) <p class="course-short-desc">{{ $course['desc'] }}</p>
<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"> <div class="course-meta-row">
@if($course->badge) <span class="badge-bestseller">{{ $course['badge'] }}</span>
<span class="badge-bestseller">{{ $course->badge }}</span> <span class="rating-star">
@endif <i class="fas fa-star"></i> {{ $course['rating'] }}
</span>
@if($course->rating) <span class="rating-count">({{ $course['students'] }})</span>
<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>
<div class="course-features"> <div class="course-features">
<span><i class="fas fa-tools"></i> Level: {{ $course->level ?? 'General' }}</span> <span><i class="fas fa-tools"></i> Practical Labs</span>
@if($course->duration) <span><i class="fas fa-certificate"></i> Verified ({{ $course['duration'] }})</span>
<span><i class="fas fa-certificate"></i> Duration: {{ $course->duration }}</span>
@endif
</div> </div>
<div class="course-footer" style="max-width: 200px;"> <div class="course-footer" style="max-width: 200px;">
@ -422,24 +432,16 @@ body {
</div> </div>
</div> </div>
</div> </div>
@empty @endforeach
<div class="col-12 text-center py-5">
<h4>No courses available at the moment.</h4>
</div>
@endforelse
</div> </div>
</div> </div>
</section> </section>
{{-- Why Study With Us Section --}} {{-- Why Study With Us Section --}}
<section class="pb-5 why-study-section"> <section class="pb-5">
<div class="container"> <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> <h2>Why Study With Us?</h2>
<div class="row g-4"> <div class="row g-4">
@ -497,8 +499,8 @@ document.addEventListener('DOMContentLoaded', function () {
let hasResults = false; let hasResults = false;
courseItems.forEach(function(item) { courseItems.forEach(function(item) {
let title = item.querySelector('.course-title') ? item.querySelector('.course-title').textContent.toLowerCase() : ''; let title = item.querySelector('.course-title').textContent.toLowerCase();
let desc = item.querySelector('.course-short-desc') ? item.querySelector('.course-short-desc').textContent.toLowerCase() : ''; let desc = item.querySelector('.course-short-desc').textContent.toLowerCase();
if (title.includes(filter) || desc.includes(filter)) { if (title.includes(filter) || desc.includes(filter)) {
item.style.setProperty('display', '', 'important'); item.style.setProperty('display', '', 'important');

View File

@ -1,437 +0,0 @@
<!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

@ -1,466 +0,0 @@
<!-- 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

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

View File

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

View File

@ -1,83 +0,0 @@
<!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

@ -1,219 +0,0 @@
@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,39 +4,46 @@
@section('content') @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> <style>
:root { :root {
--theme-navy: #2D355B; /* Primary Navy */ --purple-main: #5E244E;
--theme-navy-dark: #1F2541; /* Dark Navy */ --purple-dark: #4a1c3e;
--theme-red: #822424; /* Primary Accent Red */ --purple-light: #744a68;
--theme-red-hover: #df2c3e; /* Red Hover */ --gold-accent: #D4AF37;
--theme-yellow: #FFEA85; /* Accent Yellow/Gold */ --gold-hover: #b8972e;
--bg-light: #F6F6F6; /* Page Background */ --bg-light: #f8fafc;
--white: #ffffff; --white: #ffffff;
} }
body { body {
background: var(--bg-light); background: var(--bg-light);
font-family: 'Segoe UI', sans-serif; font-family: 'Poppins', sans-serif;
} }
.main-portal-content { .main-portal-content {
padding: 10px 5px; padding: 20px 15px;
min-height: 100vh; min-height: 100vh;
transition: all 0.3s ease; transition: all 0.3s ease;
} }
/* Premium Hero Section */ /* Premium Hero Section */
.hero { .hero {
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important; background: linear-gradient(135deg, var(--purple-main) 0%, var(--purple-dark) 100%) !important;
color: var(--white) !important; color: var(--white) !important;
border-radius: 16px; border-radius: 20px;
padding: 35px 30px; padding: 30px 20px;
margin-bottom: 30px; margin-bottom: 30px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15); box-shadow: 0 10px 30px rgba(74, 28, 62, 0.15);
position: relative; position: relative;
overflow: hidden; overflow: hidden;
border-left: 5px solid var(--theme-red);
} }
.hero::after { .hero::after {
@ -53,34 +60,33 @@ body {
/* Course Card */ /* Course Card */
.course-card { .course-card {
border: 1px solid #e2e8f0 !important; border: none !important;
border-radius: 16px !important; border-radius: 20px !important;
overflow: hidden; overflow: hidden;
box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.05) !important;
background: var(--white); background: var(--white);
margin-bottom: 30px; margin-bottom: 30px;
} }
.course-card img { .course-card img {
height: 240px; height: 200px;
object-fit: cover; object-fit: cover;
width: 100%; width: 100%;
} }
/* Sidebar Info Boxes */ /* Sidebar Info Boxes */
.info-box { .info-box {
border-radius: 12px !important; border-radius: 16px !important;
padding: 20px 24px; padding: 20px 24px;
background: var(--white); background: var(--white);
box-shadow: 0 4px 12px rgba(219, 240, 99, 0.04) !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.03) !important;
border: 1px solid #e2e8f0 !important; border: 1px solid rgba(94, 36, 78, 0.05) !important;
transition: all 0.3s ease; transition: all 0.3s ease;
} }
.info-box:hover { .info-box:hover {
transform: translateY(-3px); transform: translateY(-3px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08) !important; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06) !important;
border-color: var(--theme-navy) !important;
} }
.stat-icon { .stat-icon {
@ -89,270 +95,277 @@ body {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
border-radius: 10px; border-radius: 12px;
font-size: 18px; font-size: 18px;
background: var(--theme-red) !important; background: rgba(94, 36, 78, 0.08);
color: #ffff8d; color: var(--purple-main);
} }
/* Modules Card */ /* Modules Card */
.module-card { .module-card {
border: 1px solid #e2e8f0 !important; border: 1px solid rgba(94, 36, 78, 0.06) !important;
border-radius: 14px !important; border-radius: 16px !important;
transition: all 0.3s ease; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
background: var(--white); background: var(--white);
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03) !important; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.02) !important;
} }
.module-card:hover { .module-card:hover {
transform: translateY(-4px); transform: translateY(-5px);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08) !important; box-shadow: 0 12px 25px rgba(0, 0, 0, 0.08) !important;
border-color: var(--theme-red) !important; border-color: var(--purple-light) !important;
} }
/* Progress bar customizations */ /* Progress bar customizations */
.progress { .progress {
height: 10px !important; height: 10px !important;
border-radius: 50px !important; border-radius: 50px !important;
background-color: #e2e8f0 !important; background-color: #f1f5f9 !important;
} }
.progress-bar { .progress-bar {
border-radius: 50px !important; border-radius: 50px !important;
background: linear-gradient(90deg, var(--theme-red), var(--theme-red-hover)) !important; background: linear-gradient(90deg, var(--gold-accent), #f4d05e) !important;
} }
/* Status Badges */ /* Status Badges */
.status { .status {
font-size: 11px; font-size: 11px;
font-weight: 700; font-weight: 600;
padding: 6px 14px; padding: 5px 14px;
border-radius: 50px; border-radius: 50px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 0.5px; letter-spacing: 0.5px;
} }
.completed { background: rgba(45, 53, 91, 0.12); color: var(--theme-navy); } .completed { background: rgba(94, 36, 78, 0.1); color: var(--purple-main); }
.progressing { background: rgba(247, 63, 82, 0.15); color: var(--theme-red); } .progressing { background: rgba(212, 175, 55, 0.15); color: #9c7e1c; }
.locked { background: #e2e8f0; color: #64748b; } .locked { background: #f1f5f9; color: #64748b; }
/* Custom Buttons */ /* Custom Buttons */
.btn-theme-red { .btn-gold {
background-color: var(--theme-red) !important; background-color: var(--gold-accent) !important;
border-color: var(--theme-red) !important; border-color: var(--gold-accent) !important;
color: #fff !important; color: #fff !important;
border-radius: 8px; border-radius: 10px;
font-weight: 600; 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-theme-navy { .btn-purple {
background-color: var(--theme-navy) !important; background-color: var(--purple-main) !important;
border-color: var(--theme-navy) !important; border-color: var(--purple-main) !important;
color: #fff !important; color: #fff !important;
border-radius: 8px; border-radius: 10px;
font-weight: 600; font-weight: 500;
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 { .btn-continue {
background-color: var(--theme-red) !important; background-color: #fff !important;
color: #ffffff !important; color: var(--purple-main) !important;
border-radius: 8px; border-radius: 10px;
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) { @media (min-width: 768px) {
.main-portal-content { padding: 10px; } .main-portal-content {
.hero { padding: 40px; } padding: 34px;
.course-card img { height: 280px; } }
.hero {
padding: 45px;
}
.course-card img {
height: 280px;
}
}
@media (min-width: 992px) {
.main-portal-content {
margin-left: 18px;
}
} }
</style> </style>
<div class="main-portal-content"> <div class="main-portal-content">
<div class="container-fluid"> <div class="container-fluid">
@if($course) <!-- Hero Section -->
<div class="hero">
{{-- Dynamic Image URL Handler --}} <div class="row align-items-center">
@php <div class="col-lg-9 col-md-8 text-start">
$imageSrc = Str::startsWith($course->image, ['http://', 'https://']) <h1 class="fw-bold display-6 mb-2">Diploma in Automotive Engineering</h1>
? $course->image <p class="lead mb-4 small opacity-75">Welcome back! Continue your learning journey and complete all modules.</p>
: asset('storage/' . $course->image); <a href="#" class="btn btn-continue px-4 py-2 fw-semibold shadow-sm">
@endphp <i class="fa fa-play me-2"></i> Continue Learning
</a>
<!-- Hero Section --> </div>
<div class="hero"> <div class="col-lg-3 col-md-4 text-center d-none d-md-block">
<div class="row align-items-center"> <i class="fa-solid fa-car-side" style="font-size:100px; opacity:.2; color: var(--gold-accent);"></i>
<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> </div>
</div>
<!-- Main Content Grid --> <!-- Main Content Grid -->
<div class="row g-4"> <div class="row g-4">
<!-- LEFT COLUMN: Course details & Modules -->
<div class="col-lg-8 col-12">
<!-- LEFT COLUMN: Course details & Modules --> <!-- Main Course Card -->
<div class="col-lg-8 col-12"> <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">
<!-- Main Course Card --> <div class="card-body p-4">
<div class="card course-card"> <div class="d-flex flex-wrap justify-content-between align-items-start gap-2 mb-3">
<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>
<div class="card-body p-4"> <h3 class="fw-bold text-dark mb-1">AE101</h3>
<div class="d-flex flex-wrap justify-content-between align-items-start gap-2 mb-3"> <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>
</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>
<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>
</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>
<h3 class="fw-bold mb-1" style="color: var(--theme-navy);">{{ $course->course_code ?? $course->title }}</h3> <div class="d-flex justify-content-between align-items-start gap-2 mb-2">
<p class="text-muted small mb-0"> <h6 class="fw-bold text-dark mb-0">Engine Fundamentals</h6>
<i class="fa-solid fa-user me-1" style="color: var(--theme-red);"></i> {{ $course->author ?? 'Instructor' }} <span class="status completed">Completed</span>
</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>
<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="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>
<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>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <!-- Module 2 -->
<div class="col-md-6 col-12">
<!-- RIGHT COLUMN: Sidebar Statistics --> <div class="card module-card h-100">
<div class="col-lg-4 col-12"> <div class="card-body p-4 d-flex flex-column justify-content-between">
<div class="row g-3"> <div>
<div class="col-12"> <div class="d-flex justify-content-between align-items-start gap-2 mb-2">
<div class="info-box d-flex align-items-center"> <h6 class="fw-bold text-dark mb-0">Transmission Systems</h6>
<div class="stat-icon"><i class="fa fa-layer-group"></i></div> <span class="status progressing">In Progress</span>
<div class="ms-3"> </div>
<h5 class="fw-bold mb-0" style="color: var(--theme-navy);">{{ $course->level ?? 'General' }}</h5> <p class="text-muted small">Manual & Automatic transmission systems.</p>
<span class="text-muted small">Course Level</span> </div>
<div class="mt-3">
<button class="btn btn-gold w-100 btn-sm py-2">Continue Learning</button>
</div> </div>
</div> </div>
</div> </div>
</div>
<div class="col-12"> <!-- Module 3 -->
<div class="info-box d-flex align-items-center"> <div class="col-md-6 col-12">
<div class="stat-icon"><i class="fa fa-clock"></i></div> <div class="card module-card h-100">
<div class="ms-3"> <div class="card-body p-4 d-flex flex-column justify-content-between">
<h5 class="fw-bold mb-0" style="color: var(--theme-navy);">{{ $course->duration ?? 'N/A' }}</h5> <div>
<span class="text-muted small">Course Duration</span> <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>
</div> </div>
</div>
<div class="col-12"> <!-- Module 4 -->
<div class="info-box d-flex align-items-center"> <div class="col-md-6 col-12">
<div class="stat-icon"><i class="fa fa-award"></i></div> <div class="card module-card h-100">
<div class="ms-3"> <div class="card-body p-4 d-flex flex-column justify-content-between">
<h5 class="fw-bold mb-0" style="color: var(--theme-navy);">{{ $course->status ?? 'Enrolled' }}</h5> <div>
<span class="text-muted small">Status</span> <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> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> <!-- End Row --> </div>
@else <!-- 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>
<!-- Empty State: When no course is assigned --> <div class="col-12">
<div class="row justify-content-center py-5"> <div class="info-box d-flex align-items-center">
<div class="col-md-8 text-center"> <div class="stat-icon"><i class="fa fa-clock"></i></div>
<div class="p-5 rounded-4 shadow-sm bg-white border"> <div class="ms-3">
<i class="fas fa-graduation-cap fa-4x text-muted mb-3"></i> <h5 class="fw-bold mb-0" style="color: var(--purple-dark);">2 Years</h5>
<h3 class="fw-bold text-dark mb-2">No Assigned Course Found</h3> <span class="text-muted small">Course Duration</span>
<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 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>
</div> </div>
</div> </div>
</div> </div>
@endif </div> <!-- End Row -->
</div> </div>
</div> </div>
<script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
function goToModule(moduleId) {
window.location.href = "{{ url('/module') }}/" + moduleId;
}
</script>
@endsection @endsection

View File

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

View File

@ -4,420 +4,525 @@
@section('content') @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">
<!-- 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> <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 { body{
font-family: 'Poppins', sans-serif; background:#f6f7fb;
background: var(--bg-light);
} }
/* ======================= /* =======================
Hero Section Hero
======================= */ ======================= */
.result-hero {
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important; .result-hero{
color: var(--white);
border-radius: 16px; background:linear-gradient(135deg,#5E244E,#4a1c3e);
padding: 35px 30px; color:#fff;
margin-bottom: 30px; border-radius:20px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15); padding:40px;
border-left: 5px solid var(--theme-red); margin-bottom:30px;
box-shadow:0 15px 35px rgba(0,0,0,.15);
} }
.result-hero h2 { .result-hero h2{
font-weight: 700;
font-weight:700;
} }
.result-hero p { .result-hero p{
color: rgba(255, 255, 255, 0.85);
margin-bottom: 0; color:#ddd;
margin-bottom:0;
} }
/* ======================= /* =======================
Summary Cards Summary Cards
======================= */ ======================= */
.summary-card {
background: var(--white); .summary-card{
border: 1px solid #e2e8f0;
border-radius: 16px; background:#fff;
padding: 25px; border:none;
text-align: center; border-radius:20px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04); padding:25px;
transition: all 0.3s ease; text-align:center;
box-shadow:0 10px 25px rgba(0,0,0,.08);
transition:.3s;
} }
.summary-card:hover { .summary-card:hover{
transform: translateY(-4px);
border-color: var(--theme-navy); transform:translateY(-5px);
box-shadow: 0 10px 22px rgba(0, 0, 0, 0.08);
} }
.summary-card i { .summary-card i{
font-size: 36px;
color: var(--theme-red); font-size:40px;
margin-bottom: 12px; color:#5E244E;
margin-bottom:15px;
} }
.summary-card h3 { .summary-card h3{
color: var(--theme-navy);
font-weight: 700; color:#5E244E;
margin-bottom: 4px; font-weight:700;
} }
.summary-card small { .summary-card small{
color: #64748b;
font-weight: 500; color:#777;
} }
/* ======================= /* =======================
Result Table Result Table
======================= */ ======================= */
.result-card {
margin-top: 30px; .result-card{
background: var(--white);
border: 1px solid #e2e8f0; margin-top:35px;
border-radius: 16px; background:#fff;
overflow: hidden; border-radius:20px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04); overflow:hidden;
box-shadow:0 10px 30px rgba(0,0,0,.08);
} }
.table-head { .table-head{
background: var(--theme-navy);
color: var(--white); background:#5E244E;
padding: 18px 25px; color:#fff;
padding:18px 25px;
} }
.table { .table{
margin-bottom: 0;
margin-bottom:0;
} }
.table th { .table th{
background: #f8fafc;
color: var(--theme-navy); background:#744a68;
font-weight: 600; color:#fff;
border-bottom: 2px solid #e2e8f0; border:none;
padding: 14px 20px;
} }
.table td { .table td{
vertical-align: middle;
padding: 14px 20px; vertical-align:middle;
} }
.grade { .grade{
padding: 5px 14px;
border-radius: 30px; padding:7px 15px;
font-weight: 600; border-radius:30px;
font-size: 13px; font-weight:600;
color: var(--white); color:#fff;
display: inline-block; display:inline-block;
} }
.grade.a { .a{
background: var(--theme-navy);
background:#28a745;
} }
.grade.b { .b{
background: var(--theme-red);
background:#17a2b8;
} }
.grade.c { .c{
background: #e67e22;
background:#ffc107;
color:#222;
} }
.grade.fail { .fail{
background: #dc3545;
}
.status-pass { background:#dc3545;
color: #198754;
font-weight: 600;
}
.status-fail {
color: #dc3545;
font-weight: 600;
} }
/* ======================= /* =======================
Progress Progress
======================= */ ======================= */
.progress {
height: 10px;
border-radius: 20px;
background-color: #e2e8f0;
}
.progress-bar-navy { .progress{
background-color: var(--theme-navy) !important;
}
.progress-bar-red { height:10px;
background-color: var(--theme-red) !important; border-radius:20px;
}
.align-items-stretch {
align-items: stretch !important;
padding-top: 38px;
} }
/* ======================= /* =======================
Download Card Download
======================= */ ======================= */
.download-card {
margin-top: 30px; .download-card{
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important;
color: var(--white); margin-top:30px;
border-radius: 16px; background:#4a1c3e;
padding: 30px; color:#fff;
display: flex; border-radius:20px;
justify-content: space-between; padding:30px;
align-items: center; display:flex;
flex-wrap: wrap; justify-content:space-between;
gap: 15px; align-items:center;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15); flex-wrap:wrap;
} }
.download-card h4 { .download-card h4{
color: var(--theme-yellow);
font-weight: 700; color:#d4af37;
margin-bottom: 6px; font-weight:700;
} }
.btn-result { .btn-result{
background-color: var(--theme-red) !important;
color: var(--white) !important; background:#d4af37;
border: none; color:#fff;
border-radius: 8px; border:none;
padding: 10px 24px; border-radius:50px;
font-weight: 600; padding:12px 30px;
transition: all 0.2s ease; font-weight:600;
} }
.btn-result:hover { .btn-result:hover{
background-color: var(--theme-red-hover) !important;
color: var(--white) !important; background:#c49d20;
color:#fff;
} }
@media(max-width:768px) {
.result-hero {
padding: 25px;
}
}
</style> </style>
<div class="container py-4"> <div class="container py-4">
<!-- Printable Area Container --> <!-- Hero -->
<div id="pdf-download-area">
<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>
<!-- 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>
<!-- Summary Cards --> <div class="col-md-4 mb-4">
<div class="row g-4">
<div class="col-md-4"> <div class="summary-card">
<div class="summary-card">
<i class="fas fa-chart-line"></i> <i class="fas fa-medal"></i>
<h3>{{ $averageMarks ?? 0 }}%</h3>
<small>Overall Average</small> <h3>3.65</h3>
</div>
<small>Current GPA</small>
</div> </div>
<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>
<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> </div>
<!-- Result Table --> <div class="col-md-4 mb-4">
<div class="result-card">
<div class="table-head d-flex justify-content-between align-items-center"> <div class="summary-card">
<h5 class="mb-0 fw-bold">
Semester Results <i class="fas fa-book"></i>
</h5>
@if(isset($results) && $results->isNotEmpty()) <h3>6 / 6</h3>
<span class="badge bg-light text-dark">
{{ optional($results->first())->academic_year }} | {{ optional($results->first())->semester }} <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> </span>
@endif
</div>
<div class="table-responsive"> </td>
<table class="table table-hover align-middle">
<thead> <td>Pass</td>
<tr>
<th>Module Code</th> </tr>
<th>Module Name</th>
<th>Marks</th> <tr>
<th>Grade</th>
<th>Status</th> <td>Brake Systems</td>
</tr>
</thead> <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>
<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>
</div> <div class="p-4">
<p class="mb-2">
Course Completion
</p>
<div class="progress mb-4">
<div class="progress-bar bg-success"
style="width:82%">
<!-- 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>
<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%">
</div>
</div>
</div> </div>
<!-- Download Section Card --> </div>
<div class="col-md-6">
<div class="download-card h-100 mt-0 flex-column justify-content-between align-items-start text-start"> <!-- Download -->
<div>
<h4 class="mb-3">Download Official Result Sheet</h4> <div class="download-card">
<p class="mb-4">
Get your latest semester examination results in official PDF format. <div>
</p>
</div> <h4>
Download Official Result Sheet
</h4>
<p class="mb-0">
Download your latest semester examination results in PDF format.
</p>
<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>
<button class="btn btn-result">
<i class="fas fa-download"></i>
Download PDF
</button>
</div> </div>
</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 @endsection

View File

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

View File

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

View File

@ -5,93 +5,74 @@
@section('content') @section('content')
<style> <style>
:root { :root{
/* Premium Modern Automotive Palette matched from previous page */ --primary:#5E244E;
--primary: #3E51B8; /* Tech Blue */ --secondary:#8B3A74;
--primary-light: #0a67df; /* Vibrant Electric Blue */ --light:#f8f4f7;
--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 { body {
font-family: 'Segoe UI', Arial, sans-serif; font-family: Arial, Helvetica, sans-serif;
color: var(--text-main);
} }
.hero { .hero{
background: linear-gradient(rgba(214, 218, 238, 0.85), rgba(0, 0, 0, 0.6)), background:linear-gradient(rgba(0,0,0,.65),rgba(0,0,0,.65)),
url('https://images.pexels.com/photos/3802510/pexels-photo-3802510.jpeg'); url('https://images.pexels.com/photos/3802510/pexels-photo-3802510.jpeg');
background-size: cover; background-size:cover;
background-position: center; background-position:center;
color: #fff; color:#fff;
padding: 80px 0; padding:80px 0;
text-align: center; text-align:center;
height: 480px;
} }
.portal-card { .portal-card{
border: none; border:none;
border-radius: 15px; border-radius:15px;
transition: .4s cubic-bezier(0.165, 0.84, 0.44, 1); transition:.4s cubic-bezier(0.165, 0.84, 0.44, 1);
box-shadow: 0 5px 20px rgba(0,0,0,.04); box-shadow:0 5px 20px rgba(0,0,0,.08);
border: 1px solid var(--card-border); border: 1px solid #efeff4;
cursor: pointer;
} }
.portal-card:hover { .portal-card:hover{
transform: translateY(-8px); transform:translateY(-8px);
border-color: #5f3131; border-color: var(--primary);
box-shadow: 0 15px 30px rgba(62, 81, 184, 0.12); box-shadow: 0 15px 30px rgba(94, 36, 78, 0.1);
} }
.portal-icon { .portal-icon{
width: 70px; width:70px;
height: 70px; height:70px;
background: #822a32; background:#5E244E;
color: #fcfcfc; color:#fff;
border-radius: 50%; border-radius:50%;
display: flex; display:flex;
align-items: center; align-items:center;
justify-content: center; justify-content:center;
font-size: 28px; font-size:28px;
margin: auto; margin:auto;
transition: 0.4s ease; transition: 0.4s ease;
} }
.portal-card:hover .portal-icon { .portal-card:hover .portal-icon {
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%); background: var(--secondary);
transform: scale(1.1); transform: scale(1.1);
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.3);
color: #ffed8b;
} }
.btn-portal { .btn-portal{
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%); background:#5E244E;
color: #fff; color:#fff;
padding: 12px 35px; padding:12px 35px;
border: none;
border-radius: 8px; border-radius: 8px;
font-weight: 600; font-weight: 600;
transition: all 0.3s ease; transition: all 0.3s ease;
} }
.btn-portal:hover { .btn-portal:hover{
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%); background:#8B3A74;
color: #f4ff8d; color:#fff;
transform: translateY(-2px); transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(188, 26, 26, 0.3); box-shadow: 0 5px 15px rgba(94, 36, 78, 0.3);
}
.btn:hover {
border-color: rgba(255, 255, 255, 0.98);
} }
.modal-content { .modal-content {
@ -100,6 +81,8 @@ body {
box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15); box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
} }
.modal.fade .modal-dialog { .modal.fade .modal-dialog {
transform: scale(0.85); transform: scale(0.85);
transition: transform 0.3s ease-out; transition: transform 0.3s ease-out;
@ -148,14 +131,14 @@ body {
} }
.form-control:focus { .form-control:focus {
border-color: var(--primary-light); border-color: var(--secondary);
box-shadow: 0 0 0 4px rgba(10, 103, 223, 0.15); box-shadow: 0 0 0 4px rgba(139, 58, 116, 0.12);
outline: 0; outline: 0;
} }
.input-group:focus-within .input-group-text { .input-group:focus-within .input-group-text {
border-color: var(--primary-light); border-color: var(--secondary);
color: var(--primary-light); color: var(--secondary);
} }
.modal-footer { .modal-footer {
@ -187,29 +170,22 @@ body {
border: none; border: none;
font-weight: 600; font-weight: 600;
padding: 10px 0; padding: 10px 0;
box-shadow: 0 4px 12px rgba(62, 81, 184, 0.2); box-shadow: 0 4px 12px rgba(94, 36, 78, 0.2);
transition: all 0.2s; transition: all 0.2s;
width: 100%; width: 100%;
border-radius: 8px; border-radius: 8px;
} }
.btn-modal-login:hover { .btn-modal-login:hover {
background: linear-gradient(135deg, var(--secondary) 0%, var(--secondary-hover) 100%); background: var(--secondary);
color: #fff; color: #fff;
transform: translateY(-1px); transform: translateY(-1px);
box-shadow: 0 6px 15px rgba(188, 26, 26, 0.3); box-shadow: 0 6px 15px rgba(94, 36, 78, 0.3);
} }
.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'); Custom CSS Scroll Animations
background-size: cover; ======================================================== */
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
color: white;
}
/* Scroll Animations */
.animate-item { .animate-item {
opacity: 0; opacity: 0;
will-change: transform, opacity; will-change: transform, opacity;
@ -234,9 +210,8 @@ body {
} }
</style> </style>
<!-- HERO SECTION -->
<section class="hero"> <section class="hero">
<div class="container" style="padding-top: 46px;"> <div class="container">
<div class="animate-item animated fade-up-init"> <div class="animate-item animated fade-up-init">
<h1 class="fw-bold display-5">Student Portal</h1> <h1 class="fw-bold display-5">Student Portal</h1>
<p class="mt-3 fs-5" style="max-width: 700px; margin: auto;"> <p class="mt-3 fs-5" style="max-width: 700px; margin: auto;">
@ -261,6 +236,7 @@ body {
</p> </p>
</div> </div>
<div class="row g-4 animate-item fade-in-init"> <div class="row g-4 animate-item fade-in-init">
<div class="col-md-4"> <div class="col-md-4">
<div class="card portal-card h-100 text-center p-4" onclick="studentlogin()"> <div class="card portal-card h-100 text-center p-4" onclick="studentlogin()">
@ -325,112 +301,25 @@ body {
</div> </div>
</section> </section>
<!-- QUICK LINKS (FIXED WITH FONTAWESOME ICONS & RESPONSIVE LAYOUT) --> <!-- QUICK LINKS -->
<section class="py-5 position-relative overflow-hidden" <section class="py-5 bg-light 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">
<div class="text-center mb-5 animate-item fade-up-init" onclick="studentlogin()">
<div class="container py-4"> <h2 class="fw-bold">Quick Links</h2>
<div class="row justify-content-center"> </div>
<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>
<!-- Links List Container --> <div class="row text-center animate-item slide-right-init" onclick="studentlogin()">
<div class="d-flex flex-column gap-3"> <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>
<!-- Item 1 --> </div>
<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" <div class="col-md-3 mb-3">
style="background: rgba(255, 255, 255, 0.7); border: 1px solid rgba(0, 0, 0, 0.05); transition: all 0.3s ease;" <a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Student Handbook</a>
onmouseover="this.style.background='#ffffff'; this.style.transform='translateX(5px)'; this.style.boxShadow='0 5px 15px rgba(0,0,0,0.08)';" </div>
onmouseout="this.style.background='rgba(255, 255, 255, 0.7)'; this.style.transform='translateX(0)'; this.style.boxShadow='none';" onclick="studentlogin()"> <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 class="d-flex align-items-center gap-3"> </div>
<div class="rounded-circle d-flex align-items-center justify-content-center flex-shrink-0" <div class="col-md-3 mb-3">
style="width: 48px; height: 48px; background-color: rgb(108, 55, 55); color: #fff;"> <a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Contact Support</a>
<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> </div>
</div> </div>
@ -465,7 +354,7 @@ body {
<div class="mb-3"> <div class="mb-3">
<label for="username" class="form-label">Username / Student ID</label> <label for="username" class="form-label">Username / Student ID</label>
<div class="input-group"> <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> <input type="text" name="username" id="username" class="form-control" placeholder="Enter your student ID" required>
</div> </div>
</div> </div>
@ -489,7 +378,7 @@ body {
<div class="modal-footer d-flex gap-2 justify-content-center"> <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="button" class="btn btn-modal-cancel" data-bs-dismiss="modal">Cancel</button>
<button type="submit" class="btn btn-modal-login" style="color: #fff; background-color: #5a212af5; border-color: #007bff;"> Login </button> <button type="submit" class="btn btn-modal-login"> Login </button>
</div> </div>
</form> </form>
</div> </div>
@ -520,4 +409,6 @@ document.addEventListener('DOMContentLoaded', function () {
}); });
</script> </script>
@endsection @endsection

View File

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

File diff suppressed because it is too large Load Diff

View File

@ -6,157 +6,73 @@ use App\Http\Controllers\StudentPortalController;
use App\Http\Controllers\ContactMsgController; use App\Http\Controllers\ContactMsgController;
use App\Http\Controllers\FeedbackController; use App\Http\Controllers\FeedbackController;
use App\Http\Controllers\studentportalnavController; 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;
/* /*
|-------------------------------------------------------------------------- |--------------------------------------------------------------------------
| Public Routes & General Pages | Web Routes
|-------------------------------------------------------------------------- |--------------------------------------------------------------------------
*/ */
// Home Page
Route::get('/', function () { Route::get('/', function () {
return view('welcome'); return view('welcome');
}); });
Route::get('/courses', [coursesController::class, 'index'])->name('courses.index'); 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::view('/students', 'students')->name('students'); Route::view('/students', 'students')->name('students');
Route::view('/abouts', 'abouts')->name('abouts'); Route::view('/abouts', 'abouts')->name('abouts');
Route::view('/contact', 'contacts')->name('contact'); Route::view('/contact', 'contacts')->name('contact');
Route::view('/signin', 'signin')->name('signin'); Route::view('/signin', 'signin')->name('signin');
Route::view('/signup', 'signup')->name('signup'); Route::view('/signup', 'signup')->name('signup');
/* //student protal
|-------------------------------------------------------------------------- Route::view('/Dashboard','StudentPortal')->name('Dashboard');
| System Auth & Contact Routes (POST) Route::view('/mycourse', 'mycourse')->name('mycourse');
|-------------------------------------------------------------------------- Route::view('/timetable','timetable')->name('timetable');
*/ Route::view('/Assignments','Assignments')->name('Assignments');
Route::post('/signuppage', [AuthController::class, 'register']); Route::view('/Studentguidelines','Studentguidelines')->name('Studentguidelines');
Route::post('/signin', [AuthController::class, 'login']); Route::view('/results','results')->name('results');
Route::post('/custom-logout', [AuthController::class, 'logout']); Route::view('/Feedback&Complain','Feedback&Complain')->name('Feedback&Complain');
Route::post('/contact-submit', [ContactMsgController::class, 'store'])->name('contact.store'); Route::view('/StudentProfile','StudentProfile')->name('StudentProfile');
/*
|--------------------------------------------------------------------------
| 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');
});