mirror of
https://github.com/searxng/searxng.git
synced 2024-11-26 21:01:01 +00:00
[simple] introduce page_with_header.html template
Previously the preferences & stats templates contained the markup: <a href="{{ url_for('index') }}"><h1><span>SearXNG</span></h1></a> There are many things wrong with this: 1. the markup was duplicated 2. the CSS needed to be changed whenever a new page wanted to use this header (since the CSS used page-specific selectors) 3. h1 should be reserved for the actual page title (e.g. Preferences or Engine stats) 4. the image was set via CSS which also set: span { visibility: hidden; } which however removes the alternative text from the accessibility tree (meaning screen readers will ignore it). This commit fixes all these problems.
This commit is contained in:
parent
2a6d84dab5
commit
6f0ec7e58f
6 changed files with 17 additions and 28 deletions
|
@ -79,9 +79,7 @@ main {
|
|||
flex: 1;
|
||||
}
|
||||
|
||||
#main_preferences,
|
||||
#main_about,
|
||||
#main_stats {
|
||||
.page_with_header {
|
||||
margin: 2em auto;
|
||||
width: 85em;
|
||||
}
|
||||
|
@ -101,16 +99,8 @@ footer {
|
|||
}
|
||||
}
|
||||
|
||||
#main_preferences h1,
|
||||
#main_stats h1 {
|
||||
background: url('../img/searxng.png') no-repeat;
|
||||
background-size: contain;
|
||||
min-height: 40px;
|
||||
margin: 0 auto;
|
||||
|
||||
span {
|
||||
visibility: hidden;
|
||||
}
|
||||
.page_with_header .logo {
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
input[type="submit"],
|
||||
|
@ -647,9 +637,7 @@ article[data-vim-selected].category-social {
|
|||
}
|
||||
|
||||
@media screen and (max-width: @tablet) {
|
||||
#main_preferences,
|
||||
#main_about,
|
||||
#main_stats {
|
||||
.page_with_header {
|
||||
margin: 2rem 0.5rem;
|
||||
width: auto;
|
||||
}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
{% extends 'simple/base.html' %}
|
||||
{% extends 'simple/page_with_header.html' %}
|
||||
{% block content %}
|
||||
{{ help.about | safe }}
|
||||
{% include "__common__/aboutextend.html" ignore missing %}
|
||||
|
|
|
@ -35,7 +35,7 @@
|
|||
<link rel="icon" href="{{ url_for('static', filename='img/favicon.svg') }}" type="image/svg+xml">
|
||||
</head>
|
||||
<body class="{{ endpoint }}_endpoint" >
|
||||
<main id="main_{{ self._TemplateReference__context.name|replace("simple/", "")|replace(".html", "") }}">
|
||||
<main id="main_{{ self._TemplateReference__context.name|replace("simple/", "")|replace(".html", "") }}" class="{{body_class}}">
|
||||
{% if errors %}
|
||||
<div class="dialog-error" role="alert">
|
||||
<a href="#" class="close" aria-label="close" title="close">×</a>
|
||||
|
@ -47,6 +47,8 @@
|
|||
</div>
|
||||
{% endif %}
|
||||
|
||||
{% block header %}
|
||||
{% endblock %}
|
||||
{% block content %}
|
||||
{% endblock %}
|
||||
</main>
|
||||
|
|
5
searx/templates/simple/page_with_header.html
Normal file
5
searx/templates/simple/page_with_header.html
Normal file
|
@ -0,0 +1,5 @@
|
|||
{% set body_class = "page_with_header" %}
|
||||
{% extends "simple/base.html" %}
|
||||
{% block header %}
|
||||
<a href="{{ url_for('index') }}"><img class="logo" src="{{ url_for('static', filename='img/searxng.png') }}" alt="SearXNG"></a>
|
||||
{% endblock %}
|
|
@ -1,7 +1,7 @@
|
|||
{% from 'simple/macros.html' import tabs_open, tabs_close, tab_header, tab_footer, checkbox_onoff, checkbox %}
|
||||
{% from 'simple/icons.html' import icon_big %}
|
||||
|
||||
{% extends "simple/base.html" %}
|
||||
{% extends "simple/page_with_header.html" %}
|
||||
|
||||
{%- macro plugin_preferences(section) -%}
|
||||
{%- for plugin in plugins -%}
|
||||
|
@ -95,10 +95,7 @@
|
|||
|
||||
{% block head %} {% endblock %}
|
||||
{% block content %}
|
||||
|
||||
<a href="{{ url_for('index') }}"><h1><span>SearXNG</span></h1></a>
|
||||
|
||||
<h2>{{ _('Preferences') }}</h2>
|
||||
<h1>{{ _('Preferences') }}</h1>
|
||||
|
||||
<form id="search_form" method="post" action="{{ url_for('preferences') }}">
|
||||
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
{% from 'simple/icons.html' import icon_big %}
|
||||
{% from '__common__/new_issue.html' import new_issue with context %}
|
||||
|
||||
{% extends "simple/base.html" %}
|
||||
{% extends "simple/page_with_header.html" %}
|
||||
|
||||
{%- macro th_sort(column_order, column_name) -%}
|
||||
{% if selected_engine_name %}
|
||||
|
@ -15,10 +15,7 @@
|
|||
|
||||
{% block head %} {% endblock %}
|
||||
{% block content %}
|
||||
|
||||
<a href="{{ url_for('index') }}"><h1><span>SearXNG</span></h1></a>
|
||||
|
||||
<h2>{% if selected_engine_name %}<a href="{{ url_for('stats') }}">{% endif %}{{ _('Engine stats') }}{% if selected_engine_name %}</a> - {{ selected_engine_name }}{% endif %}</h2>
|
||||
<h1>{% if selected_engine_name %}<a href="{{ url_for('stats') }}">{% endif %}{{ _('Engine stats') }}{% if selected_engine_name %}</a> - {{ selected_engine_name }}{% endif %}</h1>
|
||||
|
||||
{% if not engine_stats.get('time') %}
|
||||
{{ _('There is currently no data available. ') }}
|
||||
|
|
Loading…
Reference in a new issue