2,602
edits
Changes
mLine 98:
Line 98: − } − − .collapsible { − background-color: #777; − color: white; − cursor: pointer; − padding: 18px; − width: 100%; − border: none; − text-align: left; − outline: none; − font-size: 15px; − } − − .active, .collapsible:hover { − background-color: #555; − } − − .collapsible:after { − content: '\002B'; − color: white; − font-weight: bold; − float: right; − margin-left: 5px; − } − − .active:after { − content: "\2212"; − } − − .content { − padding: 0 18px; − max-height: 0; − overflow: hidden; − transition: max-height 0.2s ease-out; − background-color: #f1f1f1; Line 148:
Line 112: − <br> − <p><strong>[https://gccollab.ca/blog/view/13043649/priorities-for-advancing-the-government-of-canada-data-agenda-priorit-s-pour-faire-progresser-le-programme-de-donn-es-du-gouvernement-du-canada >> Read Chief Data Officer of Canada Stephen Burt's Priorities for Advancing the Government of Canada Data Agenda <small>(on GCcollab)</small>] </strong></p> − − <p>A Collapsible:</p> − <button class="collapsible">Open Collapsible</button> − <div class="content"> − <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> − </div> − − <p>Collapsible Set:</p> − <button class="collapsible">Open Section 1</button> − <div class="content"> − <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> − </div> − <button class="collapsible">Open Section 2</button> − <div class="content"> − <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> − </div> − <button class="collapsible">Open Section 3</button> − <div class="content"> − <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p> − </div> − − <script> − var coll = document.getElementsByClassName("collapsible"); − var i; − − for (i = 0; i < coll.length; i++) { − coll[i].addEventListener("click", function() { − this.classList.toggle("active"); − var content = this.nextElementSibling; − if (content.style.maxHeight){ − content.style.maxHeight = null; − } else { − content.style.maxHeight = content.scrollHeight + "px"; − } − }); − } − </script>
Undo revision 75169 by Sharon.twiss (talk)
.checkbox {
.checkbox {
list-style: none;
list-style: none;
}
}
<p style="color:#04617B; font-size:1.15em;"><strong>Led by Treasury Board of Canada Secretariat, Privy Council Office, and Statistics Canada, supported by the GC Data Community at the Canada School of Public Service</strong></p>
<p style="color:#04617B; font-size:1.15em;"><strong>Led by Treasury Board of Canada Secretariat, Privy Council Office, and Statistics Canada, supported by the GC Data Community at the Canada School of Public Service</strong></p>
<h2 style="padding-top:20px;">23 June 2022 — Engagement Session</h2>
<h2 style="padding-top:20px;">23 June 2022 — Engagement Session</h2>