- Fixed theme selector dropdown positioning issues with proper Tailwind classes - Replaced custom CSS classes with standard Tailwind utilities for v4 compatibility - Implemented dynamic theme-aware styling system for dropdown appearance - Added theme-specific styling for Light, Dark, High Contrast Light, High Contrast Dark - Enhanced UX with professional dropdown interface and visual consistency - Maintained 100% theme compliance and accessibility standards - Updated memory bank documentation with Phase 7 completion Key improvements: - Professional dropdown with proper shadows, borders, and backgrounds - Dynamic styling that adapts to current website theme - Enhanced accessibility with ARIA support and keyboard navigation - Seamless visual integration across all theme modes - Production-ready theme selector with polished UI
40 lines
1.4 KiB
TypeScript
40 lines
1.4 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import { useRouter } from 'next/navigation';
|
|
import { useVideos } from '../../../../hooks/useVideos';
|
|
import VideoForm from '../../../../components/admin/VideoForm';
|
|
import Link from 'next/link';
|
|
|
|
export default function CreateVideoPage() {
|
|
const router = useRouter();
|
|
const { createVideo } = useVideos();
|
|
|
|
return (
|
|
<div>
|
|
<div className="sm:flex sm:items-center sm:justify-between mb-6">
|
|
<div>
|
|
<h1 className="admin-page-header-title">Add New Video</h1>
|
|
<p className="mt-1 text-sm admin-text-light">
|
|
Upload a video file along with optional thumbnail, subtitles, and transcript files.
|
|
The video duration will be automatically detected, and a thumbnail will be generated
|
|
at the 10-second mark if you don't provide one.
|
|
</p>
|
|
</div>
|
|
<div className="mt-4 sm:mt-0">
|
|
<Link
|
|
href="/admin/videos"
|
|
className="admin-btn-secondary inline-flex items-center"
|
|
>
|
|
<svg className="-ml-1 mr-2 h-5 w-5" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 19l-7-7 7-7" />
|
|
</svg>
|
|
Back to Videos
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
|
|
<VideoForm onSubmit={createVideo} isEdit={false} />
|
|
</div>
|
|
);
|
|
}
|