<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Student Center - Enrollment</title>
<link rel="stylesheet" href="styles-blue.css">
</head>
<body>
<div class="container">
<!-- Header -->
<header class="header">
<div class="header-left">
<img src="Northwestern_Connecticut_Community_College_Seal.png" alt="NCCC" class="logo">
<span class="university-name">YOUR SCHOOL NAME</span>
</div>
<div class="header-right">
<button class="icon-btn home-btn">🏠</button>
<button class="icon-btn help-btn">?</button>
<button class="icon-btn logout-btn">⏻</button>
</div>
</header>
<div class="main-content">
<!-- Sidebar -->
<nav class="sidebar">
<ul class="nav-menu">
<li class="nav-item active">
<span class="nav-icon">👤</span>
<span class="nav-text">Student Center</span>
</li>
<li class="nav-item">
<span class="nav-icon">📧</span>
<span class="nav-text">View My Messages</span>
</li>
<li class="nav-item">
<span class="nav-icon">⏸</span>
<span class="nav-text">Holds</span>
</li>
<li class="nav-item">
<span class="nav-icon">📋</span>
<span class="nav-text">To Do List</span>
</li>
<li class="nav-item">
<span class="nav-icon">💳</span>
<span class="nav-text">Make a Payment</span>
</li>
<li class="nav-item">
<span class="nav-icon">📚</span>
<span class="nav-text">Academics</span>
<span class="nav-subtext">Enrollment</span>
</li>
<li class="nav-item">
<span class="nav-icon">📊</span>
<span class="nav-text">Academics</span>
<span class="nav-subtext">Records</span>
</li>
<li class="nav-item">
<span class="nav-icon">💰</span>
<span class="nav-text">Finances</span>
</li>
<li class="nav-item">
<span class="nav-icon">🎓</span>
<span class="nav-text">Admissions</span>
</li>
<li class="nav-item">
<span class="nav-icon">👤</span>
<span class="nav-text">Personal</span>
<span class="nav-subtext">Information</span>
</li>
<li class="nav-item">
<span class="nav-icon">⚠</span>
<span class="nav-text">Alert-NCCC</span>
</li>
<li class="nav-item">
<span class="nav-icon">📝</span>
<span class="nav-text">Other Items</span>
</li>
</ul>
<div class="logout-section">
<button class="logout-btn-sidebar">🚪 Logout</button>
</div>
</nav>
<!-- Content Area -->
<main class="content">
<!-- Breadcrumb -->
<div class="breadcrumb">
<span>Enrollment Dates</span> > <span>Summer 2025</span>
</div>
<!-- User Info -->
<div class="user-info">
<span class="user-icon">👤</span>
<span class="username">Your Name</span>
</div>
<!-- Enrollment Appointments Section -->
<section class="enrollment-appointments">
<h2>Enrollment Appointments</h2>
<table class="appointments-table">
<thead>
<tr>
<th>SESSION</th>
<th>APPOINTMENT BEGINS</th>
<th>APPOINTMENT ENDS</th>
<th>MAX TOTAL UNITS</th>
<th>MAX NO GPA UNITS</th>
<th>MAX AUDIT UNITS</th>
<th>MAX WAIT LIST UNITS</th>
</tr>
</thead>
<tbody>
<tr>
<td>Summer Session One</td>
<td>2025 Apr 16<br>08:00</td>
<td>2025 May 26<br>23:59</td>
<td>12.00</td>
<td>12.00</td>
<td>12.00</td>
<td>5.00</td>
</tr>
</tbody>
</table>
</section>
<!-- Open Enrollment Dates Section -->
<section class="open-enrollment">
<h3>Open Enrollment Dates by Session</h3>
<table class="enrollment-table">
<thead>
<tr>
<th>SESSION ▲</th>
<th>BEGINS ON ▲</th>
<th>LAST DATE TO ENROLL ▲</th>
</tr>
</thead>
<tbody>
<tr>
<td>Computer Science</td>
<td>2025 May 19</td>
<td>2025 August 15</td>
</tr>
<tr>
<td>Regular Academic Session</td>
<td>2025 August 20</td>
<td>2025 December 15</td>
</tr>
<tr>
<td>Summer Session One</td>
<td>2025 June 1</td>
<td>2025 July 15</td>
</tr>
<tr>
<td>Summer Session Two</td>
<td>2025 July 16</td>
<td>2025 August 30</td>
</tr>
<tr>
<td>Special Session</td>
<td>2025 May 15</td>
<td>2025 August 30</td>
</tr>
<tr>
<td>NCCC Online Courses</td>
<td>2026 January 15</td>
<td>2026 December 15</td>
</tr>
</tbody>
</table>
</section>
<!-- Term Enrollment Limits -->
<section class="term-limits">
<h3>Term Enrollment Limits</h3>
<table class="limits-table">
<thead>
<tr>
<th>MAX TOTAL UNITS</th>
<th>MAX NO GPA UNITS</th>
<th>MAX AUDIT UNITS</th>
<th>MAX WAIT LIST UNITS</th>
</tr>
</thead>
<tbody>
<tr>
<td>12.00</td>
<td>12.00</td>
<td>12.00</td>
<td>5.00</td>
</tr>
</tbody>
</table>
</section>
<!-- Action Buttons -->
<div class="action-buttons">
<button class="btn btn-primary">Shopping Cart</button>
<button class="btn btn-secondary">Add Classes</button>
</div>
</main>
<!-- Right Sidebar -->
<aside class="right-sidebar">
<div class="sidebar-section">
<h4>In this section</h4>
<ul class="sidebar-links">
<li><a href="#">Plan</a></li>
<li><a href="#">Enroll</a></li>
<li><a href="#">My Class Schedule</a></li>
<li><a href="#">Add</a></li>
<li><a href="#">Drop</a></li>
<li><a href="#">Swap</a></li>
<li><a href="#">Edit</a></li>
<li><a href="#">Term Information</a></li>
</ul>
</div>
<div class="sidebar-section">
<h4>My Academics</h4>
</div>
</aside>
</div>
</div>
</body>
</html>
收起