rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-19 04:19:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: improve lecture ui design

Browse source
This commit is contained in:
swve 2023-01-15 16:35:42 +01:00
parent 2fc9d90e9f
commit 81aead7611
4 changed files with 14 additions and 9 deletions
Download patch file Download diff file Expand all files Collapse all files

4
front/app/_orgs/[orgslug]/course/[courseid]/element/[elementid]/edit/page.tsx
View file

@ -2,9 +2,7 @@
"use client"; "use client";
import { default as React, useEffect, useRef } from "react"; import { default as React, useEffect, useRef } from "react";
import Layout from "../../../../../../../../components/UI/Layout";
import { Title } from "../../../../../../../../components/UI/Elements/Styles/Title";
import dynamic from "next/dynamic";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { getElement } from "../../../../../../../../services/courses/elements"; import { getElement } from "../../../../../../../../services/courses/elements";
import AuthProvider from "../../../../../../../../components/Security/AuthProvider"; import AuthProvider from "../../../../../../../../components/Security/AuthProvider";

1
front/app/layout.tsx
View file

@ -1,7 +1,6 @@
"use client"; "use client";
import "../styles/globals.css"; import "../styles/globals.css";
import StyledComponentsRegistry from "../components/lib/styled-registry"; import StyledComponentsRegistry from "../components/lib/styled-registry";
import { Menu } from "../components/UI/Elements/Menu";
import { motion } from "framer-motion"; import { motion } from "framer-motion";
export default function RootLayout({ children }: { children: React.ReactNode }) { export default function RootLayout({ children }: { children: React.ReactNode }) {

11
front/components/Canva/Canva.tsx
View file

@ -8,6 +8,7 @@ import ImageBlock from "../Editor/Extensions/Image/ImageBlock";
import Youtube from "@tiptap/extension-youtube"; import Youtube from "@tiptap/extension-youtube";
import { EditorContentWrapper } from "../Editor/Editor"; import { EditorContentWrapper } from "../Editor/Editor";
import VideoBlock from "../Editor/Extensions/Video/VideoBlock"; import VideoBlock from "../Editor/Extensions/Video/VideoBlock";
import { styled } from "styled-components";
interface Editor { interface Editor {
content: string; content: string;
@ -46,10 +47,16 @@ function Canva(props: Editor) {
}); });
return ( return (
<EditorContentWrapper> <CanvaWrapper>
<EditorContent editor={editor} /> <EditorContent editor={editor} />
</EditorContentWrapper> </CanvaWrapper>
); );
} }
const CanvaWrapper = styled.div`
padding-top: 20px;
width: 1300px;
margin: 0 auto;
`;
export default Canva; export default Canva;

7
front/components/Editor/Editor.tsx
View file

@ -98,7 +98,9 @@ function Editor(props: Editor) {
{" "} {" "}
<b>{props.course.course.name}</b> <SlashIcon /> {props.element.name}{" "} <b>{props.course.course.name}</b> <SlashIcon /> {props.element.name}{" "}
</EditorInfoDocName> </EditorInfoDocName>
<EditorSaveButton onClick={() => props.setContent(editor.getJSON())}>Save <Save size={12}/></EditorSaveButton> <EditorSaveButton onClick={() => props.setContent(editor.getJSON())}>
Save <Save size={12} />
</EditorSaveButton>
</EditorInfoWrapper> </EditorInfoWrapper>
<EditorButtonsWrapper> <EditorButtonsWrapper>
<ToolbarButtons editor={editor} /> <ToolbarButtons editor={editor} />
@ -147,7 +149,7 @@ const Page = styled.div`
`; `;
const EditorTop = styled.div` const EditorTop = styled.div`
background-color: #ffffffb8; background-color: #ffffffeb;
border-radius: 15px; border-radius: 15px;
backdrop-filter: saturate(180%) blur(14px); backdrop-filter: saturate(180%) blur(14px);
margin: 40px; margin: 40px;
@ -226,7 +228,6 @@ const EditorSaveButton = styled.div`
justify-content: space-between; justify-content: space-between;
width: 53px; width: 53px;
&.is-active { &.is-active {
background: rgba(176, 176, 176, 0.5); background: rgba(176, 176, 176, 0.5);