This commit is contained in:
ditiqi 2025-02-26 22:54:22 +08:00
parent 6042002280
commit ae1d4df170
6 changed files with 24 additions and 21 deletions

View File

@ -6,6 +6,7 @@ import { useNavigate, useParams, useSearchParams } from "react-router-dom";
import { UserMenu } from "./UserMenu/UserMenu";
import { NavigationMenu } from "./NavigationMenu";
import { useMainContext } from "./MainProvider";
import { useStaff } from "@nice/client";
const { Header } = Layout;
export function MainHeader() {
@ -13,9 +14,11 @@ export function MainHeader() {
const { id } = useParams();
const navigate = useNavigate();
const { searchValue, setSearchValue } = useMainContext();
const { update } = useStaff();
return (
<Header className="select-none flex items-center justify-center bg-white shadow-md border-b border-gray-100 fixed w-full z-30">
<div className="w-full max-w-screen-2xl px-4 md:px-6 mx-auto flex items-center justify-between h-full">
<div className="w-full max-w-screen-3xl px-4 md:px-6 mx-auto flex items-center justify-between h-full">
<div className="flex items-center space-x-8">
<div
onClick={() => navigate("/")}

View File

@ -26,12 +26,12 @@ export const CourseDetailDescription: React.FC = () => {
const { id } = useParams();
return (
// <div className="w-full bg-white shadow-md rounded-lg border border-gray-200 p-5 my-4">
<div className="w-full p-5 my-4">
<div className="w-full px-5 my-4">
{isLoading || !course ? (
<Skeleton active paragraph={{ rows: 4 }} />
) : (
<div className="space-y-2">
{!selectedLectureId && (
{!selectedLectureId && course?.meta?.thumbnail && (
<>
<div className="relative my-4 overflow-hidden flex justify-center items-center">
<Image
@ -43,8 +43,8 @@ export const CourseDetailDescription: React.FC = () => {
onClick={() => {
setSelectedLectureId(firstLectureId);
}}
className="w-full h-full absolute top-0 z-10 bg-black opacity-30 transition-opacity duration-300 ease-in-out hover:opacity-70 cursor-pointer">
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 text-white text-4xl z-10">
className="w-full h-full absolute top-0 z-10 bg-[rgba(0,0,0,0.3)] transition-all duration-300 ease-in-out hover:bg-[rgba(0,0,0,0.7)] cursor-pointer">
<div className="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 text-white text-4xl z-10">
</div>
</div>

View File

@ -29,7 +29,11 @@ export const CourseDetailDisplayArea: React.FC = () => {
{lectureIsLoading && (
<Skeleton active paragraph={{ rows: 4 }} title={false} />
)}
<div className="flex justify-center flex-col items-center gap-2 w-full my-2 px-8">
<div className="flex justify-start w-full text-2xl font-bold">
{course?.title}
</div>
</div>
{selectedLectureId &&
!lectureIsLoading &&
lecture?.meta?.type === LectureType.VIDEO && (

View File

@ -12,6 +12,7 @@ import { UserMenu } from "@web/src/app/main/layout/UserMenu/UserMenu";
import { CourseDetailContext } from "../CourseDetailContext";
import { usePost, useStaff } from "@nice/client";
import toast from "react-hot-toast";
import { NavigationMenu } from "@web/src/app/main/layout/NavigationMenu";
const { Header } = Layout;
@ -24,21 +25,17 @@ export function CourseDetailHeader() {
const { update } = useStaff();
return (
<Header className="select-none flex items-center justify-center bg-white shadow-md border-b border-gray-100 fixed w-full z-30">
<div className="w-full flex items-center justify-between h-full">
<div className="flex items-center space-x-10">
<HomeOutlined
onClick={() => {
navigate("/");
}}
className="text-2xl text-primary-500 hover:scale-105 cursor-pointer"
/>
<div className="text-2xl tracking-widest font-bold bg-gradient-to-r from-primary-600 via-primary-500 to-primary-400 bg-clip-text text-transparent transition-transform ">
{course?.title}
<Header className="select-none flex items-center justify-center bg-white shadow-md border-b border-gray-100 fixed w-full z-30">
<div className="w-full max-w-screen-3xl px-4 md:px-6 flex items-center justify-between h-full">
<div className="flex items-center space-x-8">
<div
onClick={() => navigate("/")}
className="text-2xl font-bold bg-gradient-to-r from-primary-600 via-primary-500 to-primary-400 bg-clip-text text-transparent hover:scale-105 transition-transform cursor-pointer">
</div>
{/* <NavigationMenu /> */}
<NavigationMenu />
</div>
<div className="flex items-center space-x-6">
{isAuthenticated && (
<Button

View File

@ -55,7 +55,6 @@ export function VideoPlayer({
src,
poster,
onError,
}: {
src: string;
poster?: string;

View File

@ -18,7 +18,7 @@ export default function VideoPlayerLayout() {
<>
<div
className={`relative w-full bg-black rounded-lg overflow-hidden`}
style={{ aspectRatio: "21/9" }}
style={{ aspectRatio: "16/9" }}
onMouseEnter={() => {
setIsHovering(true);
setShowControls(true);