-
-
Notifications
You must be signed in to change notification settings - Fork 956
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Improve rendering of the tabs #535
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Awesome @jacr13, thanks for working on this feature. On desktop it seems to work really well. I did a quick review, the main things are:
- Are you working on a mobile tab replacement as well? Currently the mobile tab bar is removed but not replaced by anything
- Some styling elements are potentially not necessary, or need to be updated.
Thanks @benbusby for reviewing the code! This is a first version and of course it needs some rework. I will not have too much time the next two weeks, so I may take a couple of weeks to fix yours remarks and implement the rest. |
Co-authored-by: Ben Busby <noreply+git@benbusby.com>
I have added support for the mobile version and fixed the issues you highlighted before. The translation still needs to be done for all the languages (except English). |
Awesome! Will review this week. |
Just FYI -- I'm holding off on reviewing this for a bit longer since Google is in the middle of changing how results are formatted, and I want to make sure their formatting changes don't break this feature. I'll be sure to review once it seems like the new result formatting changes they're making are finished/permanent. |
The images page still had a number of pages linked that forwarded to non-Whoogle pages. Also fixed footer styling on image results page.
Created a G class enum to reference class names returned in search results. As noted in the class doc, this should only be used/updated as a last resort, as class names change frequently. For some instances, such as replacing the tbm tab, it's a lot easier to just replace by header name than attempting to replace it based on how the element is structured. Also updated a few styles to revert the latest styling changes being applied by Google.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Awesome, this looks good to go. I've added a few things with regard to styling and moving the tbm tab class names to their own enum, as well as translations for the tab names for currently supported languages.
Thanks again @jacr13!
Problem I've been having -- between switching tabs, for a brief second, it switches to some font (maybe Times New Roman?), before going back to the default font. |
* Make `/config` directory writable by all (benbusby#616) The `/config` directory needs to be writable by all in order to run the container as a non-root user. * Run container as non-root `whoogle` user (benbusby#617) Creates a non-root user ("whoogle"), and runs the container as that user. * Fix docker-compose.yml permission errors (benbusby#623) * Refactor Docker CI workflows Split previous docker test CI into one for PRs and one for triggering the main buildx workflow that deploys new images to Docker Hub. Note that this needs to be further refactored soon to use reusable workflows. The main portion of docker/docker-compose tests is duplicated between the new main + test workflows. * Move bangs init to bg thread Initializing the DDG bangs when running whoogle for the first time creates an indeterminate amount of delay before the app becomes usable, which makes usability tests (particularly w/ Docker) unreliable. This moves the bang json init to a background thread and writes a temporary empty dict to the bangs json file until the full bangs json can be used. * Remove trailing whitespace * Use `test` image tag for docker-compose tests Also adds the ability to overwrite the image in docker-compose.yml, which allows the CI build to use the same image for all docker tests. The default is still 'benbusby/whoogle-search' though. * Remove bash dependency Depending on bash wasn't strictly necessary, as the two minimal scripts in the repo were both nearly POSIX anyways. Aside from simplifying the repo's dependencies a little bit, this also helps reduce the overall Docker image size as an added bonus. * Add nightly container vuln scan Introduces a new 'scan' workflow for scanning the main branch container for vulnerabilities nightly. By default, this will fail for any 'medium' or higher vulnerability. Fixes benbusby#613 * Bump version to 0.7.1 * Remove broken public instance [skip ci] search.exonip.de now redirects to startpage Fixes benbusby#635 * Run buildx workflow on new tag Fixes benbusby#630 * Add note for fosshost instance [skip ci] The fosshost team decommissioned the region that Whoogle was hosted in, but hasn't provided an option to transfer the domain record to the new VM. Until that is fixed, the instance is inaccessible. * Read `WHOOGLE_CONFIG_DISABLE` var as bool in app init Fixes benbusby#636, which pointed out that the var was being interpreted as "active" (config hidden) regardless of the value that was set. * Override new Google search result formatting There have been some recent formatting changes made by Google for search results that do not look good (especially for dark themes). This mostly overrides those styles to resemble the original Whoogle result formatting. * Amend body width formatting in search css `min-width` is a better field to override than `max-width`, since some users prefer full width results. * Push images to ghcr.io Alternative container registries like ghcr.io are a good option for anyone seeking to avoid things like docker hub's latest changes to rate limiting * Fix incorrect min-width for mobile screen sizes min-width was previously set to 736px for all screen sizes, which forced content off screen for smaller devices such as mobile phones. This modifies the search stylesheet to only apply a min-width style to devices > 800px wide. * Update minimal mode for new Google formatting (benbusby#637) Google's latest formatting changes broke the modifications made when enabling `WHOOGLE_MINIMAL`. This updates the result filtering to work with the new changes. Fixes benbusby#634 * Fix Sinhala translation for farside search (benbusby#594) * Use consistent header for all result types (benbusby#535) Introduces a header for switching between result types (i.e. "All", "News", etc) that is consistent between the different result types. Previously, image results had a tab header that was formatted in a drastically different manner, which was jarring when switching from a different result page to the Images page. Created a G class enum to reference class names returned in search results. As noted in the class doc, this should only be used/updated as a last resort, as class names change frequently. For some instances, such as replacing the tbm tab, it's a lot easier to just replace by header name than attempting to replace it based on how the element is structured. Also updated a few styles to revert the latest styling changes being applied by Google. Co-authored-by: jacr13 <ramos.joao@protonmail.com> Co-authored-by: Ben Busby <contact@benbusby.com> * Clean "Show more results" of all site blocks (benbusby#646) * Add new instance to readme [skip ci] (benbusby#647) https://whoogle.esmailelbob.xyz * Add public instance to instance list [skip ci] https://whoogle.esmailelbob.xyz Amendment to benbusby#647 * Add gowogle.voring.me as public instance (benbusby#650) Also removes fosshost instance from readme From @benbusby: I'm unable to get in touch with fosshost support about the whoogle instance being unavailable, and am no longer interested in maintaining the instance due to the lack of communication. * Add new public instances to txt list [skip ci] Missing from benbusby#650 * Check for soup body in `remove_site_blocks` (benbusby#651) Fixes error with `remove_site_blocks` in the Images tab * Fix `collapse_sections` for `MINIMAL_MODE` (benbusby#654) * Fix "my ip" search regression Removes dependency on class names for creating the "my ip" info card in the results list for searches pertaining to the user's public IP. Adds test to prevent this from happening again. Note to anyone reading this and looking to contribute: please avoid using hardcoded class names at all costs. This approach of creating/removing content just results in issues if/when Google decides to introduce/remove class names from the result page. Fixes benbusby#657 * Check for updates using 24 hour time delta Rather than only checking for an available update on app init, the check for updates now performs the check once every 24 hours on the first request sent after that period. This also now catches the requests.exceptions.ConnectionError that is thrown if the app is initialized without an active internet connection. Fixes benbusby#649 * Give `Accept-Language` div its own class (benbusby#659) Fixes accidental assignment of "get-only" class to the "Accept-Language" config option * Ensure valid str->float conv in currency calc Currency amounts returned by google seem to randomly include unicode chars ('\xa0' noted in benbusby#642) which broke the currency calculator included in the project. This ensures that only strings that can be converted to float are ever used in the conversion. Fixes benbusby#642 * [Docker] Split config dir creation/set permissions If the config dir already exists, setting the mode (`-m 777`) doesn't actually work as it should. This change splits the command into two separate commands for directory creation and enabling the directory to be writable by all. Fixes benbusby#658 * Upgrade Python image in Dockerfile (benbusby#669) Vulnerable Python image upgraded to python:3.11.0a5-alpine * Configure setup() using setup.cfg (benbusby#667) Dependencies are not read from requirements.txt intentionally, so only direct dependencies without version pinning are included. Setuptools documentation: https://setuptools.pypa.io/en/latest/userguide/declarative_config.html * Update ad filter Recent changes to ads in search results caused Whoogle to display ads for certain searches. In particular, ads recently started appearing grouped into one div, as opposed to a singular ad per div. This was accompanied by the div label "ads" (instead of just "ad"), which threw off the existing ad filter. The ad keyword blacklist has been updated accordingly, and has been enhanced to only check against alpha chars for each label. This only seems to have affected English language searches, and only for very specific searches. Co-authored-by: ras07 <17038818+ras07@users.noreply.github.com> Co-authored-by: nakoo <4975021+nakoo@users.noreply.github.com> Co-authored-by: Ben Busby <contact@benbusby.com> Co-authored-by: DUO Labs <dvdugo333@gmail.com> Co-authored-by: සයුරි | Sayuri <85907926+sayuri-gi@users.noreply.github.com> Co-authored-by: Joao A. Candido Ramos <joao.candido@etu.unige.ch> Co-authored-by: jacr13 <ramos.joao@protonmail.com> Co-authored-by: Esmail EL BoB <github.defilable@simplelogin.co> Co-authored-by: Kainoa Kanter <44733677+ThatOneCalculator@users.noreply.github.com> Co-authored-by: Nitish Yadav <nitishy01@gmail.com> Co-authored-by: Albony Cal <67057319+Albonycal@users.noreply.github.com> Co-authored-by: jan Anja <bs@sysrq.in>
The rendering is similar in all the tabs.
In addition, the tab disposition is the same across all the tabs.
If the translation is not present, the default names will be displayed (in English), some effort needs to be made here to add translation for all supported languages. It shouldn't be very hard to translate since they are very basic words.
This probably fixes #298. I intentionally removed the shopping tab because it requires some effort to render correctly (#136).
The header should be extended to add an extra row with different parameters to choice from (#322 and possibly #192)