Skip to content

Commit 428d304

Browse files
authored
Fix/ consent page (#43)
* make logo not clickable * redesign consent page
1 parent b1e9798 commit 428d304

File tree

10 files changed

+185
-126
lines changed

10 files changed

+185
-126
lines changed

frontend/src/shared.css

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@
1414
@import url("@vector-im/compound-design-tokens/assets/web/css/compound-design-tokens.css");
1515
@import url("@vector-im/compound-web/dist/style.css");
1616

17+
@import url("../tchap/css/tchap.css");
18+
1719
@tailwind base;
1820
@tailwind components;
1921
@tailwind utilities;

frontend/tchap/components/Footer/Footer.tsx

Lines changed: 6 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -30,14 +30,12 @@ const Footer: React.FC = () => (
3030
<footer className="lasuite fr-footer">
3131
<div className="fr-container lasuite-container">
3232
<div className="fr-footer__body">
33-
<div className="fr-footer__brand fr-enlarge-link">
34-
<a href="/" title="Retour à l'accueil - Tchap">
35-
<p className="fr-logo">
36-
République
37-
<br />
38-
Française
39-
</p>
40-
</a>
33+
<div className="fr-footer__brand">
34+
<p className="fr-logo">
35+
République
36+
<br />
37+
Française
38+
</p>
4139
</div>
4240
</div>
4341
</div>

frontend/tchap/css/tchap.css

Lines changed: 13 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

frontend/tests/routes/__snapshots__/reset-cross-signing.test.tsx.snap

Lines changed: 42 additions & 72 deletions
Original file line numberDiff line numberDiff line change
@@ -71,20 +71,15 @@ exports[`Reset cross signing > renders the cancelled page 1`] = `
7171
class="fr-footer__body"
7272
>
7373
<div
74-
class="fr-footer__brand fr-enlarge-link"
74+
class="fr-footer__brand"
7575
>
76-
<a
77-
href="/"
78-
title="Retour à l'accueil - Tchap"
76+
<p
77+
class="fr-logo"
7978
>
80-
<p
81-
class="fr-logo"
82-
>
83-
République
84-
<br />
85-
Française
86-
</p>
87-
</a>
79+
République
80+
<br />
81+
Française
82+
</p>
8883
</div>
8984
</div>
9085
</div>
@@ -253,20 +248,15 @@ exports[`Reset cross signing > renders the deep link page 1`] = `
253248
class="fr-footer__body"
254249
>
255250
<div
256-
class="fr-footer__brand fr-enlarge-link"
251+
class="fr-footer__brand"
257252
>
258-
<a
259-
href="/"
260-
title="Retour à l'accueil - Tchap"
253+
<p
254+
class="fr-logo"
261255
>
262-
<p
263-
class="fr-logo"
264-
>
265-
République
266-
<br />
267-
Française
268-
</p>
269-
</a>
256+
République
257+
<br />
258+
Française
259+
</p>
270260
</div>
271261
</div>
272262
</div>
@@ -350,20 +340,15 @@ exports[`Reset cross signing > renders the errored page 1`] = `
350340
class="fr-footer__body"
351341
>
352342
<div
353-
class="fr-footer__brand fr-enlarge-link"
343+
class="fr-footer__brand"
354344
>
355-
<a
356-
href="/"
357-
title="Retour à l'accueil - Tchap"
345+
<p
346+
class="fr-logo"
358347
>
359-
<p
360-
class="fr-logo"
361-
>
362-
République
363-
<br />
364-
Française
365-
</p>
366-
</a>
348+
République
349+
<br />
350+
Française
351+
</p>
367352
</div>
368353
</div>
369354
</div>
@@ -532,20 +517,15 @@ exports[`Reset cross signing > renders the page 1`] = `
532517
class="fr-footer__body"
533518
>
534519
<div
535-
class="fr-footer__brand fr-enlarge-link"
520+
class="fr-footer__brand"
536521
>
537-
<a
538-
href="/"
539-
title="Retour à l'accueil - Tchap"
522+
<p
523+
class="fr-logo"
540524
>
541-
<p
542-
class="fr-logo"
543-
>
544-
République
545-
<br />
546-
Française
547-
</p>
548-
</a>
525+
République
526+
<br />
527+
Française
528+
</p>
549529
</div>
550530
</div>
551531
</div>
@@ -620,20 +600,15 @@ exports[`Reset cross signing > renders the success page 1`] = `
620600
class="fr-footer__body"
621601
>
622602
<div
623-
class="fr-footer__brand fr-enlarge-link"
603+
class="fr-footer__brand"
624604
>
625-
<a
626-
href="/"
627-
title="Retour à l'accueil - Tchap"
605+
<p
606+
class="fr-logo"
628607
>
629-
<p
630-
class="fr-logo"
631-
>
632-
République
633-
<br />
634-
Française
635-
</p>
636-
</a>
608+
République
609+
<br />
610+
Française
611+
</p>
637612
</div>
638613
</div>
639614
</div>
@@ -708,20 +683,15 @@ exports[`Reset cross signing > renders the success page 2`] = `
708683
class="fr-footer__body"
709684
>
710685
<div
711-
class="fr-footer__brand fr-enlarge-link"
686+
class="fr-footer__brand"
712687
>
713-
<a
714-
href="/"
715-
title="Retour à l'accueil - Tchap"
688+
<p
689+
class="fr-logo"
716690
>
717-
<p
718-
class="fr-logo"
719-
>
720-
République
721-
<br />
722-
Française
723-
</p>
724-
</a>
691+
République
692+
<br />
693+
Française
694+
</p>
725695
</div>
726696
</div>
727697
</div>

frontend/tests/routes/account/__snapshots__/index.test.tsx.snap

Lines changed: 7 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -765,20 +765,15 @@ exports[`Account home page > renders the page 1`] = `
765765
class="fr-footer__body"
766766
>
767767
<div
768-
class="fr-footer__brand fr-enlarge-link"
768+
class="fr-footer__brand"
769769
>
770-
<a
771-
href="/"
772-
title="Retour à l'accueil - Tchap"
770+
<p
771+
class="fr-logo"
773772
>
774-
<p
775-
class="fr-logo"
776-
>
777-
République
778-
<br />
779-
Française
780-
</p>
781-
</a>
773+
République
774+
<br />
775+
Française
776+
</p>
782777
</div>
783778
</div>
784779
</div>
Lines changed: 88 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,88 @@
1+
{#
2+
Copyright 2024 New Vector Ltd.
3+
Copyright 2021-2024 The Matrix.org Foundation C.I.C.
4+
5+
SPDX-License-Identifier: AGPL-3.0-only
6+
Please see LICENSE in the repository root for full details.
7+
-#}
8+
9+
{% set consent_page = true %}
10+
11+
{% extends "base.html" %}
12+
13+
{% block content %}
14+
{% set client_name = client.client_name or client.client_id %}
15+
<header class="page-heading">
16+
17+
{% if client.logo_uri %}
18+
<!-- <img class="consent-client-icon image" referrerpolicy="no-referrer" src="{{ client.logo_uri }}" /> -->
19+
<div class="consent-client-icon generic">
20+
{{ icon.devices() }}
21+
</div>
22+
{% else %}
23+
<div class="consent-client-icon generic">
24+
{{ icon.web_browser() }}
25+
</div>
26+
{% endif %}
27+
28+
<div class="header">
29+
<h1 class="title">{{ _("mas.consent.heading") }}</h1>
30+
<p class="text [&>span]:whitespace-nowrap">
31+
{{ _("mas.consent.client_wants_access", client_name=client_name, redirect_uri=(grant.redirect_uri | simplify_url)) }}
32+
{{ _("mas.consent.this_will_allow", client_name=client_name) }}
33+
</p>
34+
</div>
35+
</header>
36+
37+
<!--
38+
:tchap:
39+
<section class="consent-scope-list">
40+
{{ scope.list(scopes=grant.scope) }}
41+
</section>
42+
43+
<section class="text-center cpd-text-secondary cpd-text-body-md-regular [&>span]:whitespace-nowrap">
44+
<strong class="font-semibold cpd-text-primary [&>span]:whitespace-nowrap">{{ _("mas.consent.make_sure_you_trust", client_name=client_name) }}</strong>
45+
{{ _("mas.consent.you_may_be_sharing") }}
46+
{% if client.policy_uri or client.tos_uri %}
47+
Find out how <span>{{ client_name }}</span> will handle your data by reviewing its
48+
{% if client.policy_uri %}
49+
<a target="_blank" href="{{ client.policy_uri }}" class="cpd-link" data-kind="primary">privacy policy</a>{% if not client.tos_uri %}.{% endif %}
50+
{% endif %}
51+
{% if client.policy_uri and client.tos_uri%}
52+
and
53+
{% endif %}
54+
{% if client.tos_uri %}
55+
<a target="_blank" href="{{ client.tos_uri }}" class="cpd-link" data-kind="primary">terms of service</a>.
56+
{% endif %}
57+
{% endif %}
58+
</section>
59+
:tchap:
60+
-->
61+
<section class="flex flex-col gap-6">
62+
<form method="POST" class="cpd-form-root">
63+
<input type="hidden" name="csrf" value="{{ csrf_token }}" />
64+
{{ button.button(text=_("action.continue")) }}
65+
</form>
66+
67+
68+
<!--
69+
:tchap:
70+
<div class="flex gap-1 justify-center items-center">
71+
<p class="cpd-text-secondary cpd-text-body-md-regular">
72+
{{ _("mas.not_you", username=current_session.user.username) }}
73+
</p>
74+
75+
{{ logout.button(text=_("action.sign_out"), csrf_token=csrf_token, post_logout_action=action, as_link=true) }}
76+
</div>
77+
78+
{{ back_to_client.link(
79+
text=_("action.cancel"),
80+
kind="tertiary",
81+
uri=grant.redirect_uri,
82+
mode=grant.response_mode,
83+
params=dict(error="access_denied", state=grant.state)
84+
) }}
85+
:tchap:
86+
-->
87+
</section>
88+
{% endblock content %}

tchap/resources/templates/tchap/header.html

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,19 +3,13 @@
33
<div class="fr-header__body">
44
<div class="fr-container lasuite-container">
55
<div class="fr-header__body-row">
6-
<div class="fr-header__brand fr-enlarge-link">
6+
<div class="fr-header__brand">
77
<div class="fr-header__brand-top">
88
<div class="fr-header__logo">
99
<p class="fr-logo">République<br />Française</p>
1010
</div>
1111
</div>
12-
<div class="fr-header__service">
13-
<a
14-
class="lasuite-header__service-link"
15-
href="https://www.tchap.gouv.fr"
16-
title="Accueil - Tchap - DINUM"
17-
aria-label="Accueil - Tchap - DINUM"
18-
>
12+
<div class="fr-header__service lasuite-header__service-link">
1913
<img
2014
alt="tchap logo"
2115
class="lasuite-header__service-logo fr-responsive-img"
@@ -26,7 +20,6 @@
2620
<p class="fr-header__service-title lasuite-header__service-title">
2721
Tchap
2822
</p>
29-
</a>
3023
</div>
3124
</div>
3225
<div class="fr-header__tools">

0 commit comments

Comments
 (0)