summaryrefslogtreecommitdiffstats
path: root/client/components/cards
diff options
context:
space:
mode:
Diffstat (limited to 'client/components/cards')
-rw-r--r--client/components/cards/cardDetails.js15
-rw-r--r--client/components/cards/cardDetails.styl6
-rw-r--r--client/components/cards/labels.js2
-rw-r--r--client/components/cards/minicard.styl26
4 files changed, 33 insertions, 16 deletions
diff --git a/client/components/cards/cardDetails.js b/client/components/cards/cardDetails.js
index 4fa90bf7..82ecde85 100644
--- a/client/components/cards/cardDetails.js
+++ b/client/components/cards/cardDetails.js
@@ -1,3 +1,7 @@
+// XXX Obviously this shouldn't be a global, but this is currently the only way
+// to share a variable between two files.
+
+
BlazeComponent.extendComponent({
template: function() {
return 'cardDetails';
@@ -17,6 +21,12 @@ BlazeComponent.extendComponent({
activitiesComponent.loadNextPage();
},
+ onCreated: function() {
+ this.isLoaded = new ReactiveVar(false);
+ this.componentParent().showOverlay.set(true);
+ this.componentParent().mouseHasEnterCardDetails = false;
+ },
+
onRendered: function() {
var bodyBoardComponent = this.componentParent();
var additionalMargin = 550;
@@ -35,10 +45,6 @@ BlazeComponent.extendComponent({
});
},
- onCreated: function() {
- this.isLoaded = new ReactiveVar(false);
- },
-
events: function() {
var events = {
[CSSEvents.animationend + ' .js-card-details']: function() {
@@ -69,6 +75,7 @@ BlazeComponent.extendComponent({
'click .js-add-labels': Popup.open('cardLabels'),
'mouseenter .js-card-details': function() {
this.componentParent().showOverlay.set(true);
+ this.componentParent().mouseHasEnterCardDetails = true;
}
})];
}
diff --git a/client/components/cards/cardDetails.styl b/client/components/cards/cardDetails.styl
index 72e8c7c9..9a6736ee 100644
--- a/client/components/cards/cardDetails.styl
+++ b/client/components/cards/cardDetails.styl
@@ -7,13 +7,12 @@
flex-basis: 470px
will-change: flex-basis
overflow: hidden
- background: white
- border-radius: 3px
+ background: darken(white, 2%)
+ border-radius: bottom 3px
z-index: 20 !important
animation: flexGrowIn 0.1s
box-shadow: 0 0 7px 0 darken(white, 30%)
transition: flex-basis 0.1s
- margin-top: -9px
.card-details-canvas
width: 470px
@@ -21,7 +20,6 @@
.card-details-header
margin: 0 -20px 5px
padding 7px 20px 0
- background: #F7F7F7
border-bottom: 1px solid darken(white, 10%)
min-height: 38px
position: relative
diff --git a/client/components/cards/labels.js b/client/components/cards/labels.js
index 731e6367..4e6ceb3a 100644
--- a/client/components/cards/labels.js
+++ b/client/components/cards/labels.js
@@ -37,7 +37,7 @@ Template.createLabelPopup.helpers({
// is not already used in the board (although it's not a problem if two
// labels have the same color).
defaultColor: function() {
- var labels = this.labels || this.card.board().labels;
+ var labels = Boards.findOne(Session.get('currentBoard')).labels;
var usedColors = _.pluck(labels, 'color');
var availableColors = _.difference(labelColors, usedColors);
return availableColors.length > 1 ? availableColors[0] : labelColors[0];
diff --git a/client/components/cards/minicard.styl b/client/components/cards/minicard.styl
index ee454e78..c45c7eb9 100644
--- a/client/components/cards/minicard.styl
+++ b/client/components/cards/minicard.styl
@@ -5,10 +5,6 @@
align-items: center
margin-bottom: 9px
- &.draggable-hover-card
- background-color: #f0f0f0
- border-bottom-color: #c2c2c2
-
&.placeholder
background: darken(white, 20%)
border-radius: 2px
@@ -53,6 +49,14 @@
z-index: 25
box-shadow: -2px 1px 2px rgba(0,0,0,.2)
+ &:hover:not(.minicard-composer),
+ .is-selected &,
+ .draggable-hover-card &
+ background: darken(white, 2%)
+
+ .draggable-hover-card &
+ background: darken(white, 4%)
+
.minicard-cover
background-position: center
background-repeat: no-repeat
@@ -79,18 +83,26 @@
.badges
float: left
- margin-top: 5px
- color: darken(white, 60%)
+ margin-top: 7px
+ color: darken(white, 50%)
&:empty
display: none
.badge
float: left
- margin-right: 10px
+ margin-right: 11px
+ margin-bottom: 3px
+ font-size: 0.9em
+
+ .badge-icon,
+ .badge-text
+ vertical-align: top
.badge-text
font-size: 0.9em
+ padding-left: 2px
+ line-height: 14px
.minicard-members
float: right