-
Notifications
You must be signed in to change notification settings - Fork 0
/
article.html
137 lines (130 loc) · 7.46 KB
/
article.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
<!DOCTYPE html>
<html>
<head>
<title>Les Films de Plein Air</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta charset="UTF-8">
<meta lang="fr">
<link href="assets/styles/styles.css" rel="stylesheet">
<link rel="icon" type="image/svg+xml" href="assets/img/vector/favicon.svg">
</head>
<body>
<nav class="navigation--site" role="navigation">
<div class="navigation__logo">
<a href="./index.html">
<svg class="logo__nav" viewBox="0 0 230 230" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve">
<g transform="matrix(1,0,0,1,-7769.44,-4139.44)">
<g transform="matrix(1,0,0,1,34.7789,-69.2219)">
<g class="Logo--light-bg" transform="matrix(0.861065,0,0,0.861065,1225.96,780.471)">
<g class="logo__canvas" transform="matrix(1.16135,0,0,1.16135,-397.966,-1947.68)">
<path d="M6892.39,5270.3L6851.38,5270.3L6851.38,5105.27L7080.87,5105.27L7080.87,5270.3L7039.77,5270.3L6982.1,5205.66L7016.38,5205.66L7016.38,5169.62L6915.98,5169.62L6915.98,5205.66L6949.97,5205.66L6892.39,5270.3Z"/>
</g>
<g class="logo__triangle--category" transform="matrix(0.779325,0,0,0.779325,4453.46,3880.1)">
<path d="M3984.79,476.347L4155.64,284.549L4326.79,476.347L3984.79,476.347Z"/>
</g>
</g>
</g>
</g>
</svg>
</a>
</div>
<div class="navigation__menu--desktop">
<a class="navigation__menu__link" href="./article.html">
Le Festival
</a>
<a class="navigation__menu__link" href="./programme.html">
Le Programme
</a>
<a class="navigation__menu__link" href="./blog.html">
Le Blog
</a>
<a class="navigation__menu__link" href="./contact.html">
Contact
</a>
</div>
<div class="navigation__actions">
<select class="select select__navigation--desktop">
<option value="Français">Français</option>
<option value="English">English</option>
</select>
<a href="./inscription.html" class="button button--CTA--register button--CTA--register--navigation--desktop">
Inscrivez-vous
</a>
<button class="button--icon button--icon--menu" id="menuToggle" onclick="displayMenu()">
<svg class="icon--menu--mobile" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
<path d="M3 12H21" />
<path d="M3 6H21" />
<path d="M3 18H21" />
</svg>
</button>
</div>
<div class="navigation__menu--mobile" id="drawerMenu">
<a class="navigation__menu__link--mobile" href="./article.html">
Le Festival
</a>
<a class="navigation__menu__link--mobile" href="./programme.html">
Le Programme
</a>
<a class="navigation__menu__link--mobile" href="./blog.html">
Le Blog
</a>
<a class="navigation__menu__link--mobile" href="./contact.html">
Contact
</a>
<select class="select select__navigation--mobile">
<option value="Français">Français</option>
<option value="English">English</option>
</select>
<a href="./inscription.html" class="button button--CTA--register button--CTA--register--navigation--mobile">
Inscrivez-vous
</a>
</div>
</nav>
<main class="main-content">
<article class="article">
<header class="article__header">
<h3>Bonjour, nous sommes Les Films de Plein Air</h3>
<div class="article__meta">
<p>
Publié le
<span>
17 janvier 2021
</span>
</p>
</div>
</header>
<section class="blog__article__content">
<img class="article__image" src="./assets/img/illustration/outdoor-cinema.jpg" alt="Cinéma en plein air en pleine soirée"/>
<h4>Nemo nostrum istius generis asotos iucunde putat vivere.</h4>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duo Reges: constructio interrete. Quis hoc dicit? Erit enim mecum, si tecum erit. <a href="http://loripsum.net/" target="_blank">An eiusdem modi?</a> O magnam vim ingenii causamque iustam, cur nova existeret disciplina! Perge porro. Cur iustitia laudatur? Atqui reperies, inquit, in hoc quidem pertinacem; <a href="http://loripsum.net/" target="_blank">Quae quidem vel cum periculo est quaerenda vobis;</a> Poterat autem inpune; </p>
<p>Ita prorsus, inquam; Claudii libidini, qui tum erat summo ne imperio, dederetur. Cur deinde Metrodori liberos commendas? Quod non faceret, si in voluptate summum bonum poneret. Cum id quoque, ut cupiebat, audivisset, evelli iussit eam, qua erat transfixus, hastam. Primum quid tu dicis breve? </p>
<h4>Plane idem, inquit, et maxima quidem, qua fieri nulla maior potest.</h4>
<p>Hoc Hieronymus summum bonum esse dixit. Itaque his sapiens semper vacabit. Quis est autem dignus nomine hominis, qui unum diem totum velit esse in genere isto voluptatis? Quo modo autem philosophus loquitur? Ut enim consuetudo loquitur, id solum dicitur honestum, quod est populari fama gloriosum. Tu autem negas fortem esse quemquam posse, qui dolorem malum putet. De illis, cum volemus.
</p>
</section>
</article>
<section class="social-sharing">
<button class="button button--CTA social-sharing__button" href="#">Facebook</button>
<button class="button button--CTA social-sharing__button" href="#">Twitter</button>
<button class="button button--CTA social-sharing__button" href="#">Copier le lien</button>
</section>
</main>
<footer class="footer--site" role="footer">
<div class="footer__copyright">
© Les Films de Plein Air - 2021
</div>
<div class="footer__menu">
<a class="navigation__menu__link" href="/festival.html">
À propos
</a>
<a class="navigation__menu__link" href="#">
Mentions légales
</a>
<a class="navigation__menu__link" href="#">
Plan du site
</a>
</div>
</footer>
<script src="./assets/javascript/navigation.js" type="text/javascript"></script>
</body>
</html>