Skip to content

align logo with content, replace language links with dropdown, and fix header alignment #1476

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.

Sign up for GitHub

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

Open
soumyalimje wants to merge 3 commits into
base: dev
Choose a base branch
from
Open

align logo with content, replace language links with dropdown, and fix header alignment #1476

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
a49a660
presale: align logo with content, replace language links with dropdow…
soumyalimje Dec 11, 2025
2d635d1
presale(organizers): language dropdown and align loginbox with contai…
soumyalimje Dec 11, 2025
f0e4d84
Merge branch 'dev' into fix/tickets-header-alignment
mariobehling Dec 19, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
40 changes: 24 additions & 16 deletions app/eventyay/presale/templates/pretixpresale/event/base.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -36,21 +36,26 @@
</div>
{% endif %}
{% if event.settings.event_logo_image %}
<div class="event-logo-img-placement">
<img src="{{ event.settings.event_logo_image.url }}" alt="{% translate 'Event logo' %}" class="img-fluid event-logo-image">
<div class="container">
<div class="event-logo-img-placement">
<img src="{{ event.settings.event_logo_image.url }}" alt="{% translate 'Event logo' %}" class="img-fluid event-logo-image">
</div>
</div>
{% endif %}
<div class="container page-header-links {% if event.settings.theme_color_background|upper != "#FFFFFF" or event.settings.logo_image_large %}page-header-links-outside{% endif %}">
{% if event.settings.theme_color_background|upper != "#FFFFFF" or event.settings.logo_image_large %}
<div class="pull-right header-part flip hidden-print header-content">
<nav class="locales" aria-label="{% trans "select language" %}">
{% if event.settings.locales|length > 1 %}
{% for l in languages %}
<a href="{% url "presale:locale.set" %}?locale={{ l.code }}&next={{ request.path }}{% if request.META.QUERY_STRING %}%3F{{ request.META.QUERY_STRING|urlencode }}{% endif %}" class="{% if l.code == request.LANGUAGE_CODE %}active{% endif %}" rel="nofollow" lang="{{ l.code }}" hreflang="{{ l.code }}">
{{ l.name_local }}</a>
{% endfor %}
{% endif %}
</nav>
{% if event.settings.locales|length > 1 %}
<form action="{% url 'presale:locale.set' %}" method="get" class="locales" aria-label="{% trans "select language" %}">
<label for="locale-select" class="sr-only">{% trans "Language" %}</label>
<select id="locale-select" name="locale" onchange="this.form.submit()" class="form-control input-sm">
{% for l in languages %}
<option value="{{ l.code }}" {% if l.code == request.LANGUAGE_CODE %}selected{% endif %}>{{ l.name_local }}</option>
{% endfor %}
</select>
<input type="hidden" name="next" value="{{ request.path }}{% if request.META.QUERY_STRING %}?{{ request.META.QUERY_STRING|urlencode }}{% endif %}">
Copy link
Contributor

@sourcery-ai sourcery-ai bot Dec 11, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion: Consider deduplicating the locale switcher markup and URL-building logic.

The language switcher form and next parameter construction are now repeated in multiple templates (event/base.html twice and organizers/base.html twice). Moving this into a shared include/fragment or a helper for generating next would reduce duplication and keep behavior consistent across templates.

Suggested implementation:

                {% include "pretixpresale/partials/locale_switcher.html" %}

