victor.lafont.html 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>Victor Planning</title>
  6. <style>
  7. ::before,
  8. ::after {
  9. box-sizing: border-box;
  10. }
  11. :root {
  12. --color-primary-100: hsl(10, 59%, 25%);
  13. --color-primary-200: hsl(10, 59%, 45%);
  14. --color-primary-400: hsl(37, 100%, 45%);
  15. --color-primary-600: hsl(37, 100%, 65%);
  16. --color-primary-800: hsl(37, 100%, 85%);
  17. --color-accent-100: hsl(179, 52%, 15%);
  18. --color-accent-200: hsl(179, 52%, 25%);
  19. --color-accent-400: hsl(172, 58%, 40%);
  20. --color-accent-500: hsl(172, 58%, 53%);
  21. --color-accent-600: hsl(172, 58%, 66%);
  22. --color-accent-700: hsl(172, 60%, 70%);
  23. --color-accent-800: hsl(172, 60%, 80%);
  24. --color-accent-850: hsl(172, 70%, 90%);
  25. --color-accent-900: hsl(172, 85%, 95%);
  26. --color-accent-950: hsl(172, 96%, 98%);
  27. --color-neutral-100: hsl(37, 5%, 15%);
  28. --color-neutral-200: hsl(37, 5%, 25%);
  29. --color-neutral-300: hsl(37, 5%, 35%);
  30. --color-neutral-400: hsl(37, 5%, 45%);
  31. --color-neutral-600: hsl(37, 5%, 60%);
  32. --color-neutral-800: hsl(37, 5%, 80%);
  33. }
  34. .icon {
  35. font-family: "Material Icons";
  36. font-weight: normal;
  37. font-style: normal;
  38. font-size: 24px;
  39. line-height: 1;
  40. letter-spacing: normal;
  41. text-transform: none;
  42. display: inline-block;
  43. white-space: nowrap;
  44. word-wrap: normal;
  45. direction: ltr;
  46. font-feature-settings: "liga";
  47. -moz-font-feature-settings: "liga";
  48. -moz-osx-font-smoothing: grayscale;
  49. }
  50. .benevole {
  51. vertical-align: middle;
  52. display: inline-block;
  53. }
  54. .benevole .icon {
  55. vertical-align: bottom;
  56. }
  57. .planning-container {
  58. max-width: 800px;
  59. width: 100%;
  60. }
  61. .daily-agenda {
  62. border: solid 1px var(--color-neutral-200);
  63. }
  64. .day-header {
  65. background: var(--color-neutral-200);
  66. color: var(--color-accent-800);
  67. padding: 12px;
  68. font-size: 1.8rem;
  69. font-weight: bold;
  70. text-transform: capitalize;
  71. }
  72. .agenda-creneau-header {
  73. padding: 12px;
  74. background: var(--color-accent-850);
  75. position: relative;
  76. border-bottom: 1px solid var(--color-accent-600);
  77. }
  78. .agenda-creneau-time {
  79. padding-right: 8px;
  80. }
  81. .agenda-creneau-title {
  82. font-weight: bold;
  83. text-transform: capitalize;
  84. }
  85. .agenda-creneau-action {
  86. position: absolute;
  87. top: 8px;
  88. right: 12px;
  89. background: transparent;
  90. outline: 0;
  91. border: 0;
  92. cursor: pointer;
  93. }
  94. .agenda-creneau-action:hover {
  95. color: var(--color-neutral-400);
  96. }
  97. .transformation-container {
  98. height: auto;
  99. overflow: hidden;
  100. }
  101. .agenda-creneau-details {
  102. padding: 4px 12px;
  103. display: flex;
  104. flex-wrap: wrap;
  105. overflow: hidden;
  106. opacity: 1;
  107. transform-origin: 0px 0px;
  108. transition: height 0.3s ease-in-out;
  109. }
  110. .agenda-creneau-details--title {
  111. width: 100%;
  112. font-weight: 600;
  113. margin: 8px 0px;
  114. }
  115. .agenda-creneau-details--content {
  116. width: 100%;
  117. margin: 0px 0px 8px;
  118. }
  119. @media (min-width: 600px) {
  120. .name-header {
  121. text-align: center;
  122. }
  123. .planning-container {
  124. margin-left: auto;
  125. margin-right: auto;
  126. }
  127. .agenda-creneau-time {
  128. padding-right: 2rem;
  129. }
  130. .agenda-creneau-details--title {
  131. width: 16.6%;
  132. margin-bottom: 12px;
  133. }
  134. .agenda-creneau-details--content {
  135. width: calc(33.3% - 8px);
  136. padding-right: 8px;
  137. margin: 8px 0px 16px;
  138. }
  139. }
  140. .agenda-creneau-details--content .chip {
  141. margin: 2px;
  142. }
  143. .hide {
  144. display: none;
  145. }
  146. #links {
  147. list-style-type: none;
  148. max-width: 200px;
  149. margin: 0 auto;
  150. border-top: 1px solid var(--color-neutral-400);
  151. padding: 0;
  152. }
  153. .link-item {
  154. padding: 8px 12px;
  155. margin: 0 auto;
  156. border: solid 1px var(--color-neutral-400);
  157. border-top: 0px;
  158. }
  159. .link-item a {
  160. display: block;
  161. }
  162. .formcontrol {
  163. all: initial;
  164. display: block;
  165. box-sizing: border-box;
  166. font-family: Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
  167. }
  168. .formcontrol.home-search {
  169. margin: 3rem auto 1rem;
  170. max-width: 400px;
  171. }
  172. .formcontrol:not(:last-child) {
  173. margin-bottom: 1rem;
  174. }
  175. .formcontrol-control {
  176. width: 100%;
  177. }
  178. .formcontrol-label {
  179. color: var(--color-neutral-200);
  180. display: -webkit-box;
  181. display: flex;
  182. font-size: 0.9rem;
  183. font-family: inherit;
  184. font-weight: 500;
  185. line-height: 1.5rem;
  186. margin-bottom: 0.2rem;
  187. }
  188. .formcontrol-label > button {
  189. margin-left: 0.25rem;
  190. }
  191. .formcontrol-optional {
  192. -webkit-box-flex: 1;
  193. flex: 1;
  194. color: #647592;
  195. font-size: 0.75rem;
  196. margin-top: 0.25rem;
  197. text-align: right;
  198. line-height: 1.125rem;
  199. margin-left: 0.25rem;
  200. }
  201. .formcontrol-help {
  202. color: #647592;
  203. display: -webkit-box;
  204. display: flex;
  205. font-size: 0.75rem;
  206. margin-top: 0.5rem;
  207. font-family: inherit;
  208. line-height: 1.125rem;
  209. }
  210. .formcontrol-helplink {
  211. -webkit-box-flex: 1;
  212. flex: 1;
  213. margin-top: calc(-0.25rem);
  214. text-align: right;
  215. }
  216. .formcontrol--error .formcontrol-help {
  217. color: #e4002b;
  218. }
  219. .formcontrol--success .formcontrol-help {
  220. color: #08875b;
  221. }
  222. .input {
  223. all: initial;
  224. color: var(--color-neutral-100);
  225. width: 100%;
  226. border: none;
  227. height: 2rem;
  228. margin: 0;
  229. outline: 0;
  230. padding: 0.2rem 0.5rem;
  231. font-size: 0.875rem;
  232. -webkit-appearance: none;
  233. -moz-appearance: none;
  234. appearance: none;
  235. box-shadow: 0 -1px 0 0 var(--color-accent-700) inset;
  236. box-sizing: border-box;
  237. -webkit-transition: 0.1s ease-in-out;
  238. transition: 0.1s ease-in-out;
  239. font-family: Roboto, Helvetica Neue, Helvetica, Arial, sans-serif;
  240. line-height: 1.25rem;
  241. background-color: var(--color-accent-950);
  242. -webkit-transition-property: box-shadow, border;
  243. transition-property: box-shadow, border;
  244. }
  245. .input::-webkit-input-placeholder {
  246. color: #505d74;
  247. }
  248. .input:-ms-input-placeholder {
  249. color: #505d74;
  250. }
  251. .input::-ms-input-placeholder {
  252. color: #505d74;
  253. }
  254. .input::placeholder {
  255. color: #505d74;
  256. }
  257. .input:hover {
  258. background-color: var(--color-accent-850);
  259. }
  260. .input:focus {
  261. box-shadow: 0 0 0 2px var(--color-accent-700);
  262. border-color: transparent;
  263. background-color: var(--color-accent-950);
  264. }
  265. .input:disabled {
  266. color: #c1c7d3 !important;
  267. -webkit-user-select: none;
  268. -moz-user-select: none;
  269. -ms-user-select: none;
  270. user-select: none;
  271. border-color: transparent;
  272. pointer-events: none;
  273. }
  274. .input:disabled::-webkit-input-placeholder {
  275. color: #c1c7d3;
  276. }
  277. .input:disabled:-ms-input-placeholder {
  278. color: #c1c7d3;
  279. }
  280. .input:disabled::-ms-input-placeholder {
  281. color: #c1c7d3;
  282. }
  283. .input:disabled::placeholder {
  284. color: #c1c7d3;
  285. }
  286. .input--small {
  287. height: 2rem;
  288. font-size: 0.875rem;
  289. line-height: 1.125rem;
  290. padding-top: 0.25rem;
  291. padding-bottom: 0.25rem;
  292. }
  293. .input--adorned-start {
  294. padding-left: 2rem;
  295. }
  296. .input--adorned-end {
  297. padding-right: 2rem;
  298. }
  299. .input--valid {
  300. box-shadow: 0 -1px 0 0 #08875b inset !important;
  301. }
  302. .input--valid:focus {
  303. box-shadow: 0 0 0 2px #08875b !important;
  304. }
  305. .input--invalid {
  306. box-shadow: 0 -1px 0 0 #e93255 inset !important;
  307. }
  308. .input--invalid:focus {
  309. box-shadow: 0 0 0 2px #e93255 !important;
  310. }
  311. #search {
  312. background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224px%22%20fill%3D%22%232ba191%22%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3Cpath%20d%3D%22M15.5%2014h-.79l-.28-.27C15.41%2012.59%2016%2011.11%2016%209.5%2016%205.91%2013.09%203%209.5%203S3%205.91%203%209.5%205.91%2016%209.5%2016c1.61%200%203.09-.59%204.23-1.57l.27.28v.79l5%204.99L20.49%2019l-4.99-5zm-6%200C7.01%2014%205%2011.99%205%209.5S7.01%205%209.5%205%2014%207.01%2014%209.5%2011.99%2014%209.5%2014z%22%2F%3E%3C%2Fsvg%3E");
  313. background-repeat: no-repeat;
  314. padding-left: 30px;
  315. background-position: 4px;
  316. }
  317. </style>
  318. </head>
  319. <body>
  320. <h1 class="name-header">Victor</h1>
  321. <div class="planning-container">
  322. <div class="daily-agenda">
  323. <div class="day-header">vendredi 09 septembre</div>
  324. <div>
  325. <div>
  326. <div class="agenda-creneau-header">
  327. <span class="agenda-creneau-time">14h00-17h00 </span>
  328. <span class="agenda-creneau-title">installation salle durante</span>
  329. </div>
  330. <div class="agenda-creneau-details"><div class="agenda-creneau-details--title">Description</div>
  331. <div class="agenda-creneau-details--content">Repérer les lieux. Installer les tables, la scène.Installer la cuisine. Mettre des fléchages pour poser les affaires et la signalétique. Brancher les tireuses, etc. Multi-tâche : on vous guidera ! </div>
  332. <div class="agenda-creneau-details--title">Liste des bénévoles avec toi</div>
  333. <div class="agenda-creneau-details--content">
  334. <div class="benevole">
  335. <svg
  336. class="icon"
  337. xmlns="http://www.w3.org/2000/svg"
  338. height="24px"
  339. viewBox="0 0 24 24"
  340. width="24px"
  341. fill="currentcolor"
  342. >
  343. <path d="M0 0h24v24H0z" fill="none" />
  344. <path
  345. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  346. />
  347. </svg>
  348. <span>Manuel : 06 12 80 61 34</span>
  349. </div>
  350. <div class="benevole">
  351. <svg
  352. class="icon"
  353. xmlns="http://www.w3.org/2000/svg"
  354. height="24px"
  355. viewBox="0 0 24 24"
  356. width="24px"
  357. fill="currentcolor"
  358. >
  359. <path d="M0 0h24v24H0z" fill="none" />
  360. <path
  361. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  362. />
  363. </svg>
  364. <span>Louise : 06 77 62 65 64</span>
  365. </div>
  366. <div class="benevole">
  367. <svg
  368. class="icon"
  369. xmlns="http://www.w3.org/2000/svg"
  370. height="24px"
  371. viewBox="0 0 24 24"
  372. width="24px"
  373. fill="currentcolor"
  374. >
  375. <path d="M0 0h24v24H0z" fill="none" />
  376. <path
  377. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  378. />
  379. </svg>
  380. <span>Marine : 06 32 99 84 98</span>
  381. </div>
  382. <div class="benevole">
  383. <svg
  384. class="icon"
  385. xmlns="http://www.w3.org/2000/svg"
  386. height="24px"
  387. viewBox="0 0 24 24"
  388. width="24px"
  389. fill="currentcolor"
  390. >
  391. <path d="M0 0h24v24H0z" fill="none" />
  392. <path
  393. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  394. />
  395. </svg>
  396. <span>Nils : 06 35 38 72 26</span>
  397. </div>
  398. <div class="benevole">
  399. <svg
  400. class="icon"
  401. xmlns="http://www.w3.org/2000/svg"
  402. height="24px"
  403. viewBox="0 0 24 24"
  404. width="24px"
  405. fill="currentcolor"
  406. >
  407. <path d="M0 0h24v24H0z" fill="none" />
  408. <path
  409. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  410. />
  411. </svg>
  412. <span>Stefan : 06 66 33 03 09</span>
  413. </div>
  414. </div>
  415. <div class="agenda-creneau-details--title">Le responsable</div>
  416. <div class="agenda-creneau-details--content">
  417. <div class="benevole">
  418. <svg
  419. class="icon"
  420. xmlns="http://www.w3.org/2000/svg"
  421. height="24px"
  422. viewBox="0 0 24 24"
  423. width="24px"
  424. fill="currentcolor"
  425. >
  426. <path d="M0 0h24v24H0z" fill="none" />
  427. <path
  428. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  429. />
  430. </svg>
  431. <span>Marine : 06 32 99 84 98
  432. Logistique Lorraine : 06 71 35 76 12</span>
  433. </div>
  434. </div>
  435. </div>
  436. </div>
  437. <div>
  438. <div class="agenda-creneau-header">
  439. <span class="agenda-creneau-time">00h00-01h00 </span>
  440. <span class="agenda-creneau-title">Bar Durante </span>
  441. </div>
  442. <div class="agenda-creneau-details"><div class="agenda-creneau-details--title">Description</div>
  443. <div class="agenda-creneau-details--content">Les gens sont en autonomie pour les bières mais votre créneau sera de changer les futs, nettoyer la zone du bar + gérer l&#39;alcool fort : ne pas ouvrir 1000 bouteilles en même temps, et servir le vin blanc et rosé qui sont au frais
  444. + passer la serpillère si bière renversée</div>
  445. <div class="agenda-creneau-details--title">Liste des bénévoles avec toi</div>
  446. <div class="agenda-creneau-details--content">
  447. <div class="benevole">
  448. <svg
  449. class="icon"
  450. xmlns="http://www.w3.org/2000/svg"
  451. height="24px"
  452. viewBox="0 0 24 24"
  453. width="24px"
  454. fill="currentcolor"
  455. >
  456. <path d="M0 0h24v24H0z" fill="none" />
  457. <path
  458. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  459. />
  460. </svg>
  461. <span>Sarah : 06 89 32 01 39</span>
  462. </div>
  463. </div>
  464. <div class="agenda-creneau-details--title">Le responsable</div>
  465. <div class="agenda-creneau-details--content">
  466. <div class="benevole">
  467. <svg
  468. class="icon"
  469. xmlns="http://www.w3.org/2000/svg"
  470. height="24px"
  471. viewBox="0 0 24 24"
  472. width="24px"
  473. fill="currentcolor"
  474. >
  475. <path d="M0 0h24v24H0z" fill="none" />
  476. <path
  477. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  478. />
  479. </svg>
  480. <span>Stef : 06 66 33 03 09</span>
  481. </div>
  482. </div>
  483. <div class="agenda-creneau-details--title">Ceux que tu remplaces</div>
  484. <div class="agenda-creneau-details--content">
  485. <div class="benevole">
  486. <svg
  487. class="icon"
  488. xmlns="http://www.w3.org/2000/svg"
  489. height="24px"
  490. viewBox="0 0 24 24"
  491. width="24px"
  492. fill="currentcolor"
  493. >
  494. <path d="M0 0h24v24H0z" fill="none" />
  495. <path
  496. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  497. />
  498. </svg>
  499. <span>Cédric : 06 85 75 55 08</span>
  500. </div>
  501. <div class="benevole">
  502. <svg
  503. class="icon"
  504. xmlns="http://www.w3.org/2000/svg"
  505. height="24px"
  506. viewBox="0 0 24 24"
  507. width="24px"
  508. fill="currentcolor"
  509. >
  510. <path d="M0 0h24v24H0z" fill="none" />
  511. <path
  512. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  513. />
  514. </svg>
  515. <span>Nicholas : 07 77 82 44 89</span>
  516. </div>
  517. </div>
  518. <div class="agenda-creneau-details--title">Les personnes qui arrivent après toi</div>
  519. <div class="agenda-creneau-details--content">
  520. <div class="benevole">
  521. <svg
  522. class="icon"
  523. xmlns="http://www.w3.org/2000/svg"
  524. height="24px"
  525. viewBox="0 0 24 24"
  526. width="24px"
  527. fill="currentcolor"
  528. >
  529. <path d="M0 0h24v24H0z" fill="none" />
  530. <path
  531. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  532. />
  533. </svg>
  534. <span>Nadège : 06 78 64 72 56</span>
  535. </div>
  536. <div class="benevole">
  537. <svg
  538. class="icon"
  539. xmlns="http://www.w3.org/2000/svg"
  540. height="24px"
  541. viewBox="0 0 24 24"
  542. width="24px"
  543. fill="currentcolor"
  544. >
  545. <path d="M0 0h24v24H0z" fill="none" />
  546. <path
  547. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  548. />
  549. </svg>
  550. <span>Nils : 06 35 38 72 26</span>
  551. </div>
  552. </div>
  553. </div>
  554. </div>
  555. </div>
  556. </div>
  557. <div class="daily-agenda">
  558. <div class="day-header">samedi 10 septembre</div>
  559. <div>
  560. <div>
  561. <div class="agenda-creneau-header">
  562. <span class="agenda-creneau-time">21h00-22h00 </span>
  563. <span class="agenda-creneau-title">Sécu/ronde JdP </span>
  564. </div>
  565. <div class="agenda-creneau-details"><div class="agenda-creneau-details--title">Description</div>
  566. <div class="agenda-creneau-details--content">Balade dans la jardin pour s&#39;assurer que tout va bien.</div>
  567. <div class="agenda-creneau-details--title">Liste des bénévoles avec toi</div>
  568. <div class="agenda-creneau-details--content">
  569. <div class="benevole">
  570. <svg
  571. class="icon"
  572. xmlns="http://www.w3.org/2000/svg"
  573. height="24px"
  574. viewBox="0 0 24 24"
  575. width="24px"
  576. fill="currentcolor"
  577. >
  578. <path d="M0 0h24v24H0z" fill="none" />
  579. <path
  580. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  581. />
  582. </svg>
  583. <span>Anne Croute : 06 33 02 77 18</span>
  584. </div>
  585. </div>
  586. <div class="agenda-creneau-details--title">Le responsable</div>
  587. <div class="agenda-creneau-details--content">
  588. <div class="benevole">
  589. <svg
  590. class="icon"
  591. xmlns="http://www.w3.org/2000/svg"
  592. height="24px"
  593. viewBox="0 0 24 24"
  594. width="24px"
  595. fill="currentcolor"
  596. >
  597. <path d="M0 0h24v24H0z" fill="none" />
  598. <path
  599. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  600. />
  601. </svg>
  602. <span>Clovis 06 68 79 86 73</span>
  603. </div>
  604. </div>
  605. <div class="agenda-creneau-details--title">Ceux que tu remplaces</div>
  606. <div class="agenda-creneau-details--content">
  607. <div class="benevole">
  608. <svg
  609. class="icon"
  610. xmlns="http://www.w3.org/2000/svg"
  611. height="24px"
  612. viewBox="0 0 24 24"
  613. width="24px"
  614. fill="currentcolor"
  615. >
  616. <path d="M0 0h24v24H0z" fill="none" />
  617. <path
  618. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  619. />
  620. </svg>
  621. <span>Silvia : 06 98 09 84 36</span>
  622. </div>
  623. <div class="benevole">
  624. <svg
  625. class="icon"
  626. xmlns="http://www.w3.org/2000/svg"
  627. height="24px"
  628. viewBox="0 0 24 24"
  629. width="24px"
  630. fill="currentcolor"
  631. >
  632. <path d="M0 0h24v24H0z" fill="none" />
  633. <path
  634. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  635. />
  636. </svg>
  637. <span>Olga : 06 49 44 08 43</span>
  638. </div>
  639. </div>
  640. <div class="agenda-creneau-details--title">Les personnes qui arrivent après toi</div>
  641. <div class="agenda-creneau-details--content">
  642. <div class="benevole">
  643. <svg
  644. class="icon"
  645. xmlns="http://www.w3.org/2000/svg"
  646. height="24px"
  647. viewBox="0 0 24 24"
  648. width="24px"
  649. fill="currentcolor"
  650. >
  651. <path d="M0 0h24v24H0z" fill="none" />
  652. <path
  653. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  654. />
  655. </svg>
  656. <span>Stephane : 06 11 89 31 83</span>
  657. </div>
  658. <div class="benevole">
  659. <svg
  660. class="icon"
  661. xmlns="http://www.w3.org/2000/svg"
  662. height="24px"
  663. viewBox="0 0 24 24"
  664. width="24px"
  665. fill="currentcolor"
  666. >
  667. <path d="M0 0h24v24H0z" fill="none" />
  668. <path
  669. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  670. />
  671. </svg>
  672. <span>PierreQ : 06 70 43 76 31</span>
  673. </div>
  674. </div>
  675. </div>
  676. </div>
  677. <div>
  678. <div class="agenda-creneau-header">
  679. <span class="agenda-creneau-time">22h30-00h30 </span>
  680. <span class="agenda-creneau-title">Rangement catering / chanrgement camion tables et chaises</span>
  681. </div>
  682. <div class="agenda-creneau-details"><div class="agenda-creneau-details--title">Description</div>
  683. <div class="agenda-creneau-details--content">Ranger / nettoyer. Tout doit disparaitre et être remis dans les camions</div>
  684. <div class="agenda-creneau-details--title">Liste des bénévoles avec toi</div>
  685. <div class="agenda-creneau-details--content">
  686. <div class="benevole">
  687. <svg
  688. class="icon"
  689. xmlns="http://www.w3.org/2000/svg"
  690. height="24px"
  691. viewBox="0 0 24 24"
  692. width="24px"
  693. fill="currentcolor"
  694. >
  695. <path d="M0 0h24v24H0z" fill="none" />
  696. <path
  697. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  698. />
  699. </svg>
  700. <span>Cédric : 06 85 75 55 08</span>
  701. </div>
  702. <div class="benevole">
  703. <svg
  704. class="icon"
  705. xmlns="http://www.w3.org/2000/svg"
  706. height="24px"
  707. viewBox="0 0 24 24"
  708. width="24px"
  709. fill="currentcolor"
  710. >
  711. <path d="M0 0h24v24H0z" fill="none" />
  712. <path
  713. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  714. />
  715. </svg>
  716. <span>Armand TB : 06 46 24 64 37</span>
  717. </div>
  718. <div class="benevole">
  719. <svg
  720. class="icon"
  721. xmlns="http://www.w3.org/2000/svg"
  722. height="24px"
  723. viewBox="0 0 24 24"
  724. width="24px"
  725. fill="currentcolor"
  726. >
  727. <path d="M0 0h24v24H0z" fill="none" />
  728. <path
  729. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  730. />
  731. </svg>
  732. <span>Océane : 07 81 36 48 86</span>
  733. </div>
  734. <div class="benevole">
  735. <svg
  736. class="icon"
  737. xmlns="http://www.w3.org/2000/svg"
  738. height="24px"
  739. viewBox="0 0 24 24"
  740. width="24px"
  741. fill="currentcolor"
  742. >
  743. <path d="M0 0h24v24H0z" fill="none" />
  744. <path
  745. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  746. />
  747. </svg>
  748. <span>Sophie : 06 16 48 88 23</span>
  749. </div>
  750. <div class="benevole">
  751. <svg
  752. class="icon"
  753. xmlns="http://www.w3.org/2000/svg"
  754. height="24px"
  755. viewBox="0 0 24 24"
  756. width="24px"
  757. fill="currentcolor"
  758. >
  759. <path d="M0 0h24v24H0z" fill="none" />
  760. <path
  761. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  762. />
  763. </svg>
  764. <span>Bertrand : 07 88 61 03 28</span>
  765. </div>
  766. </div>
  767. <div class="agenda-creneau-details--title">Le responsable</div>
  768. <div class="agenda-creneau-details--content">
  769. <div class="benevole">
  770. <svg
  771. class="icon"
  772. xmlns="http://www.w3.org/2000/svg"
  773. height="24px"
  774. viewBox="0 0 24 24"
  775. width="24px"
  776. fill="currentcolor"
  777. >
  778. <path d="M0 0h24v24H0z" fill="none" />
  779. <path
  780. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  781. />
  782. </svg>
  783. <span>Alexis : 06 79 99 31 24
  784. Olivier : 06 82 50 92 85
  785. Camion : Lorraine : 06 71 35 76 12</span>
  786. </div>
  787. </div>
  788. </div>
  789. </div>
  790. </div>
  791. </div>
  792. <div class="daily-agenda">
  793. <div class="day-header">dimanche 11 septembre</div>
  794. <div>
  795. <div>
  796. <div class="agenda-creneau-header">
  797. <span class="agenda-creneau-time">08h00-09h00 </span>
  798. <span class="agenda-creneau-title">Finir nettoyage Durante</span>
  799. </div>
  800. <div class="agenda-creneau-details"><div class="agenda-creneau-details--title">Description</div>
  801. <div class="agenda-creneau-details--content">L&#39;équipe du soir a normalement tout rangé et commencé le gros du nettoyage. Repasser un coup de balai et de serpillère pour que tout soit propre pour le petit dej. Faire un tour au toilettes / cleaner et mettre du PQ.</div>
  802. <div class="agenda-creneau-details--title">Liste des bénévoles avec toi</div>
  803. <div class="agenda-creneau-details--content">
  804. <div class="benevole">
  805. <svg
  806. class="icon"
  807. xmlns="http://www.w3.org/2000/svg"
  808. height="24px"
  809. viewBox="0 0 24 24"
  810. width="24px"
  811. fill="currentcolor"
  812. >
  813. <path d="M0 0h24v24H0z" fill="none" />
  814. <path
  815. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  816. />
  817. </svg>
  818. <span>Elise : 06 33 49 97 84</span>
  819. </div>
  820. </div>
  821. <div class="agenda-creneau-details--title">Le responsable</div>
  822. <div class="agenda-creneau-details--content">
  823. <div class="benevole">
  824. <svg
  825. class="icon"
  826. xmlns="http://www.w3.org/2000/svg"
  827. height="24px"
  828. viewBox="0 0 24 24"
  829. width="24px"
  830. fill="currentcolor"
  831. >
  832. <path d="M0 0h24v24H0z" fill="none" />
  833. <path
  834. d="M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z"
  835. />
  836. </svg>
  837. <span>Sylvain : 06 72 29 46 90</span>
  838. </div>
  839. </div>
  840. </div>
  841. </div>
  842. </div>
  843. </div>
  844. </div>
  845. </body>
  846. </html>