add
This commit is contained in:
parent
6042002280
commit
ae1d4df170
|
@ -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("/")}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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 && (
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -55,7 +55,6 @@ export function VideoPlayer({
|
|||
src,
|
||||
poster,
|
||||
onError,
|
||||
|
||||
}: {
|
||||
src: string;
|
||||
poster?: string;
|
||||
|
|
|
@ -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);
|
||||
|
|
Loading…
Reference in New Issue