Skip to content

Latest commit

 

History

History
291 lines (279 loc) · 10.2 KB

cp-accordion.md

File metadata and controls

291 lines (279 loc) · 10.2 KB
layout
component
<style> cp-accordion:not([defined]) { display: block; opacity: 0; transition: opacity 0.3s ease-in-out; } .main-content cp-accordion-heading h2 { margin-bottom: 0; } .sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); border: 0; } .cp-chart.cp-chart-xs { width: 70px; height: 70px; } .cp-chart.cp-chart-sm { width: 100px; height: 100px; } .cp-chart.cp-chart-md { width: 200px; height: 200px; } .cp-chart.cp-chart-lg { width: 400px; height: 400px; } .cp-chart.cp-chart-xl { width: 600px; height: 600px; } .cp-chart-donut .cp-chart-ring { stroke: grey; stroke-width: 3; fill: transparent; } .cp-chart-donut .cp-chart-segment { stroke: grey; stroke-width: 3; fill: transparent; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-fuschia, .cp-chart-donut .cp-chart-segment.cp-chart-segment-1 { stroke: pink; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-violet, .cp-chart-donut .cp-chart-segment.cp-chart-segment-2 { stroke: violet; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-lavender, .cp-chart-donut .cp-chart-segment.cp-chart-segment-3 { stroke: purple; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-ocean, .cp-chart-donut .cp-chart-segment.cp-chart-segment-4 { stroke: darkblue; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-teal, .cp-chart-donut .cp-chart-segment.cp-chart-segment-5 { stroke: teal; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-moss, .cp-chart-donut .cp-chart-segment.cp-chart-segment-6 { stroke: darkgreen; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-clover, .cp-chart-donut .cp-chart-segment.cp-chart-segment-7 { stroke: lightgreen; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-lime, .cp-chart-donut .cp-chart-segment.cp-chart-segment-8 { stroke: lime; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-lemon-lime, .cp-chart-donut .cp-chart-segment.cp-chart-segment-9 { stroke: yellowgreen; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-lemon, .cp-chart-donut .cp-chart-segment.cp-chart-segment-10 { stroke: yellow; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-shark, .cp-chart-donut .cp-chart-segment.cp-chart-segment-11 { stroke: grey; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-dash-blue { stroke: blue; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-dash-yellow { stroke: gold; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-dash-red { stroke: red; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-grey, .cp-chart-donut .cp-chart-segment.cp-chart-segment-gray { stroke: darkgray; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-blue { stroke: darkblue; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-yellow { stroke: orange; } .cp-chart-donut .cp-chart-segment.cp-chart-segment-red { stroke: darkred; } .cp-chart-donut .cp-chart-hole { fill: #fff; } .cp-chart-text { fill: #000; } .cp-chart-text.cp-chart-text-inside { transform: translateY(0.25em); } .cp-chart-text.cp-chart-text-inside .cp-chart-number { font-size: 0.6em; line-height: 1; font-weight: 400; text-anchor: middle; transform: translateY(-0.25em); } .cp-chart-text.cp-chart-text-inside .cp-chart-label { font-size: 0.2em; text-anchor: middle; transform: translateY(0.7em); } .cp-figure-w-key { margin-left: -15px; padding-right: -15px; display: flex; justify-content: space-around; flex-direction: column; } @media (max-width: 768px) { .cp-figure-w-key { flex-direction: row; } } .cp-figure-w-key .cp-figure-content, .cp-figure-w-key .cp-figure-key { flex: 1; padding-left: 30px / 2; padding-right: 30px / 2; align-self: center; } .cp-figure-w-key .cp-figure-key { min-width: calc(8 / 12); } .cp-figure-w-key .cp-figure-key [class*="shape-"] { margin-right: 6px; } .list-stat, .stat-block { position: relative; margin: 0 0 15px; display: flex; flex-direction: column; } .list-stat dt, .list-stat .list-stat-heading, .list-stat .stat-block-heading, .stat-block dt, .stat-block .list-stat-heading, .stat-block .stat-block-heading { font-weight: normal; font-size: 0.875em; line-height: 1em; width: 100%; } .list-stat dd, .list-stat .list-stat-desc, .list-stat .stat-block-desc, .stat-block dd, .stat-block .list-stat-desc, .stat-block .stat-block-desc { margin-bottom: 0.125rem; font-size: 2em; line-height: 1em; order: -1; } .list-stat.list-stat-centered, .list-stat.stat-block-centered, .stat-block.list-stat-centered, .stat-block.stat-block-centered { text-align: center; } .cp-clock { margin: 0; display: flex; flex-direction: row; flex-wrap: wrap; } .cp-clock .cp-clock-group { margin: 0 15px 1em 0; display: flex; flex-direction: column; } .cp-clock .cp-clock-value { display: block; font-size: 2em; line-height: 1em; } .cp-clock .cp-clock-label { font-size: 0.875em; line-height: 1em; } </style> <style> cp-accordion:not([defined]) { opacity: 1; } </style>

Harry Potter FAQs

<script>require(['/assets/node_modules/@rhelements/cp-accordion/cp-accordion.compiled.js'])</script> Why do wizards need money if they could just create it?

There is legislation that decides what you can conjure and what you can not. Because things that you conjure out of thin air will not last, it is illegal in the wizarding world.

Why doesn’t Harry have a portrait of his parents?

The characters in the portraits are not actually ghosts. They mainly are there just to repeat common phrases or serve as a general representation of the individual they depict. A portrait of his parents would not be of much help to Harry.

Why is Harry considered a half-blood if both of his parents could use magic?

Because Harry’s grandparents were not able to do magic. This is generally frowned upon by those who consider themselves pure, such as the Malfoy’s or other antagonists.

Is Hogwarts the only wizarding school?

No! It has been revealed that there are actually 11 long established and prestigious schools around the globe. These include Castelobruxo in the rainforest of Brazil, Durmstrang Institute (whereas nobody is certain of it’s whereabouts), and Ilvermorny, right here in the United States.

Which book has the most pages? <title id="hp-books-title">Number of pages in Harry Potter books</title> Donut chart showing the top 4 books with the most amount of pages. There are 4100 pages out of all 7 books. Book 5 takes up 21 percent, book 7 takes up 19 percent, book 4 takes up 18%, book 6 takes up 16 percent, and the remaining 3 books take up 24% of the total. <title id="donut-segment-1-title">Book 5</title> Segment 1 spanning 21% of the whole, which is 870 pages out of 4100 total. <title id="donut-segment-2-title">Book 7</title> Segment 2 spanning 19% of the whole, which is 759 pages out of 4100 total. <title id="donut-segment-3-title">Book 4</title> Segment 3 spanning 18% of the whole, which is 734 pages out of 4100 total. <title id="donut-segment-4-title">Book 6</title> Segment 4 spanning 16% of the whole, which is 652 pages out of 4100 total. 4,100 Total Pages Donut chart showing the top 4 books with the most amount of pages. There are 4100 pages out of all 7 books. Book 5 takes up 21 percent, book 7 takes up 19 percent, book 4 takes up 18%, book 6 takes up 16 percent, and the remaining 3 books take up 24% of the total. Where do the main characters work as adults?

Harry and Hermione are at the Ministry: he ends up leading the Auror department. Ron helps George at the joke shop and does very well. Ginny becomes a professional Quidditch player and then sportswriter for the Daily Prophet.

Read more about the characters