{"id":53902,"date":"2026-08-24T14:28:08","date_gmt":"2026-08-24T12:28:08","guid":{"rendered":"https:\/\/cycloclubremois.com\/?page_id=53902"},"modified":"2026-08-24T14:28:08","modified_gmt":"2026-08-24T12:28:08","slug":"test-affichage-club-amis","status":"publish","type":"page","link":"https:\/\/cycloclubremois.com\/index.php\/test-affichage-club-amis\/","title":{"rendered":"Test affichage club amis"},"content":{"rendered":"\n\n\n<style>\n.ccr-amis {\n    font-family: 'Lato', sans-serif;\n    margin: 30px 0;\n}\n.ccr-amis-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 10px;\n    margin-bottom: 20px;\n    flex-wrap: wrap;\n}\n.ccr-amis-titre {\n    font-family: 'Rajdhani', sans-serif;\n    font-size: 22px;\n    font-weight: 700;\n    text-transform: uppercase;\n    letter-spacing: 1.5px;\n    margin: 0;\n    padding: 0;\n    color: #1a1a1a;\n    background: none;\n    border: none;\n    line-height: 1.2;\n}\n.ccr-amis-voir-tout {\n    font-size: 12px;\n    font-weight: 700;\n    color: #e74c3c;\n    text-decoration: none;\n    text-transform: uppercase;\n    letter-spacing: .08em;\n    white-space: nowrap;\n    border: 1.5px solid #e74c3c;\n    padding: 4px 14px;\n    border-radius: 20px;\n    transition: all .18s;\n}\n.ccr-amis-voir-tout:hover {\n    background: #e74c3c;\n    color: #fff;\n    text-decoration: none;\n}\n\/* \u2500\u2500 Grille 3 colonnes comme le reste de la home \u2500\u2500 *\/\n.ccr-amis-grid {\n    display: grid;\n    grid-template-columns: repeat(3, 1fr);\n    gap: 16px;\n}\n@media (max-width: 768px) {\n    .ccr-amis-grid { grid-template-columns: 1fr; }\n}\n\/* \u2500\u2500 Carte \u2500\u2500 *\/\n.ccr-amis-card {\n    background: #ffffff;\n    border: 1px solid #e8e8e8;\n    border-top: 3px solid #e74c3c;\n    border-radius: 12px;\n    overflow: hidden;\n    display: flex;\n    flex-direction: column;\n    box-shadow: 0 2px 8px rgba(0,0,0,.07);\n    transition: box-shadow .25s, transform .25s;\n    text-decoration: none;\n    color: inherit;\n}\n.ccr-amis-card:hover {\n    box-shadow: 0 6px 20px rgba(0,0,0,.12);\n    transform: translateY(-3px);\n    text-decoration: none;\n    color: inherit;\n}\n.ccr-amis-card-body {\n    padding: 14px 16px;\n    flex: 1;\n    display: flex;\n    flex-direction: column;\n    gap: 7px;\n}\n\/* Bloc date *\/\n.ccr-amis-date {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n}\n.ccr-amis-date-bloc {\n    background: #e74c3c;\n    color: #fff;\n    border-radius: 5px;\n    text-align: center;\n    padding: 5px 10px;\n    min-width: 44px;\n    flex-shrink: 0;\n}\n.ccr-amis-date-bloc .j {\n    font-family: 'Rajdhani', sans-serif;\n    font-size: 1.5rem;\n    font-weight: 700;\n    line-height: 1;\n}\n.ccr-amis-date-bloc .m {\n    font-size: .6rem;\n    text-transform: uppercase;\n    letter-spacing: .07em;\n    opacity: .9;\n}\n.ccr-amis-date-label {\n    font-size: 12px;\n    color: #888;\n    font-weight: 600;\n    text-transform: uppercase;\n    letter-spacing: .05em;\n}\n.ccr-amis-nom {\n    font-size: 15px;\n    font-weight: 700;\n    color: #1a1a1a;\n    margin: 0;\n    line-height: 1.3;\n}\n.ccr-amis-club {\n    font-size: 12px;\n    color: #888;\n}\n.ccr-amis-distances {\n    font-size: 12px;\n    color: #1565c0;\n    font-weight: 700;\n}\n\/* Pied de section *\/\n.ccr-amis-footer {\n    margin-top: 18px;\n    text-align: center;\n}\n.ccr-amis-btn-full {\n    display: inline-block;\n    background: #e74c3c;\n    color: #fff;\n    text-decoration: none;\n    padding: 10px 28px;\n    border-radius: 25px;\n    font-family: 'Rajdhani', sans-serif;\n    font-size: 15px;\n    font-weight: 700;\n    letter-spacing: .06em;\n    text-transform: uppercase;\n    transition: background .18s;\n}\n.ccr-amis-btn-full:hover {\n    background: #c0392b;\n    color: #fff;\n    text-decoration: none;\n}\n.ccr-amis-vide {\n    grid-column: 1 \/ -1;\n    text-align: center;\n    color: #aaa;\n    font-style: italic;\n    padding: 20px 0;\n    font-size: 14px;\n}\n\/* \u2500\u2500 Logo club \u2500\u2500 *\/\n.ccr-amis-card-logo {\n    padding: 6px 14px 10px;\n    border-top: 1px solid #f0f0f0;\n    display: flex;\n    align-items: center;\n    gap: 8px;\n}\n.ccr-amis-card-logo img {\n    height: 28px;\n    width: auto;\n    object-fit: contain;\n}\n.ccr-amis-card-logo span {\n    font-size: .7rem;\n    color: #999;\n    font-weight: 600;\n}\n<\/style>\n<div class=\"ccr-amis\">\n    <div class=\"ccr-amis-header\">\n        <div class=\"ccr-amis-titre\">\ud83e\udd1d Sorties des clubs amis<\/div>\n        <a class=\"ccr-amis-voir-tout\" href=\"https:\/\/cycloclubremois.com\/index.php\/les-evenements-de-nos-clubs-amis\/\">Tous les \u00e9v\u00e9nements \u2192<\/a>\n    <\/div>\n    <div class=\"ccr-amis-grid\" id=\"ccrAmisHome\"><\/div>\n    <div class=\"ccr-amis-footer\">\n        <a class=\"ccr-amis-btn-full\" href=\"https:\/\/cycloclubremois.com\/index.php\/les-evenements-de-nos-clubs-amis\/\">Voir le calendrier complet<\/a>\n    <\/div>\n<\/div>\n<script>\n\/\/ ============================================================\n\/\/  \u26a0\ufe0f DONN\u00c9ES \u2014 identiques \u00e0 la page d\u00e9di\u00e9e sorties_clubs_amis.html\n\/\/  Mettre \u00e0 jour les deux fichiers en m\u00eame temps.\n\/\/ ============================================================\nconst CCR_AMIS = [\n  { nom: \"Sacracus\",                          club: \"Club de Sacy\",                    date: \"2026-06-14\", distances: [\"50 km\",\"80 km\",\"110 km\"],   lien: \"\" },\n  { nom: \"Les Galipes\",                       club: \"Club de Rilly-la-Montagne\",       date: \"2026-06-21\", distances: [\"45 km\",\"75 km\",\"105 km\"],   lien: \"\" },\n  { nom: \"Estivales de l'\u00e9t\u00e9 \u2014 1\u00e8re sortie\",  club: \"ASA Tinqueux\",                    date: \"2026-07-05\", distances: [\"58 km\",\"76 km\"],            lien: \"https:\/\/asatinqueux-cyclo.fr\/nos-evenements\/les-estivales-de-lasa_ete-2026\/\" },\n  { nom: \"Estivales de l'\u00e9t\u00e9 \u2014 2\u00e8me sortie\",  club: \"ASA Tinqueux\",                    date: \"2026-07-19\", distances: [\"55 km\",\"75 km\"],            lien: \"https:\/\/asatinqueux-cyclo.fr\/nos-evenements\/les-estivales-de-lasa_ete-2026\/\" },\n  { nom: \"Estivales de l'\u00e9t\u00e9 \u2014 3\u00e8me sortie\",  club: \"ASA Tinqueux\",                    date: \"2026-08-02\", distances: [\"56 km\",\"77 km\"],            lien: \"https:\/\/asatinqueux-cyclo.fr\/nos-evenements\/les-estivales-de-lasa_ete-2026\/\" },\n  { nom: \"Estivales de l'\u00e9t\u00e9 \u2014 4\u00e8me sortie\",  club: \"ASA Tinqueux\",                    date: \"2026-08-23\", distances: [\"50 km\",\"75 km\"],            lien: \"https:\/\/asatinqueux-cyclo.fr\/nos-evenements\/les-estivales-de-lasa_ete-2026\/\" },\n  { nom: \"Michel Lepolard\",                   club: \"ASA Tinqueux\",                    date: \"2026-09-13\", distances: [\"21 km\",\"50 km\",\"80 km\",\"110 km\"], lien: \"\" },\n  { nom: \"Randonn\u00e9e du Chemin des Dames\",     club: \"Cyclo Randonneurs Bezannes\",      date: \"2026-09-06\", distances: [\"45 km\",\"75 km\",\"100 km\"],   lien: \"http:\/\/www.cyclorandonneursbezannes.fr\/pages\/randonnees\/randonnee-du-chemin-des-dames.html\" },\n  { nom: \"Brevets d'Automne \u2014 L'Aisne\",       club: \"Cyclo Randonneurs Bezannes\",      date: \"2026-10-11\", distances: [\"50 km\",\"76 km\"],            lien: \"http:\/\/www.cyclorandonneursbezannes.fr\/pages\/randonnees\/les-brevets-d-automne.html\" },\n  { nom: \"Brevets d'Automne \u2014 La Vesle\",      club: \"Cyclo Randonneurs Bezannes\",      date: \"2026-10-18\", distances: [\"50 km\",\"68 km\"],            lien: \"http:\/\/www.cyclorandonneursbezannes.fr\/pages\/randonnees\/les-brevets-d-automne.html\" },\n  { nom: \"Brevets d'Automne \u2014 L'Ardre\",       club: \"Cyclo Randonneurs Bezannes\",      date: \"2026-10-25\", distances: [\"37 km\",\"61 km\"],            lien: \"http:\/\/www.cyclorandonneursbezannes.fr\/pages\/randonnees\/les-brevets-d-automne.html\" },\n  { nom: \"Brevets d'Automne \u2014 La Suippe\",     club: \"Cyclo Randonneurs Bezannes\",      date: \"2026-11-01\", distances: [\"53 km\",\"85 km\"],            lien: \"http:\/\/www.cyclorandonneursbezannes.fr\/pages\/randonnees\/les-brevets-d-automne.html\" }\n];\n\/\/ ============================================================\nconst CLUBS_HOME = {\n  \"Club de Sacy\":               { logo: \"https:\/\/cycloclubremois.com\/wp-content\/uploads\/2026\/06\/Cyclo-Club-Sacy.png\",      couleur: \"#7cb518\" },\n  \"Club de Rilly-la-Montagne\":  { logo: \"https:\/\/cycloclubremois.com\/wp-content\/uploads\/2026\/06\/logo_Asrilly.jpeg\",        couleur: \"#e6b800\" },\n  \"ASA Tinqueux\":               { logo: \"https:\/\/cycloclubremois.com\/wp-content\/uploads\/2026\/06\/logo_Asatinqueux.jpeg\",    couleur: \"#1a4fa0\" },\n  \"Cyclo Randonneurs Bezannes\": { logo: \"https:\/\/cycloclubremois.com\/wp-content\/uploads\/2026\/06\/Logo_CGRB.jpg\",            couleur: \"#1a3a8f\" }\n};\nconst MOIS_FR  = [\"Jan\",\"F\u00e9v\",\"Mar\",\"Avr\",\"Mai\",\"Jun\",\"Jul\",\"Ao\u00fb\",\"Sep\",\"Oct\",\"Nov\",\"D\u00e9c\"];\nconst JOURS_FR = [\"dim.\",\"lun.\",\"mar.\",\"mer.\",\"jeu.\",\"ven.\",\"sam.\"];\nconst NB = 3; \/\/ nombre de prochains \u00e9v\u00e9nements affich\u00e9s\n(function () {\n    const today = new Date(); today.setHours(0,0,0,0);\n    const prochains = CCR_AMIS\n        .filter(e => new Date(e.date + \"T00:00:00\") >= today)\n        .sort((a, b) => a.date.localeCompare(b.date))\n        .slice(0, NB);\n    const grid = document.getElementById(\"ccrAmisHome\");\n    if (!grid) return;\n    if (!prochains.length) {\n        grid.innerHTML = '<p class=\"ccr-amis-vide\">Aucun \u00e9v\u00e9nement \u00e0 venir pour le moment \u2014 revenez bient\u00f4t !<\/p>';\n        return;\n    }\n    prochains.forEach(function (e) {\n        const d     = new Date(e.date + \"T00:00:00\");\n        const jour  = JOURS_FR[d.getDay()];\n        const dist  = e.distances.length ? e.distances.join(\" \u00b7 \") : \"\";\n        const club  = CLUBS_HOME[e.club] || { logo: \"\", couleur: \"#e74c3c\" };\n        const href  = e.lien || \"URL_PAGE_DEDIEE\";\n        const card = document.createElement(\"a\");\n        card.className = \"ccr-amis-card\";\n        card.href = href;\n        card.style.borderTopColor = club.couleur;\n        if (e.lien) { card.target = \"_blank\"; card.rel = \"noopener\"; }\n        const logoHtml = club.logo\n            ? '<div class=\"ccr-amis-card-logo\"><img decoding=\"async\" src=\"' + club.logo + '\" alt=\"' + e.club + '\"><span>' + e.club + '<\/span><\/div>'\n            : '<div class=\"ccr-amis-card-logo\"><span>\ud83d\udccd ' + e.club + '<\/span><\/div>';\n        card.innerHTML =\n            '<div class=\"ccr-amis-card-body\">' +\n                '<div class=\"ccr-amis-date\">' +\n                    '<div class=\"ccr-amis-date-bloc\" style=\"background:' + club.couleur + ';\">' +\n                        '<div class=\"j\">' + String(d.getDate()).padStart(2,\"0\") + '<\/div>' +\n                        '<div class=\"m\">' + MOIS_FR[d.getMonth()] + '<\/div>' +\n                    '<\/div>' +\n                    '<div class=\"ccr-amis-date-label\">' + jour + ' ' + d.getFullYear() + '<\/div>' +\n                '<\/div>' +\n                '<p class=\"ccr-amis-nom\">' + e.nom + '<\/p>' +\n                (dist ? '<div class=\"ccr-amis-distances\">\ud83d\udeb4 ' + dist + '<\/div>' : '') +\n            '<\/div>' +\n            logoHtml;\n        grid.appendChild(card);\n    });\n})();\n<\/script>\n","protected":false},"excerpt":{"rendered":"<p>\ud83e\udd1d Sorties des clubs amis Tous les \u00e9v\u00e9nements \u2192 Voir le calendrier complet<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"inline_featured_image":false,"ngg_post_thumbnail":0,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"folder":[],"class_list":["post-53902","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/cycloclubremois.com\/index.php\/wp-json\/wp\/v2\/pages\/53902","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cycloclubremois.com\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cycloclubremois.com\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cycloclubremois.com\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cycloclubremois.com\/index.php\/wp-json\/wp\/v2\/comments?post=53902"}],"version-history":[{"count":1,"href":"https:\/\/cycloclubremois.com\/index.php\/wp-json\/wp\/v2\/pages\/53902\/revisions"}],"predecessor-version":[{"id":53903,"href":"https:\/\/cycloclubremois.com\/index.php\/wp-json\/wp\/v2\/pages\/53902\/revisions\/53903"}],"wp:attachment":[{"href":"https:\/\/cycloclubremois.com\/index.php\/wp-json\/wp\/v2\/media?parent=53902"}],"wp:term":[{"taxonomy":"folder","embeddable":true,"href":"https:\/\/cycloclubremois.com\/index.php\/wp-json\/wp\/v2\/folder?post=53902"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}