summaryrefslogtreecommitdiffstats
path: root/client/components/lists
diff options
context:
space:
mode:
authorMaxime Quandalle <maxime@quandalle.com>2015-06-05 21:37:13 +0200
committerMaxime Quandalle <maxime@quandalle.com>2015-06-05 21:37:13 +0200
commitdea52907bdbed92c95dec7e7e832ac95d9f9d388 (patch)
tree22edfa8b3eb623084edcb2e25abb0bd8285b9cc4 /client/components/lists
parent97807abd709f4355964b52105c0931d6671ff20b (diff)
downloadwekan-dea52907bdbed92c95dec7e7e832ac95d9f9d388.tar.gz
wekan-dea52907bdbed92c95dec7e7e832ac95d9f9d388.tar.bz2
wekan-dea52907bdbed92c95dec7e7e832ac95d9f9d388.zip
Start designing the card details pane
Implement a dynamic overflow to focus sight on the pane.
Diffstat (limited to 'client/components/lists')
-rw-r--r--client/components/lists/body.jade3
-rw-r--r--client/components/lists/header.jade13
-rw-r--r--client/components/lists/main.styl33
3 files changed, 17 insertions, 32 deletions
diff --git a/client/components/lists/body.jade b/client/components/lists/body.jade
index 9f9d04ad..f1159ce5 100644
--- a/client/components/lists/body.jade
+++ b/client/components/lists/body.jade
@@ -16,8 +16,7 @@ template(name="listBody")
template(name="addCardForm")
.minicard.minicard-composer.js-composer
- .minicard-labels.js-minicard-composer-labels
- .minicard-details.clearfix
+ .minicard-detailss.clearfix
textarea.minicard-composer-textarea.js-card-title(autofocus)
.minicard-members.js-minicard-composer-members
.add-controls.clearfix
diff --git a/client/components/lists/header.jade b/client/components/lists/header.jade
index b8548278..e319aa93 100644
--- a/client/components/lists/header.jade
+++ b/client/components/lists/header.jade
@@ -3,11 +3,14 @@ template(name="listHeader")
+inlinedForm
+editListTitleForm
else
- h2.list-header-name.js-open-inlined-form= title
+ h2.list-header-name(
+ class="{{#if currentUser.isBoardMember}}js-open-inlined-form is-editable{{/if}}")
+ = title
a.list-header-menu-icon.fa.fa-bars.js-open-list-menu
template(name="editListTitleForm")
- input.field.single-line(type="text" value=title autofocus)
- .edit-controls.clearfix
- button.primary.confirm(type="submit") {{_ 'save'}}
- a.fa.fa-times-thin.js-close-inlined-form
+ .list-composer
+ input.field.single-line(type="text" value=title autofocus)
+ .edit-controls.clearfix
+ button.primary.confirm(type="submit") {{_ 'save'}}
+ a.fa.fa-times-thin.js-close-inlined-form
diff --git a/client/components/lists/main.styl b/client/components/lists/main.styl
index 98b4abf4..bfa0f348 100644
--- a/client/components/lists/main.styl
+++ b/client/components/lists/main.styl
@@ -8,7 +8,7 @@
position: relative
// Even if this background color is the same as the body we can't leave it
// transparent, because that won't work during a list drag.
- background: darken(white, 10%)
+ background: darken(white, 13%)
height: 100%
border-left: 1px solid darken(white, 20%)
padding: 0
@@ -17,7 +17,7 @@
margin-left: 5px
border-left: none
- .card-detail + &
+ .card-details + &
border-left: none
&.ui-sortable-helper
@@ -32,13 +32,15 @@
box-shadow: none
height: 100px
- &.list-composer
+ &.list-composer, & list-composer
padding: 17px
+ form
+ margin-top: -5px
+
.list-name-input
- background: rgba(0, 0, 0, .05)
+ background: rgba(255, 255, 255, .4)
border-color: #aaa
- box-shadow: inset 0 1px 8px rgba(0, 0, 0, .15)
display: block
margin: 0
transition: margin 85ms ease-in,
@@ -52,14 +54,9 @@
overflow: hidden
margin: 4px 0 0
- input[type=submit]
- margin-top: 0
- min-height: 30px
- height: 30px
-
.list-header
flex: 0 0 auto
- margin: 20px 15px 4px
+ margin: 20px 12px 4px
position: relative
min-height: 20px
@@ -76,17 +73,9 @@
word-wrap: break-word
.list-header-menu-icon
- background-clip: content-box
- background-origin: content-box
- // padding: 6px 8px
position: absolute
top: 0
right: 0
- color: #a6a6a6
-
- .list-header-num-cards
- color: #8c8c8c
- margin: 0
.list-body
flex: 1
@@ -119,9 +108,3 @@
background: #fafafa
color: #222
box-shadow: 0 1px 2px rgba(0,0,0,.2)
-
-@keyframes fadeIn
- from
- opacity: 0
- to
- opacity: 1