Skip to content

Commit

Permalink
[FINNA-1432] Use item status specific classes for colors. (#3102)
Browse files Browse the repository at this point in the history
This prepares for Bootstrap 5 where it's more difficult to override the colors set by the .text-* classes.
  • Loading branch information
EreMaijala authored Dec 11, 2024
1 parent 7474c74 commit 5e360a5
Show file tree
Hide file tree
Showing 5 changed files with 48 additions and 39 deletions.
41 changes: 25 additions & 16 deletions themes/finna2/scss/finna/holdings.scss
Original file line number Diff line number Diff line change
Expand Up @@ -13,23 +13,24 @@
.status-unavailable-icon {
color: $brand-danger;
}
.status-available .icon {
color: $brand-success;
}
.status-unavailable .icon {
color: $brand-danger;
}
.status-uncertain .icon, .status-unknown .icon {
color: $brand-warning;
}
.dedup-select {
max-width: 100%;
}
.groupLocation {
letter-spacing: 0.2px;
padding: 0;
padding-bottom: 2px;
span:not(.icon) {
&.text-error, &.text-success, &.text-warning {
color: inherit;
vertical-align: middle;
margin-right: 10px;
font-weight: normal;
}
}
.text-error {
color: $brand-danger;
.location-name {
vertical-align: middle;
}
}
.no-branches .groupLocation {
Expand Down Expand Up @@ -187,12 +188,23 @@
h5 {
padding-left: 15px;
}
.holdings-group {
.status-available {
color: $state-success-text;
.icon {
color: $brand-success;
}
}
.status-unavailable {
color: $brand-danger;
}
.status-uncertain, .status-unknown {
color: $brand-warning;
}
}
.holdings-group:not(.headers+.holdings-group) {
border-top: 2px solid $record-holdings-border-color;
}
span.icon.text-success {
color: $brand-success;
}
// Fix horizontal alignment of uncertain status icon:
span.icon.fa-circle-o {
padding-left: 2px;
Expand Down Expand Up @@ -576,9 +588,6 @@
}
span.icon {
vertical-align: middle;
&.text-success {
color: $brand-success;
}
// Fix horizontal alignment of uncertain status icon:
&.fa-circle-o {
padding-left: 2px;
Expand Down
8 changes: 4 additions & 4 deletions themes/finna2/templates/RecordTab/holdings-items.phtml
Original file line number Diff line number Diff line change
Expand Up @@ -65,10 +65,10 @@
<?php /* Begin Available Items (Holds) */ ?>
<?php
if ($row['availability']->is(\VuFind\ILS\Logic\AvailabilityStatusInterface::STATUS_UNCERTAIN)) {
$statusClassEsc = 'text-warning';
$icon = 'status-unknown';
$statusClassEsc = 'status-uncertain';
$icon = 'status-uncertain';
} else {
$statusClassEsc = 'text-success';
$statusClassEsc = 'status-available';
$icon = 'status-available';
}
?>
Expand All @@ -95,7 +95,7 @@
</div>
<?php else: ?>
<?php /* Begin Unavailable Items (Recalls) */ ?>
<span class="text-danger"><?=$status == 'Ordered' ? '' : $this->icon('status-unavailable');?> <?=$this->transEsc('status_' . $status, $statusDescriptionTokens, $this->translate($status, $statusDescriptionTokens))?> </span>
<span class="status-unavailable"><?=$status == 'Ordered' ? '' : $this->icon('status-unavailable');?> <?=$this->transEsc('status_' . $status, $statusDescriptionTokens, $this->translate($status, $statusDescriptionTokens))?> </span>
<?php if (isset($row['returnDate']) && $row['returnDate']): ?>&ndash; <span class="small"><?=$this->escapeHtml($row['returnDate'])?></span><?php endif; ?>
<?php if (isset($row['duedate']) && $row['duedate']): ?>
&ndash;&nbsp;<span class="small"><?=$this->transEsc('Due')?>:&nbsp;<?=$this->escapeHtml($row['duedate'])?></span>
Expand Down
10 changes: 5 additions & 5 deletions themes/finna2/templates/RecordTab/holdingsils.phtml
Original file line number Diff line number Diff line change
Expand Up @@ -265,17 +265,17 @@
}
}
if ($available) {
$holdingSummary = '<span class="text-success">' . $this->icon('status-available', 'text-success') . ' ' . $this->translate('status_items_available_html', ['%%count%%' => $available]) . '</span>';
$holdingSummary = '<span class="status-available">' . $this->icon('status-available') . ' ' . $this->translate('status_items_available_html', ['%%count%%' => $available]) . '</span>';
} elseif ($firstDueStr) {
$holdingSummary = '<span class="text-danger">' . $this->icon('status-unavailable', 'text-danger') . ' ' . $this->transEsc('closest_due_date', ['%%date%%' => $firstDueStr]) . '</span>';
$holdingSummary = '<span class="status-unavailable">' . $this->icon('status-unavailable') . ' ' . $this->transEsc('closest_due_date', ['%%date%%' => $firstDueStr]) . '</span>';
} elseif ($statuses) {
if ($uncertain) {
$holdingSummary = '<span class="text-warning">' . $this->icon('status-unknown', 'text-warning') . ' ' . $this->escapeHtml(implode(' ', array_flip($statuses))) . '</span>';
$holdingSummary = '<span class="status-uncertain">' . $this->icon('status-unknown') . ' ' . $this->escapeHtml(implode(' ', array_flip($statuses))) . '</span>';
} else {
$holdingSummary = '<span class="text-danger"> ' . $this->escapeHtml(implode(' ', array_flip($statuses))) . '</span>';
$holdingSummary = '<span class="status-unavailable"> ' . $this->escapeHtml(implode(' ', array_flip($statuses))) . '</span>';
}
} else {
$holdingSummary = '<span class="text-success">' . $this->icon('status-available', 'text-success') . ' ' . $this->transEsc('Available') . '</span>';
$holdingSummary = '<span class="status-available">' . $this->icon('status-available') . ' ' . $this->transEsc('Available') . '</span>';
}

$additionalSummary = [];
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,13 +23,13 @@
<div class="holdings-details electronic">
<?php $statusDescriptionTokens = $item['availability']->getStatusDescriptionTokens(); ?>
<?php if ($item['availability']->is(\VuFind\ILS\Logic\AvailabilityStatusInterface::STATUS_UNKNOWN)): ?>
<span><?=$this->transEsc('status_unknown_message')?></span>
<span class="status-unknown"><?=$this->transEsc('status_unknown_message')?></span>
<?php elseif ($item['availability']->is(\VuFind\ILS\Logic\AvailabilityStatusInterface::STATUS_UNAVAILABLE)): ?>
<span class="text-danger"><?=$this->transEsc($item['availability']->getStatusDescription(), $statusDescriptionTokens)?></span>
<span class="status-unavailable"><?=$this->transEsc($item['availability']->getStatusDescription(), $statusDescriptionTokens)?></span>
<?php elseif ((int)$item['availability']->is(\VuFind\ILS\Logic\AvailabilityStatusInterface::STATUS_UNCERTAIN)): ?>
<span class="text-warning"><?=$this->transEsc($item['availability']->getStatusDescription(), $statusDescriptionTokens)?></span>
<span class="status-uncertain"><?=$this->transEsc($item['availability']->getStatusDescription(), $statusDescriptionTokens)?></span>
<?php else: ?>
<span class="text-success">
<span class="status-available">
<?=$this->transEsc($item['availability']->getStatusDescription(), $statusDescriptionTokens)?>
</span>
<?php endif; ?>
Expand Down
20 changes: 10 additions & 10 deletions themes/finna2/templates/ajax/status-full.phtml
Original file line number Diff line number Diff line change
Expand Up @@ -109,8 +109,8 @@ if ($groupBranches) {

<?php if ($groupBranches): ?>
<div class="holdings-container root <?=$collapseLocations ? ' collapsible' : ''?>">
<div class="header<?=!empty($availableTotal) ? ' available' : ''?> clearfix">
<?=!empty($availableTotal) ? $this->icon('status-available', 'text-success') : $this->icon('status-unavailable', 'text-danger')?>
<div class="header<?=!empty($availableTotal) ? ' available status-available' : 'status-unavailable'?> clearfix">
<?=!empty($availableTotal) ? $this->icon('status-available') : $this->icon('status-unavailable')?>
<span>
<?php if (!empty($availableTotal)): ?>
<?=sprintf('%s %d %s', $this->transEsc('axiell_available'), $availableTotal, $this->transEsc($journal ? 'axiell_issues' : 'axiell_branches'));?>
Expand Down Expand Up @@ -139,8 +139,8 @@ if ($groupBranches) {
<div class="header holdings<?=!empty($availableTotal) ? ' available' : ''?> clearfix">
<div>
<?php if (!empty($availableTotal)): ?>
<span class="available-total">
<?=$this->icon('status-available', 'text-success')?> <span><?=$this->translate('status_items_available_html', ['%%count%%' => $availableTotal])?></span>
<span class="available-total status-available">
<?=$this->icon('status-available')?> <span><?=$this->translate('status_items_available_html', ['%%count%%' => $availableTotal])?></span>
</span>
<?php endif; ?>
<span class="info">
Expand Down Expand Up @@ -217,16 +217,16 @@ foreach ($this->statusItems as $item):
$classes = null;
if ($item['availability']->is(\VuFind\ILS\Logic\AvailabilityStatusInterface::STATUS_AVAILABLE)) {
$icon = 'status-available';
$classEsc = 'text-success';
$classEsc = 'status-available';
} elseif ($item['availability']->is(\VuFind\ILS\Logic\AvailabilityStatusInterface::STATUS_UNCERTAIN)) {
$icon = 'status-unknown';
$classEsc = 'text-warning';
$classEsc = 'status-uncertain';
} elseif ($item['availability']->is(\VuFind\ILS\Logic\AvailabilityStatusInterface::STATUS_UNKNOWN)) {
$icon = $onlyUnknownStatuses ? '' : 'status-unknown';
$classEsc = 'text-warning';
$classEsc = 'status-unknown';
} else {
$icon = 'status-unavailable';
$classEsc = 'text-error';
$classEsc = 'status-unavailable';
}
$locationText = $this->transEscWithPrefix('location_', $item['location']);
if ($item['locationhref'] ?? false) {
Expand All @@ -243,8 +243,8 @@ foreach ($this->statusItems as $item):
?>
<div class="<?=$currentRow % 2 == 0 ? 'even' : 'odd'?> clearfix">
<div class="<?=$groupBranches ? 'group-location-col' : 'no-branches'?>">
<div class="groupLocation <?= $prevOrganisation && $newOrganisation ? ' new-organisation' : ''; ?>">
<?=$icon ? $this->icon($icon, $classEsc) : ''?> <span class="<?=$classEsc?>"><?=$locationHtml?></span>
<div class="groupLocation <?=$classEsc?><?= $prevOrganisation && $newOrganisation ? ' new-organisation' : ''; ?>">
<?=$icon ? $this->icon($icon) : ''?> <span class="location-name"><?=$locationHtml?></span>
</div>
<?php if ($groupBranches): ?>
</div>
Expand Down

0 comments on commit 5e360a5

Please sign in to comment.