summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
Diffstat
-rw-r--r--client/components/activities/comments.styl46
-rw-r--r--client/components/cards/details.jade16
-rw-r--r--client/components/cards/details.styl11
-rw-r--r--client/components/cards/labels.styl3
-rw-r--r--client/components/forms/forms.styl3
-rw-r--r--client/components/forms/inlinedform.jade2
-rw-r--r--client/components/lists/header.jade2
-rw-r--r--client/components/users/userAvatar.styl1
-rw-r--r--client/lib/escapeActions.js3
-rw-r--r--client/styles/main.styl83
10 files changed, 71 insertions, 99 deletions
diff --git a/client/components/activities/comments.styl b/client/components/activities/comments.styl
new file mode 100644
index 00000000..f372e5ef
--- /dev/null
+++ b/client/components/activities/comments.styl
@@ -0,0 +1,46 @@
+.new-comment
+ position: relative
+ margin: 0 0 20px 38px
+
+ .member
+ opacity: .7
+ position: absolute
+ top: 1px
+ left: -38px
+
+ &.focus
+ .member
+ opacity: 1
+
+ .helper
+ display: inline-block
+
+ .new-comment-input
+ min-height: 108px
+ color: #4d4d4d
+ cursor: auto
+ overflow: hidden
+ word-wrap: break-word
+
+ .too-long
+ margin-top: 8px
+
+.new-comment-input
+ background-color: #fff
+ border: 0
+ box-shadow: 0 1px 2px rgba(0, 0, 0, .23)
+ color: #8c8c8c
+ height: 36px
+ margin: 4px 4px 6px 0
+ padding: 9px 11px
+ width: 100%
+
+ &:hover,
+ &:focus
+ background-color: #fff
+ box-shadow: 0 1px 3px rgba(0, 0, 0, .33)
+ border: 0
+ cursor: pointer
+
+ &:focus
+ cursor: auto
diff --git a/client/components/cards/details.jade b/client/components/cards/details.jade
index dc3d3dc3..be166ad8 100644
--- a/client/components/cards/details.jade
+++ b/client/components/cards/details.jade
@@ -5,7 +5,7 @@ template(name="cardDetails")
.card-details-header
+inlinedForm(classNames="js-card-details-title")
- input.field.single-line(type="text" value=title autofocus)
+ input.full-line(type="text" value=title autofocus)
.edit-controls.clearfix
button.primary.confirm(type="submit") {{_ 'save'}}
a.fa.fa-times-thin.js-close-inlined-form
@@ -25,23 +25,23 @@ template(name="cardDetails")
.card-details-items
.card-details-item.card-details-item-members
- h3 {{_ 'members'}}
+ h3.card-details-item-title {{_ 'members'}}
each members
+userAvatar(userId=this cardId=../_id)
a.member.add-member.card-details-item-add-button.js-add-members
i.fa.fa-plus
.card-details-item.card-details-item-labels
- h3 {{_ 'labels'}}
- .js-add-labels
+ h3.card-details-item-title {{_ 'labels'}}
+ a.js-add-labels
each labels
span.card-label(class="card-label-{{color}}" title=name)= name
- a.card-label.add-label.js-add-labels
- i.fa.fa-plus
+ a.card-label.add-label.js-add-labels
+ i.fa.fa-plus
//- XXX We should use "editable" to avoide repetiting ourselves
if currentUser.isBoardMember
- h3 Description
+ h3.card-details-item-title Description
+inlinedForm(classNames="js-card-description")
+editor(autofocus=true)
= description
@@ -56,7 +56,7 @@ template(name="cardDetails")
else
| {{_ 'edit'}}
else if description
- h3 Description
+ h3.card-details-item-title Description
+viewer
= description
if attachments.count
diff --git a/client/components/cards/details.styl b/client/components/cards/details.styl
index 4da8a371..94c75cf5 100644
--- a/client/components/cards/details.styl
+++ b/client/components/cards/details.styl
@@ -45,6 +45,10 @@
margin: 3px 0
padding: 0
+ form.inlined-form
+ margin-top: 5px
+ margin-bottom: 10px
+
.card-details-list
font-size: 0.85em
margin-bottom: 3px
@@ -58,6 +62,7 @@
border-radius: 3px
padding: 0px 5px
+
.card-details-items
display: flex
margin: 15px 0
@@ -65,10 +70,14 @@
.card-details-item
flex-grow: 1
- h3
+ .card-details-item-title
font-size: 14px
color: darken(white, 45%)
+ .card-label
+ padding-top: 5px
+ padding-bottom: 5px
+
.new-comment
position: relative
margin: 0 0 20px 38px
diff --git a/client/components/cards/labels.styl b/client/components/cards/labels.styl
index c93ecd12..39f9844f 100644
--- a/client/components/cards/labels.styl
+++ b/client/components/cards/labels.styl
@@ -2,7 +2,6 @@
// XXX Use .board-widget-labels as a flexbox container
.card-label
- background-color: #b3b3b3
border-radius: 4px
color: white
display: inline-block
@@ -10,7 +9,6 @@
font-size: 13px
margin-right: 4px
padding: 3px 8px
- position:relative
max-width: 100%
min-width: 8px
overflow: ellipsis
@@ -26,7 +24,6 @@
&.add-label
box-shadow: 0 0 0 2px darken(white, 25%) inset
- background: darken(white, 5%)
.card-label-green
background-color: #3cb500
diff --git a/client/components/forms/forms.styl b/client/components/forms/forms.styl
index f13a7e79..a71aee81 100644
--- a/client/components/forms/forms.styl
+++ b/client/components/forms/forms.styl
@@ -46,6 +46,9 @@ input[type="email"]
height: 18px
width: 200px
+ &.full-line
+ width: 100%
+
input[type="email"]:invalid
box-shadow: none
diff --git a/client/components/forms/inlinedform.jade b/client/components/forms/inlinedform.jade
index 40e1c35c..ac58552a 100644
--- a/client/components/forms/inlinedform.jade
+++ b/client/components/forms/inlinedform.jade
@@ -1,6 +1,6 @@
template(name='inlinedForm')
if isOpen.get
- form.js-inlined-form(id=id class=classNames)
+ form.inlined-form.js-inlined-form(id=id class=classNames)
+Template.contentBlock
else
+Template.elseBlock
diff --git a/client/components/lists/header.jade b/client/components/lists/header.jade
index e319aa93..288cfd57 100644
--- a/client/components/lists/header.jade
+++ b/client/components/lists/header.jade
@@ -10,7 +10,7 @@ template(name="listHeader")
template(name="editListTitleForm")
.list-composer
- input.field.single-line(type="text" value=title autofocus)
+ input.full-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/users/userAvatar.styl b/client/components/users/userAvatar.styl
index ed583288..010311b6 100644
--- a/client/components/users/userAvatar.styl
+++ b/client/components/users/userAvatar.styl
@@ -95,7 +95,6 @@ avatar-radius = 50%
align-items: center
justify-content: center
box-shadow: 0 0 0 2px darken(white, 25%) inset
- background: darken(white, 5%)
.atMention
background: #dbdbdb
diff --git a/client/lib/escapeActions.js b/client/lib/escapeActions.js
index 3759f441..5d8a1f25 100644
--- a/client/lib/escapeActions.js
+++ b/client/lib/escapeActions.js
@@ -151,7 +151,8 @@ Mousetrap.bindGlobal('esc', function() {
// close the popup). We don't execute any action if the user has clicked on a
// link or a button.
$(document).on('click', function(evt) {
- if (evt.which === 1 && $(evt.target).closest('a,button').length === 0) {
+ if (evt.which === 1 &&
+ $(evt.target).closest('a,button,.is-editable').length === 0) {
EscapeActions.clickExecute(evt, 'detailsPane');
}
});
diff --git a/client/styles/main.styl b/client/styles/main.styl
index e6849852..3509d5c9 100644
--- a/client/styles/main.styl
+++ b/client/styles/main.styl
@@ -137,42 +137,6 @@ dl, dt
dd
margin: 0 0 16px 24px
-.edit
- display: none
- position: relative
-
-.editable .current
- cursor: pointer
-
-.editable.editing
- cursor: auto
-
-.edits-warning, .edits-error
- display: none
- clear: both
-
-.editing .edit
- display: block
- float: left
- padding-bottom: 9px
- z-index: 100
- width: 100%
-
-.editing .edits-warning
- display: none!important
-
-.editing .edit .field,
-.editing .edit .field:active
- background: rgba(0, 0, 0, .03)
- box-shadow: inset 0 1px 6px rgba(0, 0, 0, .1)
- border-color: rgba(0, 0, 0, .15)
- margin-bottom: 4px
-
-.edit-heavy .field
- font-size: 15px
- font-weight: 700
- line-height: 18px
-
.ui-draggable-dragging
z-index: 200
@@ -212,53 +176,6 @@ dd
font-size: 25px
color: white
-.new-comment
- position: relative
- margin: 0 0 20px 38px
-
- .member
- opacity: .7
- position: absolute
- top: 1px
- left: -38px
-
- &.focus
- .member
- opacity: 1
-
- .helper
- display: inline-block
-
- .new-comment-input
- min-height: 108px
- color: #4d4d4d
- cursor: auto
- overflow: hidden
- word-wrap: break-word
-
- .too-long
- margin-top: 8px
-
-.new-comment-input
- background-color: #fff
- border: 0
- box-shadow: 0 1px 2px rgba(0, 0, 0, .23)
- color: #8c8c8c
- height: 36px
- margin: 4px 4px 6px 0
- padding: 9px 11px
- width: 100%
-
- &:hover,
- &:focus
- background-color: #fff
- box-shadow: 0 1px 3px rgba(0, 0, 0, .33)
- border: 0
- cursor: pointer
-
- &:focus
- cursor: auto
-
.atMention
background: #dbdbdb
border-radius: 3px
generated by cgit v1.2.3-1-g7c22 (git 2.25.1) at 2024-10-31 13:25:15 +0000