To fully implement the deduplication and keep behavior consistent:

  1. Create a new template fragment at app/eventyay/presale/templates/pretixpresale/partials/locale_switcher.html with the full, DRY implementation: 
    {% if event.settings.locales|length > 1 %}
    <form action="{% url 'presale:locale.set' %}" method="get" class="locales" aria-label="{% trans "select language" %}">
        <label for="locale-select" class="sr-only">{% trans "Language" %}</label>
        <select id="locale-select" name="locale" onchange="this.form.submit()" class="form-control input-sm">
            {% for l in languages %}
                <option value="{{ l.code }}" {% if l.code == request.LANGUAGE_CODE %}selected{% endif %}>{{ l.name_local }}</option>
            {% endfor %}
        </select>
        <input type="hidden" name="next" value="{{ request.path }}{% if request.META.QUERY_STRING %}?{{ request.META.QUERY_STRING|urlencode }}{% endif %}">
    </form>
{% endif %}
  2. Replace the other three duplicated locale-switcher blocks in event/base.html and organizers/base.html with {% include "pretixpresale/partials/locale_switcher.html" %} in the same way as above.
  3. If different contexts use different id values for the <select> (e.g., multiple switchers on one page), either:
    • Parameterize the id via {% include ... with select_id="locale-select-header" %}, or
    • Remove the hardcoded id if it's not relied on by JavaScript or labels elsewhere.

</form>
{% endif %}
{% include "pretixpresale/fragment_login_status.html" %}
</div>
{% endif %}
Expand All @@ -71,12 +76,15 @@
{% if event.settings.locales|length > 1 %}
{% if event.settings.theme_color_background|upper == "#FFFFFF" and not event.settings.logo_image_large %}
<div class="{% if not event_logo or not event.settings.logo_image_large %}pull-right flip{% endif %} loginbox hidden-print">
<nav class="locales" aria-label="{% trans "select language" %}">
{% for l in languages %}
<a href="{% url "presale:locale.set" %}?locale={{ l.code }}&next={{ request.path }}{% if request.META.QUERY_STRING %}%3F{{ request.META.QUERY_STRING|urlencode }}{% endif %}" class="{% if l.code == request.LANGUAGE_CODE %}active{% endif %}" rel="nofollow">
{{ l.name_local }}</a>
{% endfor %}
</nav>
<form action="{% url 'presale:locale.set' %}" method="get" class="locales" aria-label="{% trans "select language" %}">
<label for="locale-select-inline" class="sr-only">{% trans "Language" %}</label>
<select id="locale-select-inline" name="locale" onchange="this.form.submit()" class="form-control input-sm">
{% for l in languages %}
<option value="{{ l.code }}" {% if l.code == request.LANGUAGE_CODE %}selected{% endif %}>{{ l.name_local }}</option>
{% endfor %}
</select>
<input type="hidden" name="next" value="{{ request.path }}{% if request.META.QUERY_STRING %}?{{ request.META.QUERY_STRING|urlencode }}{% endif %}">
</form>
</div>
{% endif %}
{% endif %}
Expand Down
2 changes: 1 addition & 1 deletion app/eventyay/presale/templates/pretixpresale/fragment_login_status.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
{{ show_organizer_area|json_script:"show_organizer_area" }}
{{ 'popover-profile'|json_script:"popover_toggle" }}
{{ base_path|json_script:"base_path" }}
<nav class="login-hdr" aria-label="{% translate 'account' %}" style="{% if request.event and request.event.settings.event_logo_image %}margin-right: 18rem{% else %}margin-right: 0{% endif %}">
<nav class="login-hdr login-hdr--aligned" aria-label="{% translate 'account' %}">

