Code JSON utilisé lors de la démonstration

{

"Semaine1":

"<div class=\"container\">\n    <div class=\"row\">\n        <div class=\"col-12 col-xl\" style=\"padding:10px;\">\n            <div style=\"background-color:#e74c3c;color:#fff;text-align:center;padding:0.5rem 0;margin-bottom:1rem;\">\n                <strong>Lundi</strong>\n            </div>\n            <table style=\"width:100%;border-collapse:collapse;\">\n                <tbody>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>9h00<br>10h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>10h00<br>11h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>11h00<br>12h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>12h00<br>13h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>13h00<br>14h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>14h00<br>15h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>15h00<br>16h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                </tbody>\n            </table>\n        </div>\n        <div class=\"col-12 col-xl\" style=\"padding:10px;\">\n            <div style=\"background-color:#e67e22;color:#fff;text-align:center;padding:0.5rem 0;margin-bottom:1rem;\">\n                <strong>Mardi</strong>\n            </div>\n            <table style=\"width:100%;border-collapse:collapse;\">\n                <tbody>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>9h00<br>10h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>10h00<br>11h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>11h00<br>12h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>12h00<br>13h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>13h00<br>14h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>14h00<br>15h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>15h00<br>16h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                </tbody>\n            </table>\n        </div>\n        <div class=\"col-12 col-xl\" style=\"padding:10px;\">\n            <div style=\"background-color:#f1c40f;color:#000;text-align:center;padding:0.5rem 0;margin-bottom:1rem;\">\n                <strong>Mercredi</strong>\n            </div>\n            <table style=\"width:100%;border-collapse:collapse;\">\n                <tbody>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>9h00<br>10h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>10h00<br>11h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>11h00<br>12h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>12h00<br>13h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>13h00<br>14h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>14h00<br>15h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>15h00<br>16h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                </tbody>\n            </table>\n        </div>\n        <div class=\"col-12 col-xl\" style=\"padding:10px;\">\n            <div style=\"background-color:#2ecc71;color:#fff;text-align:center;padding:0.5rem 0;margin-bottom:1rem;\">\n                <strong>Jeudi</strong>\n            </div>\n            <table style=\"width:100%;border-collapse:collapse;\">\n                <tbody>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>9h00<br>10h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>10h00<br>11h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>11h00<br>12h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>12h00<br>13h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>13h00<br>14h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>14h00<br>15h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>15h00<br>16h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                \n",

"Semaine2":

"<div class=\"container\">\n    <div class=\"row\">\n        <div class=\"col-12 col-xl\" style=\"padding:10px;\">\n            <div style=\"background-color:#e74c3c;color:#fff;text-align:center;padding:0.5rem 0;margin-bottom:1rem;\">\n                <strong>Lundi</strong>\n            </div>\n            <table style=\"width:100%;border-collapse:collapse;\">\n                <tbody>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>9h00<br>10h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>10h00<br>11h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>11h00<br>12h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>12h00<br>13h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>13h00<br>14h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>14h00<br>15h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>15h00<br>16h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                </tbody>\n            </table>\n        </div>\n        <div class=\"col-12 col-xl\" style=\"padding:10px;\">\n            <div style=\"background-color:#e67e22;color:#fff;text-align:center;padding:0.5rem 0;margin-bottom:1rem;\">\n                <strong>Mardi</strong>\n            </div>\n            <table style=\"width:100%;border-collapse:collapse;\">\n                <tbody>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>9h00<br>10h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>10h00<br>11h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>11h00<br>12h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>12h00<br>13h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>13h00<br>14h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>14h00<br>15h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>15h00<br>16h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                </tbody>\n            </table>\n        </div>\n        <div class=\"col-12 col-xl\" style=\"padding:10px;\">\n            <div style=\"background-color:#f1c40f;color:#000;text-align:center;padding:0.5rem 0;margin-bottom:1rem;\">\n                <strong>Mercredi</strong>\n            </div>\n            <table style=\"width:100%;border-collapse:collapse;\">\n                <tbody>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>9h00<br>10h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>10h00<br>11h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>11h00<br>12h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>12h00<br>13h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>13h00<br>14h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>14h00<br>15h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>15h00<br>16h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                </tbody>\n            </table>\n        </div>\n        <div class=\"col-12 col-xl\" style=\"padding:10px;\">\n            <div style=\"background-color:#2ecc71;color:#fff;text-align:center;padding:0.5rem 0;margin-bottom:1rem;\">\n                <strong>Jeudi</strong>\n            </div>\n            <table style=\"width:100%;border-collapse:collapse;\">\n                <tbody>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>9h00<br>10h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>10h00<br>11h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>11h00<br>12h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>12h00<br>13h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>13h00<br>14h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>14h00<br>15h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                    <tr>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><strong>15h00<br>16h00</strong></td>\n                        <td style=\"border:1px solid #ccc;padding:5px;\"><br></td>\n                    </tr>\n                \n"

}

Ce code permet d'assigner aux pages "Semaine1" et "Semaine2" le rendu visuel suivant :