Support data URI auth images and fix auth name display#18542
Support data URI auth images and fix auth name display#18542felixfon wants to merge 2 commits intoWeblateOrg:mainfrom
Conversation
felixfon
commented
Mar 19, 2026
- Added support for data URIs in the image parameter.
- Replaced spacers with CSS margins for better layout control and to prevent link underlines from touching the image.
- Implemented vertical alignment for images and text.
3c18d5f to
4e31623
Compare
There was a problem hiding this comment.
Pull request overview
This PR updates how authentication provider icons/names are rendered across the accounts UI and extends the auth icon source handling to support data: URIs (in addition to static files and http(s) URLs).
Changes:
- Update templates to use the simplified
{% auth_name ... %}tag invocation and adjust layout/styling for provider labels. - Extend
auth_nameicon handling to treatdata:URIs as non-static sources. - Refactor the
auth_nameHTML markup generation to wrap labels in a dedicated.auth-nameelement.
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 5 comments.
Show a summary per file
| File | Description |
|---|---|
| weblate/templates/accounts/user.html | Updates identity table rendering to use the new auth_name signature/output. |
| weblate/templates/accounts/register.html | Updates registration backend buttons to use the new auth_name signature/output. |
| weblate/templates/accounts/redirect.html | Updates redirect button rendering to use the new auth_name signature/output. |
| weblate/templates/accounts/login.html | Updates login backend buttons to use the new auth_name signature/output. |
| weblate/static/styles/main.css | Adjusts .auth-name spacing/alignment to replace template-provided separators. |
| weblate/accounts/templatetags/authnames.py | Adds data: URI handling and changes the generated auth icon/label markup. |
| @register.simple_tag | ||
| def auth_name(auth: str, separator: str = auth_name_default_separator, only: str = ""): | ||
| def auth_name(auth: str, only: str = ""): | ||
| """Create HTML markup for social authentication method.""" | ||
| params = get_auth_params(auth) | ||
|
|
||
| if not params["image"].startswith("http"): | ||
| if not params["image"].startswith(("http", "data:")): | ||
| params["image"] = staticfiles_storage.url(f"auth/{params['image']}") | ||
| params["icon"] = format_html(IMAGE_SOCIAL_TEMPLATE, separator=separator, **params) | ||
| params["icon"] = format_html(IMAGE_SOCIAL_TEMPLATE, **params) | ||
| params["label"] = format_html(NAME_SOCIAL_TEMPLATE, **params) | ||
|
|
||
| if only: | ||
| return params[only] | ||
|
|
||
| return format_html(SOCIAL_TEMPLATE, separator=separator, **params) | ||
| return format_html(SOCIAL_TEMPLATE, **params) |
There was a problem hiding this comment.
This adds a user-visible capability (supporting SOCIAL_AUTH_*_IMAGE as a data: URI) and changes how auth provider names/icons are rendered on login/registration pages. Please add an entry to docs/changes.rst under the appropriate rubric so the behavior change is discoverable for admins/custom theme authors.
| if not params["image"].startswith(("http", "data:")): | ||
| params["image"] = staticfiles_storage.url(f"auth/{params['image']}") |
There was a problem hiding this comment.
Allowing any data: URI here means non-image payloads (and potentially risky SVG variants) can be embedded as the auth icon. Consider restricting this to data:image/… (and/or a short allowlist like data:image/png, data:image/jpeg, data:image/svg+xml) to better match the expected "image" semantics and reduce XSS risk surface if this setting is ever user-controlled.
4ac7374 to
79def4d
Compare
| if not params["image"].startswith(("http", "data:")): | ||
| params["image"] = staticfiles_storage.url(f"auth/{params['image']}") | ||
| params["icon"] = format_html(IMAGE_SOCIAL_TEMPLATE, separator=separator, **params) | ||
| params["icon"] = format_html(IMAGE_SOCIAL_TEMPLATE, **params) |
There was a problem hiding this comment.
The new data: handling changes URL resolution behavior for auth provider images, but there is no automated test covering this (e.g., ensuring data: URIs are not passed through staticfiles_storage.url() and still render correctly). Adding a small SimpleTestCase that renders {% auth_name %} for both a data: image and a static filename would help prevent regressions.
| IMAGE_SOCIAL_TEMPLATE = """ | ||
| <img class="auth-image" src="{image}" /> | ||
| """ | ||
| IMAGE_SOCIAL_TEMPLATE = """<img class="auth-image" src="{image}" />""" |
There was a problem hiding this comment.
The name should be next to the image, so clearly hide this from the screen readers:
| IMAGE_SOCIAL_TEMPLATE = """<img class="auth-image" src="{image}" />""" | |
| IMAGE_SOCIAL_TEMPLATE = """<img class="auth-image" src="{image}" alt="" aria-hidden="true"/>""" |
|
|
||
| @register.simple_tag | ||
| def auth_name(auth: str, separator: str = auth_name_default_separator, only: str = ""): | ||
| def auth_name(auth: str, only: str = ""): |
There was a problem hiding this comment.
Removing the default separator breaks the add new identity tab in the user profile which relied on this.
There was a problem hiding this comment.
The template isn't passing that argument anymore, so it should be safe! I've checked the code here and it seems fine.
It works perfectly on my device, too. Did I miss a spot somewhere else?

There was a problem hiding this comment.
Before this PR, the names were below the icons because it used the default separator <br>.
79def4d to
acfd584
Compare
ec6f81a to
ff59ad3
Compare
0ae1d18 to
16c4339
Compare
