Compare commits

..

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

32 changed files with 2647 additions and 4553 deletions

View File

@ -34,94 +34,28 @@ public function studentlogin(Request $request)
} }
// public function showProfile(Request $request)
// {
public function showProfile(Request $request) // $log_id = $request->session()->get('student_id');
{
$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') // if (!$log_id) {
->where('student_portal_log_id', $log_id) // return redirect('/')->with('error', 'Please login first!');
->orWhere('student_id', $student_code) // }
->first();
if (!$student) { // $student = DB::table('student_details')
return redirect()->back()->with('error', 'Student details not found in database!'); // ->where('student_portal_log_id', $log_id)
} // ->first();
// if (!$student) {
// return redirect()->back()->with('error', 'Student details not found!');
// }
// return view('StudentProfile', compact('student'));
// }
return view('StudentProfile', compact('student'));
}
// 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('student_portal_log_id', $log_id)
// ->orWhere('student_id', $student_code)
// ->first();
// if (!$student) {
// return redirect()->back()->with('error', 'Student details not found in database!');
// }
// return view('StudentProfile', compact('student'));
// }
// 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_id', $log_id)
// ->orWhere('student_portal_log_id', $log_id)
// ->first();
// if (!$student) {
// $student = (object)[
// 'image' => '',
// 'full_name' => 'Data Not Found (Check DB)',
// 'student_id' => $log_id,
// 'nic_passport' => 'N/A',
// 'date_of_birth' => '2000-01-01',
// 'gender' => 'N/A',
// 'email' => 'N/A',
// 'phone' => 'N/A',
// 'qualification' => 'N/A',
// 'institute' => 'N/A',
// 'year_completed' => 'N/A',
// 'course_name' => 'N/A',
// 'duration' => 'N/A',
// 'current_semester' => 'N/A',
// 'trainer_name' => 'N/A'
// ];
// }
// return view('StudentProfile', compact('student'));
// }
} }

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'); // Tawa name ekak nam view name eka wenas karanna
}
public function store(Request $request)
{
// 1. Data Validation Rules
$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',
]);
// 2. Multi File Upload Process
$certificatePaths = [];
if ($request->hasFile('certificates')) {
foreach ($request->file('certificates') as $file) {
$path = $file->store('certificates', 'public');
$certificatePaths[] = $path;
}
}
// 3. Current Logged-in User ID එක set කිරීම & Data Save කිරීම
$application = new Application($validatedData);
$application->user_id = Auth::id(); // Log unukena ge ID eka attach wei
$application->certificates = $certificatePaths; // Paths array eka save wei
$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,22 +3,14 @@
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

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

View File

