mirror of
https://github.com/rzmk/learnhouse.git
synced 2025-12-19 04:19:25 +00:00
feat: add indication of elem nature in course edit
This commit is contained in:
parent
3a898eb29a
commit
018e20c10e
7 changed files with 202 additions and 230 deletions
|
|
@ -2,7 +2,7 @@ import React from "react";
|
|||
import styled from "styled-components";
|
||||
import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd";
|
||||
import Activity from "./Activity";
|
||||
import { PlusSquare } from "lucide-react";
|
||||
import { PlusSquare, Trash, Trash2 } from "lucide-react";
|
||||
|
||||
function Chapter(props: any) {
|
||||
return (
|
||||
|
|
@ -13,20 +13,22 @@ function Chapter(props: any) {
|
|||
{...provided.draggableProps}
|
||||
ref={provided.innerRef}
|
||||
// isDragging={snapshot.isDragging}
|
||||
className="backdrop-blur-md"
|
||||
key={props.info.list.chapter.id}
|
||||
>
|
||||
<h3 className="pt-3 font-bold text-md">
|
||||
{props.info.list.chapter.name}
|
||||
<h3 className="flex space-x-2 pt-3 font-bold text-md items-center">
|
||||
<p>{props.info.list.chapter.name}
|
||||
</p>
|
||||
|
||||
|
||||
|
||||
<button
|
||||
<div
|
||||
className="hover:cursor-pointer p-1 rounded-md bg-slate-100"
|
||||
onClick={() => {
|
||||
props.deleteChapter(props.info.list.chapter.id);
|
||||
}}
|
||||
>
|
||||
X
|
||||
</button>
|
||||
<Trash2 className="text-slate-500" size={16} />
|
||||
</div>
|
||||
</h3>
|
||||
<Droppable key={props.info.list.chapter.id} droppableId={props.info.list.chapter.id} type="activity">
|
||||
{(provided) => (
|
||||
|
|
@ -39,7 +41,7 @@ function Chapter(props: any) {
|
|||
|
||||
<div onClick={() => {
|
||||
props.openNewActivityModal(props.info.list.chapter.id);
|
||||
}} className="flex space-x-2 items-center py-2 my-3 rounded-md justify-center outline outline-3 text-slate-500 outline-slate-200 bg-slate-50 hover:cursor-pointer">
|
||||
}} className="flex space-x-2 items-center py-2 my-3 rounded-md justify-center text-slate-500 outline-slate-200 bg-slate-50 hover:cursor-pointer">
|
||||
<PlusSquare className="" size={17} />
|
||||
<div className="text-sm mx-auto my-auto items-center font-bold">Add Activity</div>
|
||||
</div>
|
||||
|
|
@ -58,7 +60,7 @@ function Chapter(props: any) {
|
|||
const ChapterWrapper = styled.div`
|
||||
margin-bottom: 20px;
|
||||
padding: 4px;
|
||||
background-color: #ffffffc5;
|
||||
background-color: #ffffff9d;
|
||||
width: 900px;
|
||||
font-size: 15px;
|
||||
display: block;
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue