lostecho/everyone-can-use-english
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix layout (#1191)

Browse Source 
* fix layout

* fix layout
This commit is contained in:
an-lee
2024-11-20 10:02:38 +08:00
committed by GitHub
parent 58a6c34c1a
commit 6c2dec5220
26 changed files with 43 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
enjoy/src/renderer/components/chats/chat-session.tsx
View File

@@ -12,14 +12,14 @@ export const ChatSession = (props: {
if (!chatId) {
return (
<div className="flex items-center justify-center h-[calc(100vh-2rem)]">
<div className="flex items-center justify-center h-content">
<span className="text-muted-foreground">{t("noChatSelected")}</span>
</div>
);
}
return (
<ScrollArea className="h-[calc(100vh-2rem)] relative">
<ScrollArea className="h-content relative">
<ChatSessionProvider chatId={chatId}>
<ChatHeader
sidePanelCollapsed={sidePanelCollapsed}

2
enjoy/src/renderer/components/copilots/copilot-session.tsx
View File

@@ -8,7 +8,7 @@ export const CopilotSession = () => {
const { currentChat } = useContext(CopilotProviderContext);
return (
<ScrollArea className="h-[calc(100vh-2rem)] relative">
<ScrollArea className="h-content relative">
{currentChat?.id ? (
<ChatSessionProvider chatId={currentChat.id}>
<CopilotHeader />

6
enjoy/src/renderer/components/layouts/layout.tsx
View File

@@ -27,7 +27,7 @@ export const Layout = () => {
<ResizablePanel id="main-panel" order={1} minSize={50}>
<div className="flex flex-start">
<Sidebar />
<div className="flex-1 border-l overflow-x-hidden overflow-y-auto h-[calc(100vh-2rem)]">
<div className="flex-1 border-l overflow-x-hidden overflow-y-auto h-content">
<Outlet />
</div>
</div>
@@ -44,7 +44,7 @@ export const Layout = () => {
minSize={15}
onCollapse={() => setActive(false)}
>
<div className="h-[calc(100vh-2rem)]">
<div className="h-content">
<CopilotSession />
</div>
</ResizablePanel>
@@ -57,7 +57,7 @@ export const Layout = () => {
return (
<div className="h-screen flex flex-col w-full">
<TitleBar />
<div className="flex-1 h-[calc(100vh-2rem)] overflow-y-auto">
<div className="flex-1 h-content overflow-y-auto">
<Outlet />
</div>
</div>

2
enjoy/src/renderer/components/layouts/sidebar.tsx
View File

@@ -76,7 +76,7 @@ export const Sidebar = () => {
return (
<div
className={`h-[calc(100vh-2rem)] pt-8 transition-all relative draggable-region ${
className={`h-content pt-8 transition-all relative draggable-region ${
isCollapsed ? "w-12" : "w-48"
}`}
data-testid="sidebar"

7
enjoy/src/renderer/components/layouts/title-bar.tsx
View File

@@ -2,7 +2,6 @@ import {
AppSettingsProviderContext,
CopilotProviderContext,
} from "@/renderer/context";
import { ChevronRightIcon } from "@radix-ui/react-icons";
import {
AlertDialog,
AlertDialogHeader,
@@ -78,7 +77,7 @@ export const TitleBar = () => {
}, []);
return (
<div className="z-50 h-8 w-full bg-muted draggable-region flex items-center justify-between border-b">
<div className="z-[100] h-8 w-full bg-muted draggable-region flex items-center justify-between border-b">
<div className="flex items-center px-2">
{platform === "darwin" && !isFullScreen && <div className="w-16"></div>}
<DropdownMenu>
@@ -150,9 +149,7 @@ export const TitleBar = () => {
<DropdownMenuGroup>
<DropdownMenuSub>
<DropdownMenuSubTrigger className="non-draggable-region">
<span className="capitalize">
{t("feedback")}
</span>
<span className="capitalize">{t("feedback")}</span>
</DropdownMenuSubTrigger>
<DropdownMenuPortal>
<DropdownMenuSubContent>

2
enjoy/src/renderer/components/login/bandu-login-form.tsx
View File

@@ -41,7 +41,7 @@ export const BanduLoginButton = () => {
</SheetTrigger>
<SheetContent
side="bottom"
className="h-screen"
className="h-content"
aria-describedby={undefined}
>
<SheetHeader>

2
enjoy/src/renderer/components/login/github-login-form.tsx
View File

@@ -33,7 +33,7 @@ export const GithubLoginButton = () => {
</SheetTrigger>
<SheetContent
side="bottom"
className="h-screen"
className="h-content"
aria-describedby={undefined}
>
<div className="w-full h-full flex">

2
enjoy/src/renderer/components/login/mixin-login-form.tsx
View File

@@ -42,7 +42,7 @@ export const MixinLoginButton = () => {
</SheetTrigger>
<SheetContent
side="bottom"
className="h-screen"
className="h-content"
aria-describedby={undefined}
>
<SheetHeader>

2
enjoy/src/renderer/components/medias/media-bottom-panel/media-current-recording.tsx
View File

@@ -686,7 +686,7 @@ export const MediaCurrentRecording = () => {
<SheetContent
aria-describedby={undefined}
side="bottom"
className="rounded-t-2xl shadow-lg max-h-screen overflow-y-scroll"
className="rounded-t-2xl shadow-lg max-h-content overflow-y-scroll"
displayClose={false}
>
<SheetHeader className="flex items-center justify-center -mt-4 mb-2">

2
enjoy/src/renderer/components/medias/media-left-panel/media-transcription-read-button.tsx
View File

@@ -233,7 +233,7 @@ const TranscriptionRecordingsList = () => {
<SheetContent
aria-describedby={undefined}
side="bottom"
className="rounded-t-2xl shadow-lg max-h-screen overflow-y-scroll"
className="rounded-t-2xl shadow-lg max-h-content overflow-y-scroll"
displayClose={false}
>
<SheetHeader className="flex items-center justify-center -mt-4 mb-2">

4
enjoy/src/renderer/components/messages/assistant-message.tsx
View File

@@ -297,12 +297,12 @@ export const AssistantMessageComponent = (props: {
<SheetContent
aria-describedby={undefined}
side="bottom"
className="h-screen p-0 flex flex-col"
className="h-content p-0 flex flex-col gap-0"
displayClose={false}
onPointerDownOutside={(event) => event.preventDefault()}
onInteractOutside={(event) => event.preventDefault()}
>
<SheetHeader className="flex items-center justify-center">
<SheetHeader className="flex items-center justify-center space-y-0 py-1">
<SheetTitle className="sr-only">{t("shadow")}</SheetTitle>
<SheetClose>
<ChevronDownIcon />

2
enjoy/src/renderer/components/ui/toast.tsx
View File

@@ -14,7 +14,7 @@ const ToastViewport = React.forwardRef<
<ToastPrimitives.Viewport
ref={ref}
className={cn(
"fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
"fixed top-0 z-[100] flex max-h-content w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
className
)}
{...props}

6
enjoy/src/renderer/context/chat-session-provider.tsx
View File

@@ -482,12 +482,12 @@ export const ChatSessionProvider = ({
>
<SheetContent
side="bottom"
className="h-screen p-0 flex flex-col"
className="h-content p-0 flex flex-col gap-0"
displayClose={false}
onPointerDownOutside={(event) => event.preventDefault()}
onInteractOutside={(event) => event.preventDefault()}
>
<SheetHeader className="flex items-center justify-center">
<SheetHeader className="flex items-center justify-center space-y-0 py-1">
<SheetTitle className="sr-only">Shadow</SheetTitle>
<SheetDescription className="sr-only"></SheetDescription>
<SheetClose>
@@ -508,7 +508,7 @@ export const ChatSessionProvider = ({
<SheetContent
aria-describedby={undefined}
side="bottom"
className="rounded-t-2xl shadow-lg max-h-screen overflow-y-scroll"
className="rounded-t-2xl shadow-lg max-h-content overflow-y-scroll"
displayClose={false}
>
<SheetHeader className="flex items-center justify-center -mt-4 mb-2">

6
enjoy/src/renderer/context/course-provider.tsx
View File

@@ -72,12 +72,12 @@ export const CourseProvider = ({
>
<SheetContent
side="bottom"
className="h-screen p-0 flex flex-col"
className="h-content p-0 flex flex-col gap-0"
displayClose={false}
onPointerDownOutside={(event) => event.preventDefault()}
onInteractOutside={(event) => event.preventDefault()}
>
<SheetHeader className="flex items-center justify-center">
<SheetHeader className="flex items-center justify-center space-y-0 py-1">
<SheetTitle className="sr-only">Shadow</SheetTitle>
<SheetDescription className="sr-only"></SheetDescription>
<SheetClose>
@@ -85,7 +85,7 @@ export const CourseProvider = ({
</SheetClose>
</SheetHeader>
<AudioPlayer id={shadowing?.id} />
{shadowing && <AudioPlayer id={shadowing.id} />}
</SheetContent>
</Sheet>
</MediaShadowProvider>

2
enjoy/src/renderer/pages/audio.tsx
View File

@@ -25,7 +25,7 @@ export default () => {
const navigate = useNavigate();
return (
<div className="h-[calc(100vh-2rem)] flex flex-col relative">
<div className="h-content flex flex-col relative">
<Breadcrumb className="px-4 pt-3 pb-2">
<BreadcrumbList>
<BreadcrumbItem>

2
enjoy/src/renderer/pages/chats.tsx
View File

@@ -38,7 +38,7 @@ export default function Chats() {
}, [currentChat]);
return (
<ResizablePanelGroup direction="horizontal" className="h-screen">
<ResizablePanelGroup direction="horizontal" className="h-content">
{!sidePanelCollapsed && (
<>
<ResizablePanel

6
enjoy/src/renderer/pages/conversation.tsx
View File

@@ -231,7 +231,7 @@ export default () => {
return (
<div
data-testid="conversation-page"
className="h-[calc(100vh-2rem)] px-4 py-4 lg:px-8 flex flex-col"
className="h-content px-4 py-4 lg:px-8 flex flex-col"
>
<div className="h-[calc(100vh-5rem)] relative w-full max-w-screen-md mx-auto flex flex-col">
<div className="flex items-center justify-center py-2 relative">
@@ -249,13 +249,13 @@ export default () => {
</div>
</SheetTrigger>
<SheetContent className="p-0" aria-describedby={undefined}>
<SheetContent className="p-0 pt-8" aria-describedby={undefined}>
<SheetHeader>
<SheetTitle className="sr-only">
{t("editConversation")}
</SheetTitle>
</SheetHeader>
<div className="h-screen">
<div className="h-content">
<ConversationForm
conversation={conversation}
onFinish={() => {

6
enjoy/src/renderer/pages/conversations.tsx
View File

@@ -15,7 +15,7 @@ import {
} from "@renderer/components/ui";
import { ConversationCard, ConversationForm } from "@renderer/components";
import { useState, useEffect, useContext, useReducer } from "react";
import { ChevronLeftIcon, LoaderIcon } from "lucide-react";
import { LoaderIcon } from "lucide-react";
import { Link, useNavigate, useSearchParams } from "react-router-dom";
import {
DbProviderContext,
@@ -292,13 +292,13 @@ export default () => {
</Dialog>
<Sheet open={creating} onOpenChange={(value) => setCreating(value)}>
<SheetContent className="p-0" aria-describedby={undefined}>
<SheetContent className="p-0 pt-8" aria-describedby={undefined}>
<SheetHeader>
<SheetTitle className="sr-only">
{t("startConversation")}
</SheetTitle>
</SheetHeader>
<div className="h-screen relative">
<div className="h-content relative">
<ConversationForm
conversation={preset}
onFinish={() => setCreating(false)}

4
enjoy/src/renderer/pages/courses/chapter.tsx
View File

@@ -42,7 +42,7 @@ export default () => {
return (
<CourseProvider id={id}>
<div className="flex flex-col h-screen px-4 xl:px-6 py-6">
<div className="flex flex-col h-content px-4 xl:px-6 py-4">
<Breadcrumb className="mb-4">
<BreadcrumbList>
<BreadcrumbItem>
@@ -58,7 +58,7 @@ export default () => {
<BreadcrumbPage>{chapter?.title || sequence}</BreadcrumbPage>
</BreadcrumbList>
</Breadcrumb>
<div className="flex-1 h-[calc(100vh-5.75rem)] border rounded-lg">
<div className="flex-1 h-[calc(100vh-7.75rem)] border rounded-lg">
<ResizablePanelGroup direction="horizontal">
<ResizablePanel defaultSize={50}>
<ScrollArea className="px-4 py-3 h-full relative bg-muted">

4
enjoy/src/renderer/pages/document.tsx
View File

@@ -36,14 +36,14 @@ const DocumentComponent = () => {
if (!document) {
return (
<div className="h-screen flex flex-col justify-center items-center relative">
<div className="h-content flex flex-col justify-center items-center relative">
<LoaderSpin />
</div>
);
}
return (
<div className="h-[calc(100vh-2rem)] flex flex-col relative">
<div className="h-content flex flex-col relative">
<Breadcrumb className="px-4 pt-3 pb-2">
<BreadcrumbList>
<BreadcrumbItem>

2
enjoy/src/renderer/pages/error-page.tsx
View File

@@ -7,7 +7,7 @@ export default () => {
console.error(error);
return (
<div className="h-screen px-4 py-6 lg:px-8">
<div className="h-content px-4 py-6 lg:px-8">
<PagePlaceholder
placeholder={t("somethingWentWrong")}
extra={error ? (error as Error).message : ""}

2
enjoy/src/renderer/pages/pronunciation-assessments/index.tsx
View File

@@ -201,7 +201,7 @@ export default () => {
<SheetContent
aria-describedby={undefined}
side="bottom"
className="rounded-t-2xl shadow-lg max-h-screen overflow-y-scroll"
className="rounded-t-2xl shadow-lg max-h-content overflow-y-scroll"
displayClose={false}
>
<SheetHeader className="flex items-center justify-center -mt-4 mb-2">

2
enjoy/src/renderer/pages/story-preview.tsx
View File

@@ -206,7 +206,7 @@ export default () => {
}, [readable, loading]);
return (
<div className="h-screen w-full flex flex-col bg-muted">
<div className="h-content w-full flex flex-col bg-muted">
{(loading || !readable) && (
<div className="h-12 flex items-center space-x-2 px-4 border-b shadow">
<Button

2
enjoy/src/renderer/pages/story.tsx
View File

@@ -229,7 +229,7 @@ export default () => {
return (
<>
<ScrollArea className="h-screen w-full bg-muted">
<ScrollArea className="h-content w-full bg-muted">
<StoryToolbar
marked={marked}
toggleMarked={() => setMarked(!marked)}

2
enjoy/src/renderer/pages/video.tsx
View File

@@ -25,7 +25,7 @@ export default () => {
const navigate = useNavigate();
return (
<div className="h-[calc(100vh-2rem)] flex flex-col relative">
<div className="h-content flex flex-col relative">
<Breadcrumb className="px-4 pt-3 pb-2">
<BreadcrumbList>
<BreadcrumbItem>