body{
    background:#F8F9FA;

}
.card{
    /* overflow: hidden;
    border-radius: 14px; */
}

/* 列表内容的布局 */
.task-item{
    display: flex;
    align-items: center;
}
/* 当li有comleted类名时，表示当前任务已完成 */
.completed .task-text{
    color: #6c757d;
    text-decoration:line-through;
}



.task-item:hover{
    background: #F8F9FA;
}
.task-text{
    /* 让剩余空间都是它的，拉伸 */
flex-grow: 1;
cursor: pointer;
}
/* 隐藏 */
.task-ctrl{
    /* display: none; */
    opacity: 0;
    transition: 0.5s;
}
.task-item:hover .task-ctrl{
    opacity:1;
}