Display Search Results as a Gallery Rather Than Carousel

[shin-go]

Describe your suggested feature

I have a large media base in komga and search results broken out into Books and Series tend to become tiresome on the eyes as I hit to bring up the next batch of hits in the carousel.

It would be nice to have the option to set search results to be displayed as a Gallery rather than Carousel. A Gallery view allows the user to scroll through (relative to result page size) at their own pace, rather than the whizzing by of results when navigating pagination in the Carousel.

Other details

A nice to have with a Gallery view for search results would be the option to collapse Books or Series. This helps conserve screen real estate while giving a relatively easy way for the user to switch result contexts.

Acknowledgements

• I have searched the existing issues and this is a new ticket, NOT a duplicate or related to another open issue.
• I have written a short but informative title.
• I have updated the app to the latest version.
• I will fill out all of the requested information in this form.

[Justin27482]

If anyone is interested in a temporary short term fix using a userscript this will work, make sure you update YOURKOMGASERVER and YOURPORT to match where you are hosting. This is achieved by updating the last span on the search results page and changing the flex-nowrap class to flex-wrap. The requirement of jQuery and waitForKeyElements is so the script will wait until the page is fully loaded before trying to change the class.

Obviously this does not resolve this issue as it isn't part of Komga, nor is it an adjustable setting, but in the short term if you are like me and you really want your search results to populate vertically, this should work until gotson has time to add this to the source code.

// ==UserScript==
// @name         Komga Vertical Search Results
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  This switches search results to flex-wrap from flex-nowrap, causing them to display vertically
// @author       Justin27482
// @match        http://YOURKOMGASERVER:YOURPORT/search?*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=27.81
// @require      https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js
// @require      https://gist.github.com/raw/2625891/waitForKeyElements.js
// @grant        GM_addStyle
// ==/UserScript==

(function() {
    'use strict';

    waitForKeyElements ("span:last", actionFunction);

function actionFunction (jNode) {
    document.querySelectorAll('span.d-flex.flex-nowrap').forEach(span => { span.classList.replace("flex-nowrap", "flex-wrap")})
}
})();