desc

Author: seraphimrose

app/action/detail.js

@@ -4,5 +4,9 @@ import { fromJS } from 'immutable'
 export const toggleDetail = createAction("Show card detail", data => fromJS(data))
 
 export const editingBoardTitle = createAction("Editing board title")
+
 export const editingListTitle = createAction("Editing board title")
-export const editingCardTitle = createAction("Editing board title")
+
+export const editingCardTitle = createAction("Editing board title")
+
+export const editingDesc = createAction("Editing the description")

app/action/entity.js

@@ -23,4 +23,6 @@ export const addMember = createAction("Add members to card", data => fromJS(data
 
 export const addTag = createAction("Add tags to card", data => fromJS(data))
 
-export const changeDueDate = createAction("Change due date", data => fromJS(data))
+export const changeDueDate = createAction("Change due date", data => fromJS(data))
+
+export const editDesc = createAction("Edit the description", data => fromJS(data))

app/component/app/index.js

@@ -13,12 +13,14 @@ export default (props) => (
 			<div>
 				<Detail
 					user={props.user}
+					height={props.height}
 					card={props.card.get(props.detailIndex)}
 					index={props.detailIndex}
 					tag={props.tag}
 					member={props.member}
 					dispatch={props.dispatch}
 					tempCardTitle={props.tempCardTitle}
+					tempDesc={props.tempDesc}
 				/>
 				<div id="mask" onClick={() => props.dispatch(toggleDetail({}))}></div>
 			</div>

app/component/detail/detail.css

@@ -3,7 +3,6 @@
 	left: 265px;
 	top: 45px;
 	width: 730px;
-	height: 520px;
 	z-index: 100;
 	background: #edeff0;
 	color: #000;
@@ -175,6 +174,32 @@
 
 			:local(.desc) {
 				width: 520px;
+
+				:local(.editDesc) {
+					textarea {
+						resize: none;
+						width: 500px;
+						height: 75px;
+						max-width: 500px;
+						max-height: 75px;
+						border: 1px #e2e4e6 solid;
+						border-radius: 3px;
+						box-shadow: 0 0 2px 2px #e2e4e6;
+					}
+
+					button {
+						margin: 5px 10px 0 0;
+					}
+				}
+
+				i {
+					margin-left: 5px;
+					cursor: pointer;
+				}
+
+				.delete {
+					color: #eb5a46;
+				}
 			}
 		}