Changes for page Solr Search

Last modified by Monika Leung on 2025/04/05 16:25

From version 2.1
edited by Monika Leung
on 2023/09/08 16:45
Change comment: Install extension [org.xwiki.platform:xwiki-platform-search-solr-ui/15.7]
To version 4.1
edited by Monika Leung
on 2024/01/13 15:56
Change comment: Install extension [org.xwiki.platform:xwiki-platform-search-solr-ui/15.10.4]

Summary

Details

dark-grey-disclosure-arrow-down.png
Author
... ... @@ -1,1 +1,0 @@
1 -XWiki.sysadmin
Size
... ... @@ -1,1 +1,0 @@
1 -94 bytes
Content
dark-grey-disclosure-arrow-left.png
Author
... ... @@ -1,1 +1,0 @@
1 -XWiki.sysadmin
Size
... ... @@ -1,1 +1,0 @@
1 -94 bytes
Content
light-grey-disclosure-arrow-down.png
Author
... ... @@ -1,1 +1,0 @@
1 -XWiki.sysadmin
Size
... ... @@ -1,1 +1,0 @@
1 -94 bytes
Content
light-grey-disclosure-arrow-left.png
Author
... ... @@ -1,1 +1,0 @@
1 -XWiki.sysadmin
Size
... ... @@ -1,1 +1,0 @@
1 -94 bytes
Content
XWiki.JavaScriptExtension[0]
code
... ... @@ -68,8 +68,8 @@
68 68   updateExpandCollapseAllFacetsState(facetsContainer);
69 69  
70 70   // Expand/Collapse toggle for each facet.
71 - facetsContainer.find('.search-facet-header').on('click', function(event) {
72 - $(event.target).parent('.search-facet').toggleClass('expanded');
71 + facetsContainer.find('.facet-toggler').on('click', function(event) {
72 + $(event.target).parents('.search-facet').toggleClass('expanded');
73 73   updateExpandCollapseAllFacetsState(facetsContainer);
74 74   });
75 75  
XWiki.StyleSheetExtension[0]
code
... ... @@ -222,7 +222,7 @@
222 222   box-shadow: 0 2px 2px rgba(0, 0, 0, 0.2);
223 223   /* Leave space for the bottom shadow. */
224 224   margin-bottom: 1em;
225 - border-radius: 4px;
225 + border-radius: 7px;
226 226  }
227 227  /* Colibri skin doesn't have the grid system. */
228 228  .skin-colibri .search-facets {
... ... @@ -287,7 +287,6 @@
287 287  }
288 288  
289 289  .search-facet-header {
290 - background: url("$doc.getAttachmentURL('dark-grey-disclosure-arrow-left.png')") no-repeat scroll 100% 50% transparent;
291 291   color: $theme.titleColor;
292 292   cursor: pointer;
293 293   line-height: 1.4em;
... ... @@ -334,10 +334,36 @@
334 334   padding: .1em .2em;
335 335  }
336 336  
337 -.search-facet.expanded .search-facet-header {
338 - background-image: url("$doc.getAttachmentURL('dark-grey-disclosure-arrow-down.png')");
336 +.search-facet .search-facet-header .facet-toggler, button.facet-value-toggler {
337 + background: transparent;
338 + float: right;
339 339  }
340 340  
341 +button.facet-value-toggler:not(:active) {
342 + color: $theme.btn-primary-color;
343 +}
344 +
345 +.search-facet .search-facet-header .facet-toggler:active, button.facet-value-toggler:active {
346 + box-shadow: unset;
347 +}
348 +
349 +.search-facet .search-facet-header .facet-toggler > span, button.facet-value-toggler > span,
350 +.search-facet .search-facet-header .facet-toggler > img, button.facet-value-toggler > img {
351 + transform: rotate(90deg);
352 +}
353 +
354 +.search-facet.expanded .search-facet-header .facet-toggler > span, .expanded > button.facet-value-toggler > span,
355 +.search-facet.expanded .search-facet-header .facet-toggler > img, .expanded > button.facet-value-toggler > img {
356 + transform: rotate(0deg);
357 +}
358 +
359 +@media not (prefers-reduced-motion) {
360 + .search-facet .search-facet-header .facet-toggler > span, button.facet-value-toggler > span,
361 + .search-facet .search-facet-header .facet-toggler > img, button.facet-value-toggler > img {
362 + transition: transform 0.2s ease;
363 + }
364 +}
365 +
341 341  .search-facet.expanded .search-facet-body {
342 342   display: block;
343 343  }