|
1 | 1 | <?php |
2 | 2 | get_header(); |
3 | | -?> |
4 | | -<div class="intro"> |
5 | | - <style> |
6 | | - .intro { |
7 | | - display: flex; |
8 | | - flex-direction: column; |
9 | | - justify-content: center; |
10 | | - align-items: center; |
11 | | - height: 100vh; |
12 | | - text-align: center; |
13 | | - } |
14 | 3 |
|
15 | | - .intro svg { |
16 | | - width: 200px; |
17 | | - } |
| 4 | +if ( have_posts() ) : |
| 5 | + while ( have_posts() ) : |
| 6 | + the_post(); |
| 7 | + endwhile; |
| 8 | +endif; |
18 | 9 |
|
19 | | - .intro h1 { |
20 | | - color: #000; |
21 | | - } |
22 | | - </style> |
23 | | - <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 212 225"><path fill="#ffe600" d="M136.3 224.7a4.1 4.1 0 0 1-2.6-3.9v-27.9H20.2a4.2 4.2 0 0 1-4.2-4.2V20.2c0-2.3 1.9-4.2 4.2-4.2h187.7c2.3 0 4.2 1.9 4.2 4.2v168.6c0 2.3-1.9 4.2-4.2 4.2H169l-28.2 30.7a4 4 0 0 1-4.5 1z"/><path d="M8.3 168.2h113.2c2.3 0 4.1 1.9 4.1 4.1v21.4l22.1-24.2a4 4 0 0 1 3.1-1.3h36.4V8.3H8.3v159.9zm111.7 40a4.1 4.1 0 0 1-2.6-3.9v-27.9H4.1a4.1 4.1 0 0 1-4.1-4.1V4.1C0 1.9 1.9 0 4.1 0h187.3c2.3 0 4.1 1.9 4.1 4.1v168.2c0 2.3-1.9 4.1-4.1 4.1h-38.8l-28.1 30.7a4 4 0 0 1-3.1 1.3c-.4.1-.9 0-1.4-.2z"/><path d="M126.8 104h7l-4.8 21.5h-7zm4.7-17.5c1.1 0 2.1.4 2.8 1.2.8.8 1.2 1.7 1.2 2.8 0 1.1-.4 2.1-1.2 2.8-.8.8-1.7 1.2-2.8 1.2-1.1 0-2.1-.4-2.8-1.2a3.8 3.8 0 0 1-1.2-2.8c0-1.1.4-2.1 1.2-2.8.8-.8 1.7-1.2 2.8-1.2m23.5 13.8c0 11.4-4.1 20.1-11.6 27.5l-.1.1-4.5-4.1.1-.1a32.4 32.4 0 0 0 9.6-23.3c0-9.2-3.2-16.5-9.6-23.3l-.1-.1 4.5-4.2.1.1a36.6 36.6 0 0 1 11.6 27.4zm-53.2 2.6c-2.2 0-4 .7-5.5 2.3a8.4 8.4 0 0 0-2.2 5.9 8 8 0 0 0 2.2 6 7.3 7.3 0 0 0 5.5 2.3c2.1 0 3.9-.8 5.4-2.3a8.4 8.4 0 0 0 2.2-5.9c0-2.4-.7-4.3-2.2-5.9a6.5 6.5 0 0 0-5.4-2.4zm-7.3-5.8v3.1a12 12 0 0 1 8.8-3.7c3.6 0 6.7 1.4 9.2 4.1 2.5 2.7 3.8 6.3 3.8 10.6 0 4.1-1.3 7.6-3.9 10.4a12.3 12.3 0 0 1-13.8 3.3c-1.4-.6-2.7-1.5-4.1-2.8v13.1h-6.9v-38h6.9zm-31.7 6.3c-2.2 0-4 .8-5.4 2.3a8.4 8.4 0 0 0-2.1 5.9 8 8 0 0 0 2.2 5.9c1.4 1.5 3.2 2.3 5.4 2.3s4-.8 5.5-2.3a8.5 8.5 0 0 0 2.2-6 8 8 0 0 0-2.2-5.9 8.2 8.2 0 0 0-5.6-2.2zm7.3-5.7h7v27.8h-7v-2.9a14.3 14.3 0 0 1-4.1 2.8 12.3 12.3 0 0 1-13.7-3.3 14.6 14.6 0 0 1-3.9-10.4c0-4.3 1.3-7.8 3.8-10.6 2.5-2.7 5.6-4.1 9.2-4.1 1.7 0 3.2.3 4.7.9 1.5.6 2.8 1.6 4.1 2.8l-.1-3zm38.2-28.1a7 7 0 0 0-2.7-3.8 8 8 0 0 0-4.8-1.5c-2 0-3.7.5-5.2 1.6-.9.7-1.8 1.9-2.6 3.7h15.3zm7.1 5.5H92.7c.3 2 1.2 3.6 2.6 4.8a8 8 0 0 0 5.4 1.8c2.6 0 4.9-.9 6.8-2.8l5.9 2.8a15.7 15.7 0 0 1-5.3 4.7c-2.1 1-4.5 1.5-7.4 1.5-4.4 0-8-1.4-10.8-4.2a14.2 14.2 0 0 1-4.2-10.5 14.5 14.5 0 0 1 14.6-15c4.4 0 8 1.4 10.8 4.3 2.8 2.8 4.2 6.6 4.2 11.2v1.4zM65.1 64.6c-2.2 0-4 .8-5.5 2.3a8.4 8.4 0 0 0-2.2 5.9 8 8 0 0 0 2.2 6 7.5 7.5 0 0 0 5.5 2.3c2.1 0 3.9-.8 5.4-2.3 1.5-1.6 2.2-3.6 2.2-6s-.7-4.4-2.2-5.9a7.3 7.3 0 0 0-5.4-2.3zm-7.4-16.5v13.8a13 13 0 0 1 8.8-3.8 12 12 0 0 1 9.3 4.2c2.6 2.7 3.8 6.3 3.8 10.6 0 4.2-1.3 7.6-4 10.5a12.3 12.3 0 0 1-9.3 4.2c-1.6 0-3.1-.3-4.5-.8-1.4-.6-2.7-1.5-4.2-2.8v3h-6.9V48.1h7z"/></svg> |
24 | | - <h1>Be API Frontend Framework</h1> |
25 | | -</div> |
26 | | - |
27 | | -<div class="blocks-container"> |
28 | | - |
29 | | - <h1>Titre de niveau 1</h1> |
30 | | - |
31 | | - <h2>Titre de niveau 2</h2> |
32 | | - |
33 | | - <h3>Titre de nivrau 3</h3> |
34 | | - |
35 | | - <h4>Titre de niveau 4</h4> |
36 | | - |
37 | | - <h5>Titre de niveau 5</h5> |
38 | | - |
39 | | - <h6>Titre de niveau 6</h6> |
40 | | - |
41 | | - <h2>Fusce a quam. Donec mollis hendrerit risus. Nam commodo suscipit quam. Maecenas nec odio et ante tincidunt |
42 | | - tempus. Praesent egestas tristique nibh.</h2> |
43 | | - |
44 | | - <p>Fusce a quam. Donec mollis hendrerit risus. Nam commodo suscipit quam. Maecenas nec odio et ante tincidunt |
45 | | - tempus. Praesent egestas tristique nibh.</p> |
46 | | - |
47 | | - <ul> |
48 | | - <li>Fusce a quam. Donec mollis hendrerit risus.</li> |
49 | | - <li>Nam commodo suscipit quam.</li> |
50 | | - <li>Maecenas nec odio et ante tincidunt tempus. Praesent egestas tristique nibh.</li> |
51 | | - </ul> |
52 | | - |
53 | | - <ol> |
54 | | - <li>Fusce a quam. Donec mollis hendrerit risus.</li> |
55 | | - <li>Nam commodo suscipit quam.</li> |
56 | | - <li>Maecenas nec odio et ante tincidunt tempus. Praesent egestas tristique nibh</li> |
57 | | - </ol> |
58 | | - |
59 | | - <div class="wp-container-2 wp-block-group has-cyan-bluish-gray-background-color has-background"> |
60 | | - <div class="wp-block-group__inner-container"> |
61 | | - <div class="wp-container-1 wp-block-buttons"> |
62 | | - <div class="wp-block-button"><a class="wp-block-button__link">primary</a></div> |
63 | | - <div class="wp-block-button is-style-outline"><a class="wp-block-button__link">outline</a></div> |
64 | | - </div> |
65 | | - </div> |
66 | | - </div> |
67 | | - |
68 | | - <blockquote class="wp-block-quote"> |
69 | | - <p>Bloc citation – Lorem ipsum dolor sit amet</p><cite>Une source</cite> |
70 | | - </blockquote> |
71 | | - |
72 | | - <pre class="wp-block-code"><code>Bloc code</code></pre> |
73 | | - |
74 | | - <pre class="wp-block-preformatted">Bloc préformaté</pre> |
75 | | - |
76 | | - <figure class="wp-block-pullquote"> |
77 | | - <blockquote> |
78 | | - <p>Bloc citation en exergue</p><cite>Une source</cite> |
79 | | - </blockquote> |
80 | | - </figure> |
81 | | - |
82 | | - <figure class="wp-block-table"> |
83 | | - <table class="has-fixed-layout"> |
84 | | - <thead> |
85 | | - <tr> |
86 | | - <th>Tableau Lorem 1</th> |
87 | | - <th>Tableau lorem 2</th> |
88 | | - </tr> |
89 | | - </thead> |
90 | | - <tbody> |
91 | | - <tr> |
92 | | - <td>Valeur 1</td> |
93 | | - <td>Valeur 2</td> |
94 | | - </tr> |
95 | | - <tr> |
96 | | - <td>Valeur 3</td> |
97 | | - <td>Valeur 4</td> |
98 | | - </tr> |
99 | | - </tbody> |
100 | | - </table> |
101 | | - <figcaption>Une légende</figcaption> |
102 | | - </figure> |
103 | | - |
104 | | - <pre class="wp-block-verse">Bloc couplet</pre> |
105 | | - |
106 | | - <figure class="wp-block-image size-large"><img src="https://picsum.photos/1600/800" alt=""> |
107 | | - <figcaption>Une légende</figcaption> |
108 | | - </figure> |
109 | | - |
110 | | - <figure class="wp-block-gallery has-nested-images columns-default is-cropped"> |
111 | | - <figure class="wp-block-image size-large"><img loading="lazy" data-id="19" |
112 | | - src="https://picsum.photos/1600/800"></figure> |
113 | | - |
114 | | - <figure class="wp-block-image size-large"><img loading="lazy" data-id="20" |
115 | | - src="https://picsum.photos/1600/800"></figure> |
116 | | - |
117 | | - <figure class="wp-block-image size-large"><img loading="lazy" data-id="21" |
118 | | - src="https://picsum.photos/1600/800"></figure> |
119 | | - |
120 | | - <figure class="wp-block-image size-large"><img loading="lazy" data-id="22" |
121 | | - src="https://picsum.photos/1600/800"></figure> |
122 | | - |
123 | | - <figure class="wp-block-image size-large"><img loading="lazy" data-id="22" |
124 | | - src="https://picsum.photos/1600/800"></figure> |
125 | | - |
126 | | - <figure class="wp-block-image size-large"><img loading="lazy" data-id="22" |
127 | | - src="https://picsum.photos/1600/800"></figure> |
128 | | - </figure> |
129 | | - |
130 | | - <figure class="wp-block-audio"><audio controls="" |
131 | | - src="https://soundcloud.com/dj-toilettiquette/bensound-the-elevator-bossa-nova?utm_source=clipboard&utm_medium=text&utm_campaign=social_sharing"></audio> |
132 | | - </figure> |
133 | | - |
134 | | - <div class="wp-block-cover alignfull"><span aria-hidden="true" |
135 | | - class="has-black-background-color has-background-dim-100 wp-block-cover__gradient-background has-background-dim"></span> |
136 | | - <div class="wp-block-cover__inner-container"> |
137 | | - <h2 class="has-text-align-center">Un titre de bannière</h2> |
138 | | - <p class="has-text-align-center">Un texte</p> |
139 | | - </div> |
140 | | - </div> |
141 | | - |
142 | | - <div class="wp-block-file"><a id="wp-block-file--media-6fc0216b-4375-46cf-a04e-747f342fd18a" |
143 | | - href="https://bff.lndo.site/app/uploads/2022/05/fulltext01.pdf">fulltext01</a><a |
144 | | - href="https://bff.lndo.site/app/uploads/2022/05/fulltext01.pdf" class="wp-block-file__button" download="" |
145 | | - aria-describedby="wp-block-file--media-6fc0216b-4375-46cf-a04e-747f342fd18a">Télécharger</a></div> |
146 | | - |
147 | | - <div class="wp-block-media-text is-stacked-on-mobile"> |
148 | | - <figure class="wp-block-media-text__media"><img loading="lazy" |
149 | | - src="https://picsum.photos/1600/800" alt="" class="wp-image-22 size-full"></figure> |
150 | | - <div class="wp-block-media-text__content"> |
151 | | - <h2>Media et texte : titre</h2> |
152 | | - <p>Lorem ipsum dolor sit amet</p> |
153 | | - </div> |
154 | | - </div> |
155 | | - |
156 | | - <div class="wp-block-columns"> |
157 | | - <div class="wp-block-column"> |
158 | | - <h2>Colonne 1</h2> |
159 | | - <p>Lorem ipsum dolor sit amet</p> |
160 | | - </div> |
161 | | - |
162 | | - <div class="wp-block-column"> |
163 | | - <h2>Colonne 2</h2> |
164 | | - <p>Lorem ipsum dolor sit amet</p> |
165 | | - </div> |
166 | | - |
167 | | - <div class="wp-block-column"> |
168 | | - <h2>Colonne 3</h2> |
169 | | - <p>Lorem ipsum dolor sit amet</p> |
170 | | - </div> |
171 | | - </div> |
172 | | - |
173 | | - <div class="wp-container-3 wp-block-group has-black-background-color has-background"> |
174 | | - <div class="wp-block-group__inner-container"> |
175 | | - <h2 class="has-white-color has-text-color">Groupe</h2> |
176 | | - </div> |
177 | | - </div> |
178 | | -</div> |
179 | | - |
180 | | -<div class="container" style="padding: 100px 0"> |
181 | | - <h1 class="js-animation-title">Exemples d'animation</h1> |
182 | | - <p class="js-animation-opacity">Fusce a quam. Donec mollis hendrerit risus. Nam commodo suscipit quam. Maecenas nec odio et ante tincidunt |
183 | | - tempus. Praesent egestas tristique nibh.</p> |
184 | | - |
185 | | - <ul style="display: flex; justify-content: space-between; list-style: none; margin-top: 50px"> |
186 | | - <li class="js-animation-translation" style="width: 32%"> |
187 | | - <div style="background: #000; height: 450px;"></div> |
188 | | - </li> |
189 | | - <li class="js-animation-translation" style="width: 32%"> |
190 | | - <div style="background: #000; height: 450px;"></div> |
191 | | - </li> |
192 | | - <li class="js-animation-translation" style="width: 32%"> |
193 | | - <div style="background: #000; height: 450px;"></div> |
194 | | - </li> |
195 | | - </ul> |
196 | | -</div> |
197 | | - |
198 | | -<div class="container" style="padding: 100px 0"> |
199 | | - <form> |
200 | | - <div style="margin-bottom: 32px"> |
201 | | - <label>Checkboxes</label> |
202 | | - <input type="checkbox" id="checkbox-1" name="checkbox" value="0" /> |
203 | | - <label for="checkbox-1">Checkbox 1</label> |
204 | | - <input type="checkbox" id="checkbox-2" name="checkbox" value="1" /> |
205 | | - <label for="checkbox-2">Checkbox 2</label> |
206 | | - </div> |
207 | | - <div style="margin-bottom: 32px"> |
208 | | - <label>Radios</label> |
209 | | - <input type="radio" id="radio-1" name="radio" value="0" /> |
210 | | - <label for="radio-1">Radio 1</label> |
211 | | - <input type="radio" id="radio-2" name="radio" value="1" /> |
212 | | - <label for="radio-2">Radio 2</label> |
213 | | - </div> |
214 | | - <div style="margin-bottom: 32px"> |
215 | | - <label>Input text</label> |
216 | | - <input type="text" /> |
217 | | - </div> |
218 | | - <div style="margin-bottom: 32px"> |
219 | | - <label>Select</label> |
220 | | - <select> |
221 | | - <option>Option 1</option> |
222 | | - <option>Option 2</option> |
223 | | - </select> |
224 | | - </div> |
225 | | - <div> |
226 | | - <button class="btn-block">Button submit</button> |
227 | | - <button class="btn-outline">Button submit outline</button> |
228 | | - <input type="submit" value="Input submit"> |
229 | | - <input type="reset" value="Input reset"> |
230 | | - </div> |
231 | | - </form> |
232 | | -</div> |
233 | | -<?php |
234 | 10 | get_footer(); |
0 commit comments