Heavily customized version of smokesignal - https://whtwnd.com/kayrozen.com/3lpwe4ymowg2t
at main 36 kB view raw
1 2<section class="section"> 3 <div class="container"> 4 {% if is_legacy_event %} 5 <article class="message is-warning"> 6 <div class="message-body"> 7 <span class="icon-text"> 8 <span class="icon"> 9 <i class="fas fa-exclamation-triangle"></i> 10 </span> 11 <span>{{ t("legacy-event-warning") }}</span> 12 {% if standard_event_exists %} 13 <span class="ml-3"> 14 <a href="{{ base }}{{ standard_event_url }}" class="button is-small is-primary"> 15 <span class="icon"> 16 <i class="fas fa-calendar-alt"></i> 17 </span> 18 <span>{{ t("view-latest") }}</span> 19 </a> 20 </span> 21 {% endif %} 22 {% if can_edit and not standard_event_exists %} 23 <span class="ml-3"> 24 <a href="{{ base }}/{{ handle_slug }}/{{ event_rkey }}/migrate" class="button is-small is-info"> 25 <span class="icon"> 26 <i class="fas fa-arrows-up-to-line"></i> 27 </span> 28 <span>{{ t("migrate-event") }}</span> 29 </a> 30 </span> 31 {% endif %} 32 </span> 33 </div> 34 </article> 35 {% elif using_fallback_collection %} 36 <article class="message is-info"> 37 <div class="message-body"> 38 <span class="icon-text"> 39 <span class="icon"> 40 <i class="fas fa-info-circle"></i> 41 </span> 42 <span>{{ t("fallback-collection-info", collection=fallback_collection) }}</span> 43 </span> 44 </div> 45 </article> 46 {% endif %} 47 48 <!-- Header avec image de couverture --> 49 <div class="box p-0 mb-4" style="overflow: hidden; border-radius: 12px;"> 50 <!-- Image de couverture avec hero layout --> 51 <section class="hero is-small custom-hero"> 52 <img src="https://picsum.photos/1600/400?random={{ event.rkey }}&blur=2&grayscale" alt="{{ event.name }} Background" class="hero-background"> 53 <div class="hero-overlay"></div> 54 <div class="hero-body is-flex is-flex-direction-column is-justify-content-flex-end is-align-items-flex-start"> 55 <h1 class="title is-3 hero-gradient-title mb-4" >{{ event.name }}</h1> 56 <p class="subtitle is-6 has-text-white-ter icon-text"> 57 <span class="icon"> 58 <i class="fas fa-calendar-alt"></i> 59 </span> 60 {% if event.starts_at_human %} 61 <span> 62 <time class="dt-start" {% if event.starts_at_machine %} datetime="{{ event.starts_at_machine }}" {% endif %}> 63 {{- event.starts_at_human -}} 64 </time> 65 {% if event.ends_at_human %} 66 - <time class="dt-end" {% if event.ends_at_machine %} datetime="{{ event.ends_at_machine }}" {% endif %}> 67 {{- event.ends_at_human -}} 68 </time> 69 {% endif %} 70 </span> 71 {% else %} 72 <span>{{ t("no-start-time-set") }}</span> 73 {% endif %} 74 </p> 75 {% if can_edit %} 76 <a href="{{ base }}/{{ handle_slug }}/{{ event_rkey }}/edit" class="button is-medium is-outlined is-primary ml-2"> 77 <span class="icon"> 78 <i class="fas fa-edit"></i> 79 </span> 80 <span>{{ t("button-edit") }}</span> 81 </a> 82 {% endif %} 83 </div> 84 </section> 85 86 <!-- Badges de statut en overlay --> 87 <div style="position: absolute; top: 16px; left: 16px;"> 88 {% if event.status == "planned" %} 89 <span class="tag is-light is-medium"> 90 <span class="icon"> 91 <i class="fas fa-calendar-days"></i> 92 </span> 93 <span>{{ t("status-planned") }}</span> 94 </span> 95 {% elif event.status == "rescheduled" %} 96 <span class="tag is-warning is-medium"> 97 <span class="icon"> 98 <i class="fas fa-calendar-plus"></i> 99 </span> 100 <span>{{ t("status-rescheduled") }}</span> 101 </span> 102 {% elif event.status == "scheduled" %} 103 <span class="tag is-info is-medium"> 104 <span class="icon"> 105 <i class="fas fa-calendar-check"></i> 106 </span> 107 <span>{{ t("status-scheduled") }}</span> 108 </span> 109 {% elif event.status == "cancelled" %} 110 <span class="tag is-danger is-medium"> 111 <span class="icon"> 112 <i class="fas fa-calendar-xmark"></i> 113 </span> 114 <span>{{ t("status-cancelled") }}</span> 115 </span> 116 {% elif event.status == "postponed" %} 117 <span class="tag is-warning is-medium"> 118 <span class="icon"> 119 <i class="fas fa-calendar-minus"></i> 120 </span> 121 <span>{{ t("status-postponed") }}</span> 122 </span> 123 {% endif %} 124 </div> 125 </div> 126 127 <!-- Actions RSVP (déplacé ici pour être pleine largeur) --> 128 {% if is_legacy_event %} 129 <article class="message is-info"> 130 <div class="message-body"> 131 <span class="icon-text"> 132 <span class="icon"> 133 <i class="fas fa-info-circle"></i> 134 </span> 135 <span>{{ t("legacy-rsvp-unavailable") }}</span> 136 {% if standard_event_exists %} 137 <span>{{ t("legacy-use-standard", url=base+standard_event_url) }}</span> 138 {% if user_rsvp_status and not user_has_standard_rsvp %} 139 <div class="mt-2"> 140 <a href="{{ base }}/{{ handle_slug }}/{{ event_rkey }}/migrate-rsvp" 141 class="button is-small is-info"> 142 <span class="icon"> 143 <i class="fas fa-sync-alt"></i> 144 </span> 145 <span>{{ t("migrate-rsvp") }}</span> 146 </a> 147 </div> 148 {% elif user_rsvp_status and user_has_standard_rsvp %} 149 <div class="mt-2"> 150 <span class="tag is-success"> 151 <span class="icon"> 152 <i class="fas fa-check"></i> 153 </span> 154 <span>{{ t("legacy-rsvp-migrated") }}</span> 155 </span> 156 </div> 157 {% endif %} 158 {% endif %} 159 </span> 160 </div> 161 </article> 162 {% elif not current_handle %} 163 <article class="message is-success"> 164 <div class="message-body"> 165 {{ t("login-to-rsvp", url="/login") }} 166 </div> 167 </article> 168 {% else %} 169 {% if not user_rsvp_status %} 170 <article class="message" id="rsvpFrame"> 171 <div class="message-body"> 172 <div class="columns is-vcentered is-multiline"> 173 <div class="column"> 174 <p>{{ t("rsvp-not-rsvpd") }}</p> 175 </div> 176 <div class="column"> 177 <button class="button is-success is-fullwidth" hx-post="/rsvp" hx-target="#rsvpFrame" 178 hx-swap="outerHTML" 179 hx-vals='{"subject_aturi": "{{ event.aturi }}", "build_state": "Review", "status": "going"}'> 180 <span class="icon"> 181 <i class="fas fa-star"></i> 182 </span> 183 <span>{{ t("rsvp-going") }}</span> 184 </button> 185 </div> 186 <div class="column"> 187 <button class="button is-link is-fullwidth" hx-post="/rsvp" hx-target="#rsvpFrame" 188 hx-swap="outerHTML" 189 hx-vals='{"subject_aturi": "{{ event.aturi }}", "build_state": "Review", "status": "interested"}'> 190 <span class="icon"> 191 <i class="fas fa-eye"></i> 192 </span> 193 <span>{{ t("rsvp-interested") }}</span> 194 </button> 195 </div> 196 <div class="column"> 197 <button class="button is-warning is-fullwidth" hx-post="/rsvp" hx-target="#rsvpFrame" 198 hx-swap="outerHTML" 199 hx-vals='{"subject_aturi": "{{ event.aturi }}", "build_state": "Review", "status": "notgoing"}'> 200 <span class="icon"> 201 <i class="fas fa-ban"></i> 202 </span> 203 <span>{{ t("rsvp-not-going") }}</span> 204 </button> 205 </div> 206 </div> 207 </div> 208 </article> 209 {% elif user_rsvp_status == "going" %} 210 <article class="message is-info" id="rsvpFrame"> 211 <div class="message-body"> 212 <div class="columns is-vcentered is-multiline"> 213 <div class="column"> 214 <p>{{ t("rsvp-going-msg") }}</p> 215 </div> 216 <div class="column"> 217 <button class="button is-link is-fullwidth" hx-post="/rsvp" hx-target="#rsvpFrame" 218 hx-swap="outerHTML" 219 hx-vals='{"subject_aturi": "{{ event.aturi }}", "build_state": "Review", "status": "interested"}'> 220 <span class="icon"> 221 <i class="fas fa-eye"></i> 222 </span> 223 <span>{{ t("rsvp-interested") }}</span> 224 </button> 225 </div> 226 <div class="column"> 227 <button class="button is-warning is-fullwidth" hx-post="/rsvp" hx-target="#rsvpFrame" 228 hx-swap="outerHTML" 229 hx-vals='{"subject_aturi": "{{ event.aturi }}", "build_state": "Review", "status": "notgoing"}'> 230 <span class="icon"> 231 <i class="fas fa-ban"></i> 232 </span> 233 <span>{{ t("rsvp-not-going") }}</span> 234 </button> 235 </div> 236 </div> 237 </div> 238 </article> 239 {% elif user_rsvp_status == "interested" %} 240 <article class="message is-info" id="rsvpFrame"> 241 <div class="message-body"> 242 <div class="columns is-vcentered is-multiline"> 243 <div class="column"> 244 <p>{{ t("rsvp-interested-msg") }}</p> 245 </div> 246 <div class="column"> 247 <button class="button is-success is-fullwidth" hx-post="/rsvp" hx-target="#rsvpFrame" 248 hx-swap="outerHTML" 249 hx-vals='{"subject_aturi": "{{ event.aturi }}", "build_state": "Review", "status": "going"}'> 250 <span class="icon"> 251 <i class="fas fa-star"></i> 252 </span> 253 <span>{{ t("rsvp-going") }}</span> 254 </button> 255 </div> 256 <div class="column"> 257 <button class="button is-warning is-fullwidth" hx-post="/rsvp" hx-target="#rsvpFrame" 258 hx-swap="outerHTML" 259 hx-vals='{"subject_aturi": "{{ event.aturi }}", "build_state": "Review", "status": "notgoing"}'> 260 <span class="icon"> 261 <i class="fas fa-ban"></i> 262 </span> 263 <span>{{ t("rsvp-not-going") }}</span> 264 </button> 265 </div> 266 </div> 267 </div> 268 </article> 269 {% elif user_rsvp_status == "notgoing" %} 270 <article class="message is-warning" id="rsvpFrame"> 271 <div class="message-body"> 272 <div class="columns is-vcentered is-multiline"> 273 <div class="column"> 274 <p>{{ t("rsvp-not-going-msg") }}</p> 275 </div> 276 <div class="column"> 277 <button class="button is-success is-fullwidth" hx-post="/rsvp" hx-target="#rsvpFrame" 278 hx-swap="outerHTML" 279 hx-vals='{"subject_aturi": "{{ event.aturi }}", "build_state": "Review", "status": "going"}'> 280 <span class="icon"> 281 <i class="fas fa-star"></i> 282 </span> 283 <span>{{ t("rsvp-going") }}</span> 284 </button> 285 </div> 286 <div class="column"> 287 <button class="button is-link is-fullwidth" hx-post="/rsvp" hx-target="#rsvpFrame" 288 hx-swap="outerHTML" 289 hx-vals='{"subject_aturi": "{{ event.aturi }}", "build_state": "Review", "status": "interested"}'> 290 <span class="icon"> 291 <i class="fas fa-eye"></i> 292 </span> 293 <span>{{ t("rsvp-interested") }}</span> 294 </button> 295 </div> 296 </div> 297 </div> 298 </article> 299 {% endif %} 300 {% endif %} 301 302 <!-- Section marque-pages --> 303 {% if current_handle and not is_legacy_event %} 304 <div class="columns is-vcentered"> 305 <div class="column"> 306 <div id="bookmarkFrame"> 307 {% if user_bookmark_status %} 308 <article class="message is-info"> 309 <div class="message-body"> 310 <div class="columns is-vcentered"> 311 <div class="column"> 312 <span class="icon-text"> 313 <span class="icon"> 314 <i class="fas fa-bookmark"></i> 315 </span> 316 <span>Marqué{% if user_bookmark_tags %} avec étiquettes: {{ user_bookmark_tags | join(", ") }}{% endif %}</span> 317 </span> 318 </div> 319 <div class="column is-narrow"> 320 <button class="button is-outlined is-danger is-small" 321 hx-delete="/bookmarks/{{ user_bookmark_aturi | urlencode }}" 322 hx-target="#bookmarkFrame" 323 hx-swap="outerHTML" 324 hx-confirm="Êtes-vous sûr·e de vouloir retirer ce marque-page?"> 325 <span class="icon"> 326 <i class="fas fa-times"></i> 327 </span> 328 <span>Retirer le marque-page</span> 329 </button> 330 </div> 331 </div> 332 </div> 333 </article> 334 {% else %} 335 <article class="message is-light"> 336 <div class="message-body"> 337 <div class="columns is-vcentered"> 338 <div class="column"> 339 <span class="icon-text"> 340 <span class="icon"> 341 <i class="far fa-bookmark"></i> 342 </span> 343 <span>Marquez cet événement pour l'ajouter à votre calendrier personnel</span> 344 </span> 345 </div> 346 <div class="column is-narrow"> 347 <button class="button is-primary is-small" 348 hx-get="/bookmarks/modal?event_aturi={{ event.aturi | urlencode }}" 349 hx-target="#bookmarkModal" 350 hx-swap="innerHTML" 351 onclick="document.getElementById('bookmarkModal').classList.add('is-active')"> 352 <span class="icon"> 353 <i class="fas fa-bookmark"></i> 354 </span> 355 <span>Marquer l'événement</span> 356 </button> 357 </div> 358 </div> 359 </div> 360 </article> 361 {% endif %} 362 </div> 363 </div> 364 </div> 365 {% endif %} 366 <!-- Fin section marque-pages --> 367 368 <!-- Layout principal: 2 colonnes --> 369 <div class="columns is-desktop"> 370 <!-- Colonne principale (gauche) --> 371 <div class="column is-8"> 372 <!-- Statistiques (déplacé avant RSVP) --> 373 {% if not is_legacy_event %} 374 <div class="box mb-4"> 375 <div class="level"> 376 <div class="level-item has-text-centered"> 377 <div> 378 <p class="heading"> 379 <span class="icon"> 380 <i class="fas fa-star"></i> 381 </span> 382 <span>{{ t("rsvp-status-going") }}</span> 383 </p> 384 <p class="title is-4 has-text-success">{{ event.count_going | default("0") }}</p> 385 </div> 386 </div> 387 <div class="level-item has-text-centered"> 388 <div> 389 <p class="heading"> 390 <span class="icon"> 391 <i class="fas fa-eye"></i> 392 </span> 393 <span>{{ t("rsvp-status-interested") }}</span> 394 </p> 395 <p class="title is-4 has-text-info">{{ event.count_interested | default("0") }}</p> 396 </div> 397 </div> 398 <div class="level-item has-text-centered"> 399 <div> 400 <p class="heading"> 401 <span class="icon"> 402 <i class="fas fa-ban"></i> 403 </span> 404 <span>{{ t("rsvp-status-not-going") }}</span> 405 </p> 406 <p class="title is-4 has-text-warning">{{ event.count_not_going | default("0") }}</p> 407 </div> 408 </div> 409 </div> 410 </div> 411 {% else %} 412 <div class="box mb-4"> 413 <div class="notification is-light"> 414 <p class="has-text-centered"> 415 {{ t("legacy-rsvp-unavailable") }} 416 {% if standard_event_exists %} 417 <br><a href="{{ base }}{{ standard_event_url }}" class="button is-small is-primary mt-2"> 418 <span class="icon"> 419 <i class="fas fa-calendar-alt"></i> 420 </span> 421 <span>{{ t("view-latest") }}</span> 422 </a> 423 {% endif %} 424 </p> 425 </div> 426 </div> 427 {% endif %} 428 429 <!-- Détails de l'événement --> 430 <div class="box mb-4"> 431 <h3 class="title is-5 mb-4">{{ t("event-description") }}</h3> 432 433 <!-- Date et heure --> 434 <div class="media mb-4"> 435 <div class="media-left"> 436 <span class="icon"> 437 <i class="fas fa-clock"></i> 438 </span> 439 </div> 440 <div class="media-content"> 441 <p> 442 {% if event.starts_at_human %} 443 {{ t("starts-at", time=event.starts_at_human) }} 444 {% if event.ends_at_human %} 445 <br> 446 {{ t("ends-at", time=event.ends_at_human) }} 447 {% endif %} 448 {% else %} 449 {{ t("no-start-time-set") }} 450 {% endif %} 451 </p> 452 </div> 453 </div> 454 455 <!-- Type d'événement --> 456 <div class="media mb-4"> 457 <div class="media-left"> 458 {% if event.mode == "inperson" %} 459 <span class="icon"> 460 <i class="fas fa-users"></i> 461 </span> 462 {% elif event.mode == "virtual" %} 463 <span class="icon"> 464 <i class="fas fa-globe"></i> 465 </span> 466 {% elif event.mode == "hybrid" %} 467 <span class="icon"> 468 <i class="fas fa-user-plus"></i> 469 </span> 470 {% endif %} 471 </div> 472 <div class="media-content"> 473 <p> 474 {% if event.mode == "inperson" %} 475 {{ t("mode-in-person") }} 476 {% elif event.mode == "virtual" %} 477 {{ t("mode-virtual") }} 478 {% elif event.mode == "hybrid" %} 479 {{ t("mode-hybrid") }} 480 {% endif %} 481 </p> 482 </div> 483 </div> 484 485 <!-- Liens --> 486 {% if event.links %} 487 <div class="media mb-4"> 488 <div class="media-left"> 489 <span class="icon"> 490 <i class="fas fa-link"></i> 491 </span> 492 </div> 493 <div class="media-content"> 494 <p class="is-size-7 has-text-grey">{{ t("placeholder-tickets") }}</p> 495 {% for (link, link_label) in event.links %} 496 <p class="mb-2"> 497 <a href="{{ link }}" rel="nofollow" target="blank"> 498 {{ link_label if link_label else link }} 499 </a> 500 </p> 501 {% endfor %} 502 </div> 503 </div> 504 {% endif %} 505 506 <!-- Description --> 507 <div class="media mb-4"> 508 <div class="media-content"> 509 <div class="content" style="word-break: break-word; white-space: pre-wrap;"> 510 {%- autoescape false -%} 511 {{- event.description -}} 512 {%- endautoescape -%} 513 </div> 514 </div> 515 </div> 516 </div> 517 <!-- Organisateur --> 518 <div class="box mb-4"> 519 <h2 class="title is-5 mb-4">{{ t("role-organizer") }}</h2> 520 521 <div class="has-text-centered"> 522 <div class="is-inline-flex is-align-items-center is-justify-content-center mb-4" 523 style="width: 120px; height: 120px; background: linear-gradient(45deg, #00d1b2, #3273dc); border-radius: 50%;"> 524 <span class="has-text-white is-size-1 has-text-weight-bold"> 525 {{ event.organizer_display_name[0] | upper }} 526 </span> 527 </div> 528 529 <h3 class="title is-4 has-text-white mb-3">{{ event.organizer_display_name }}</h3> 530 531 <div class="content mb-4"> 532 <p class="is-size-7 has-text-grey-light mb-2">{{ t("display-name") }}</p> 533 <a href="{{ base }}/{{ event.organizer_did }}" class="has-text-info"> 534 @{{ event.organizer_display_name }} 535 </a> 536 </div> 537 538 <a href="{{ base }}/{{ event.organizer_did }}" class="button is-dark is-fullwidth"> 539 <span class="icon is-small"> 540 <i class="fas fa-user"></i> 541 </span> 542 <span>{{ t("view") }} {{ t("profile") }}</span> 543 </a> 544 </div> 545 546 </div> 547 </div> 548 549 <!-- Sidebar (droite) --> 550 <div class="column is-4"> 551 <!-- Partage et calendrier --> 552 <div class="box mb-4"> 553 <h4 class="title is-6 mb-3">{{ t("button-download-ical") }}</h4> 554 <div class="buttons are-small is-flex is-justify-content-center mb-3"> 555 <a class="button" href="//bsky.app/intent/compose?text={{ event.name | urlencode }}&url={{ base }}/{{ handle_slug }}/{{ event_rkey }}" rel="nofollow" target="_blank"> 556 <span class="icon"> 557 <i class="fab fa-bluesky"></i> 558 </span> 559 560 </a> 561 <a class="button" href="//www.threads.net/intent/post?text={{ event.name }}&url={{ base }}/{{ handle_slug }}/{{ event_rkey }}" rel="nofollow" target="_blank"> 562 <span class="icon"> 563 <i class="fab fa-threads"></i> 564 </span> 565 566 </a> 567 <a class="button" href="//www.facebook.com/sharer/sharer.php?u={{ base }}/{{ handle_slug }}/{{ event_rkey }}" rel="nofollow" target="_blank"> 568 <span class="icon"> 569 <i class="fab fa-facebook"></i> 570 </span> 571 572 </a> 573 574 <a class="button" href="//www.reddit.com/submit?url={{ base }}/{{ handle_slug }}/{{ event_rkey }}&title={{ event.name }}" rel="nofollow" target="_blank"> 575 <span class="icon"> 576 <i class="fab fa-reddit"></i> 577 </span> 578 </a> 579 580 <a class="button" href="mailto:?subject={{ event.name | urlencode }}&body=Je%20voulais%20partager%20cet%20événement%20avec%20toi%20:%20{{ event.name | urlencode }}%0A%0ADate%20:%20{{ event.starts_at_human | urlencode }}%0ALien%20:%20{{ base }}/{{ handle_slug }}/{{ event_rkey }}" rel="nofollow"> 581 <span class="icon"> 582 <i class="fas fa-envelope"></i> 583 </span> 584 585 </a> 586 </div> 587 <a href="{{ base }}/{{ handle_slug }}/{{ event_rkey }}/ical" 588 class="button is-outlined is-info is-fullwidth" 589 download="{{ event.name }}.ics"> 590 <span class="icon"> 591 <i class="fas fa-calendar-plus"></i> 592 </span> 593 <span>{{ t("button-download-ical") }}</span> 594 </a> 595 </div> 596 597 <!-- Carte / Lieu --> 598 {% if event.address_display %} 599 <div class="box mb-4"> 600 <div class="event-map-container mt-3 mb-3"> 601 <div id="event-location-map" 602 data-address="{{ event.address_display }}" 603 {% if event.coordinates_lat and event.coordinates_lng %} 604 data-lat="{{ event.coordinates_lat }}" 605 data-lng="{{ event.coordinates_lng }}" 606 {% endif %}></div> 607 <div id="event-map-loading" class="loading-overlay"> 608 <div class="has-text-centered"> 609 <div class="loader"></div> 610 <p class="mt-2">Chargement de la carte...</p> 611 </div> 612 </div> 613 <div id="event-map-error" class="is-hidden has-text-danger has-text-centered p-4"> 614 <!-- Error message will be displayed here --> 615 </div> 616 </div> 617 <p class="mb-3">{{ event.address_display }}</p> 618 <div class="buttons are-small"> 619 <a class="button is-fullwidth" href="//maps.apple.com/?q={{ event.address_display | urlencode }}" rel="nofollow" target="_blank"> 620 <span class="icon"> 621 <i class="fab fa-apple"></i> 622 </span> 623 <span>{{ t("apple-maps") }}</span> 624 </a> 625 <a class="button is-fullwidth" href="//maps.google.com/?q={{ event.address_display | urlencode }}" rel="nofollow" target="_blank"> 626 <span class="icon"> 627 <i class="fab fa-google"></i> 628 </span> 629 <span>{{ t("google-maps") }}</span> 630 </a> 631 </div> 632 </div> 633 {% elif event.mode == "inperson" or event.mode == "hybrid" %} 634 <div class="box mb-4"> 635 <h4 class="title is-6 mb-3">{{ t("location") }}</h4> 636 <p class="has-text-grey">{{ t("no-location-info") }}</p> 637 </div> 638 {% endif %} 639 640 <!-- Participants --> 641 {% if not is_legacy_event %} 642 <div class="box"> 643 <h4 class="title is-6 mb-3">{{ t("rsvp-status-going") }}</h4> 644 <div class="tabs is-small"> 645 <ul> 646 <li {% if active_tab=="going" %}class="is-active" {% endif %}> 647 <a href="?tab=going&collection={{ fallback_collection if using_fallback_collection else collection }}" 648 rel="nofollow"> 649 {{ t("going-count", count=event.count_going | default("0")) }} 650 </a> 651 </li> 652 <li {% if active_tab=="interested" %}class="is-active" {% endif %}> 653 <a href="?tab=interested&collection={{ fallback_collection if using_fallback_collection else collection }}" 654 rel="nofollow"> 655 {{ t("interested-count", count=event.count_interested | default("0")) }} 656 </a> 657 </li> 658 <li {% if active_tab=="notgoing" %}class="is-active" {% endif %}> 659 <a href="?tab=notgoing&collection={{ fallback_collection if using_fallback_collection else collection }}" 660 rel="nofollow"> 661 {{ t("not-going-count", count=event.count_not_going | default("0")) }} 662 </a> 663 </li> 664 </ul> 665 </div> 666 <div class="grid is-col-min-12 has-text-centered"> 667 {% if active_tab == "going" %} 668 {% for handle in going %} 669 <span class="cell"> 670 <a href="/@{{ handle }}">@{{ handle }}</a> 671 </span> 672 {% endfor %} 673 {% elif active_tab == "interested" %} 674 {% for handle in interested %} 675 <span class="cell"> 676 <a href="/@{{ handle }}">@{{ handle }}</a> 677 </span> 678 {% endfor %} 679 {% else %} 680 {% for handle in notgoing %} 681 <span class="cell"> 682 <a href="/@{{ handle }}">@{{ handle }}</a> 683 </span> 684 {% endfor %} 685 {% endif %} 686 </div> 687 </div> 688 {% endif %} 689 </div> 690 </div> 691 </div> 692</section> 693 694<!-- Modal marque-pages --> 695<div class="modal" id="bookmarkModal"> 696 <div class="modal-background" onclick="document.getElementById('bookmarkModal').classList.remove('is-active')"></div> 697 <div class="modal-content"> 698 <!-- Le contenu du modal sera chargé via HTMX --> 699 </div> 700 <button class="modal-close is-large" aria-label="close" onclick="document.getElementById('bookmarkModal').classList.remove('is-active')"></button> 701</div>