nakidai
/
whoogle-search
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
whoogle-search/app/templates/header.html

68 lines
2.7 KiB
HTML
Raw Normal View History

Feature: autocomplete/search suggestions (#72) Basic autocomplete/search suggestion functionality added * Adds new GET and POST routes for '/autocomplete' that accept a string query and returns an array of suggestions * Adds new autoscript.js file for handling queries on the main page and results view * Updated requests class to include autocomplete method * Updated opensearch template to handle search suggestions * Added header template to allow for autocomplete on results view * Updated readme to mention autocomplete feature
2020-05-24 23:03:11 +03:00
{% if mobile %}
<header>
Allow theme to mirror user system settings Introduces a new config element and environment variable (WHOOGLE_CONFIG_THEME) for setting the theme of the app. Rather than just having either light or dark, this allows a user to have their instance use their current system light/dark preference to determine the theme to use. As a result, the dark mode setting (and WHOOGLE_CONFIG_DARK) have been deprecated, but will still work as expected until a system theme has been chosen.
2021-06-28 17:26:51 +03:00
<div class="bz1lBb header-div">
Remove gap between input and result types Enforces 0 margin for the search input form on the result page, which removes the weird gap that is seen by default. Also made minor changes to the border styling. Desktop searches now have a single bottom border in dark mode rather than an all around border, and the border around the mobile search result input was removed entirely.
2021-04-22 23:23:00 +03:00
<form class="search-form Pg70bf" id="search-form" method="POST">
Allow theme to mirror user system settings Introduces a new config element and environment variable (WHOOGLE_CONFIG_THEME) for setting the theme of the app. Rather than just having either light or dark, this allows a user to have their instance use their current system light/dark preference to determine the theme to use. As a result, the dark mode setting (and WHOOGLE_CONFIG_DARK) have been deprecated, but will still work as expected until a system theme has been chosen.
2021-06-28 17:26:51 +03:00
<a class="logo-link mobile-logo" href="/">
<div id="mobile-header-logo">
Expand custom css variables and functionality Squashed commit of the following: commit 37e22d2945b077a94d9997d064f4355ff8819bae Author: Ben Busby <benbusby@protonmail.com> Date: Mon Apr 5 10:27:05 2021 -0400 Pass user config to logo template commit 2406fee05c3e221112fbe802fbf2ecca1df99127 Author: Ben Busby <benbusby@protonmail.com> Date: Mon Apr 5 10:24:54 2021 -0400 Fix incorrect contrast text in dark theme commit 91dd677e22c2e99819123154e03e9f519f95a9bd Author: Ben Busby <benbusby@protonmail.com> Date: Fri Apr 2 17:21:38 2021 -0400 Remove inline onclicks, fix svg sizing commit 91bbf9c0fae36febd6a6a0d8e6a560babe8622d5 Merge: 72637df b1227bd Author: Ben Busby <benbusby@protonmail.com> Date: Fri Apr 2 15:35:37 2021 -0400 Merge remote-tracking branch 'origin/develop' into custom-css-tweaks commit 72637df213f4b9e83e4b58fe76973de02f63ec8e Author: Ben Busby <benbusby@protonmail.com> Date: Fri Apr 2 11:38:38 2021 -0400 Use svg logo w/ custom styling on results pages commit 666a7ceac4a6e4d3fe1975dcee91e6094b66149e Author: Ben Busby <benbusby@protonmail.com> Date: Fri Apr 2 11:10:37 2021 -0400 Split whoogle-accent into whoogle-element-bg and whoogle-logo See discussion on #247
2021-04-05 17:37:39 +03:00
{{ logo|safe }}
</div>
Feature: autocomplete/search suggestions (#72) Basic autocomplete/search suggestion functionality added * Adds new GET and POST routes for '/autocomplete' that accept a string query and returns an array of suggestions * Adds new autoscript.js file for handling queries on the main page and results view * Updated requests class to include autocomplete method * Updated opensearch template to handle search suggestions * Added header template to allow for autocomplete on results view * Updated readme to mention autocomplete feature
2020-05-24 23:03:11 +03:00
</a>
Allow theme to mirror user system settings Introduces a new config element and environment variable (WHOOGLE_CONFIG_THEME) for setting the theme of the app. Rather than just having either light or dark, this allows a user to have their instance use their current system light/dark preference to determine the theme to use. As a result, the dark mode setting (and WHOOGLE_CONFIG_DARK) have been deprecated, but will still work as expected until a system theme has been chosen.
2021-06-28 17:26:51 +03:00
<div class="H0PQec mobile-input-div">
Feature: autocomplete/search suggestions (#72) Basic autocomplete/search suggestion functionality added * Adds new GET and POST routes for '/autocomplete' that accept a string query and returns an array of suggestions * Adds new autoscript.js file for handling queries on the main page and results view * Updated requests class to include autocomplete method * Updated opensearch template to handle search suggestions * Added header template to allow for autocomplete on results view * Updated readme to mention autocomplete feature
2020-05-24 23:03:11 +03:00
<div class="sbc esbc autocomplete">
Disable autocorrect on mobile search inputs Fixes #292
2021-04-21 17:48:26 +03:00
<input
id="search-bar"
Allow theme to mirror user system settings Introduces a new config element and environment variable (WHOOGLE_CONFIG_THEME) for setting the theme of the app. Rather than just having either light or dark, this allows a user to have their instance use their current system light/dark preference to determine the theme to use. As a result, the dark mode setting (and WHOOGLE_CONFIG_DARK) have been deprecated, but will still work as expected until a system theme has been chosen.
2021-06-28 17:26:51 +03:00
class="mobile-search-bar"
Disable autocorrect on mobile search inputs Fixes #292
2021-04-21 17:48:26 +03:00
autocapitalize="none"
autocomplete="off"
autocorrect="off"
spellcheck="false"
class="noHIxc"
name="q"
type="text"
Fix rtl lang problem in search box (#399) Adds auto dir to index, search and header input html
2021-08-31 01:10:07 +03:00
value="{{ clean_query(query) }}"
dir="auto">
Allow theme to mirror user system settings Introduces a new config element and environment variable (WHOOGLE_CONFIG_THEME) for setting the theme of the app. Rather than just having either light or dark, this allows a user to have their instance use their current system light/dark preference to determine the theme to use. As a result, the dark mode setting (and WHOOGLE_CONFIG_DARK) have been deprecated, but will still work as expected until a system theme has been chosen.
2021-06-28 17:26:51 +03:00
<input id="search-reset" type="reset" value="x">
Fixed #76 Added enter key submit on results page Added results type carryover for subsequent searches on results page Removed redundant header on image search results
2020-05-25 19:53:15 +03:00
<input name="tbm" value="{{ search_type }}" style="display: none">
Hotfix: Add hidden submit btn for nojs searches With javascript disabled, searches could not be submitted on the results page using the "Enter" key. Adding a hidden submit button to the header template resolves this issue.
2021-01-19 19:11:13 +03:00
<input type="submit" style="display: none;">
Feature: autocomplete/search suggestions (#72) Basic autocomplete/search suggestion functionality added * Adds new GET and POST routes for '/autocomplete' that accept a string query and returns an array of suggestions * Adds new autoscript.js file for handling queries on the main page and results view * Updated requests class to include autocomplete method * Updated opensearch template to handle search suggestions * Added header template to allow for autocomplete on results view * Updated readme to mention autocomplete feature
2020-05-24 23:03:11 +03:00
<div class="sc"></div>
</div>
</div>
</form>
</div>
</header>
{% else %}
<header>
<div class="logo-div">
Add ability to set temp config in search query Dark mode, country, interface language, and search language configs can now be set in the search query by appending each option as a url parameter. Supported args are: 'dark', 'lang_search', 'lang_interface', and 'ctry' Ex: /search?q=%s&dark=1&lang_search=lang_en... These config settings persist across page navigation and switching result type, but will be reset if the main search bar is used. See #144
2020-11-11 08:40:49 +03:00
<a class="logo-link" href="/">
Allow theme to mirror user system settings Introduces a new config element and environment variable (WHOOGLE_CONFIG_THEME) for setting the theme of the app. Rather than just having either light or dark, this allows a user to have their instance use their current system light/dark preference to determine the theme to use. As a result, the dark mode setting (and WHOOGLE_CONFIG_DARK) have been deprecated, but will still work as expected until a system theme has been chosen.
2021-06-28 17:26:51 +03:00
<div class="desktop-header-logo">
Expand custom css variables and functionality Squashed commit of the following: commit 37e22d2945b077a94d9997d064f4355ff8819bae Author: Ben Busby <benbusby@protonmail.com> Date: Mon Apr 5 10:27:05 2021 -0400 Pass user config to logo template commit 2406fee05c3e221112fbe802fbf2ecca1df99127 Author: Ben Busby <benbusby@protonmail.com> Date: Mon Apr 5 10:24:54 2021 -0400 Fix incorrect contrast text in dark theme commit 91dd677e22c2e99819123154e03e9f519f95a9bd Author: Ben Busby <benbusby@protonmail.com> Date: Fri Apr 2 17:21:38 2021 -0400 Remove inline onclicks, fix svg sizing commit 91bbf9c0fae36febd6a6a0d8e6a560babe8622d5 Merge: 72637df b1227bd Author: Ben Busby <benbusby@protonmail.com> Date: Fri Apr 2 15:35:37 2021 -0400 Merge remote-tracking branch 'origin/develop' into custom-css-tweaks commit 72637df213f4b9e83e4b58fe76973de02f63ec8e Author: Ben Busby <benbusby@protonmail.com> Date: Fri Apr 2 11:38:38 2021 -0400 Use svg logo w/ custom styling on results pages commit 666a7ceac4a6e4d3fe1975dcee91e6094b66149e Author: Ben Busby <benbusby@protonmail.com> Date: Fri Apr 2 11:10:37 2021 -0400 Split whoogle-accent into whoogle-element-bg and whoogle-logo See discussion on #247
2021-04-05 17:37:39 +03:00
{{ logo|safe }}
</div>
Feature: autocomplete/search suggestions (#72) Basic autocomplete/search suggestion functionality added * Adds new GET and POST routes for '/autocomplete' that accept a string query and returns an array of suggestions * Adds new autoscript.js file for handling queries on the main page and results view * Updated requests class to include autocomplete method * Updated opensearch template to handle search suggestions * Added header template to allow for autocomplete on results view * Updated readme to mention autocomplete feature
2020-05-24 23:03:11 +03:00
</a>
</div>
<div class="search-div">
<form id="search-form" class="search-form" id="sf" method="POST">
Allow theme to mirror user system settings Introduces a new config element and environment variable (WHOOGLE_CONFIG_THEME) for setting the theme of the app. Rather than just having either light or dark, this allows a user to have their instance use their current system light/dark preference to determine the theme to use. As a result, the dark mode setting (and WHOOGLE_CONFIG_DARK) have been deprecated, but will still work as expected until a system theme has been chosen.
2021-06-28 17:26:51 +03:00
<div class="autocomplete header-autocomplete">
Feature: autocomplete/search suggestions (#72) Basic autocomplete/search suggestion functionality added * Adds new GET and POST routes for '/autocomplete' that accept a string query and returns an array of suggestions * Adds new autoscript.js file for handling queries on the main page and results view * Updated requests class to include autocomplete method * Updated opensearch template to handle search suggestions * Added header template to allow for autocomplete on results view * Updated readme to mention autocomplete feature
2020-05-24 23:03:11 +03:00
<div style="width: 100%; display: flex">
Disable autocorrect on mobile search inputs Fixes #292
2021-04-21 17:48:26 +03:00
<input
id="search-bar"
autocapitalize="none"
autocomplete="off"
autocorrect="off"
Remove gap between input and result types Enforces 0 margin for the search input form on the result page, which removes the weird gap that is seen by default. Also made minor changes to the border styling. Desktop searches now have a single bottom border in dark mode rather than an all around border, and the border around the mobile search result input was removed entirely.
2021-04-22 23:23:00 +03:00
class="search-bar-desktop noHIxc"
Disable autocorrect on mobile search inputs Fixes #292
2021-04-21 17:48:26 +03:00
name="q"
spellcheck="false"
type="text"
Fix rtl lang problem in search box (#399) Adds auto dir to index, search and header input html
2021-08-31 01:10:07 +03:00
value="{{ clean_query(query) }}"
dir="auto">
Fixed #76 Added enter key submit on results page Added results type carryover for subsequent searches on results page Removed redundant header on image search results
2020-05-25 19:53:15 +03:00
<input name="tbm" value="{{ search_type }}" style="display: none">
Hotfix: Add hidden submit btn for nojs searches With javascript disabled, searches could not be submitted on the results page using the "Enter" key. Adding a hidden submit button to the header template resolves this issue.
2021-01-19 19:11:13 +03:00
<input type="submit" style="display: none;">
Feature: autocomplete/search suggestions (#72) Basic autocomplete/search suggestion functionality added * Adds new GET and POST routes for '/autocomplete' that accept a string query and returns an array of suggestions * Adds new autoscript.js file for handling queries on the main page and results view * Updated requests class to include autocomplete method * Updated opensearch template to handle search suggestions * Added header template to allow for autocomplete on results view * Updated readme to mention autocomplete feature
2020-05-24 23:03:11 +03:00
<div class="sc"></div>
</div>
</div>
</form>
</div>
</header>
{% endif %}
Use cache busting for css/js files On app init, short hashes are generated from file checksums to use for cache busting. These hashes are added into the full file name and used to symlink to the actual file contents. These symlinks are loaded in the jinja templates for each page, and can tell the browser to load a new file if the hash changes. This is only in place for css and js files, but can be extended in the future for other file types if needed.
2021-07-01 02:00:01 +03:00
<script type="text/javascript" src="{{ cb_url('header.js') }}"></script>