archive/attract
0
0
Fork 0
Code Issues 7 Pull Requests Projects Releases Wiki Activity

Click on the whole cell to open task

Browse Source
This commit is contained in:
Pablo Vazquez
2016-09-26 15:58:08 +02:00
parent 0eb51a2804
commit c4b4197cb8
3 changed files with 87 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/styles/_shots.sass
View File

@@ -7,6 +7,9 @@
.table-cell
text-align: center
&.highlight .collapser
color: $color-primary-dark
&.shot-thumbnail
width: $shots-list-thumbnail-width
@@ -19,6 +22,10 @@
display: inline-block
padding: 5px
&:hover
span.collapser
color: $color-primary
.table-body
display: table-row-group
@@ -60,35 +67,62 @@
.table-cell
text-align: center
border-left: thin solid transparent
border-right: thin solid transparent
&.active
background-color: $color-background
&.highlight
background-color: $color-background-light
&.shot-name
padding: 0px 10px
text-align: left
position: relative
height: 100%
a
height: 100%
color: $color-text-dark-primary
&.task-type
max-width: 120px
position: relative
height: 100%
overflow: hidden
a
display: inline-block /* Each task in a new line */
border-radius: 50%
width: 16px
height: 16px
position: relative
top: 2px
+text-overflow-ellipsis
+status-background-color
height: 100%
width: 100%
transition: all 150ms ease-in-out
+status-background-color-before
&:before
display: block
content: ''
position: absolute
width: 16px
height: 16px
border-radius: 50%
border: 2px solid transparent
top: 50%
left: 50%
transform: translate(-50%, -50%)
&.active
opacity: 1
border-radius: 3px
border-radius: 2px
display: inline-block
&.task-add
width: auto
border-radius: initial
opacity: 0
vertical-align: middle
&:hover a.task-add
opacity: 1

19
src/styles/_utils.sass
View File

@@ -526,6 +526,25 @@
&-review
background-color: hsl(hue($color-status-review), 100%, 75%)
=status-background-color-before
&.status
&-invalid:before
background-color: hsl(hue($color-status-invalid), 100%, 75%)
&-todo:before
background-color: $color-status-todo-dark
&-in_progress:before
background-color: hsl(hue($color-status-in_progress), 100%, 50%)
&-on_hold:before
background-color: hsl(hue($color-status-on_hold), 60%, 50%)
&-approved:before
background-color: hsl(hue($color-status-approved), 40%, 60%)
&-cbb:before
background-color: $color-status-cbb
&-final:before
background-color: hsl(hue($color-status-final), 100%, 40%)
&-review:before
background-color: hsl(hue($color-status-review), 100%, 75%)
=status-color
&.status
&-invalid

22
src/templates/attract/shots/for_project.jade
View File

@@ -71,12 +71,13 @@ script.
$(function() { item_open('{{ open_shot_id }}', 'shot', false); });
{% endif %}
var same_cells;
$('.table-head .table-cell span').on('click', function(e){
e.stopPropagation();
/* We need to find every cell matching the same classes */
var same_cells = '.' + $(this).parent().attr('class').split(' ').join('.');
same_cells = '.' + $(this).parent().attr('class').split(' ').join('.');
$(same_cells).hide();
/* Add the spacer which we later click to expand */
$('<div class="table-cell-spacer"></div>').insertAfter(same_cells);
@@ -84,9 +85,26 @@ script.
$('body').on('click', '.table-cell-spacer', function(){
/* We need to find every cell matching the same classes */
var same_cells = '.' + $(this).prev().attr('class').split(' ').join('.');
same_cells = '.' + $(this).prev().attr('class').split(' ').join('.');
$(same_cells).show();
$(same_cells).next().remove();
});
$('.table-body .table-cell').mouseenter(function(){
same_cells = '.' + $(this).attr('class').split(' ').join('.');
$('.table-head ' + same_cells).addClass('highlight');
}).mouseleave(function(){
same_cells = '.' + $(this).attr('class').split(' ').join('.');
$('.table-head ' + same_cells).removeClass('highlight');
});
$('.table-head .table-cell').mouseenter(function(){
same_cells = '.' + $(this).attr('class').split(' ').join('.');
$('.table-body ' + same_cells).addClass('highlight');
}).mouseleave(function(){
same_cells = '.' + $(this).attr('class').split(' ').join('.');
$('.table-body ' + same_cells).removeClass('highlight');
});
| {% endblock footer_scripts %}