Skip to content

Commit 723b558

Browse files
brunatobrunato
authored
Proposal for making a SPID compliant set of templates (#54)
* Remove Django 3.0 tests in tox.ini * Clean saml2 subpackage imports in src/djangosaml2_spid/views.py * Move demo project's templatetags to app - These templatetags are needed for validate an installation * Add SPID base template and wayf.html for reusable app * Remove unecessary metadata files from demo and tests * Rename SPID base template blocks - Use italia/design-django-theme compatible names: head-extra-scripts -> extra_head body-extra-scripts -> extra_scripts
1 parent ade8249 commit 723b558

File tree

13 files changed

+514
-114
lines changed

13 files changed

+514
-114
lines changed

Diff for: ‎.gitignore

+6-2
Original file line numberDiff line numberDiff line change
@@ -129,5 +129,9 @@ dmypy.json
129129
.pyre/
130130

131131
# downloaded metadata
132-
example/spid_config/metadata/idp_*.xml
133-
tests/metadata/idp_*.xml
132+
example/spid_config/metadata/*
133+
!example/metadata/satosa-spid.xml
134+
!example/metadata/spid-saml-check.xml
135+
tests/metadata/*
136+
!tests/metadata/spid-saml-check.xml
137+

Diff for: ‎example/spid_config/templates/wayf.html renamed to ‎example/spid_config/templates/wayf_.html

File renamed without changes.

Diff for: ‎src/djangosaml2_spid/templates/spid_base.html

+364
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,364 @@
1+
{% load static %}
2+
3+
<!DOCTYPE html>
4+
<html lang="it">
5+
<head>
6+
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
7+
<!-- Required meta tags -->
8+
<meta charset="utf-8">
9+
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
10+
<!-- Page details -->
11+
12+
<title>
13+
Accedi Con SPID
14+
</title>
15+
16+
<meta name="description" content="Bootstrap Italia">
17+
<!-- CSS -->
18+
<link rel="stylesheet" href="{% static 'spid/bootstrap-italia.css' %}">
19+
<!-- Extra CSS/Javascript -->
20+
21+
<link rel="shortcut icon" href="{% static 'spid/favicon/favicon-32x32.png' %}">
22+
23+
<link type="text/css" rel="stylesheet" href="{% static 'spid/spid-sp-access-button.css' %}">
24+
25+
{% block extra_head %} {% endblock %}
26+
27+
</head>
28+
<body>
29+
30+
<div class="it-header-wrapper">
31+
32+
<!-- Top row in header -->
33+
34+
<div class="it-header-slim-wrapper">
35+
<div class="container">
36+
<div class="row">
37+
<div class="col-12">
38+
<div class="it-header-slim-wrapper-content">
39+
<a class="d-none d-lg-block navbar-brand" href="/">
40+
41+
Nome Organizzazione
42+
43+
</a>
44+
<div class="nav-mobile">
45+
<nav>
46+
<a class="it-opener d-lg-none" data-toggle="collapse" href="#menu-principale" role="button" aria-expanded="false" aria-controls="menu-principale">
47+
<span>
48+
49+
Nome Organizzazione
50+
51+
</span>
52+
53+
</a>
54+
55+
</nav>
56+
</div>
57+
58+
59+
</div>
60+
</div>
61+
</div>
62+
</div>
63+
</div>
64+
65+
66+
<div class="it-nav-wrapper">
67+
<div class="it-header-center-wrapper">
68+
<div class="container">
69+
<div class="row">
70+
<div class="col-12">
71+
<div class="it-header-center-content-wrapper">
72+
<!-- Logo -->
73+
<div class="it-brand-wrapper">
74+
<a href="/">
75+
76+
<div class="col-10 col-md-12 offset-1 offset-md-0">
77+
<img src="{% static 'spid/logo.jpg' %}" style="width: 10%;" alt="SPID Logo">
78+
</div>
79+
80+
81+
<div class="it-brand-text">
82+
<h2 class="no_toc">
83+
84+
85+
86+
</h2>
87+
<h3 class="no_toc d-none d-md-block">
88+
89+
90+
91+
</h3>
92+
</div>
93+
</a>
94+
</div>
95+
96+
<!-- Social and Search -->
97+
98+
<div class="it-right-zone">
99+
100+
101+
102+
103+
104+
</div>
105+
106+
</div>
107+
</div>
108+
</div>
109+
</div>
110+
</div>
111+
112+
<!-- Main menu -->
113+
114+
<div class="it-header-navbar-wrapper">
115+
<div class="container">
116+
<div class="row">
117+
<div class="col-12">
118+
<nav class="navbar navbar-expand-lg has-megamenu">
119+
<button class="custom-navbar-toggler" type="button" aria-controls="nav10" aria-expanded="false" aria-label="Toggle navigation" data-target="#nav10">
120+
<svg class="icon">
121+
<use xlink:href="/static/images/svg/sprite.svg#it-burger"></use>
122+
</svg>
123+
</button>
124+
<div class="navbar-collapsable" id="nav10">
125+
<div class="overlay"></div>
126+
<div class="close-div sr-only">
127+
<button class="btn close-menu" type="button"><span class="it-close"></span>close</button>
128+
</div>
129+
<div class="menu-wrapper">
130+
<ul class="navbar-nav">
131+
132+
<li class="nav-item active"><a class="nav-link active" href="#">
133+
<span>Pagina principale</span>
134+
<span class="sr-only">current</span></a></li>
135+
136+
137+
138+
<li class="nav-item dropdown">
139+
<a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" aria-expanded="false">
140+
<span>Domande frequenti</span>
141+
<svg class="icon icon-xs">
142+
<use xlink:href="/static/images/svg/sprite.svg#it-expand"></use>
143+
</svg>
144+
</a>
145+
<div class="dropdown-menu">
146+
<div class="link-list-wrapper">
147+
<ul class="link-list">
148+
<li>
149+
<h3 class="no_toc" id="heading">Questo servizio</h3>
150+
</li>
151+
<li><a class="list-item" href=""><span>Assistenza</span></a></li>
152+
<li><span class="divider"></span></li>
153+
<li>
154+
<h3 class="no_toc" id="heading">SPID</h3>
155+
</li>
156+
<li class="spid-idp-support-link">
157+
<a class="list-item" href="https://www.spid.gov.it/">Maggiori informazioni</a>
158+
</li>
159+
<li class="spid-idp-support-link">
160+
<a class="list-item" href="https://www.spid.gov.it/richiedi-spid">Non hai SPID?</a>
161+
</li>
162+
<li class="spid-idp-support-link">
163+
<a class="list-item" href="https://www.spid.gov.it/serve-aiuto">Serve aiuto?</a>
164+
</li>
165+
166+
167+
</ul>
168+
</div>
169+
</div>
170+
</li>
171+
</ul>
172+
</div>
173+
</div>
174+
</nav>
175+
</div>
176+
</div>
177+
</div>
178+
</div>
179+
180+
</div>
181+
</div>
182+
183+
184+
185+
186+
<!-- Container - Body of page-->
187+
<div class="main-body">
188+
<div class="container">
189+
{% block container %} {% endblock %}
190+
</div>
191+
</div>
192+
193+
<!-- Footer -->
194+
195+
<footer class="it-footer">
196+
<div class="it-footer-main">
197+
<div class="container">
198+
199+
<section>
200+
<div class="row clearfix">
201+
<div class="col-sm-12">
202+
<div class="it-brand-wrapper">
203+
<a href="#">
204+
205+
<img class="icon" src="{% static 'spid/logo.jpg' %}">
206+
207+
208+
<div class="it-brand-text">
209+
<h2 class="no_toc">
210+
211+
Nome Organizzazione
212+
213+
</h2>
214+
<h3 class="no_toc d-none d-md-block">
215+
216+
lorem ipsum
217+
218+
</h3>
219+
</div>
220+
221+
</a>
222+
</div>
223+
</div>
224+
</div>
225+
</section>
226+
227+
228+
<!-- Footer middle section with menu blocks -->
229+
230+
231+
232+
<!-- Footer bottom section with contacts -->
233+
234+
<section class="py-4 border-white border-top">
235+
<div class="row">
236+
<div class="col-lg-4 col-md-4 pb-2">
237+
<h4><a href="#" title="Vai alla pagina: Contatti">Contatti</a></h4>
238+
<p>
239+
<strong>Nome Organizzazione</strong>
240+
<br>
241+
via Tal dei Tali 00000 Città, Provincia
242+
<br>
243+
Codice Fiscale 2384762384623894 - Tel. (+39) xxxx yyyyyy
244+
</p>
245+
<div class="link-list-wrapper">
246+
<ul class="footer-list link-list clearfix">
247+
<li>
248+
<a class="list-item" href="https://www.example.org/contacts/" title="Vai alla pagina: Posta Elettronica Certificata">
249+
Posta Elettronica Certificata
250+
</a>
251+
</li>
252+
<li>
253+
<a class="list-item" href="https://www.example.org/fatturazione" title="Vai alla pagina: Fatturazione elettronica">
254+
Fatturazione Elettronica
255+
</a>
256+
</li>
257+
</ul>
258+
</div>
259+
</div>
260+
<div class="col-lg-4 col-md-4 pb-2">
261+
<h4><a href="#" title="Vai alla pagina: Lorem Ipsum">Link Utili</a></h4>
262+
<div class="link-list-wrapper">
263+
<ul class="footer-list link-list clearfix">
264+
<li>
265+
<a class="list-item" href="https://www.example.org/search_phone" title="Vai alla pagina: Contatti/cerca persone">
266+
Contatti/cerca persone
267+
</a>
268+
</li>
269+
<li>
270+
<a class="list-item" href="https://www.example.org/amministrazione/" title="Vai alla pagina: Contatti amministrazione">
271+
Contatti amministrazione
272+
</a>
273+
</li>
274+
<li>
275+
<a class="list-item" href="https://www.example.org/" title="Vai alla pagina: Contatti servizi">
276+
Contatti servizi
277+
</a>
278+
</li>
279+
<li>
280+
<a class="list-item" href="https://example.portaleamministrazionetrasparente.it/" title="Vai alla pagina: PAT - Portale amministrazione trasparente">
281+
PAT - Portale amministrazione trasparente
282+
</a>
283+
</li>
284+
</ul>
285+
</div>
286+
</div>
287+
<div class="col-lg-4 col-md-4 pb-2">
288+
<div class="pb-2">
289+
<h4><a href="#" title="Vai alla pagina: Seguici su">Seguici su</a></h4>
290+
<ul class="list-inline text-left social">
291+
<li class="list-inline-item">
292+
<a class="p-2 text-white" href="https://it-it.facebook.com/pages/example" target="_blank">
293+
<svg class="icon icon-sm icon-white align-top">
294+
<use xlink:href="/static/svg/sprite.svg#it-facebook"></use>
295+
</svg><span class="sr-only">Facebook</span>
296+
</a>
297+
</li>
298+
<li class="list-inline-item">
299+
<a class="p-2 text-white" href="https://twitter.com/example" target="_blank">
300+
<svg class="icon icon-sm icon-white align-top">
301+
<use xlink:href="/static/svg/sprite.svg#it-twitter"></use>
302+
</svg><span class="sr-only">Twitter</span>
303+
</a>
304+
</li>
305+
<li class="list-inline-item">
306+
<a class="p-2 text-white" href="https://www.instagram.com/example/" target="_blank">
307+
<svg class="icon icon-sm icon-white align-top">
308+
<use xlink:href="/static/svg/sprite.svg#it-instagram"></use>
309+
</svg><span class="sr-only">Instagram</span>
310+
</a>
311+
</li>
312+
<li class="list-inline-item">
313+
<a class="p-2 text-white" href="https://www.youtube.com/example" target="_blank">
314+
<svg class="icon icon-sm icon-white align-top">
315+
<use xlink:href="/static/svg/sprite.svg#it-youtube"></use>
316+
</svg><span class="sr-only">YouTube</span>
317+
</a>
318+
</li>
319+
</ul>
320+
</div>
321+
<div class="pb-2">
322+
<h4><a href="#" title="Vai alla pagina: Newsletter">Newsletter</a></h4>
323+
<p>Form Newsletter</p>
324+
</div>
325+
</div>
326+
</div>
327+
</section>
328+
329+
</div>
330+
</div>
331+
332+
333+
<div class="it-footer-small-prints clearfix">
334+
<div class="container">
335+
336+
<h3 class="sr-only">Sezione Link Utili</h3>
337+
<ul class="it-footer-small-prints-list list-inline mb-0 d-flex flex-column flex-md-row">
338+
<li class="list-inline-item">
339+
<a href="/" title="Note Legali">
340+
Note legali
341+
</a>
342+
</li>
343+
<li class="list-inline-item">
344+
<a href="https://www.example.org/privacy/" title="Protezione dei dati">
345+
Protezione dei dati
346+
</a>
347+
</li>
348+
</ul>
349+
350+
</div>
351+
</div>
352+
353+
</footer>
354+
355+
<script>window.__PUBLIC_PATH__ = "{% static 'spid/fonts' %}"</script>
356+
<script src="{% static 'spid/bootstrap-italia.js' %}"></script>
357+
358+
<script src="{% static 'spid/spid-sp-access-button.js' %}"></script>
359+
<script src="{% static 'spid/spid_button.js' %}"></script>
360+
361+
{% block extra_scripts %} {% endblock %}
362+
363+
</body>
364+
</html>

0 commit comments

Comments
 (0)