flexday/demo_desc.html

106 lines
3.8 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
</head>
<body>
<!-- Top Navigation Bar -->
<div class="flex flex-wrap items-center gap-4 border-b border-gray-300 px-4 py-2 bg-white">
<!-- Dropdown Menus -->
<div class="relative group">
<button class="px-4 py-1 border border-black font-semibold hover:bg-gray-100 focus:outline-none">
Schedule
</button>
<div class="absolute z-10 hidden group-hover:block bg-white shadow-md border mt-1">
<ul class="text-sm text-blue-700 whitespace-nowrap">
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">Basic</a></li>
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">With Enrollment</a></li>
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">Early / Late</a></li>
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">Enrollment Velocity</a></li>
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">Graphic Overview</a></li>
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">Delivery by Semester</a></li>
</ul>
</div>
</div>
<div class="relative group">
<button class="px-4 py-1 border border-black font-semibold hover:bg-gray-100">Catalog</button>
<div class="absolute z-10 hidden group-hover:block bg-white shadow-md border mt-1">
<ul class="text-sm text-blue-700 whitespace-nowrap">
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">Programs</a></li>
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">Graphic Overview</a></li>
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">Courses</a></li>
</ul>
</div>
</div>
<div class="relative group">
<button class="px-4 py-1 border border-black font-semibold hover:bg-gray-100">Faculty</button>
<div class="absolute z-10 hidden group-hover:block bg-white shadow-md border mt-1">
<ul class="text-sm text-blue-700 whitespace-nowrap">
<li><a href="#" class="block px-4 py-2 hover:bg-gray-100">History and Training</a></li>
</ul>
</div>
</div>
<!-- Spacer -->
<div class="flex-grow"></div>
<!-- Term Selector
<select class="border border-blue-500 rounded px-2 py-1 focus:outline-none focus:ring focus:ring-blue-200">
<option>Fall 2025</option>
<option>Summer 2019</option>
<option>Fall 2019</option>
<option>Spring 2020</option>
<option>Summer 2020</option>
<option>Fall 2020</option>
<option>Spring 2021</option>
</select>
</div> -->
<!-- Header -->
<div class="px-4 py-2">
<h2 class="text-xl font-bold text-blue-900">FALL 2025 QUICK COURSE FINDER</h2>
<p class="text-xs text-gray-500 mt-1">Last updated: July 12 2025 1:01 pm</p>
</div>
<div>
<h3 class="text-xl font-bold text-gray-900 mt-6 mb-2 border-b pb-1">Jan 23, 2025 — Optional Day</h3>
</div>
<br clear="all" />
<div class="bg-white border rounded-lg shadow p-4 mb-4">
<div class="flex flex-col md:flex-row md:justify-between">
<div>
<h2 class="text-lg font-semibold text-gray-800">SLO & Backward Design</h2>
<div class="text-sm text-gray-600">
<span class="block">10:00am 11:30am</span>
<span class="block">In Person @ SS 205</span>
</div>
</div>
<div class="mt-2 md:mt-0 md:text-right">
<span class="inline-block px-2 py-1 text-xs font-semibold text-white bg-green-500 rounded">In Person</span>
<button class="ml-2 text-sm text-blue-600 hover:underline">Edit</button>
</div>
</div>
<div class="mt-2 text-sm text-gray-700 line-clamp-3">
This workshop offers a hands-on experience aimed at demystifying Student Learning Outcomes (SLOs)...
</div>
</div>
</div>
</body>
</html>