[mod] simple theme: build design for details (collapsables)

* set border top and bottom on sidebar collasables
* inrease peading on summary so its easier to click on mobile
* remove margins and add flex wrapper to normalize elements in sidebar
This commit is contained in:
mrpaulblack 2023-05-28 00:37:25 +02:00 committed by Markus Heiser
parent b7e315563d
commit f087959b02
6 changed files with 46 additions and 26 deletions

View file

@ -1,24 +1,26 @@
<div id="apis" role="complementary" aria-labelledby="apis-title">
<details>
<details class="sidebar-collapsable">
<summary class="title" id="apis-title">{{ _('Download results') }}</summary>
{%- for output_type in search_formats -%}
<div class="left">
<form method="{{ method or 'POST' }}" action="{{ url_for('search') }}">
<input type="hidden" name="q" value="{{ q|e }}">
{%- for category in selected_categories -%}
<input type="hidden" name="category_{{ category }}" value="1">
{%- endfor -%}
<input type="hidden" name="pageno" value="{{ pageno }}">
<input type="hidden" name="language" value="{{ current_language }}">
<input type="hidden" name="time_range" value="{{ time_range }}">
<input type="hidden" name="safesearch" value="{{ safesearch }}">
<input type="hidden" name="format" value="{{ output_type }}">
{%- if timeout_limit -%}
<input type="hidden" name="timeout_limit" value="{{ timeout_limit|e }}" >
{%- endif -%}
<input type="submit" role="link" value="{{ output_type }}">
</form>
</div>
{%- endfor -%}
<div class="wrapper">
{%- for output_type in search_formats -%}
<div class="left">
<form method="{{ method or 'POST' }}" action="{{ url_for('search') }}">
<input type="hidden" name="q" value="{{ q|e }}">
{%- for category in selected_categories -%}
<input type="hidden" name="category_{{ category }}" value="1">
{%- endfor -%}
<input type="hidden" name="pageno" value="{{ pageno }}">
<input type="hidden" name="language" value="{{ current_language }}">
<input type="hidden" name="time_range" value="{{ time_range }}">
<input type="hidden" name="safesearch" value="{{ safesearch }}">
<input type="hidden" name="format" value="{{ output_type }}">
{%- if timeout_limit -%}
<input type="hidden" name="timeout_limit" value="{{ timeout_limit|e }}" >
{%- endif -%}
<input type="submit" role="link" value="{{ output_type }}">
</form>
</div>
{%- endfor -%}
</div>
</details>
</div>

View file

@ -1,5 +1,5 @@
<div id="engines_msg">
<details>
<details class="sidebar-collapsable">
<summary class="title" id="engines_msg-title">{{ _('Messages from the search engines') }}</summary>
<div class="dialog-error" role="alert">
{{ icon_big('warning') }}

View file

@ -1,5 +1,5 @@
<div id="search_url" role="complementary" aria-labelledby="search_url-title">
<details>
<details class="sidebar-collapsable">
<summary class="title" id="search_url-title">{{ _('Search URL') }}</summary>
<div class="selectable_url">
<pre>{{ url_for('search', _external=True) }}?q={{ q|urlencode }}&amp;language={{ current_language }}&amp;time_range={{ time_range }}&amp;safesearch={{ safesearch }}

View file

@ -1,5 +1,5 @@
<div id="suggestions" role="complementary" aria-labelledby="suggestions-title">
<details>
<details class="sidebar-collapsable">
<summary class="title" id="suggestions-title">{{ _('Suggestions') }}</summary>
<div class="wrapper">
{%- for suggestion in suggestions -%}