cybrneko/searxng-nekosearch
1
0
Fork 0
Code Issues Pull Requests Actions 3 Activity

[simple theme] replace Image_layout.js with flexbox CS impl.

Browse Source 
* drop image_layout.js from simple theme
* move image_layout.js to oscar theme and delete common js dir (since its empty now)
* align top position of image detail modal with bottom position of search header
* use flexbox to display images; row height can be set via @results-image-row-height in defenitions.less
* display span title underneath each image with a max width of 12rem
* increase margin and padding around image article on desktop and tablet
* make article height smaller on phone layout (height of 6rem) to display more content on current view
* remove content from result, if the title and content matches
* use a group that cotains the flex image article, if images are mixed with other categories
* fix pylint issues in webapp.py
* use the default.html result template in unit tests (thanks @return42)
This commit is contained in:
mrpaulblack
2022-02-21 22:18:48 +01:00
parent 3408d061aa
commit 21e3c40516
12 changed files with 91 additions and 51 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
searx/static/themes/simple/src/less/definitions.less
View File

@@ -68,8 +68,8 @@
--color-result-search-url-border: #ddd;
--color-result-search-url-font: #000;
// Images Colors
--color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
--color-result-image-span-font: #fff;
--color-result-image-span-font: #444;
--color-result-image-span-font-selected: #fff;
--color-result-image-background: #fff;
/// Settings Colors
--color-settings-tr-hover: #f7f7f7;
@@ -179,8 +179,8 @@
--color-result-detail-loader-border: rgba(255, 255, 255, 0.2);
--color-result-detail-loader-borderleft: rgba(0, 0, 0, 0);
// Images Colors
--color-result-image-span-background-hover: rgba(0, 0, 0, 0.6);
--color-result-image-span-font: #fff;
--color-result-image-span-font: #bbb;
--color-result-image-span-font-selected: #222;
--color-result-image-background: #222;
/// Settings Colors
--color-settings-tr-hover: #2d2d2d;
@@ -230,9 +230,11 @@
@results-gap: 5rem;
@results-margin: 0.125rem;
@result-padding: 1rem;
@results-image-row-height: 12rem;
@results-image-row-height-phone: 6rem;
@search-width: 40rem;
// heigh of #search, see detail.less
@search-height: 7.75rem;
@search-height: 7.6rem;
/// Device Size
/// @desktop > @tablet