9a02e896f6
base_login.html only loaded style-custom.css, leaving the --ds-* tokens undefined. The Google SSO btn-primary used background-color: var(--ds-primary) with color: white, rendering invisible (white text on a card with transparent button bg) on both navy and blue themes. Load design-tokens.css the same way base.html does so the button picks up its green fill.
31 lines
1.2 KiB
HTML
31 lines
1.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" data-theme="{{ instance_theme | default('blue') }}">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{% block title %}Data Analyst Portal{% endblock %}</title>
|
|
<link rel="stylesheet" href="{{ static_url('style-custom.css') }}">
|
|
{# Design-system tokens (`--ds-*`) — required so `.btn-primary`
|
|
(Google SSO on /login) gets its `--ds-primary` green fill;
|
|
otherwise the white button text renders invisible on a white
|
|
card. Same reason base.html loads it globally. #}
|
|
<link rel="stylesheet" href="{{ static_url('css/design-tokens.css') }}">
|
|
{% include '_theme.html' %}
|
|
</head>
|
|
<body>
|
|
{% with messages = get_flashed_messages(with_categories=true) %}
|
|
{% if messages %}
|
|
<div class="flash-messages" style="position: fixed; top: 20px; left: 50%; transform: translateX(-50%); z-index: 1000; max-width: 500px;">
|
|
{% for category, message in messages %}
|
|
<div class="flash flash-{{ category }}">
|
|
{{ message }}
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% endif %}
|
|
{% endwith %}
|
|
|
|
{% block content %}{% endblock %}
|
|
{% include "_version_badge.html" %}
|
|
</body>
|
|
</html>
|