From c5b83c04c17eea8e49e9d9f865ecd47e37d84a1d Mon Sep 17 00:00:00 2001
From: nztqa <nztqa@users.noreply.github.com>
Date: Mon, 3 Jul 2017 16:57:20 +0900
Subject: Improve UI Design (checklists item)

1. Change background color on mouseover and remove it after mouseout
2. Increase the clickable area of title
---
 client/components/cards/checklists.styl | 3 +++
 1 file changed, 3 insertions(+)

(limited to 'client/components')

diff --git a/client/components/cards/checklists.styl b/client/components/cards/checklists.styl
index 885d7528..1156c577 100644
--- a/client/components/cards/checklists.styl
+++ b/client/components/cards/checklists.styl
@@ -46,6 +46,8 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item
     font-size: 1.1em
     margin-top: 3px
     display: flex
+    &:hover
+      background-color: darken(white, 8%)
 
     .check-box
       margin-top: 5px
@@ -54,6 +56,7 @@ textarea.js-add-checklist-item, textarea.js-edit-checklist-item
         border-right: 2px solid #3cb500
 
     .item-title
+      flex-grow: 1
       padding-left: 10px;
       &.is-checked
         color: #8c8c8c
-- 
cgit v1.2.3-1-g7c22