401 lines
9.0 KiB
PHP
401 lines
9.0 KiB
PHP
@extends('layouts.studentportalnav')
|
|
|
|
@section('title', 'Assignments')
|
|
|
|
@section('content')
|
|
|
|
<style>
|
|
body{
|
|
background:#f4f7fc;
|
|
}
|
|
|
|
.page-title{
|
|
font-size:32px;
|
|
font-weight:700;
|
|
color:#1f2937;
|
|
}
|
|
|
|
.assignment-card{
|
|
border:none;
|
|
border-radius:18px;
|
|
overflow:hidden;
|
|
box-shadow:0 10px 25px rgba(0,0,0,.08);
|
|
transition:.3s;
|
|
}
|
|
|
|
.assignment-card:hover{
|
|
transform:translateY(-5px);
|
|
box-shadow:0 18px 35px rgba(0,0,0,.12);
|
|
}
|
|
|
|
.assignment-header{
|
|
background:linear-gradient(135deg,#5E244E,#4a1c3e);
|
|
color:white;
|
|
padding:18px;
|
|
}
|
|
|
|
.assignment-header h5{
|
|
margin:0;
|
|
font-weight:600;
|
|
}
|
|
|
|
.assignment-body{
|
|
padding:22px;
|
|
}
|
|
|
|
.info-box{
|
|
display:flex;
|
|
justify-content:space-between;
|
|
margin-bottom:12px;
|
|
}
|
|
|
|
.info-title{
|
|
color:#6b7280;
|
|
font-size:14px;
|
|
}
|
|
|
|
.info-value{
|
|
font-weight:600;
|
|
}
|
|
|
|
.status{
|
|
padding:6px 14px;
|
|
border-radius:50px;
|
|
font-size:13px;
|
|
font-weight:600;
|
|
}
|
|
|
|
.pending{
|
|
background:#fff3cd;
|
|
color:#856404;
|
|
}
|
|
|
|
.submitted{
|
|
background:#d1e7dd;
|
|
color:#0f5132;
|
|
}
|
|
|
|
.overdue{
|
|
background:#f8d7da;
|
|
color:#842029;
|
|
}
|
|
|
|
.progress{
|
|
height:8px;
|
|
border-radius:20px;
|
|
}
|
|
|
|
.btn-submit{
|
|
border-radius:50px;
|
|
padding:10px 22px;
|
|
|
|
}
|
|
|
|
.search-box{
|
|
border-radius:50px;
|
|
}
|
|
|
|
.filter-btn{
|
|
border-radius:50px;
|
|
margin-right:8px;
|
|
}
|
|
</style>
|
|
|
|
<div class="container py-4">
|
|
|
|
<!-- Page Header -->
|
|
|
|
<div class="d-flex justify-content-between align-items-center mb-4" >
|
|
|
|
<div>
|
|
<h2 class="page-title" style="color:#5E244E">
|
|
<i class="fas fa-file-alt text-primary" style="color: #5E244E !important;" ></i>
|
|
Assignments
|
|
</h2>
|
|
|
|
<p class="text-muted">
|
|
View, download and submit your course assignments.
|
|
</p>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Search -->
|
|
|
|
<div class="row mb-4">
|
|
|
|
<div class="col-md-6">
|
|
|
|
<input type="text"
|
|
class="form-control search-box"
|
|
placeholder="Search Assignment...">
|
|
|
|
</div>
|
|
|
|
<div class="col-md-6 text-md-end mt-3 mt-md-0">
|
|
|
|
<button class="btn btn-primary filter-btn" style="background-color:#5E244E">All</button>
|
|
<button class="btn btn-warning filter-btn">Pending</button>
|
|
<button class="btn btn-success filter-btn">Submitted</button>
|
|
<button class="btn btn-danger filter-btn">Overdue</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="row">
|
|
|
|
<!-- Assignment 1 -->
|
|
|
|
<div class="col-lg-6 mb-4">
|
|
|
|
<div class="card assignment-card">
|
|
|
|
<div class="assignment-header">
|
|
|
|
<h5>
|
|
Engine Maintenance Report
|
|
</h5>
|
|
|
|
</div>
|
|
|
|
<div class="assignment-body">
|
|
|
|
<div class="info-box">
|
|
<span class="info-title">Module</span>
|
|
<span class="info-value">Automobile Engineering</span>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<span class="info-title">Due Date</span>
|
|
<span class="info-value text-danger">
|
|
20 July 2026
|
|
</span>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<span class="info-title">Status</span>
|
|
|
|
<span class="status pending">
|
|
Pending
|
|
</span>
|
|
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
<p class="text-muted">
|
|
|
|
Prepare a detailed report on preventive engine
|
|
maintenance including servicing procedures and
|
|
safety guidelines.
|
|
|
|
</p>
|
|
|
|
<label class="small text-muted mb-2">
|
|
Submission Progress
|
|
</label>
|
|
|
|
<div class="progress mb-4">
|
|
|
|
<div class="progress-bar bg-warning"
|
|
style="width:40%">
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-between">
|
|
|
|
<a href="#"
|
|
class="btn btn-outline-primary">
|
|
|
|
<i class="fas fa-download"></i>
|
|
Download
|
|
|
|
</a>
|
|
|
|
<a href="#"
|
|
class="btn btn-success btn-submit">
|
|
|
|
<i class="fas fa-upload"></i>
|
|
Submit
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Assignment 2 -->
|
|
|
|
<div class="col-lg-6 mb-4">
|
|
|
|
<div class="card assignment-card">
|
|
|
|
<div class="assignment-header bg-success">
|
|
|
|
<h5>
|
|
Brake System Inspection
|
|
</h5>
|
|
|
|
</div>
|
|
|
|
<div class="assignment-body">
|
|
|
|
<div class="info-box">
|
|
<span class="info-title">Module</span>
|
|
<span class="info-value">Vehicle Technology</span>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<span class="info-title">Due Date</span>
|
|
<span class="info-value">
|
|
10 July 2026
|
|
</span>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<span class="info-title">Status</span>
|
|
|
|
<span class="status submitted">
|
|
Submitted
|
|
</span>
|
|
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
<p class="text-muted">
|
|
|
|
Explain the complete brake inspection procedure
|
|
with diagrams and maintenance schedule.
|
|
|
|
</p>
|
|
|
|
<label class="small text-muted mb-2">
|
|
Submission Progress
|
|
</label>
|
|
|
|
<div class="progress mb-4">
|
|
|
|
<div class="progress-bar bg-success"
|
|
style="width:100%">
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-between">
|
|
|
|
<a href="#"
|
|
class="btn btn-outline-primary">
|
|
|
|
<i class="fas fa-download"></i>
|
|
Download
|
|
|
|
</a>
|
|
|
|
<button class="btn btn-secondary btn-submit" disabled>
|
|
|
|
Submitted
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<!-- Assignment 3 -->
|
|
|
|
<div class="col-lg-6 mb-4">
|
|
|
|
<div class="card assignment-card">
|
|
|
|
<div class="assignment-header bg-danger">
|
|
|
|
<h5>
|
|
Transmission System Analysis
|
|
</h5>
|
|
|
|
</div>
|
|
|
|
<div class="assignment-body">
|
|
|
|
<div class="info-box">
|
|
<span class="info-title">Module</span>
|
|
<span class="info-value">Power Train</span>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<span class="info-title">Due Date</span>
|
|
<span class="info-value text-danger">
|
|
01 July 2026
|
|
</span>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<span class="info-title">Status</span>
|
|
|
|
<span class="status overdue">
|
|
Overdue
|
|
</span>
|
|
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
<p class="text-muted">
|
|
|
|
Compare manual and automatic transmission systems
|
|
with advantages and disadvantages.
|
|
|
|
</p>
|
|
|
|
<label class="small text-muted mb-2">
|
|
Submission Progress
|
|
</label>
|
|
|
|
<div class="progress mb-4">
|
|
|
|
<div class="progress-bar bg-danger"
|
|
style="width:0%">
|
|
</div>
|
|
|
|
</div>
|
|
|
|
<div class="d-flex justify-content-between">
|
|
|
|
<a href="#"
|
|
class="btn btn-outline-primary">
|
|
|
|
<i class="fas fa-download"></i>
|
|
Download
|
|
|
|
</a>
|
|
|
|
<button class="btn btn-danger btn-submit">
|
|
|
|
Submit Late
|
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
@endsection |