@ -2,29 +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'
];
} }

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,170 +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; /* Primary Navy */ background:#f6f7fb;
--theme-navy-dark: #1F2541; /* Dark Navy */
--theme-red: #822424; /* Primary Accent Red */
--theme-red-hover: #df2c3e; /* Red Hover */
--theme-yellow: #FFEA85; /* Accent Yellow/Gold */
--bg-light: #F6F6F6; /* Page Background */
--white: #ffffff;
}
body {
font-family: 'Poppins', sans-serif;
background: var(--bg-light);
} }
/* Header */ /* Header */
.feedback-header { .feedback-header{
background: linear-gradient(135deg, #2B293F 0%, #94A6F959 100%) !important; background:linear-gradient(135deg,#5E244E,#4a1c3e);
color: var(--white); color:white;
padding: 35px 30px; padding:40px;
border-radius: 16px; border-radius:20px;
margin-bottom: 30px; margin-bottom:35px;
box-shadow: 0 8px 25px rgba(31, 37, 65, 0.15); box-shadow:0 15px 35px rgba(0,0,0,.12);
border-left: 5px solid var(--theme-red);
} }
.feedback-header h2 { .feedback-header h2{
font-weight: 700; font-weight:700;
} }
.feedback-header p { .feedback-header p{
color: rgba(255, 255, 255, 0.85); color:#ddd;
margin-bottom: 0;
} }
/* Cards */ /* Cards */
.feedback-card { .feedback-card{
background: var(--white); background:#fff;
border: 1px solid #e2e8f0; border-radius:20px;
border-radius: 16px; border:none;
padding: 30px; padding:30px;
box-shadow: 0 4px 15px rgba(0, 0, 0, .04); box-shadow:0 10px 30px rgba(0,0,0,.08);
height: 100%; height:100%;
} }
.card-title { .card-title{
color: var(--theme-navy); color:#5E244E;
font-weight: 700; font-weight:700;
margin-bottom: 25px; margin-bottom:25px;
} }
.card-title i { .card-title i{
color: var(--theme-red); color:#d4af37;
margin-right: 8px; margin-right:8px;
}
/* Form Controls */
.form-label {
font-weight: 600;
color: var(--theme-navy);
font-size: 14px;
} }
/* Inputs */
.form-control, .form-control,
.form-select { .form-select{
border-radius: 10px; border-radius:15px;
padding: 12px 15px; padding:12px;
border: 1px solid #cbd5e1; border:1px solid #ddd;
font-size: 14px;
} }
.form-control:focus, .form-control:focus,
.form-select:focus { .form-select:focus{
border-color: var(--theme-navy); border-color:#744a68;
box-shadow: 0 0 0 0.25rem rgba(45, 53, 91, 0.15); box-shadow:0 0 0 .2rem rgba(94,36,78,.15);
} }
/* Buttons */ /* Button */
.submit-btn { .submit-btn{
background: var(--theme-red) !important; background:#5E244E;
color: var(--white) !important; color:white;
border: none; border:none;
border-radius: 8px; border-radius:50px;
padding: 12px 30px; padding:12px 30px;
font-weight: 600; font-weight:600;
transition: all 0.2s ease;
width: 100%;
} }
.submit-btn:hover { .submit-btn:hover{
background: var(--theme-red-hover) !important; background:#4a1c3e;
color: var(--white) !important; color:#fff;
} }
/* History Card */ /* History */
.history-card { .history-card{
margin-top: 35px; margin-top:35px;
background: var(--white); background:white;
border: 1px solid #e2e8f0; border-radius:20px;
border-radius: 16px; overflow:hidden;
overflow: hidden; box-shadow:0 10px 30px rgba(0,0,0,.08);
box-shadow: 0 4px 15px rgba(0, 0, 0, .04);
} }
.history-head { .history-head{
background: var(--theme-navy); background:#5E244E;
color: var(--white); color:white;
padding: 18px 25px; padding:18px 25px;
} }
.history-head h5 { .badge-status{
font-weight: 700; padding:7px 15px;
margin: 0; border-radius:50px;
font-size:13px;
} }
.table th { .pending{
background: #f8fafc; background:#fff3cd;
color: var(--theme-navy); color:#856404;
font-weight: 600;
border-bottom: 2px solid #e2e8f0;
padding: 14px 20px;
} }
.table td { .resolved{
vertical-align: middle; background:#d1e7dd;
padding: 14px 20px; color:#0f5132;
}
/* Status Badges */
.badge-status {
padding: 6px 14px;
border-radius: 30px;
font-size: 12px;
font-weight: 600;
display: inline-block;
}
.pending {
background: rgba(255, 234, 133, 0.4);
color: #856404;
}
.resolved {
background: #d1e7dd;
color: #0f5132;
}
@media(max-width:768px) {
.feedback-header, .feedback-card {
padding: 25px;
}
} }
</style> </style>
@ -172,77 +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 (Validation & Success) -->
@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 ($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"> <!-- IF NEEDED FOR BACKEND -->
<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>
@ -250,33 +168,75 @@ 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>
<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 --> <!-- Previous History Table -->
<div class="history-card"> <div class="history-card">
<div class="history-head"> <div class="history-head">
<h5><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>
@ -288,16 +248,16 @@ body {
<tbody id="historyTableBody"> <tbody id="historyTableBody">
<tr> <tr>
<td><span class="fw-semibold" style="color: var(--theme-navy);">Feedback</span></td> <td>Feedback</td>
<td>Workshop Equipment </td> <td>Workshop Equipment </td>
<td>10 July 2026</td> <td>10 July 2026</td>
<td><span class="badge-status resolved"><i class="fas fa-check me-1"></i> Resolved</span></td> <td><span class="badge-status resolved"> Resolved</span></td>
</tr> </tr>
<tr> <tr>
<td><span class="fw-semibold" style="color: var(--theme-navy);">Complaint</span></td> <td>Complaint</td>
<td>Class Schedule Issue </td> <td>Class Schedule Issue </td>
<td>05 July 2026 </td> <td>05 July 2026 </td>
<td><span class="badge-status pending"><i class="fas fa-clock me-1"></i> Pending </span></td> <td><span class="badge-status pending"> Pending </span></td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
@ -306,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 -->
<!-- Profile Left -->
<div class="col-lg-4"> <div class="col-lg-4">
<div class="profile-card text-center"> <div class="profile-card text-center">
<img src="{{ !empty($student->image) ? asset($student->image) : 'https://i.pravatar.cc/300' }}" <img src="https://i.pravatar.cc/300"
class="profile-image" alt="Profile Image"> class="profile-image">
<h3 class="student-name">Kasun Perera </h3>
<h3 class="student-name">{{ $student->full_name }}</h3> <span class="student-id">
Student ID : AEA20260045
<span class="student-id">
Student ID : {{ $student->student_id }}
</span> </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,6 +177,7 @@ body {
</div> </div>
<div class="row g-4"> <div class="row g-4">
<!-- කාඩ් එකින් එක Zoom-in වේ -->
<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">
@ -503,98 +245,7 @@ document.addEventListener('DOMContentLoaded', function () {
} }
}); });
}, { }, {
threshold: 0.15 threshold: 0.15 // Element එකෙන් 15%ක් පෙනෙද්දීම ඇනිමේෂන් එක පටන් ගනී
});
animatedElements.forEach(el => observer.observe(el));
});
</script>
@endsection
</a>
</div>
</div>
</div>
</section>
<!-- FEATURES -->
<section class="py-5 bg-light">
<div class="container">
<div class="section-title animate-item fade-up-init">
<h2 class="fw-bold">Why Choose Us</h2>
<p class="text-muted">We provide the best learning experience</p>
</div>
<div class="row g-4">
<div class="col-md-4 animate-item zoom-in-init" style="transition-delay: 100ms;">
<div class="about-box text-center">
<div class="icon-circle">
<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)); animatedElements.forEach(el => observer.observe(el));

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,7 +138,9 @@ 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">
@ -158,26 +148,27 @@ body {
</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

@ -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,35 +4,32 @@
<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 based on Master Layout */ /* Global Root Variables */
:root { :root {
--theme-navy: #2D355B; /* Primary Dark Navy */ --primary: #000000;
--theme-footer-navy: #1F2541; /* Dark Navy for active/hover states */ --background: #f5f6fb;
--theme-red: #822424; /* Primary Accent Red */
--theme-red-hover: #df2c3e; /* Red Hover state */
--theme-yellow: #FFEA85; /* Accent Yellow/Gold */
--theme-bg: #F6F6F6; /* Light Background */
--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;
@ -42,7 +39,7 @@
.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;
@ -52,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;
@ -74,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;
} }
@ -91,53 +101,26 @@
text-align: center; text-align: center;
} }
/* Hover & Active states matched to Main Theme */
.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;
border-left: 4px solid #F73F52;
font-weight: 700;
}
/* User Profile Section inside Sidebar */
.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; color: #fff;
text-decoration: none; border-left: 3px solid #fff;
font-size: 0.95rem; font-weight: 600;
transition: color 0.2s ease;
} }
.sidebar-user-profile .user-dropdown-toggle:hover { .sidebar .logout-link {
color: var(--theme-yellow); color: rgba(255,255,255,.6);
margin-top: auto;
} }
/* Custom Theme Buttons */ .sidebar .logout-link:hover {
.btn-theme-register { color: #fff;
background-color: var(--theme-red); background: rgba(220,53,69,.25);
color: white;
border: 1px solid #ffffff;
transition: background-color 0.2s ease;
}
.btn-theme-register:hover {
background-color: var(--theme-red-hover);
color: white;
} }
/* ---------- Main Content Layout ---------- */ /* ---------- Main Content Layout ---------- */
@ -146,17 +129,16 @@
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 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;
@ -169,22 +151,18 @@
.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 */ /* Overlay Background when sidebar open on Mobile */
@ -195,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;
@ -206,7 +184,7 @@
opacity: 1; opacity: 1;
} }
/* Responsive Breakpoints */ /* ---------- 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));
@ -218,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%;
} }
@ -235,24 +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 Dropdown --> <!-- Mobile View User Profile Header Dropdown -->
<div class="mobile-user-profile"> <div class="mobile-user-profile">
@if(Auth::check()) @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">{{ Auth::user()->first_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="/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">
@ -262,7 +238,7 @@
</ul> </ul>
</div> </div>
@else @else
<a href="/signin" 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>
@ -273,47 +249,51 @@
<!-- 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>
<!-- Navigation Links --> <!-- 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="/Studentguidelines" class="nav-link {{ request()->is('Studentguidelines*') ? 'active' : '' }}">
<i class="fa-solid fa-book-open"></i> Student Guidelines
</a>
<a href="/Feedback&Complain" class="nav-link {{ request()->is('Feedback&Complain*') ? 'active' : '' }}">
<i class="fa-solid fa-comments"></i> Feedback & Complain
</a>
<!-- <a href="/StudentProfile" class="nav-link {{ request()->is('StudentProfile*') ? 'active' : '' }}">
<i class="fa-solid fa-user"></i> Student Profile
</a> --> </a> -->
<a href="{{ route('StudentProfile') }}" class="nav-link {{ request()->routeIs('StudentProfile') ? 'active' : '' }}"> <a href="/results" class="nav-link">
<i class="fa-solid fa-user"></i> Student Profile <i class="fa-solid fa-square-poll-vertical"></i>Exam Results
</a> </a>
<a href="/Studentguidelines" class="nav-link">
<i class="fa-solid fa-book-open"></i>Student Guidelines
</a>
<a href="/Feedback&Complain" class="nav-link">
<i class="fa-solid fa-comments"></i>Feedback & Complain
</a>
<a href="/StudentProfile" class="nav-link">
<i class="fa-solid fa-user"></i>Student Profile
</a>
</nav> </nav>
<!-- Sidebar User Profile (Desktop View Footer) --> <div class="sidebar-user-profile">
<div class="sidebar-user-profile">
@if(Auth::check()) @if(Auth::check())
@php @php
$displayName = Auth::user()->first_name . ' ' . Auth::user()->last_name; $displayName = Auth::user()->first_name . ' ' . Auth::user()->last_name;
@endphp @endphp
<div class="dropdown dropup"> <div class="dropdown">
<a class="user-dropdown-toggle dropdown-toggle" href="#" role="button" id="userMenuDesktop" data-bs-toggle="dropdown" aria-expanded="false"> <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; color: var(--theme-yellow);"></i> <i class="fa-solid fa-circle-user" style="font-size: 24px;"></i>
<span class="text-truncate" style="max-width: 150px;">{{ $displayName }}</span> <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">
@ -324,19 +304,20 @@
</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="/signin" class="btn btn-outline-light btn-sm w-50">Sign In</a> <a href="/signin" class="btn btn-outline-light btn-sm w-50">Sign In</a>
<a href="/signup" class="btn btn-theme-register btn-sm w-50">Register</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 Content Area -->
@ -344,13 +325,28 @@
@yield('content') @yield('content')
</main> </main>
<!-- Scripts --> <!-- Sidebar Toggle JavaScript -->
<script>
const toggleBtn = document.getElementById('toggleBtn');
const sidebar = document.getElementById('sidebar');
const overlay = document.getElementById('sidebarOverlay');
// Function to toggle sidebar view
toggleBtn.addEventListener('click', () => {
sidebar.classList.toggle('show');
overlay.classList.toggle('show');
});
// Close sidebar if user clicks outside of it
overlay.addEventListener('click', () => {
sidebar.classList.remove('show');
overlay.classList.remove('show');
});
</script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script> <script>
function submitLogout() {
function submitLogout() {
const tokenEl = document.querySelector('meta[name="csrf-token"]'); const tokenEl = document.querySelector('meta[name="csrf-token"]');
fetch('/studentlogout', { fetch('/studentlogout', {
@ -361,11 +357,16 @@ function submitLogout() {
'X-CSRF-TOKEN': tokenEl ? tokenEl.getAttribute('content') : '' 'X-CSRF-TOKEN': tokenEl ? tokenEl.getAttribute('content') : ''
} }
}) })
.then(res => res.json()) .then(res => {
if (!res.ok) {
return res.text().then(text => { throw new Error(text) });
}
return res.json();
})
.then(data => { .then(data => {
if (data.success) { if (data.success) {
alert('Logged out successfully!');
window.location.href = '/signin'; window.location.href = '/students';
} else { } else {
alert('Logout failed. Please try again.'); alert('Logout failed. Please try again.');
} }
@ -375,55 +376,7 @@ function submitLogout() {
alert('Server side error occurred during logout.'); alert('Server side error occurred during logout.');
}); });
} }
</script>
<!-- <script> </script>
// Sidebar Toggle Logic
const toggleBtn = document.getElementById('toggleBtn');
const sidebar = document.getElementById('sidebar');
const overlay = document.getElementById('sidebarOverlay');
toggleBtn.addEventListener('click', () => {
sidebar.classList.toggle('show');
overlay.classList.toggle('show');
});
overlay.addEventListener('click', () => {
sidebar.classList.remove('show');
overlay.classList.remove('show');
});
// Dynamic 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 => {
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

@ -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,118 +95,97 @@ 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 */ /* Responsive Media Queries */
@media (min-width: 768px) { @media (min-width: 768px) {
.main-portal-content { .main-portal-content {
padding: 10px; padding: 34px;
} }
.hero { .hero {
padding: 40px; padding: 45px;
} }
.course-card img { .course-card img {
height: 280px; height: 280px;
} }
} }
@media (min-width: 992px) {
.main-portal-content {
margin-left: 18px;
}
}
</style> </style>
<div class="main-portal-content"> <div class="main-portal-content">
@ -217,7 +202,7 @@ body {
</a> </a>
</div> </div>
<div class="col-lg-3 col-md-4 text-center d-none d-md-block"> <div class="col-lg-3 col-md-4 text-center d-none d-md-block">
<i class="fa-solid fa-car-side" style="font-size: 157px;opacity: 0.35;color: #8C080F;"></i> <i class="fa-solid fa-car-side" style="font-size:100px; opacity:.2; color: var(--gold-accent);"></i>
</div> </div>
</div> </div>
</div> </div>
@ -234,22 +219,22 @@ body {
<div class="card-body p-4"> <div class="card-body p-4">
<div class="d-flex flex-wrap justify-content-between align-items-start gap-2 mb-3"> <div class="d-flex flex-wrap justify-content-between align-items-start gap-2 mb-3">
<div> <div>
<h3 class="fw-bold mb-1" style="color: var(--theme-navy);">AE101</h3> <h3 class="fw-bold text-dark mb-1">AE101</h3>
<p class="text-muted small mb-0"> <p class="text-muted small mb-0">
<i class="fa-solid fa-building me-1" style="color: var(--theme-red);"></i> Automotive Engineering Department <i class="fa-solid fa-building me-1" style="color: var(--purple-light);"></i> Automotive Engineering Department
</p> </p>
</div> </div>
<span class="badge px-3 py-2 rounded-pill" style="background-color: var(--theme-navy); color: var(--theme-yellow);">Diploma</span> <span class="badge bg-dark px-3 py-2 rounded-pill">Diploma</span>
</div> </div>
<p class="text-secondary small lh-base"> <p class="text-secondary small lh-base">
Master engine diagnostics, suspension systems, transmission technology, electrical systems, and hybrid vehicle maintenance through hands-on training and theoretical modules. Master engine diagnostics, suspension systems, transmission technology, electrical systems and hybrid vehicle maintenance.
</p> </p>
<div class="mt-4"> <div class="mt-4">
<div class="d-flex justify-content-between mb-2 small"> <div class="d-flex justify-content-between mb-2 small">
<span class="fw-semibold" style="color: var(--theme-navy);">Overall Progress</span> <span class="text-dark fw-semibold">Overall Progress</span>
<span class="fw-bold" style="color: var(--theme-red);">55%</span> <span class="fw-bold" style="color: var(--purple-main);">55%</span>
</div> </div>
<div class="progress"> <div class="progress">
<div class="progress-bar" style="width:55%"></div> <div class="progress-bar" style="width:55%"></div>
@ -259,9 +244,9 @@ body {
</div> </div>
<!-- Modules Header --> <!-- Modules Header -->
<div class="section-title-wrapper"> <div class="my-4">
<h4 class="fw-bold mb-0" style="color: var(--theme-navy);"> <h4 class="fw-bold text-dark">
Course Modules <i class="fa-solid fa-list-check me-2" style="color: var(--gold-accent);"></i> Course Modules
</h4> </h4>
</div> </div>
@ -273,13 +258,13 @@ body {
<div class="card-body p-4 d-flex flex-column justify-content-between"> <div class="card-body p-4 d-flex flex-column justify-content-between">
<div> <div>
<div class="d-flex justify-content-between align-items-start gap-2 mb-2"> <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);">Engine Fundamentals</h6> <h6 class="fw-bold text-dark mb-0">Engine Fundamentals</h6>
<span class="status completed">Completed</span> <span class="status completed">Completed</span>
</div> </div>
<p class="text-muted small mb-0">Learn engine parts and working principles.</p> <p class="text-muted small">Learn engine parts and working principles.</p>
</div> </div>
<div class="mt-4"> <div class="mt-3">
<button class="btn btn-theme-navy w-100 btn-sm py-2">Review Module</button> <button class="btn btn-purple w-100 btn-sm py-2">Review Module</button>
</div> </div>
</div> </div>
</div> </div>
@ -291,13 +276,13 @@ body {
<div class="card-body p-4 d-flex flex-column justify-content-between"> <div class="card-body p-4 d-flex flex-column justify-content-between">
<div> <div>
<div class="d-flex justify-content-between align-items-start gap-2 mb-2"> <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);">Transmission Systems</h6> <h6 class="fw-bold text-dark mb-0">Transmission Systems</h6>
<span class="status progressing">In Progress</span> <span class="status progressing">In Progress</span>
</div> </div>
<p class="text-muted small mb-0">Manual & Automatic transmission systems.</p> <p class="text-muted small">Manual & Automatic transmission systems.</p>
</div> </div>
<div class="mt-4"> <div class="mt-3">
<button class="btn btn-theme-red w-100 btn-sm py-2">Continue Learning</button> <button class="btn btn-gold w-100 btn-sm py-2">Continue Learning</button>
</div> </div>
</div> </div>
</div> </div>
@ -312,9 +297,9 @@ body {
<h6 class="fw-bold text-secondary mb-0">Brake Systems</h6> <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> <span class="status locked"><i class="fa fa-lock me-1"></i> Locked</span>
</div> </div>
<p class="text-muted small mb-0">Complete previous module to unlock.</p> <p class="text-muted small">Complete previous module to unlock.</p>
</div> </div>
<div class="mt-4"> <div class="mt-3">
<button class="btn btn-secondary w-100 btn-sm py-2" disabled>Locked</button> <button class="btn btn-secondary w-100 btn-sm py-2" disabled>Locked</button>
</div> </div>
</div> </div>
@ -330,9 +315,9 @@ body {
<h6 class="fw-bold text-secondary mb-0">Hybrid Technology</h6> <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> <span class="status locked"><i class="fa fa-lock me-1"></i> Locked</span>
</div> </div>
<p class="text-muted small mb-0">Learn EV and Hybrid systems.</p> <p class="text-muted small">Learn EV and Hybrid systems.</p>
</div> </div>
<div class="mt-4"> <div class="mt-3">
<button class="btn btn-secondary w-100 btn-sm py-2" disabled>Locked</button> <button class="btn btn-secondary w-100 btn-sm py-2" disabled>Locked</button>
</div> </div>
</div> </div>
@ -349,7 +334,7 @@ body {
<div class="info-box d-flex align-items-center"> <div class="info-box d-flex align-items-center">
<div class="stat-icon"><i class="fa fa-book"></i></div> <div class="stat-icon"><i class="fa fa-book"></i></div>
<div class="ms-3"> <div class="ms-3">
<h5 class="fw-bold mb-0" style="color: var(--theme-navy);">12</h5> <h5 class="fw-bold mb-0" style="color: var(--purple-dark);">12</h5>
<span class="text-muted small">Modules Available</span> <span class="text-muted small">Modules Available</span>
</div> </div>
</div> </div>
@ -359,7 +344,7 @@ body {
<div class="info-box d-flex align-items-center"> <div class="info-box d-flex align-items-center">
<div class="stat-icon"><i class="fa fa-clock"></i></div> <div class="stat-icon"><i class="fa fa-clock"></i></div>
<div class="ms-3"> <div class="ms-3">
<h5 class="fw-bold mb-0" style="color: var(--theme-navy);">2 Years</h5> <h5 class="fw-bold mb-0" style="color: var(--purple-dark);">2 Years</h5>
<span class="text-muted small">Course Duration</span> <span class="text-muted small">Course Duration</span>
</div> </div>
</div> </div>
@ -369,7 +354,7 @@ body {
<div class="info-box d-flex align-items-center"> <div class="info-box d-flex align-items-center">
<div class="stat-icon"><i class="fa fa-award"></i></div> <div class="stat-icon"><i class="fa fa-award"></i></div>
<div class="ms-3"> <div class="ms-3">
<h5 class="fw-bold mb-0" style="color: var(--theme-navy);">NVQ Level 5</h5> <h5 class="fw-bold mb-0" style="color: var(--purple-dark);">NVQ Level 5</h5>
<span class="text-muted small">Qualification</span> <span class="text-muted small">Qualification</span>
</div> </div>
</div> </div>
@ -382,4 +367,5 @@ body {
</div> </div>
</div> </div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
@endsection @endsection

View File

@ -4,373 +4,523 @@
@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
======================= */ ======================= */
.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;
} background:#dc3545;
.status-pass {
color: #198754;
font-weight: 600;
} }
/* ======================= /* =======================
Progress Progress
======================= */ ======================= */
.progress {
height: 10px;
border-radius: 20px;
background-color: #e2e8f0;
}
.progress-bar-navy { .progress{
background-color: var(--theme-navy) !important;
} height:10px;
border-radius:20px;
.progress-bar-red {
background-color: var(--theme-red) !important;
} }
/* ======================= /* =======================
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">
<!-- Hero Section --> <!-- Hero -->
<div class="result-hero"> <div class="result-hero">
<h2> <h2>
<i class="fas fa-award me-2" style="color: var(--theme-yellow);"></i>
<i class="fas fa-award"></i>
Academic Results Academic Results
</h2> </h2>
<p> <p>
View your examination results and overall academic performance.
View your examination results and academic performance.
</p> </p>
</div> </div>
<!-- Summary Cards --> <!-- Summary -->
<div class="row g-4">
<div class="col-md-4"> <div class="row">
<div class="col-md-4 mb-4">
<div class="summary-card"> <div class="summary-card">
<i class="fas fa-chart-line"></i> <i class="fas fa-chart-line"></i>
<h3>82%</h3> <h3>82%</h3>
<small>Overall Average</small> <small>Overall Average</small>
</div> </div>
</div> </div>
<div class="col-md-4"> <div class="col-md-4 mb-4">
<div class="summary-card"> <div class="summary-card">
<i class="fas fa-medal"></i> <i class="fas fa-medal"></i>
<h3>3.65</h3> <h3>3.65</h3>
<small>Current GPA</small> <small>Current GPA</small>
</div> </div>
</div> </div>
<div class="col-md-4"> <div class="col-md-4 mb-4">
<div class="summary-card"> <div class="summary-card">
<i class="fas fa-book-open"></i>
<i class="fas fa-book"></i>
<h3>6 / 6</h3> <h3>6 / 6</h3>
<small>Modules Passed</small> <small>Modules Passed</small>
</div> </div>
</div> </div>
</div> </div>
<!-- Result Table --> <!-- Result Table -->
<div class="result-card"> <div class="result-card">
<div class="table-head"> <div class="table-head">
<h5 class="mb-0 fw-bold">
<h4 class="mb-0">
Semester Results Semester Results
</h5>
</h4>
</div> </div>
<div class="table-responsive"> <table class="table table-hover">
<table class="table table-hover align-middle">
<thead>
<tr>
<th>Module</th>
<th>Marks</th>
<th>Grade</th>
<th>Status</th>
</tr>
</thead>
<tbody> <thead>
<tr>
<td class="fw-semibold" style="color: var(--theme-navy);">Engine Technology</td>
<td>91</td>
<td>
<span class="grade a">A+</span>
</td>
<td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
</tr>
<tr> <tr>
<td class="fw-semibold" style="color: var(--theme-navy);">Brake Systems</td>
<td>84</td>
<td>
<span class="grade a">A</span>
</td>
<td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
</tr>
<tr> <th>Module</th>
<td class="fw-semibold" style="color: var(--theme-navy);">Electrical Systems</td> <th>Marks</th>
<td>79</td> <th>Grade</th>
<td> <th>Status</th>
<span class="grade b">B+</span>
</td>
<td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
</tr>
<tr> </tr>
<td class="fw-semibold" style="color: var(--theme-navy);">Transmission Systems</td>
<td>74</td>
<td>
<span class="grade b">B</span>
</td>
<td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
</tr>
<tr> </thead>
<td class="fw-semibold" style="color: var(--theme-navy);">Workshop Practice</td>
<td>88</td> <tbody>
<td>
<span class="grade a">A</span> <tr>
</td>
<td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td> <td>Engine Technology</td>
</tr>
<td>91</td>
<td>
<span class="grade a">
A+
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Brake Systems</td>
<td>84</td>
<td>
<span class="grade a">
A
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Electrical Systems</td>
<td>79</td>
<td>
<span class="grade b">
B+
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Transmission Systems</td>
<td>74</td>
<td>
<span class="grade b">
B
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Workshop Practice</td>
<td>88</td>
<td>
<span class="grade a">
A
</span>
</td>
<td>Pass</td>
</tr>
<tr>
<td>Industrial Safety</td>
<td>81</td>
<td>
<span class="grade a">
A-
</span>
</td>
<td>Pass</td>
</tr>
</tbody>
</table>
<tr>
<td class="fw-semibold" style="color: var(--theme-navy);">Industrial Safety</td>
<td>81</td>
<td>
<span class="grade a">A-</span>
</td>
<td><span class="status-pass"><i class="fas fa-check-circle me-1"></i>Pass</span></td>
</tr>
</tbody>
</table>
</div>
</div> </div>
<!-- Performance Bars --> <!-- Performance -->
<div class="result-card">
<div class="result-card mt-4">
<div class="table-head"> <div class="table-head">
<h5 class="mb-0 fw-bold">
<h4 class="mb-0">
Overall Performance Overall Performance
</h5>
</h4>
</div> </div>
<div class="p-4"> <div class="p-4">
<div class="d-flex justify-content-between mb-2">
<span class="fw-semibold" style="color: var(--theme-navy);">Course Completion</span> <p class="mb-2">
<span class="fw-bold" style="color: var(--theme-navy);">82%</span>
</div> Course Completion
</p>
<div class="progress mb-4"> <div class="progress mb-4">
<div class="progress-bar progress-bar-navy" style="width:82%"></div>
<div class="progress-bar bg-success"
style="width:82%">
</div>
</div> </div>
<div class="d-flex justify-content-between mb-2"> <p class="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> Attendance Score
</div>
</p>
<div class="progress"> <div class="progress">
<div class="progress-bar progress-bar-red" style="width:90%"></div>
<div class="progress-bar bg-warning"
style="width:90%">
</div>
</div> </div>
</div> </div>
</div> </div>
<!-- Download Section --> <!-- Download -->
<div class="download-card"> <div class="download-card">
<div> <div>
<h4>Download Official Result Sheet</h4>
<h4>
Download Official Result Sheet
</h4>
<p class="mb-0"> <p class="mb-0">
Get your latest semester examination results in official PDF format.
Download your latest semester examination results in PDF format.
</p> </p>
</div> </div>
<button class="btn btn-result shadow-sm"> <button class="btn btn-result">
<i class="fas fa-download me-2"></i>Download PDF
<i class="fas fa-download"></i>
Download PDF
</button> </button>
</div> </div>
</div> </div>

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">
<div class="col-lg-6 right-panel col-12 mx-auto">
<div class="box"> <div class="box">
<h2 class="headline">Student Sign In</h2> <h2 class="headline">Student Sign In</h2>
@ -236,14 +223,15 @@
<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,95 +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: #ffed8b; 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);
} }
.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 {
@ -102,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;
@ -150,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 {
@ -189,34 +170,19 @@ 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');
background-position-x: 0%, 0%;
background-position-y: 0%, 0%;
background-repeat: repeat, repeat;
background-attachment: scroll, scroll;
background-size: auto, auto;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;
color: white;
}
/* ======================================================== /* ========================================================
Custom CSS Scroll Animations Custom CSS Scroll Animations
======================================================== */ ======================================================== */
@ -242,13 +208,10 @@ body {
opacity: 1; opacity: 1;
transform: translate(0) scale(1); transform: translate(0) scale(1);
} }
/* .rounded-pill {
border-radius: inherit;
} */
</style> </style>
<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;">
@ -273,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()">
@ -338,88 +302,27 @@ body {
</section> </section>
<!-- QUICK LINKS --> <!-- QUICK LINKS -->
<!-- <section class="py-5 bg-light overflow-hidden"> <section class="py-5 bg-light overflow-hidden">
<div class="container"> <div class="container">
<div class="text-center mb-5 animate-item fade-up-init"> <div class="text-center mb-5 animate-item fade-up-init" onclick="studentlogin()">
<h2 class="fw-bold">Quick Links</h2> <h2 class="fw-bold">Quick Links</h2>
</div> </div>
<div class="row text-center animate-item slide-right-init" style="color:white;"> <div class="row text-center animate-item slide-right-init" onclick="studentlogin()">
<div class="col-md-3 mb-3"> <div class="col-md-3 mb-3">
<a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill" style="color:white;">Academic Calendar</a> <a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Academic Calendar</a>
</div> </div>
<div class="col-md-3 mb-3"> <div class="col-md-3 mb-3">
<a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill" style="color:white;">Student Handbook</a> <a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Student Handbook</a>
</div> </div>
<div class="col-md-3 mb-3"> <div class="col-md-3 mb-3">
<a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill" style="color:white;">Examination Notices</a> <a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Examination Notices</a>
</div> </div>
<div class="col-md-3 mb-3"> <div class="col-md-3 mb-3">
<a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill" style="color:white;">Contact Support</a> <a href="#" class="btn btn-outline-dark w-100 py-2 fw-semibold rounded-pill">Contact Support</a>
</div> </div>
</div> </div>
</div> </div>
</section> -->
<section class="py-5 overflow-hidden"
style="background: linear-gradient(rgba(25, 48, 102, 0.49), rgba(10, 9, 17, 0.9)), url('https://images.pexels.com/photos/3807277/pexels-photo-3807277.jpeg?auto=compress&cs=tinysrgb&w=1600'); background-size: cover; background-position: center; background-repeat: no-repeat; background-attachment: fixed; color: white; height: 395px; ">
<div class="container">
<!-- Section Title -->
<div class="text-center mb-5 animate-item fade-up-init">
<h2 class="fw-bold mb-2" style="color: #ffffff;">Quick Links</h2>
<p style="color: #ffffff; font-size: 0.95rem; font-weight: 500;">Access important student portals and resources instantly</p>
</div>
<!-- Quick Links Grid -->
<div class="row g-3 justify-content-center animate-item slide-right-init">
<!-- Link 1 -->
<div class="col-6 col-md-3">
<a href="#" class="d-flex flex-column align-items-center text-decoration-none p-4 rounded-4 text-center"
style="background: rgba(255, 255, 255, 0.75); border: 1px solid rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08); transition: all 0.3s ease;">
<div style="color: #0284c7; font-size: 2rem;" class="mb-2">
<i class="bi bi-calendar-event"></i>
</div>
<span class="fw-bold" style="color: #002886; font-size: 19px;">Academic Calendar</span>
</a>
</div>
<!-- Link 2 -->
<div class="col-6 col-md-3">
<a href="#" class="d-flex flex-column align-items-center text-decoration-none p-4 rounded-4 text-center"
style="background: rgba(255, 255, 255, 0.75); border: 1px solid rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08); transition: all 0.3s ease;">
<div style="color: #0284c7; font-size: 2rem;" class="mb-2">
<i class="bi bi-journal-bookmark"></i>
</div>
<span class="fw-bold" style="color: #002886; font-size: 19px;">Student Handbook</span>
</a>
</div>
<!-- Link 3 -->
<div class="col-6 col-md-3">
<a href="#" class="d-flex flex-column align-items-center text-decoration-none p-4 rounded-4 text-center"
style="background: rgba(255, 255, 255, 0.75); border: 1px solid rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08); transition: all 0.3s ease;">
<div style="color: #0284c7; font-size: 2rem;" class="mb-2">
<i class="bi bi-file-earmark-text"></i>
</div>
<span class="fw-bold" style="color: #002886; font-size: 19px;">Examination Notices</span>
</a>
</div>
<!-- Link 4 -->
<div class="col-6 col-md-3">
<a href="#" class="d-flex flex-column align-items-center text-decoration-none p-4 rounded-4 text-center"
style="background: rgba(255, 255, 255, 0.75); border: 1px solid rgba(255, 255, 255, 0.9); backdrop-filter: blur(10px); box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08); transition: all 0.3s ease;">
<div style="color: #0284c7; font-size: 2rem;" class="mb-2">
<i class="bi bi-headset"></i>
</div>
<span class="fw-bold" style="color: #002886; font-size: 19px;">Contact Support</span>
</a>
</div>
</div>
</div>
</section> </section>
<!-- BOTTOM CTA --> <!-- BOTTOM CTA -->
@ -506,4 +409,6 @@ document.addEventListener('DOMContentLoaded', function () {
}); });
</script> </script>
@endsection @endsection

View File

@ -14,350 +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 Today's Classes
</h5> </h5>
<div class="mb-3 p-2 rounded" style="background: #f8fafc; border-left: 3px solid var(--theme-navy);"> <div class="mb-3">
<strong>08:30 - 10:30</strong><br> <strong>08:30 - 10:30</strong><br>
<span class="badge badge-theory me-1">Theory</span>
<span>Engine Fundamentals</span> <span class="badge badge-theory">
Theory
</span>
Engine Fundamentals
</div> </div>
<div class="mb-3 p-2 rounded" style="background: #f8fafc; border-left: 3px solid #e67e22;"> <div class="mb-3">
<strong>10:45 - 12:30</strong><br> <strong>10:45 - 12:30</strong><br>
<span class="badge badge-workshop me-1">Workshop</span>
<span>Practical Session</span> <span class="badge badge-workshop">
Workshop
</span>
Practical Session
</div> </div>
<div class="p-2 rounded" style="background: #f8fafc; border-left: 3px solid var(--theme-red);"> <div>
<strong>01:30 - 03:30</strong><br> <strong>01:30 - 03:30</strong><br>
<span class="badge badge-practical me-1">Practical</span>
<span>Electrical System</span> <span class="badge badge-practical">
Practical
</span>
Electrical System
</div> </div>
</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-card">
<div class="table-responsive"> <div class="table-responsive">
<table class="table table-bordered align-middle mb-0"> <table class="table table-bordered align-middle mb-0">
<thead> <thead>
<tr>
<th>Time</th> <tr>
<th>Monday</th>
<th>Tuesday</th> <th>Time</th>
<th>Wednesday</th>
<th>Thursday</th> <th>Monday</th>
<th>Friday</th>
</tr> <th>Tuesday</th>
<th>Wednesday</th>
<th>Thursday</th>
<th>Friday</th>
</tr>
</thead> </thead>
<tbody> <tbody>
<tr>
<th>08:30 - 10:30</th>
<td>
<span class="badge badge-theory mb-1">Theory</span><br>
Engine Fundamentals
</td>
<td>
<span class="badge badge-practical mb-1">Practical</span><br>
Engine Lab
</td>
<td>
<span class="badge badge-theory mb-1">Theory</span><br>
Transmission
</td>
<td>
<span class="badge badge-workshop mb-1">Workshop</span><br>
Engine Repair
</td>
<td>
<span class="badge badge-theory mb-1">Theory</span><br>
Vehicle Safety
</td>
</tr>
<tr> <tr>
<th>10:45 - 12:30</th>
<td>
<span class="badge badge-workshop mb-1">Workshop</span><br>
Service Practice
</td>
<td>
<span class="badge badge-theory mb-1">Theory</span><br>
Electrical
</td>
<td>
<span class="badge badge-practical mb-1">Practical</span><br>
Diagnostics
</td>
<td>
<span class="badge badge-theory mb-1">Theory</span><br>
Fuel System
</td>
<td>
<span class="badge badge-workshop mb-1">Workshop</span><br>
Engine Assembly
</td>
</tr>
<tr class="lunch-row"> <th>08:30 - 10:30</th>
<th>12:30 - 01:30</th>
<td colspan="5"> <td>
🍴 LUNCH BREAK <span class="badge badge-theory">Theory</span><br>
</td> Engine Fundamentals
</tr> </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>
<tr>
<th>01:30 - 03:30</th>
<td>
<span class="badge badge-practical mb-1">Practical</span><br>
Electrical System
</td>
<td>
<span class="badge badge-workshop mb-1">Workshop</span><br>
Welding
</td>
<td>
<span class="badge badge-theory mb-1">Theory</span><br>
Auto Electronics
</td>
<td>
<span class="badge badge-practical mb-1">Practical</span><br>
Brake System
</td>
<td>
<span class="badge badge-theory mb-1">Theory</span><br>
Revision
</td>
</tr>
</tbody> </tbody>
</table> </table>
</div> </div>
</div> </div>
</div> </div>

File diff suppressed because it is too large Load Diff

View File

@ -6,11 +6,6 @@ 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\asswordController;
use App\Http\Controllers\Auth\ForgotPasswordController;
use App\Http\Controllers\coursesController;
use App\Http\Controllers\ApplyController;
/* /*
|-------------------------------------------------------------------------- |--------------------------------------------------------------------------
@ -23,35 +18,7 @@ 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::middleware(['auth'])->group(function () {
Route::get('/apply', [ApplyController::class, 'index'])->name('apply.index');
Route::post('/apply', [ApplyController::class, 'store'])->name('apply.store');
});
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');
});
Route::post('/studentlogout', [studentportalnavController::class, 'logout'])->name('student.logout');
Route::get('/StudentProfile', [StudentPortalController::class, 'showProfile'])->name('StudentProfile');
// Route::post('/studentlogout', [studentportalnavController::class, 'logout']);
Route::post('/feedback/store', [FeedbackController::class, 'feedback']) ->middleware('auth') ->name('feedback.store'); Route::post('/feedback/store', [FeedbackController::class, 'feedback']) ->middleware('auth') ->name('feedback.store');
@ -91,7 +58,7 @@ Route::get('/student-portal', function () {
Route::view('/apply', 'apply')->name('apply'); Route::view('/apply', 'apply')->name('apply');
// Route::view('/courses', 'courses')->name('courses'); 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');
@ -108,4 +75,4 @@ Route::view('/Assignments','Assignments')->name('Assignments');
Route::view('/Studentguidelines','Studentguidelines')->name('Studentguidelines'); Route::view('/Studentguidelines','Studentguidelines')->name('Studentguidelines');
Route::view('/results','results')->name('results'); Route::view('/results','results')->name('results');
Route::view('/Feedback&Complain','Feedback&Complain')->name('Feedback&Complain'); Route::view('/Feedback&Complain','Feedback&Complain')->name('Feedback&Complain');
// Route::view('/StudentProfile','StudentProfile')->name('StudentProfile'); Route::view('/StudentProfile','StudentProfile')->name('StudentProfile');