2369f7158d
- /TeacherDashboard/index.html - /TeacherDashboard/TeacherDashboard.code-workspace - /TeacherDashboard/components/resourceModal.html - /TeacherDashboard/components/subjectModal.html - /TeacherDashboard/components/topicModal.html - /TeacherDashboard/js/main.js - /TeacherDashboard/js/subjects/colors.js - /TeacherDashboard/js/subjects/subjectManager.js - /TeacherDashboard/js/subjects/SubjectModel.js - /TeacherDashboard/js/subjects/SubjectStorage.js - /TeacherDashboard/js/topics/TopicModel.js - /TeacherDashboard/js/topics/topicManager.js - /TeacherDashboard/styles/main.css
68 lines
5.1 KiB
HTML
68 lines
5.1 KiB
HTML
<!-- Subject Modal -->
|
|
<div id="subjectModal" class="modal hidden fixed inset-0 bg-black/30 flex items-center justify-center">
|
|
<div class="bg-white rounded-2xl p-8 w-full max-w-2xl shadow-2xl border-2 border-gray-100">
|
|
<div class="flex justify-between items-center mb-6">
|
|
<h3 class="text-xl font-bold">Neues Fach erstellen</h3>
|
|
<button onclick="closeModal('subjectModal')" class="text-gray-500 hover:text-gray-700">
|
|
<i class="fas fa-times"></i>
|
|
</button>
|
|
</div>
|
|
<form id="subjectForm" class="space-y-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700">Fachname</label>
|
|
<input type="text" name="displayName" class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm">
|
|
</div>
|
|
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700">Beschreibung</label>
|
|
<textarea name="description" rows="3"
|
|
class="mt-1 block w-full rounded-lg border-gray-300 shadow-sm"
|
|
placeholder="Kurze Beschreibung des Fachs..."></textarea>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700">Farbe</label>
|
|
<div id="colorPalette" class="mt-2 grid grid-cols-5 gap-2"></div>
|
|
<input type="hidden" id="selectedColor" name="color">
|
|
</div>
|
|
<div>
|
|
<label class="block text-sm font-medium text-gray-700">Icon</label>
|
|
<div class="mt-2 h-[120px] overflow-y-auto grid grid-cols-5 gap-2 p-1">
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-book"><i class="fas fa-book"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-calculator"><i class="fas fa-calculator"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-flask"><i class="fas fa-flask"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-atom"><i class="fas fa-atom"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-globe-europe"><i class="fas fa-globe-europe"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-palette"><i class="fas fa-palette"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-music"><i class="fas fa-music"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-dumbbell"><i class="fas fa-dumbbell"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-language"><i class="fas fa-language"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-microscope"><i class="fas fa-microscope"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-keyboard"><i class="fas fa-keyboard"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-dna"><i class="fas fa-dna"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-brain"><i class="fas fa-brain"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-history"><i class="fas fa-history"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-chart-line"><i class="fas fa-chart-line"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-draw-polygon"><i class="fas fa-draw-polygon"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-running"><i class="fas fa-running"></i></div>
|
|
<div class="icon-option p-2 border rounded-lg cursor-pointer" data-icon="fa-theater-masks"><i class="fas fa-theater-masks"></i></div>
|
|
</div>
|
|
<input type="hidden" id="selectedIcon" name="icon">
|
|
</div>
|
|
</div>
|
|
|
|
<div class="flex justify-end gap-4">
|
|
<button type="button" onclick="closeModal('subjectModal')"
|
|
class="px-4 py-2 text-gray-700 bg-gray-100 rounded-lg hover:bg-gray-200">
|
|
Abbrechen
|
|
</button>
|
|
<button type="submit"
|
|
class="px-6 py-3 text-white bg-[var(--primary-color)] rounded-xl hover:bg-[var(--secondary-color)] shadow-lg hover:shadow-xl transition">
|
|
Speichern
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|