{% if request.user.is_authenticated %}
<div class="navigation-button">
Expand Down
32 changes: 20 additions & 12 deletions app/eventyay/presale/templates/pretixpresale/organizers/base.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,12 +17,15 @@
{% if organizer.settings.theme_color_background|upper != "#FFFFFF" or organizer.settings.organizer_logo_image_large %}
<div class="container page-header-links">
<div class="pull-right header-part flip header-content">
<div class="locales">
{% for l in languages %}
<a href="{% url "presale:locale.set" %}?locale={{ l.code }}&next={{ request.path }}%3F{{ request.META.QUERY_STRING|urlencode }}" class="{% if l.code == request.LANGUAGE_CODE %}active{% endif %}" rel="nofollow">
{{ l.name_local }}</a>
{% endfor %}
</div>
<form action="{% url 'presale:locale.set' %}" method="get" class="locales" aria-label="{% trans "select language" %}">
<label for="locale-select-org" class="sr-only">{% trans "Language" %}</label>
<select id="locale-select-org" name="locale" onchange="this.form.submit()" class="form-control input-sm">
{% for l in languages %}
<option value="{{ l.code }}" {% if l.code == request.LANGUAGE_CODE %}selected{% endif %}>{{ l.name_local }}</option>
{% endfor %}
</select>
<input type="hidden" name="next" value="{{ request.path }}{% if request.META.QUERY_STRING %}?{{ request.META.QUERY_STRING|urlencode }}{% endif %}">
</form>
</div>
</div>
{% endif %}
Expand All @@ -47,12 +50,17 @@ <h1><a href="{% eventurl organizer "presale:organizer.index" %}">{{ organizer.na
</div>
{% if organizer.settings.locales|length > 1 %}
{% if organizer.settings.theme_color_background|upper == "#FFFFFF" and not organizer.settings.organizer_logo_image_large %}
<div class="{% if not organizer_logo or not organizer.settings.organizer_logo_image_large %}pull-right flip{% endif %} loginbox">
<div class="locales">
{% for l in languages %}
<a href="{% url "presale:locale.set" %}?locale={{ l.code }}&next={{ request.path }}%3F{{ request.META.QUERY_STRING|urlencode }}" class="{% if l.code == request.LANGUAGE_CODE %}active{% endif %}" rel="nofollow">
{{ l.name_local }}</a>
{% endfor %}
<div class="container">
<div class="{% if not organizer_logo or not organizer.settings.organizer_logo_image_large %}pull-right flip{% endif %} loginbox">
<form action="{% url 'presale:locale.set' %}" method="get" class="locales" aria-label="{% trans "select language" %}">
<label for="locale-select-org-inline" class="sr-only">{% trans "Language" %}</label>
<select id="locale-select-org-inline" name="locale" onchange="this.form.submit()" class="form-control input-sm">
{% for l in languages %}
<option value="{{ l.code }}" {% if l.code == request.LANGUAGE_CODE %}selected{% endif %}>{{ l.name_local }}</option>
{% endfor %}
</select>
<input type="hidden" name="next" value="{{ request.path }}{% if request.META.QUERY_STRING %}?{{ request.META.QUERY_STRING|urlencode }}{% endif %}">
</form>
</div>
</div>
Comment on lines +53 to 65
Copy link

Copilot AI Dec 11, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The language selector in the organizer template has been wrapped in a container div for alignment purposes, but the equivalent language selector in the event template (lines 78-88) lacks this container wrapper. This creates an inconsistency in how the two templates handle the same layout scenario. Consider adding the same container wrapper to the event template's language selector to maintain consistent alignment behavior across both templates.

Copilot uses AI. Check for mistakes.
{% endif %}
Expand Down
14 changes: 9 additions & 5 deletions app/eventyay/static/pretixpresale/scss/_event.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,7 @@
border-bottom: 2px solid $table-border-color;
}

&:last-child {
}
/* removed empty ruleset */
p {
margin-bottom: 0;
}
Expand Down Expand Up @@ -161,21 +160,21 @@ section.front-page {
top: 0;
}
.event-logo-img-placement {
margin: 0 12%;
margin: 0; /* align with .container gutters */
}
.event-logo-image {
max-height: 140px;
max-width: 240px;
width: auto;
border-radius: 10px;
border-radius: 0; /* keep original image shape */
}

@media (max-width: 768px) {
.event-logo-image {
max-height: 120px;
max-width: 120px;
width: auto;
border-radius: 10px;
border-radius: 0;
margin-bottom: 10px;
}
}
Expand Down Expand Up @@ -232,6 +231,11 @@ section.front-page {
}
}

/* Ensure login fragment aligns with container gutters; use modifier class added to fragment */
.login-hdr--aligned {
margin-right: 0 !important;
}

.subevent-list {
background-color: white;

Expand Down