From 889c53ffd1499b08148c99b7196c4b233bd288e8 Mon Sep 17 00:00:00 2001 From: Terran McCanna Date: Thu, 12 Nov 2020 14:46:30 -0500 Subject: [PATCH] OPAC: PINES Carousel Implementation Adds carousel display with custom carousel picker to home page. Signed-off-by: Terran McCanna --- .../opac/css/style.css.tt2 | 80 ++++++++++- .../opac/parts/homesearch.tt2 | 19 ++- .../opac/parts/org_selector.tt2 | 133 ++++++++++++++++++ 3 files changed, 221 insertions(+), 11 deletions(-) diff --git a/Open-ILS/src/templates-bootstrap/opac/css/style.css.tt2 b/Open-ILS/src/templates-bootstrap/opac/css/style.css.tt2 index 5065da656c..f3cc62e633 100755 --- a/Open-ILS/src/templates-bootstrap/opac/css/style.css.tt2 +++ b/Open-ILS/src/templates-bootstrap/opac/css/style.css.tt2 @@ -3811,8 +3811,8 @@ label[for*=expert_] */ .carousel { - width: 40%; - margin: 0 auto; + width: 50%; + margin-left: 450px; } .carousel-title { font-size: 150%; @@ -3824,11 +3824,12 @@ label[for*=expert_] margin: 0px 3px; } .carousel-entry { - max-width: 150px; + max-width: 130px; } .carousel-entry-image { - width: 100%; - height: auto; + width: auto; + height: 160px; + border: 1px solid #999; } .carousel .glide__arrow { color: [% css_colors.button_text %]; @@ -3843,10 +3844,75 @@ label[for*=expert_] display: inline-block; } .carousel .glide__arrow--right { - right: -8em; + right: -5em; } .carousel .glide__arrow--left { - left: -8em; + left: -7em; +} + +/* PINES Carousel customizations */ +#carousel_selector { + width: 300px; +} + +.pines_carousel_selector { + float: left; + text-align: center; + height: 250px; + width: 350px; + margin-left: 0px; + margin-right: 40px; +} + +.pines_carousel_selector_image { + height: 150px; +} + +.pines_carousel_selector_text { + font-size: 125%; + font-weight: bold; + color: #006838; +} + +@media only screen and (max-width: 1200px) { + .carousel { + margin-left: 430px; + width: 40%; + } + .carousel-entry-image { + width: auto; + height: 90px; + border: 1px solid #999; + } +} + +@media only screen and (max-width: 1000px) { + .carousel { + margin: auto; + width: 80%; + } + .carousel-entry-image { + width: auto; + height: 100px; + border: 1px solid #999; + } + .pines_carousel_selector { + float: none; + text-align: center; + height: 80px; + width: 100%; + margin: auto; + margin-top: -50px; + margin-bottom: 40px; + } + .pines_carousel_selector_image { + display: none; + } + .pines_carousel_selector_text { + font-size: 125%; + font-weight: bold; + color: #006838; + } } .search-filter{ diff --git a/Open-ILS/src/templates-bootstrap/opac/parts/homesearch.tt2 b/Open-ILS/src/templates-bootstrap/opac/parts/homesearch.tt2 index 229d4429d6..cde1bcc6a2 100755 --- a/Open-ILS/src/templates-bootstrap/opac/parts/homesearch.tt2 +++ b/Open-ILS/src/templates-bootstrap/opac/parts/homesearch.tt2 @@ -1,5 +1,16 @@ - + + + + + + + [% PROCESS carousels %] + -[% PROCESS carousels %] diff --git a/Open-ILS/src/templates-bootstrap/opac/parts/org_selector.tt2 b/Open-ILS/src/templates-bootstrap/opac/parts/org_selector.tt2 index e368399678..0cd3ceae0e 100755 --- a/Open-ILS/src/templates-bootstrap/opac/parts/org_selector.tt2 +++ b/Open-ILS/src/templates-bootstrap/opac/parts/org_selector.tt2 @@ -132,3 +132,136 @@ BLOCK build_org_selector; [%- END %] [%- END %] + +[% # PINES Customization for Carousels + # Build org selector that refreshes page with carousel_loc set to control which carousels display + +BLOCK build_org_selector_carousel; + node_stack = [{org => org_unit || ctx.aouct_tree || ctx.aou_tree}]; + inherited_vis = ctx.get_cgf('opac.org_unit.non_inherited_visibility').enabled == 'f'; + + IF !name; + name = loc_name; + END; + IF !value; + value = loc_value; + END; + + # if the selected org unit is out of hiding scope, + # disable the ou-hide scoping altogether. + hiding_disabled = ctx.org_hiding_disabled(value); + + -%] + + +[%- END %] + -- 2.43.2