LT-379: Study association table row hover is odd

This commit is contained in:
Leonardo Campos 2016-11-22 20:25:14 -02:00
parent da5b7d4fc4
commit dc64210b99
3 changed files with 25 additions and 12 deletions

View File

@ -23,13 +23,13 @@
<tbody> <tbody>
{{#each relevantStudies}} {{#each relevantStudies}}
<tr> <tr class="{{#if autoselected}}disabled{{/if}}">
<td class="checkboxWrapper center"> <td class="checkboxWrapper center">
<label> <label>
<input type="checkbox" class="includeStudy" {{valueIf autoselected '' 'checked'}}/> <span></span> <input type="checkbox" class="includeStudy" {{valueIf autoselected '' 'checked'}}/> <span></span>
</label> </label>
</td> </td>
<td class="center studyDataCell {{#if autoselected}}disabled{{/if}}"> <td class="center studyDataCell">
{{#if autoselected}} {{#if autoselected}}
<p class="studyDate autoselected" <p class="studyDate autoselected"
data-toggle="tooltip" data-toggle="tooltip"
@ -40,13 +40,13 @@
<p class="studyDate">{{formatDA studyDate}}</p> <p class="studyDate">{{formatDA studyDate}}</p>
{{/if}} {{/if}}
</td> </td>
<td class="center studyDataCell {{#if autoselected}}disabled{{/if}}"> <td class="center studyDataCell">
<p>{{formatPN patientName}}</p> <p>{{formatPN patientName}}</p>
</td> </td>
<td class="studyDataCell {{#if autoselected}}disabled{{/if}}"> <td class="studyDataCell">
<p>{{studyDescription}}</p> <p>{{studyDescription}}</p>
</td> </td>
<td class="timepointOptions center studyDataCell noselect {{#if autoselected}}disabled{{/if}}"> <td class="timepointOptions center studyDataCell noselect">
{{#each timepointOptions}} {{#each timepointOptions}}
<label class="noselect"> <label class="noselect">
<input type="radio" <input type="radio"
@ -54,7 +54,7 @@
value="{{value}}" value="{{value}}"
class="timepointOption" class="timepointOption"
{{valueIf checked 'checked' ''}} {{valueIf checked 'checked' ''}}
{{valueIf autoselected 'disabled' ''}}> {{valueIf ../autoselected 'disabled' ''}}>
<span></span>{{name}} <span></span>{{name}}
</label> </label>
{{/each}} {{/each}}

View File

@ -128,12 +128,14 @@ Template.studyAssociationTable.helpers({
Template.studyAssociationTable.events({ Template.studyAssociationTable.events({
'change input.includeStudy'(event, instance) { 'change input.includeStudy'(event, instance) {
const checkbox = event.currentTarget; const checkbox = event.currentTarget;
const studyDataCells = $(checkbox).parents('tr').find('td.studyDataCell'); const studyRow = $(checkbox).closest('tr');
const studyDataCells = studyRow.find('td.studyDataCell');
if (checkbox.checked === true) { if (checkbox.checked === true) {
studyDataCells.removeClass('disabled'); studyRow.removeClass('disabled');
studyDataCells.find('input').attr('disabled', false); studyDataCells.find('input').attr('disabled', false);
} else { } else {
studyDataCells.addClass('disabled'); studyRow.addClass('disabled');
studyDataCells.find('input').attr('disabled', true); studyDataCells.find('input').attr('disabled', true);
} }
} }

View File

@ -108,6 +108,16 @@ $bodyCellHeight = 30px
&:before &:before
theme('background-color', '$activeColor') theme('background-color', '$activeColor')
&:disabled
& + span
border-color: #535960 !important
&:checked + span
border-color: #0D4256 !important
&:before
background-color: #0D4256 !important
label label
padding: 0 5px padding: 0 5px
padding-left: 20px padding-left: 20px
@ -115,9 +125,6 @@ $bodyCellHeight = 30px
position: relative position: relative
line-height: initial line-height: initial
&.disabled
opacity: 0.2
&.checkboxWrapper &.checkboxWrapper
label label
display: block display: block
@ -165,6 +172,10 @@ $bodyCellHeight = 30px
&:before &:before
content: '\2713' content: '\2713'
&.disabled
td
color: #535960
&:hover, &:active, &.active &:hover, &:active, &.active
background-color: $tableHoverColor background-color: $tableHoverColor
color: white color: white