diff --git a/themes/finc-accessibility/scss/compiled.scss b/themes/finc-accessibility/scss/compiled.scss
new file mode 100644
index 0000000000000000000000000000000000000000..766002b57789f053a07aea5a5099e79b2f515732
--- /dev/null
+++ b/themes/finc-accessibility/scss/compiled.scss
@@ -0,0 +1,57 @@
+// HOWTO:
+// Create a compiled.SCSS file for all sub-themes which imports the respective parent theme's compiled.scss
+// in the cascade plus extends it - this way we ALWAYS have an UP-TO-DATE compiled.CSS imported
+// which includes finc plus all subsequent customizations
+// i.e. finc's compiled.scss imports bootstrap3/scss/compiled - the house-specific branches such as
+// de_15 then import finc/scss/compiled
+// -------------------------------------------------------
+// 0. Note for developers
+// Do NOT EDIT compiled.css
+// -------------------------------------------------------
+// 1. Define or re-define KEY VARIABLES and MIXINS (see 1.1 ff below) OR import your own
+// -------------------------------------------------------
+// 1.1 Unless imported, define standard colour variables here which are used in variables below prior to finc.scss import
+// e.g. $brand-primary: #083152 !default; // blue
+// $brand-secondary: #e7e7e7 !default; // white-lilac
+// $brand-danger: #f04124 !default; // cinnabar
+// $brand-info: #a0d3e8 !default; // cornflower
+// $brand-success: #085218 !default; // sea-green
+// $brand-warning: #f08a24 !default; // carrot
+// -------------------------------------------------------
+// 1.2 DO NOT define site-specific colours in finc - this will be done in site-specific themes
+// -------------------------------------------------------
+// 2. For Media queries:
+// The maximum ranges are defined as the next higher element minus 1px, so:
+// '$screen-xs-max' = $screen-sm-min - 1
+// Extra small screen / phone: up to '$screen-xs-max' (= '$screen-sm-min - 1') = everything below 767px;
+// Small screen / tablet: from '$screen-sm-min' (= 768px) to '$screen-sm-max' (= '$screen-md-min -1') = 991px
+// Medium screen / desktop: from '$screen-md-min' (=992px) to '$screen-md-max' (= '$screen-lg-min -1') = 1199px
+// Large screen / wide desktop: '$screen-lg-min' (=1200px);
+// So, you can simply use: // @media (max-width: $screen-xs-max) {...} for everything for XS devices
+// -------------------------------------------------------
+// 2.1 Media queries for Navbar collapse/uncollapse:
+// The point at which the navbar becomes uncollapsed is defined as
+// $grid-float-breakpoint: $screen-sm-min !default;
+// in Bootstrap -- so you can use '$screen-sm-min' unless you changed the definition
+// The point at which the navbar begins collapsing is defined as
+// $grid-float-breakpoint-max: ($grid-float-breakpoint - 1) !default;
+// -------------------------------------------------------
+// 3. import entire BS (finc) OR import (instances) finc compiled.scss to have variables and mixins defined above applied to it
+@import '../../bootstrap3/scss/bootstrap';
+// @import '../../finc/scss/compiled.scss'
+// -------------------------------------------------------
+// 4. Customize further - this for BASIC SETTINGS ONLY - all colour customization will be done in in site-specific themes
+// ATTENTION: any change made here will affect ALL subsequent branches !!!
+
+//// Result List ol, ul that contains li.result or facet group / side facets that contains li.facet
+.record-list, .facet-group > ul {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+
+// remove filter links styling
+a.remove-filter {
+ display: flex;
+ width: 100%;
+}
\ No newline at end of file
diff --git a/themes/finc-accessibility/templates/Recommend/SideFacets/cluster-list.phtml b/themes/finc-accessibility/templates/Recommend/SideFacets/cluster-list.phtml
new file mode 100644
index 0000000000000000000000000000000000000000..b4099695aacfd3feb94bd97e67246300908d6a64
--- /dev/null
+++ b/themes/finc-accessibility/templates/Recommend/SideFacets/cluster-list.phtml
@@ -0,0 +1,55 @@
+<!-- finc-accessibility - Recommend - SideFacets - cluster-list -->
+<?php $idAndClass = 'id="more-narrowGroupHidden-' . $this->escapeHtmlAttr($this->title) . '" class="facet narrow-toggle"'; ?>
+<?php $moreClass = 'narrowGroupHidden-' . $this->escapeHtmlAttr($this->title) . ' hidden'; ?>
+<?php foreach ($this->cluster['list'] as $i => $thisFacet): ?>
+ <?php if ($i == $this->facets_before_more): ?>
+ <?php if ($facetLightbox = $this->options->getFacetListAction()): ?>
+ <?php $moreUrl = $this->url($facetLightbox) . $results->getUrlQuery()->getParams() . '&facet=' . $this->title . '&facetop=' . $thisFacet['operator'] . '&facetexclude=' . ($this->allowExclude ? 1 : 0); ?>
+ <?php else: ?>
+ <?php $moreUrl = '#'; ?>
+ <?php endif; ?>
+ <?php if (($this->showMoreInLightbox && $this->showMoreInLightbox !== 'more') && $facetLightbox): ?>
+ <a <?=$idAndClass ?> data-lightbox href="<?=$moreUrl ?>" rel="nofollow">
+ <span class="text"><?=$this->transEsc('more')?> ...</span>
+ </a>
+ <?php break; ?>
+ <?php endif; ?>
+ <li <?=$idAndClass ?>>
+ <a class="text" href="<?=$moreUrl ?>" onclick="event.stopImmediatePropagation(); return moreFacets('narrowGroupHidden-<?=$this->escapeHtmlAttr($this->title) ?>');" rel="nofollow">
+ <?=$this->transEsc('more')?> ...
+ </a>
+ </li>
+ <?php endif; ?>
+ <?=$this->render('Recommend/SideFacets/single-facet.phtml', [
+ 'exclude' => $this->allowExclude,
+ 'facet' => $thisFacet,
+ 'group' => $this->title,
+ 'moreClass' => $i >= $this->facets_before_more ? $moreClass : false,
+ 'url' => $this->results->getUrlQuery(),
+ 'urlBase' => '',
+ ]) ?>
+<?php endforeach; ?>
+<?php if (empty($this->cluster['list'])): ?>
+ <div class="facet"><?=$this->transEsc('facet_list_empty')?></div>
+<?php endif; ?>
+
+<?php /* LESS and SEE MORE links */ ?>
+<?php if (isset($i) && $i >= $this->facets_before_more): ?>
+ <?php if ($this->showMoreInLightbox === 'more' && $facetLightbox = $options->getFacetListAction()): ?>
+ <?php
+ $moreUrl = $this->url($facetLightbox) . $results->getUrlQuery()->getParams() . '&facet=' . $this->title . '&facetop=' . $thisFacet['operator'] . '&facetexclude=' . ($this->allowExclude ? 1 : 0);
+ if (!empty($this->baseUriExtra)) {
+ $moreUrl .= '&baseUriExtra=' . urlencode($this->baseUriExtra);
+ }
+ ?>
+ <a class="facet narrow-toggle <?=$moreClass ?>" data-lightbox href="<?=$moreUrl ?>" rel="nofollow">
+ <span class="text"><?=$this->transEsc('see all')?> ...</span>
+ </a>
+ <?php endif; ?>
+ <li class="facet narrow-toggle <?=$moreClass ?>">
+ <a class="text" href="#" onclick="event.stopImmediatePropagation(); return lessFacets('narrowGroupHidden-<?=$this->escapeHtmlAttr($this->title) ?>');">
+ <?=$this->transEsc('less')?> ...
+ </a>
+ </li>
+<?php endif; ?>
+<!-- finc-accessibility - Recommend - SideFacets - cluster-list - END -->
diff --git a/themes/finc-accessibility/templates/Recommend/SideFacets/filter-list.phtml b/themes/finc-accessibility/templates/Recommend/SideFacets/filter-list.phtml
index e2bcbb9c9e466615696ac66aaa5165e1a143d182..2abcc73899ebf11bd294537db651a089cf64b21d 100644
--- a/themes/finc-accessibility/templates/Recommend/SideFacets/filter-list.phtml
+++ b/themes/finc-accessibility/templates/Recommend/SideFacets/filter-list.phtml
@@ -2,6 +2,7 @@
<?php /* #18509 copied from bootstrap for adding language tags to displayText */ ?>
<div class="facet-group active-filters">
<div class="title"><?=$this->transEsc('Remove Filters')?></div>
+ <ul>
<?php foreach ($filterList as $field => $filters): ?>
<?php foreach ($filters as $i => $filter): ?>
<?php
@@ -18,16 +19,19 @@
$filter['displayText'] = $this->translate('filter_wildcard');
}
?>
- <a class="facet" href="<?=$removeLink ?>" title="<?=$this->transEsc('clear_tag_filter') ?> - <?=$this->transEsc('page_reload_on_deselect_hint', ['%%filter_name%%' => $filter['displayText']])?>">
- <span class="sr-only"><?=$this->transEsc('clear_tag_filter') ?></span>
- <span class="text">
- <?php if ($filter['operator'] == 'NOT'): ?><?=$this->transEsc('NOT') ?><?php endif; ?>
- <?php if ($filter['operator'] == 'OR' && $i > 0): ?><?=$this->transEsc('OR') ?><?php endif; ?>
- <?=$this->transEsc($field) ?>: <?=$this->sideFacet()->getLanguageTag($this->escapeHtml($filter['displayText']), 'span', $this->layout()->userLang) ?>
- </span>
- <span class="status"><i class="fa fa-times" aria-hidden="true"></i></span>
- </a>
+ <li class="facet">
+ <a class="remove-filter" href="<?=$removeLink ?>" title="<?=$this->transEsc('clear_tag_filter') ?> - <?=$this->transEsc('page_reload_on_deselect_hint', ['%%filter_name%%' => $filter['displayText']])?>">
+ <span class="sr-only"><?=$this->transEsc('clear_tag_filter') ?></span>
+ <span class="text">
+ <?php if ($filter['operator'] == 'NOT'): ?><?=$this->transEsc('NOT') ?><?php endif; ?>
+ <?php if ($filter['operator'] == 'OR' && $i > 0): ?><?=$this->transEsc('OR') ?><?php endif; ?>
+ <?=$this->transEsc($field) ?>: <?=$this->sideFacet()->getLanguageTag($this->escapeHtml($filter['displayText']), 'span', $this->layout()->userLang) ?>
+ </span>
+ <span class="status"><i class="fa fa-times" aria-hidden="true"></i></span>
+ </a>
+ </li>
<?php endforeach; ?>
<?php endforeach; ?>
+ </ul>
</div>
<!-- finc-accessibility - Recommend - SideFacets - filter-list.phtml - END -->
diff --git a/themes/finc-accessibility/templates/search/facet-list.phtml b/themes/finc-accessibility/templates/search/facet-list.phtml
new file mode 100644
index 0000000000000000000000000000000000000000..9312d4d68412be58d3a9ad5f1a7d8e03fa639049
--- /dev/null
+++ b/themes/finc-accessibility/templates/search/facet-list.phtml
@@ -0,0 +1,56 @@
+<!-- finc-accessibility: search - facet-list -->
+<?php
+ $options = $this->results->getParams()->getOptions();
+ $facetLightbox = $options->getFacetListAction();
+ if (empty($this->sortOptions)) {
+ $this->sort = 'default';
+ $this->sortOptions = [ 'default' => 'default' ];
+ }
+ $urlBase = $this->url($facetLightbox) . $results->getUrlQuery()->getParams() . '&facet=' . urlencode($this->facet) . '&facetexclude=' . $this->exclude . '&facetop=' . $this->operator;
+ $searchAction = $this->url($options->getSearchAction());
+ if (!empty($this->baseUriExtra)) {
+ $searchAction .= urlencode($this->baseUriExtra);
+ $urlBase .= '&baseUriExtra=' . urlencode($this->baseUriExtra);
+ }
+ $this->headTitle($this->translate('facet_list_for', ['%%field%%' => $this->facetLabel]));
+?>
+<h2><?=$this->transEsc($this->facetLabel) ?></h2>
+<?php if (count($this->sortOptions) > 1): ?>
+ <div class="full-facet-sort-options">
+ <label><?=$this->translate('Sort') ?></label>
+ <div class="btn-group">
+ <?php foreach ($this->sortOptions as $key => $sort): ?>
+ <a href="<?=$urlBase . '&facetpage=1&facetsort=' . urlencode($key) ?>" class="btn btn-default js-facet-sort<?php if($this->sort == $key): ?> active<?php endif; ?>" data-sort="<?=$key ?>" data-lightbox-ignore><?=$this->translate($sort) ?></a>
+ <?php endforeach; ?>
+ </div>
+ </div>
+<?php endif; ?>
+<div class="lightbox-scroll full-facets">
+ <?php foreach ($this->sortOptions as $key => $sort): ?>
+ <?php $active = $this->sort == $key; ?>
+ <ul class="full-facet-list facet-group<?php if(!$active): ?> hidden<?php endif; ?>" id="facet-list-<?=$this->escapeHtmlAttr($key) ?>">
+ <?php if ($active): ?>
+ <?php if ($this->page > 1): ?>
+ <a href="<?=$urlBase . '&facetpage=' . ($this->page - 1) . '&facetsort=' . $this->sort ?>" class="facet js-facet-prev-page" data-page="<?=($this->page + 1) ?>" data-sort="<?=$this->sort ?>" data-limit="<?=count($this->data) ?>" data-lightbox-ignore><?=$this->translate('prev') ?> ...</a>
+ <?php endif; ?>
+ <?php foreach ($this->data as $item): ?>
+ <?=$this->render('Recommend/SideFacets/single-facet.phtml', [
+ 'exclude' => $this->exclude,
+ 'facet' => $item,
+ 'group' => $this->facet,
+ 'url' => $this->results->getUrlQuery(),
+ 'urlBase' => $searchAction
+ ]) ?>
+ <?php endforeach; ?>
+ <?php endif; ?>
+ <?php if ($this->anotherPage): ?>
+ <a href="<?=$urlBase . '&facetpage=' . ($this->page + 1) . '&facetsort=' . urlencode($key) ?>" class="facet js-facet-next-page" data-page="<?=($this->page + 1) ?>" data-sort="<?=$this->escapeHtmlAttr($key) ?>" data-lightbox-ignore>
+ <span class="text"><?=$this->translate('more') ?> ...</span>
+ </a>
+ <?php endif; ?>
+ </ul>
+ <?php endforeach; ?>
+</div>
+<button class="btn btn-default lightbox-only" data-dismiss="modal"><?=$this->translate('close') ?></button>
+<?=$this->inlineScript(\Zend\View\Helper\HeadScript::SCRIPT, '(typeof VuFind.lightbox_facets !== "undefined") && VuFind.lightbox_facets.setup();', 'SET'); ?>
+<!-- finc-accessibility: search - facet-list - END -->
diff --git a/themes/finc/scss/compiled.scss b/themes/finc/scss/compiled.scss
index 117e5c97bd91f71bed14d91d9a266f3cab92c007..5ef3c469f8f60fab8f6646256f2d49a84bce76a0 100644
--- a/themes/finc/scss/compiled.scss
+++ b/themes/finc/scss/compiled.scss
@@ -39,7 +39,7 @@
// $grid-float-breakpoint-max: ($grid-float-breakpoint - 1) !default;
// -------------------------------------------------------
// 3. import entire BS (finc) OR import (instances) finc compiled.scss to have variables and mixins defined above applied to it
-@import '../../bootstrap3/scss/bootstrap';
+@import '../../finc-accessibility/scss/compiled';
// @import '../../finc/scss/compiled.scss'
// -------------------------------------------------------
// 4. Customize further - this for BASIC SETTINGS ONLY - all colour customization will be done in in site-specific themes
@@ -2144,13 +2144,6 @@ footer {
}
}
-//// Result List ol, ul that contains li.result or facet group that contains li.facet
-.record-list {
- list-style: none;
- margin: 0;
- padding: 0;
-}
-
//// Results (see BS SCSS/COMPONENTS/... for details)
.result {
hyphens: auto;
diff --git a/themes/finc/templates/Recommend/SideFacets.phtml b/themes/finc/templates/Recommend/SideFacets.phtml
index c9b17d41fee7a615524004e5a69dcacb2ee5cdb9..361ead35a1593f0ee60b1fa94c71b399d30b988a 100644
--- a/themes/finc/templates/Recommend/SideFacets.phtml
+++ b/themes/finc/templates/Recommend/SideFacets.phtml
@@ -58,7 +58,7 @@ if ($hierarchicalFacets) {
<button class="title<?php if(in_array($title, $collapsedFacets)): ?> collapsed<?php endif ?>" data-toggle="collapse" href="#side-collapse-<?=$this->escapeHtmlAttr($title) ?>" >
<?=$this->transEsc($cluster['label'])?>
</button>
- <div id="side-collapse-<?=$this->escapeHtmlAttr($title)?>" class="collapse<?php if (!in_array($title, $collapsedFacets)): ?> in<?php endif ?>">
+ <ul id="side-collapse-<?=$this->escapeHtmlAttr($title)?>" class="collapse<?php if (!in_array($title, $collapsedFacets)): ?> in<?php endif ?>">
<?=$this->context($this)->renderInContext(
'Recommend/SideFacets/facet.phtml',
[
@@ -66,7 +66,7 @@ if ($hierarchicalFacets) {
'cluster' => $cluster,
'collapsedFacets' => $collapsedFacets ]
); ?>
- </div>
+ </ul>
</div>
<?php endforeach; ?>
<?php endif; ?>
diff --git a/themes/finc/templates/Recommend/SideFacets/single-facet.phtml b/themes/finc/templates/Recommend/SideFacets/single-facet.phtml
index 054dcc31a94decb722a11827fea8b9afff4a6e0d..d82632dc70a58abc9da86952b4c25f8a07029149 100644
--- a/themes/finc/templates/Recommend/SideFacets/single-facet.phtml
+++ b/themes/finc/templates/Recommend/SideFacets/single-facet.phtml
@@ -31,9 +31,10 @@
}
?>
<?php if ($hasSubLinks): ?>
- <div class="<?=implode(' ', $classList) ?>">
+ <li class="<?=implode(' ', $classList) ?>">
<?php else: ?>
- <a
+ <li>
+ <a
<?php if ($this->facet['isApplied']): ?>id="<?=$this->sideFacet()->setAppliedFacet($this->transEsc('Skip to facet', ['%%filter_name%%' => $this->facet['displayText']])) ?>"<?php endif; ?>
href="<?=$toggleUrl ?>"
class="<?=implode(' ', $classList) ?>"
@@ -64,12 +65,12 @@
</span>
<?php endif; ?>
- <?php if ($this->exclude && !$this->facet['isApplied']): ?>
+ <?php if ($hasSubLinks): ?>
<?php $excludeURL = $this->urlBase . $this->url->addFacet($this->group, $this->facet['value'], 'NOT'); ?>
<a href="<?=$excludeURL ?>" data-lightbox-ignore class="exclude" title="<?= $this->transEsc('exclude_filter', ['%%filter_name%%' => $this->facet['displayText']]) ?>, <?= $this->transEsc('page_reload_hint') ?>">
<i class="fa fa-times" aria-hidden="true"></i>
</a>
<?php endif; ?>
-<?=$hasSubLinks ? '</div>' : '</a>'; ?>
+<?=$hasSubLinks ? '</li>' : '</a></li>'; ?>
<!-- finc - Recommend - SideFacets - single-facet - END -->
\ No newline at end of file