diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/Gryffindor.css b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/Gryffindor.css new file mode 100644 index 0000000..585da1b --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/Gryffindor.css @@ -0,0 +1,241 @@ +@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=PT+Sans&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Cinzel&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Cormorant:wght@300;400&family=Rye&display=swap'); +/* Change the following color pallete alone */ +:root { + --color1: #1a472a; + --color2: #2a623d; + --color3: #8d635c; + --color4: #fdd17c; + --color5: #000000; + --color6: #997a6c; + --color7: #b83f3f; + --color8: #cf5050; +} + +* { + margin: 0px; + padding: 0px; +} + +body { + overflow-x: hidden; +} + +header { + width: 100%; + background-color: var(--color7); + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px; + display: flex; + flex-direction: row; + align-items: center; +} +.logo-container, .heading, .back{ + display: flex; +} +.logo-container{ + flex: 1; +} +.logo-container img{ + width: 20vh; + -webkit-filter: drop-shadow(0 0.2rem 0.25rem rgba(0, 0, 0, 0.2)); + filter: drop-shadow(0 0.2rem 0.25rem rgba(0, 0, 0, 0.2)); +} +.heading{ + flex: 2; + flex-direction: column; +} +.heading h1 { + color: var(--color4); + font-family: 'Cinzel'; + text-align: center; + font-size: 8vh; + letter-spacing: 5px; +} +.heading img { + padding-top: 1vh; + width: 20%; + height: 20%; + margin: auto; +} +.back{ + flex: 1; +} +.back a:link, a:visited { + margin-left: auto; + margin-right: 10%; + background-color: var(--color8); + color: var(--color4); + border-radius: 10%; + padding: 15px 20px; + text-align: center; + text-decoration: none; + display: inline-block; + transition: 0.4s; + cursor: pointer; + } + +.back a:hover, a:active { + background-color: var(--color3); + color: var(--color4); + } +.sec1 { + width: 100vw; + height: 80vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + background: #8d261f +} + +.sec1 article { + display: grid; + text-align: center; + place-items: center; + width: 50%; + height: 50%; + background-color: var(--color7); + box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset; + +} + +.sec1 article p { + font-size: 2.1vw; + font-family: 'Cormorant', serif; + font-weight: 400; + color: var(--color4); +} + +.sec2 { + width: 100vw; + height: 100vh; + background: var(--color4); + padding-top: 10vh; +} + +.sec2 article { + margin-left: auto; + margin-right: auto; + width: 50%; + color: var(--color6); + z-index: 2; + + +} + +.sec2 article h2 { + color: var(--color6); + font-size: 4vw; + font-family: 'Cinzel'; + text-align: center; +} + + +.sec2 article ul { + padding: 25px 25px 25px 25px; + border-radius: 2%; + text-align: center; + list-style: none; + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} + +.sec2 article ul li{ + list-style: none; +} + + +.sec2 article ul li h3 { + font-size: 2.5vw; +} + +.sec2 article ul li p { + font-size: 1.1vw; + color: var(--color3); + font-family: sans-serif; +} + +.sec3 { + height: 100vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: #b83f3f +} + +.sec3 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec3 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.sec4 { + height: 30vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: var(--color7); +} +.sec4 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec4 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} +.sec5 { + height: 100vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: var(--color7); +} +.sec5 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec5 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.content { + flex: 2; + display: flex; + flex-direction: column; +} + +.content h2 { + text-align: center; + color: var(--color6); + font-size: 4vw; + font-family: 'Cinzel'; +} +.content p { + margin-left: auto; + margin-right: auto; + width: 60%; + text-align: justify; + color: var(--color4); + font-family: sans-serif; + font-size: 1.5vw; +} diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/Gryffindor.html b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/Gryffindor.html new file mode 100644 index 0000000..a5d9f96 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/Gryffindor.html @@ -0,0 +1,180 @@ + + + + + + + + + + Gryffindor + + +
+
+ icon +
+
+

Gryffindor

+ Gryffindor Logo +
+
+ BACK +
+
+
+
+

"You might belong in Gryffindor,
+ Where dwell the brave at heart,
+ Their daring, nerve, and chivalry
+ Set Gryffindors apart" +

+
+ +
+ +
+
+

Traits +

+
+ +
+
+ +
+
+ Founder name +
+

Godric Gryffindor +

+
+

Professor Godric Gryffindor was a wizard of medieval times and one of the four Founders of Hogwarts School of Witchcraft and Wizardry. He was good friends with Salazar Slytherin but opposed him when he later thought that they should not accept Muggle-born students at Hogwarts. It is unknown when he died. Gryffindor's birthplace became known as Godric's Hollow, in his honour. Godric Gryffindor's portrait still remains at Hogwarts.

+
+
+
+ +
+
+ Gryffindor Logo +
+

FAMOUS GRYFFINDORS

+
+
+
+
+ Dumbledore +
+

Albus Dumbledore +

+
+

Professor Albus Percival Wulfric Brian Dumbledore, O.M. (First Class), + was an English half-blood wizard. He was the Defence Against the Dark Arts Professor, + later the Transfiguration Professor, and later the Headmaster of Hogwarts School of Witchcraft and Wizardry. + He also served as Supreme Mugwump of the International Confederation of Wizards and + Chief Warlock of the Wizengamot. A Muggle-supporting wizard, + he was considered to have been the greatest wizard of modern times, perhaps of all time.

+
+
+
+ +
+
+ McGonagall +
+

Minerva McGonagall

+
+

Professor Minerva McGonagall, O.M. (First Class),was a Scottish half-blood witch. + She attended Hogwarts School of Witchcraft and Wizardry and was Sorted + into Gryffindor House. During her seventh year, she was appointed Head Girl. + + After her education, Minerva worked for two years at the Ministry of Magic and later returned to Hogwarts, + where she became Head of Gryffindor House and the Transfiguration professor. + She greatly helped the Ministry of Magic's resistance + through spying on Death Eaters and bringing the Aurors crucial information on their activities.

+
+
+
+
+
+ Harry +
+

Harry Potter

+
+

Harry Potter is the protagonist in the Harry Potter series. The majority of the books' plot + covers seven years in the life of the orphan Harry, who, on his eleventh birthday, + learns he is a wizard. He goes to Hogwarts School of Witchcraft and Wizardry + to practise magic under the guidance of the school professors along with his best + friends Ron Weasley and Hermione Granger. + Harry also discovers that he is already famous throughout the novel's magical community, + and that his fate is tied with that of Lord Voldemort – the internationally feared Dark + Wizard. The series revolves around Harry's struggle to adapt to the wizarding world and defeat Voldemort. +

+
+
+
+
+
+ Ron +
+

Ronald Weasley

+
+

Ronald Bilius "Ron" Weasley (born 1 March, 1980) was an English pure-blood wizard, + the sixth and youngest son of Arthur and Molly Weasley. He was also + the younger brother of Bill, Charlie, Percy, Fred, George, and the elder brother of Ginny + . Ron and his siblings lived at the The Burrow, on the outskirts of Ottery St Catchpole, Devon. +

+
+
+
+
+
+ Hermoine +
+

Hermoine Granger

+
+

Hermione Jean Granger (born 19 September, 1979) was an English Muggle-born + witch born to Mr and Mrs Granger. At the age of eleven, she learned about her magical nature + and was accepted into Hogwarts School of Witchcraft and Wizardry. Hermione began attending + Hogwarts in 1991 and was Sorted into Gryffindor House. She possessed a brilliant academic mind + and proved to be a gifted student in almost every subject that she studied. +

+
+
+
+ + + diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/Dumbledore.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/Dumbledore.jpg new file mode 100644 index 0000000..1380d75 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/Dumbledore.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/Godric_Gryffindor.png b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/Godric_Gryffindor.png new file mode 100644 index 0000000..68a01c2 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/Godric_Gryffindor.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/HarryPotter.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/HarryPotter.jpg new file mode 100644 index 0000000..6545d78 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/HarryPotter.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/Hermoine.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/Hermoine.jpg new file mode 100644 index 0000000..df31b17 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/Hermoine.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/McGonnagal.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/McGonnagal.jpg new file mode 100644 index 0000000..30f22ba Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/McGonnagal.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/RonWeasley.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/RonWeasley.jpg new file mode 100644 index 0000000..478f3e6 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/RonWeasley.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/logo.svg b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/logo.svg new file mode 100644 index 0000000..b61d590 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Gryffindor/images/logo.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/Hufflepuff.css b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/Hufflepuff.css new file mode 100644 index 0000000..5e29ae9 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/Hufflepuff.css @@ -0,0 +1,237 @@ +@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=PT+Sans&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Cinzel&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Cormorant:wght@300;400&family=Rye&display=swap'); +/* Change the following color pallete alone */ +:root { + --color1:#e4a300; + --color2: #ffb700; + --color3: #c2a790; + --color4: #372e29; + --color5: #000000; + --color6: #e6e6e6; + --color7: #e7a600; +} + +* { + margin: 0px; + padding: 0px; +} + +body { + overflow-x: hidden; +} + +header { + width: 100%; + background-color: var(--color1); + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px; + display: flex; + flex-direction: row; + align-items: center; +} +.logo-container, .heading, .back{ + display: flex; +} +.logo-container{ + flex: 1; +} +.logo-container img{ + width: 20vh; + -webkit-filter: drop-shadow(0 0.2rem 0.25rem rgba(0, 0, 0, 0.2)); + filter: drop-shadow(0 0.2rem 0.25rem rgba(0, 0, 0, 0.2)); +} +.heading{ + flex: 2; + flex-direction: column; +} +.heading h1 { + color: white; + font-family: 'Cinzel'; + text-align: center; + font-size: 8vh; + letter-spacing: 5px; +} +.heading img { + padding-top: 1vh; + width: 20%; + height: 20%; + margin: auto; +} +.back{ + flex: 1; +} +.back a:link, a:visited { + margin-left: auto; + margin-right: 10%; + background-color: var(--color6); + color: var(--color1); + border-radius: 10%; + padding: 15px 20px; + text-align: center; + text-decoration: none; + display: inline-block; + transition: 0.4s; + cursor: pointer; + } + +.back a:hover, a:active { + background-color: var(--color2); + color: var(--color6); + } +.sec1 { + width: 100vw; + height: 80vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + background: #ce9300 +} + +.sec1 article { + display: grid; + text-align: center; + place-items: center; + width: 50%; + height: 50%; + background-color: var(--color7); + box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset; +} + +.sec1 article p { + font-size: 2.1vw; + font-family: 'Cormorant', serif; + font-weight: 400; + color: var(--color6); +} + +.sec2 { + width: 100vw; + height: 100vh; + background: var(--color4); + padding-top: 10vh; +} + +.sec2 article { + margin-left: auto; + margin-right: auto; + width: 50%; + color: var(--color6); + z-index: 2; + + +} + +.sec2 article h2 { + color: var(--color6); + font-size: 4vw; + font-family: 'Cinzel'; + text-align: center; +} + + +.sec2 article ul { + padding: 25px 25px 25px 25px; + border-radius: 2%; + text-align: center; + list-style: none; + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} + +.sec2 article ul li{ + list-style: none; +} + + +.sec2 article ul li h3 { + font-size: 2.5vw; +} + +.sec2 article ul li p { + font-size: 1.3vw; + color: var(--color3); + font-family: sans-serif; +} + +.sec3 { + height: 100vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: #ce9300 +} + +.sec3 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec3 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px; +} +.sec4 { + height: 30vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: var(--color1); +} +.sec4 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec4 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} +.sec5 { + height: 100vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: var(--color1); +} +.sec5 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec5 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} +.content { + flex: 2; + display: flex; + flex-direction: column; +} + +.content h2 { + text-align: center; + color: var(--color6); + font-size: 4vw; + font-family: 'Cinzel'; +} +.content p { + margin-left: auto; + margin-right: auto; + width: 60%; + text-align: justify; + color: var(--color4); + font-family: sans-serif; + font-size: 1.6vw; +} diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/Hufflepuff.html b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/Hufflepuff.html new file mode 100644 index 0000000..576c9df --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/Hufflepuff.html @@ -0,0 +1,156 @@ + + + + + + + + + + + Hufflepuff + + +
+
+ icon +
+
+

Hufflepuff

+ +
+
+ BACK +
+
+
+
+

"You might belong in Hufflepuff,
+ Where they are just and loyal,
+ Those patient Hufflepuffs are true,
+ And unafraid of toil."
+ - The Sorting Hat

+
+ +
+ +
+
+

Traits +

+
+ +
+
+ +
+
+ Founder name +
+

Helga Hufflepuff

+
+

+ Helga Hufflepuff (fl. c. 993) was a Welsh witch and was one of the four founders of Hogwarts School + of Witchcraft and Wizardry. While the other founders chose to have special students, she accepted + them all without preference, but the students of her house are described as loyal and hard-working. + Helga's portrait remained at Hogwarts by at least the 1980s. +

+
+
+
+ +
+
+ +
+

FAMOUS HUFFLEPUFFS

+
+
+
+
+
+ Newt Scamander +
+

New Scamander

+
+

+ Newton Artemis Fido "Newt" Scamander, (b. 24 February,1897) was an English wizard, famed + Magizoologist and the author of Fantastic Beasts and Where to Find Them. Early in life, Scamander + developed an interest in magical creatures, influenced by his mother's breeding of hippogriffs. He + attended Hogwarts School of Witchcraft and Wizardry, where he was sorted into Hufflepuff House. + While at Hogwarts he was sentenced to expulsion, though Albus Dumbledore, who had been his Defence + Against the Dark Arts instructor, recognised his innocence, and objected strongly. +

+
+
+
+
+
+ Nymphadora Tonks +
+

Nymphadora Tonks

+
+

+ Nymphadora "Dora" Lupin (née Tonks) more commonly known as Tonks was a British half-blood witch and + a Metamorphmagus. She was the only child of Ted and Andromeda Tonks (née Black). Tonks attended + Hogwarts School of Witchcraft and Wizardry from 1984 to 1991 and was Sorted into Hufflepuff House. + She was in the same year at Hogwarts as Gryffindor Charlie Weasley. +

+
+
+
+
+
+ Cedric Diggory +
+

Cedric Diggory

+
+

+ Cedric Diggory was a British wizard who was the son of Amos Diggory and his wife. He started + attending Hogwarts School of Witchcraft and Wizardry in 1989, and was sorted into the Hufflepuff + House. During his time at school he was a prefect and captained the Hufflepuff Quidditch team, + playing as Seeker. In his sixth year Cedric put his name forward to compete in the Triwizard + Tournament. +

+
+
+
+ + diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Cedric_Diggory.jpeg b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Cedric_Diggory.jpeg new file mode 100644 index 0000000..61e42cd Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Cedric_Diggory.jpeg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Helga_Hufflepuff.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Helga_Hufflepuff.jpg new file mode 100644 index 0000000..d50def4 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Helga_Hufflepuff.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Newt_Scamander.jpeg b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Newt_Scamander.jpeg new file mode 100644 index 0000000..a480be4 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Newt_Scamander.jpeg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Nymphadora_Tonks.png b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Nymphadora_Tonks.png new file mode 100644 index 0000000..5585923 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/Nymphadora_Tonks.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/logo.svg b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/logo.svg new file mode 100644 index 0000000..16ce1b7 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Hufflepuff/images/logo.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/README.md b/public/Projects/Arnav Sharma/Hogwarts/code/README.md new file mode 100644 index 0000000..5e26464 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/README.md @@ -0,0 +1,57 @@ +# Hogwarts + +> ## Play the Quiz here: [Hogwarts](https://hogwarts-quiz-app.herokuapp.com/) + +![Hogwarts](./ReadmeImages/Hogwarts.png "Image Of Homepage of Hogwarts") + +## What is Hogwarts About? + +Hogwarts is a Web App made using HTML, CSS and JavaScript. +This project is made by Harry Potter lovers for Harry Potter lovers. +The goal of this project is to test how deep is your knowledge of the Harry Potter Universe. +You will be given a series of questions, the more correct answers you answer, the higher your score will be. +Do you believe you know the Harry Potter universe? +Can you get the maximum score? + +--- + +## How to Play + +### First, on the Home Page, click on the "Play" button: + +![Play Menu](./ReadmeImages/playmenu.png "Image of Play Menu") + +--- + +### Then, answer the questions: + +![Question Example](./ReadmeImages/questionexample.png?raw=true "Image of Sample Quiz Questions") + +--- + +### Check your score: + +![Result](./ReadmeImages/end.png?raw=true "Result") + +--- + +## To explore more about Gryffindor , Hufflepuff , Ravenclaw & Slytherin click on the house crests on home page + +![House Image's](./ReadmeImages/4housesinoneimage.jpg?raw=true "House Image's") + +--- + +## Want to be a wizard and contribute to Hogwarts? + +- [Read Contribution Guidline for this Repo](https://github.com/arnav1776/Hogwarts/blob/master/CONTRIBUTING.md) +- Fork the repo +- Clone the repo in your local system (git clone https://github.com//Hogwarts.git) +- Navigate to the project directory (cd Hogwarts/) +- Add a remote to original repo (git remote add upstream https://github.com/arnav1776/Hogwarts.git) +- Always pull upstream repo to be up-to-data (git pull upstream main) +- Create a new branch (git checkout -b ) +- Make your desired changes +- Track your changes (git add .) +- Commit your changes (git commit -m "relevant message") +- Push to the branch (git push -u origin ) +- Create a Pull Request diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Flitwick.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Flitwick.jpg new file mode 100644 index 0000000..ad82cb1 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Flitwick.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Lockhart.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Lockhart.jpg new file mode 100644 index 0000000..349b785 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Lockhart.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Ollivander.png b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Ollivander.png new file mode 100644 index 0000000..5fe357a Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Ollivander.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Rowena_Ravenclaw.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Rowena_Ravenclaw.jpg new file mode 100644 index 0000000..34e7a8a Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/Rowena_Ravenclaw.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/logo.svg b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/logo.svg new file mode 100644 index 0000000..676d47d --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/images/logo.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/ravenclaw.css b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/ravenclaw.css new file mode 100644 index 0000000..b9111d7 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/ravenclaw.css @@ -0,0 +1,241 @@ +@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=PT+Sans&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Cinzel&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Cormorant:wght@300;400&family=Rye&display=swap'); +/* Change the following color pallete alone */ +:root { + --color1: #1a472a; + --color2: #2a623d; + --color3: #0e1a40; + --color4: #946b2d; + --color5: #000000; + --color6: #5d5d5d; + --color7: #222f5b; + --color8: #424E78; +} + +* { + margin: 0px; + padding: 0px; +} + +body { + overflow-x: hidden; +} + +header { + width: 100%; + background-color: var(--color7); + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px; + display: flex; + flex-direction: row; + align-items: center; +} +.logo-container, .heading, .back{ + display: flex; +} +.logo-container{ + flex: 1; +} +.logo-container img{ + width: 20vh; + -webkit-filter: drop-shadow(0 0.2rem 0.25rem rgba(0, 0, 0, 0.2)); + filter: drop-shadow(0 0.2rem 0.25rem rgba(0, 0, 0, 0.2)); +} +.heading{ + flex: 2; + flex-direction: column; +} +.heading h1 { + color: var(--color4); + font-family: 'Cinzel'; + text-align: center; + font-size: 8vh; + letter-spacing: 5px; +} +.heading img { + padding-top: 1vh; + width: 20%; + height: 20%; + margin: auto; +} +.back{ + flex: 1; +} +.back a:link, a:visited { + margin-left: auto; + margin-right: 10%; + background-color: var(--color8); + color: var(--color4); + border-radius: 10%; + padding: 15px 20px; + text-align: center; + text-decoration: none; + display: inline-block; + transition: 0.4s; + cursor: pointer; + } + +.back a:hover, a:active { + background-color: var(--color3); + color: var(--color4); + } +.sec1 { + width: 100vw; + height: 80vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + background: #0e1a40 +} + +.sec1 article { + display: grid; + text-align: center; + place-items: center; + width: 50%; + height: 50%; + background-color: var(--color7); + box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset; + +} + +.sec1 article p { + font-size: 2.1vw; + font-family: 'Cormorant', serif; + font-weight: 400; + color: var(--color4); +} + +.sec2 { + width: 100vw; + height: 100vh; + background: var(--color4); + padding-top: 10vh; +} + +.sec2 article { + margin-left: auto; + margin-right: auto; + width: 50%; + color: var(--color6); + z-index: 2; + + +} + +.sec2 article h2 { + color: var(--color6); + font-size: 4vw; + font-family: 'Cinzel'; + text-align: center; +} + + +.sec2 article ul { + padding: 25px 25px 25px 25px; + border-radius: 2%; + text-align: center; + list-style: none; + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} + +.sec2 article ul li{ + list-style: none; +} + + +.sec2 article ul li h3 { + font-size: 2.5vw; +} + +.sec2 article ul li p { + font-size: 1.1vw; + color: var(--color3); + font-family: sans-serif; +} + +.sec3 { + height: 100vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: #353F65 +} + +.sec3 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec3 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.sec4 { + height: 30vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: #353F65; +} +.sec4 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec4 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} +.sec5 { + height: 100vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: #353F65; +} +.sec5 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec5 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} + +.content { + flex: 2; + display: flex; + flex-direction: column; +} + +.content h2 { + text-align: center; + color: var(--color6); + font-size: 3.8vw; + font-family: 'Cinzel'; +} +.content p { + margin-left: auto; + margin-right: auto; + width: 60%; + text-align: justify; + color: var(--color4); + font-family: sans-serif; + font-size: 1.5vw; +} diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/ravenclaw.html b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/ravenclaw.html new file mode 100644 index 0000000..4022368 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Ravenclaw/ravenclaw.html @@ -0,0 +1,138 @@ + + + + + + + + + + Ravenclaw + + +
+
+ icon +
+
+

Ravenclaw

+ Gryffindor Logo +
+
+ BACK +
+
+
+
+

Or yet in wise old Ravenclaw,
+ If you've a ready mind,
+ Where those of wit and learning,
+ Will always find their kind." + +

+
+ +
+ +
+
+

Traits

+
+
    +
  • +

    Wisdom

    +

    Ravenclaw House prized learning, wisdom, wit, and intellect in its members.[6] Thus, many + Ravenclaws tended to be academically motivated and talented students.

    +
  • +
    +
  • +

    Hard Working

    +

    Ravenclaws are often hard-working and diligent, as often was the case with intellectuals with a + predisposition for academics, some of the pupils sorted under the blue-bronzed eagle were known + to be inclined to dismiss certain social expectations for the sake of satisfying their own + intellectual curiosity.

    +
  • +
    +
  • +

    Curious

    +

    Ravenclaws tended to be curious about the world and paid attention to the world around them. + Ravenclaws were known to be logical and rational. In addition, Ravenclaw students tended to have + abilities regarding Memory.

    +
  • +
    +
  • +

    Exceptional memory

    +

    Ravenclaw students tended to have abilities regarding Memory. Garrick Ollivander, for example, + possessed an eidetic memory and can remember every wand he has sold,[21] and Gilderoy Lockhart + had an exceptional talent in the Memory Charm.

    +
  • +
+
+
+ +
+
+ Founder name +
+

Rowena Ravenclaw +

+
+

Rowena Ravenclaw (fl. c. 993 – 1000) was a Scottish witch. Noted for her intelligence and creativity and regarded as one of the greatest witches of the age, Ravenclaw was one of the four founders of Hogwarts School of Witchcraft and Wizardry along with Godric Gryffindor, Helga Hufflepuff and Salazar Slytherin, as well as the namesake of the Ravenclaw House. Ravenclaw was "beautiful yet slightly intimidating." + + Ravenclaw died sometime in the eleventh century, after she fell fatally ill. Legend had it that a broken heart is the cause — because her daughter Helena ran away with her diadem. Rowena's portrait remains at Hogwarts.

+
+
+
+ +
+
+ Ravenclaw Logo +
+

FAMOUS RAVENCLAWS

+
+
+
+
+ Ollivander +
+

Garrick Ollivander +

+
+

Garrick Ollivander (born 25 September, 1909) was a half-blood wizard who was + the proprietor of Ollivanders in Diagon Alley during most of the 20th century. Ollivander + was widely considered the best wandmaker in the world, and many wizards and witches bought + their wands from him.

+
+
+
+ +
+
+ Flitwick +
+

Filius Flitwick

+
+

Professor Filius Flitwick (born 17 October 1958 or earlier) was a Part-Goblin wizard + who attended Hogwarts School of Witchcraft and Wizardry and was sorted into Ravenclaw House, + being an intelligent young man and a model student. After his graduation, + Flitwick returned to Hogwarts and became the Charms Master, as well as the Head of Ravenclaw House.

+
+
+
+
+
+ Lockhart +
+

Gilderoy Lockhart

+
+

Professor Gilderoy Lockhart, Order of Merlin (Third Class), (born 26 January, 1964) + was a half-blood wizard, a Ravenclaw student at Hogwarts School + of Witchcraft and Wizardry, and later a famous wizarding celebrity + who authored many books on dark creatures and his supposed encounters with them. + Later on in the books we learn that he is a fradulent personality with more charm than skill. +

+
+
+
+ + diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/Draco_Malfoy_TDH.png b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/Draco_Malfoy_TDH.png new file mode 100644 index 0000000..fea2f06 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/Draco_Malfoy_TDH.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/Horace_Slughorn.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/Horace_Slughorn.jpg new file mode 100644 index 0000000..b98a739 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/Horace_Slughorn.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/Salazar_Slytherine.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/Salazar_Slytherine.jpg new file mode 100644 index 0000000..08faae4 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/Salazar_Slytherine.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/logo.svg b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/logo.svg new file mode 100644 index 0000000..bab228f --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/logo.svg @@ -0,0 +1,53 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/merlin.png b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/merlin.png new file mode 100644 index 0000000..57df6ec Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/merlin.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/slytherin-clipart.png b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/slytherin-clipart.png new file mode 100644 index 0000000..da26a37 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/images/slytherin-clipart.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/slytherin.css b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/slytherin.css new file mode 100644 index 0000000..d116b53 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/slytherin.css @@ -0,0 +1,242 @@ +@import url("https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap"); +@import url("https://fonts.googleapis.com/css2?family=PT+Sans&display=swap"); +@import url("https://fonts.googleapis.com/css2?family=Cinzel&display=swap"); +@import url("https://fonts.googleapis.com/css2?family=Abril+Fatface&family=Cormorant:wght@300;400&family=Rye&display=swap"); +/* Change the following color pallete alone */ +:root { + --color1: #1a472a; + --color2: #2a623d; + --color3: #3e554f; + --color4: #658974; + --color5: #000000; + --color6: #3a6b66; + --color7: #266748; + --color8: #164b2f; +} + +* { + margin: 0px; + padding: 0px; +} + +body { + overflow-x: hidden; +} + +header { + width: 100%; + background-color: var(--color7); + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; + display: flex; + flex-direction: row; + align-items: center; +} +.logo-container, +.heading, +.back { + display: flex; +} +.logo-container { + flex: 1; +} +.logo-container img { + width: 20vh; + -webkit-filter: drop-shadow(0 0.2rem 0.25rem rgba(0, 0, 0, 0.2)); + filter: drop-shadow(0 0.2rem 0.25rem rgba(0, 0, 0, 0.2)); +} +.heading { + flex: 2; + flex-direction: column; +} +.heading h1 { + color: var(--color4); + font-family: "Cinzel"; + text-align: center; + font-size: 8vh; + letter-spacing: 5px; +} +.heading img { + padding-top: 1vh; + width: 20%; + height: 20%; + margin: auto; +} +.back { + flex: 1; +} +.back a:link, +a:visited { + margin-left: auto; + margin-right: 10%; + background-color: var(--color8); + color: var(--color4); + border-radius: 10%; + padding: 15px 20px; + text-align: center; + text-decoration: none; + display: inline-block; + transition: 0.4s; + cursor: pointer; +} + +.back a:hover, +a:active { + background-color: var(--color3); + color: var(--color4); +} +.sec1 { + width: 100vw; + height: 80vh; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + background: var(--color1); +} + +.sec1 article { + display: grid; + text-align: center; + place-items: center; + width: 50%; + height: 50%; + background-color: var(--color7); + box-shadow: rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, + rgba(0, 0, 0, 0.3) 0px 30px 60px -30px, + rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset; +} + +.sec1 article p { + font-size: 2.1vw; + font-family: "Cormorant", serif; + font-weight: 400; + color: var(--color4); +} + +.sec2 { + width: 100vw; + height: 100vh; + background: var(--color4); + padding-top: 10vh; +} + +.sec2 article { + margin-left: auto; + margin-right: auto; + width: 50%; + color: var(--color6); + z-index: 2; +} + +.sec2 article h2 { + color: var(--color6); + font-size: 4vw; + font-family: "Cinzel"; + text-align: center; +} + +.sec2 article ul { + padding: 25px 25px 25px 25px; + border-radius: 2%; + text-align: center; + list-style: none; + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} + +.sec2 article ul li { + list-style: none; +} + +.sec2 article ul li h3 { + font-size: 2.5vw; +} + +.sec2 article ul li p { + font-size: 1vw; + color: var(--color3); + font-family: sans-serif; +} + +.sec3 { + height: 100vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: var(--color1); +} + +.sec3 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec3 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} +.sec4 { + height: 30vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: var(--color1); +} +.sec4 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec4 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} +.sec5 { + height: 100vh; + width: 100vw; + display: flex; + justify-content: center; + align-items: center; + background: var(--color1); +} +.sec5 article { + width: 80%; + height: 80%; + display: flex; + background: var(--color7); + box-shadow: rgba(0, 0, 0, 0.56) 0px 22px 70px 4px; +} +.sec5 article img { + height: 100%; + box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, + rgba(0, 0, 0, 0.22) 0px 10px 10px; +} +.content { + flex: 2; + display: flex; + flex-direction: column; +} + +.content h2 { + text-align: center; + color: var(--color6); + font-size: 4vw; + font-family: "Cinzel"; +} +.content p { + margin-left: auto; + margin-right: auto; + width: 60%; + text-align: justify; + color: var(--color4); + font-family: sans-serif; + font-size: 1.5vw; +} diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/slytherin.html b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/slytherin.html new file mode 100644 index 0000000..116ee4e --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/Slytherin/slytherin.html @@ -0,0 +1,151 @@ + + + + + + + + + + + Slytherin + + + +
+
+ icon +
+
+

Slytherin

+ Slytherin Logo +
+
+ BACK +
+
+
+
+

"Or perhaps in Slytherin,
+ You'll make your real friends,
+ Those cunning folk use any means,
+ To achieve their ends."

+
+ +
+ +
+
+

Traits +

+
+
    +
  • +

    Ambition

    +

    A trait that nearly all Slytherins have in common is ambition. They want to be the best: the + smartest in the class, the most popular in a group of friends, the boss at work. Because of + their strong drive and work ethic, they often achieve these heights, too, becoming invaluable + members of society and powerful in the work world.

    +
  • +
    +
  • +

    Cunning

    +

    Slytherins are highly intelligent, but not in the same way as Ravenclaws. Rather than seeking to + expand their knowledge, Slytherins simply find ways to use their existing skills to their + advantage. This makes them clever and cunning and can aid them in their quest for fame and + power.

    +
  • +
    +
  • +

    Resourcefulness

    +

    Slytherins are able to make the best of any situation. They're highly adaptable and resourceful + and can find ways to turn even the worst situations to their advantage.

    +
  • +
    +
  • +

    Determination

    +

    Like Hufflepuffs, Slytherins are highly determined. Their determination, however, is more + self-focused. They will use their strong work ethic to fulfill their ambition and advance their + own position. While this may seem self-absorbed, Slytherins recognise that by focusing on + self-improvement, they can become better friends and family members and be more useful to + society as a whole.

    +
  • +
+
+
+ +
+
+ Salazar Slytherin +
+

Salazar Slytherin + +

+
+

Professor Salazar Slytherin was a pure-blood wizard of medieval times. He was a Parselmouth (a wizard + with the rare ability to speak with snakes) and skilled at Legilimency.He was one of the four + founders of Hogwarts School of Witchcraft and Wizardry and the former best friend of Godric + Gryffindor, a fellow founder. Slytherin didn't trust Muggle-born students, and he expressed his + opinion not to accept them at Hogwarts. However, when the other Hogwarts founders didn't agree, + Slytherin left the school and did not return again but not before creating the Chamber of Secrets + and concealing a basilisk inside. He died sometime in the Middle Ages.

+
+
+
+
+
+ Slytherin Logo +
+

FAMOUS SLYTHERINS

+
+
+
+
+ Draco Malfoy +
+

Draco Malfoy +

+
+

Draco Lucius Malfoy(b. 5 June 1980) was a British pure-blood wizard and the only son of Lucius + and Narcissa Malfoy(née Black). The son of a Death Eater, Draco was raised to strongly believe in + the importance of blood purity. He attended Hogwarts School of Witchcraft and Wizardry from + 1991-1998 and was sorted into Slytherin House. During his years at Hogwarts, he became friends with + Vincent Crabbe, Gregory Goyle, Pansy Parkinson, and other fellow Slytherins, but he quickly + developed a rivalry with Harry Potter.

+
+
+
+
+
+ Merlin +
+

Merlin

+
+

Merlin was a legendary British wizard who lived during the Middle Ages. Little is known of his past, + but he was a member of King Arthur's court, and arguably the most famous wizard of all time.
+ Merlin was born sometime during the medieval era. During his formative years, he attended + Hogwarts School of Witchcraft and Wizardry, and was sorted into Slytherin House. It is possible + that he was taught by Salazar Slytherin himself, given the time period Merlin lived in. It is said + that Merlin's wand was of English oak (though his grave has never been found, so this cannot be + proven).

+
+
+
+
+
+ Merlin +
+

Horace Slughorn

+
+

Professor Horace Eugene Flaccus Slughorn (b. 28 April, between 1882 and 1913) was a + pure-blood or half-blood wizard. He attended Hogwarts School of Witchcraft and Wizardry as a + member of Slytherin before returning in 1931 as Potions Master. He also served as Head of Slytherin + House, before retiring in 1981 due to a fear that Albus Dumbledore would discover that he had told + Tom Riddle about Horcruxes.

+
+
+
+ + + \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/blue-bg.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/blue-bg.jpg new file mode 100644 index 0000000..26c855b Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/blue-bg.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/end.css b/public/Projects/Arnav Sharma/Hogwarts/code/end.css new file mode 100644 index 0000000..9d3207b --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/end.css @@ -0,0 +1,111 @@ +*{ + margin: 0; + padding: 0; +} +body{ + background-image: url('blue-bg.jpg'); + background-size:cover; + color: white; + /* color: grey; */ +} +.container{ + position: absolute; + /* border: 2px solid white; */ + /* background-color: aqua; */ + background-color: rgb(196, 188, 188); + top: 40%; + left: 50%; + transform: translate(-50%,-50%); + height: auto; + width: 33vw; + border-radius: 20px; +} +.score{ + background:linear-gradient(rgb(236, 61, 8), rgb(167, 32, 32), rgb(94, 5, 5)); + height: auto; + padding: 5px; + text-align: center; + font-family: Arial, Helvetica, sans-serif; + border-radius: 20px; +} +#yourScore, #finalScore{ + font-size: 2.5vw; + font-weight: bold; +} +.over{ + background-color: rgb(87, 80, 80); + border-radius: 20px; + font-size: 3.7vw; + font-weight: bold; + height: auto; +} +.form{ + background: linear-gradient(rgb(196, 188, 188),rgb(94, 88, 88)); + height: auto; + font-family: Arial, Helvetica, sans-serif; + color: black; + padding: 3% 0; + text-align: center; +} +#username{ + font-size: 1.5vw; + margin-left: 0; + height: auto; + border-radius: 10px; + padding: 1%; + /* line-height: 4rem; */ + +} +#end-text{ + text-align: center; + font-size: 2vw; +} +/* .in{ + margin-left: 50px; +} */ +.btn{ + height: auto; + background-color: rgb(27, 138, 27); + font-size: 1.7vw; + width: 100px; + color: white; + border-radius: 15px; +} +.btn:hover{ + color: rgb(10, 9, 9); + +} +.button{ + display: flex; + flex-direction: row; + justify-content: space-between; + margin: 30px; +} + +.button a{ + height: auto; + width: 120px; + text-align: center; + padding-top: 5px; + text-decoration: none; +} +.button a:hover{ + height: auto; + width: 120px; + text-align: center; + padding-top: 5px; + color: black; +} + +@media (max-width: 800px) { + .container{ + width: 50vw; + } + #username, .btn{ + font-size: 3vw; + margin: 2%; + } + .btn{ + padding: 2%; + } +} \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/end.html b/public/Projects/Arnav Sharma/Hogwarts/code/end.html new file mode 100644 index 0000000..4ecd23a --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/end.html @@ -0,0 +1,45 @@ + + + + + + + Document + + + + + + +
+
+
+
Game Over
+
+

Your Score

+ +

0

+
+
+
+
+

To save your score

+ +
+ + +
+
+
+ +
+
+ + + + \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/end.js b/public/Projects/Arnav Sharma/Hogwarts/code/end.js new file mode 100644 index 0000000..7afa387 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/end.js @@ -0,0 +1,36 @@ +const username = document.querySelector('#username') +const saveScoreBtn = document.querySelector('#saveScoreBtn') +const finalScore = document.querySelector('#finalScore') +const mostRecentScore = localStorage.getItem('mostRecentScore') + +const highScores = JSON.parse(localStorage.getItem('highScores')) || [] + +const MAX_HIGH_SCORES = 5 + +finalScore.innerText = mostRecentScore + +username.addEventListener('keyup', () => { + saveScoreBtn.disabled = !username.value +}) + +saveHighScore = e => { + e.preventDefault() + + const score = { + score: mostRecentScore, + name: username.value + } + + highScores.push(score) + + highScores.sort((a,b) => { + return b.score - a.score + }) + + highScores.splice(5) + + localStorage.setItem('highScores', JSON.stringify(highScores)) + window.location.assign('/') + + +} \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/endpage.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/endpage.jpg new file mode 100644 index 0000000..1ba98b1 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/endpage.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/fonts/Lumos.woff b/public/Projects/Arnav Sharma/Hogwarts/code/fonts/Lumos.woff new file mode 100644 index 0000000..f30c974 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/fonts/Lumos.woff differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/fonts/Lumos.woff2 b/public/Projects/Arnav Sharma/Hogwarts/code/fonts/Lumos.woff2 new file mode 100644 index 0000000..8251c86 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/fonts/Lumos.woff2 differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/game.css b/public/Projects/Arnav Sharma/Hogwarts/code/game.css new file mode 100644 index 0000000..187fb11 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/game.css @@ -0,0 +1,151 @@ +ody { + color: #fff; +} +body { + background: linear-gradient(rgb(130, 220, 226), rgb(7, 54, 109)); + height: 590px; + overflow-x: hidden; +} +/* .choice-container { + display: flex; + margin-bottom: 0.8rem; + width: 100%; + border-radius: 4px; + background: rgb(18, 93, 255); + font-size: 2rem; + min-width: 30rem; + height: 60px; +} */ + +/* .choice-container:hover { + cursor: pointer; + box-shadow: 0 0.4rem 1.4rem 0 rgba(6, 103, 247, 0.5); + /* transform: scale(1.02); + transform: transform 100ms; */ +/* height: 60px; */ +/* } */ + +#game { + width: 100%; + max-width: 80vw; + margin: 2vw auto; +} + +.choice-container { + padding: 0; + display: flex; + height: 2cm; + justify-content: flex-start; + margin-bottom: 0.2rem; + background-color: yellow; + border-radius: 20px; + overflow: hidden; +} +.choice-container:hover { + cursor: pointer; + box-shadow: 0 0.4rem 0.4rem 0 rgba(6, 103, 247, 0.5); + transform: scale(1.009); + transform: transform 100ms; +} +.choice-prefix { + padding: 1.5rem 2.5rem; + color: black; + width: 10px; + font-family: Arial, Helvetica, sans-serif; + font-size: 1.8rem; +} + +.choice-text { + padding: 1.5rem; + width: 90%; + font-family: Arial, Helvetica, sans-serif; + font-size: 1.8rem; + font-weight: bolder; +} +.choice-container p { + height: max-content; + margin-top: 0; +} + +.correct { + background: linear-gradient( + 32deg, + rgba(11, 223, 36) 0%, + rgb(41, 232, 111) 100% + ); + border-top-right-radius: 20px; + border-bottom-right-radius: 20px; +} + +.incorrect { + background: linear-gradient( + rgba(230, 29, 29, 1) 0%, + rgb(224, 11, 11, 1) 100% + ); + border-top-right-radius: 20px; + border-bottom-right-radius: 20px; +} + +/* Heads up Display */ +#hud { + display: flex; + justify-content: space-between; +} + +.hud-prefix { + text-align: center; + font-size: 2rem; +} + +.hud-main-text { + text-align: center; +} + +#progressBar { + width: 20rem; + height: 2rem; + border: 0.2rem solid rgb(2, 46, 7); + border-radius: 50px; + overflow: hidden; +} + +#progressBarFull { + height: 100%; + background: rgb(2, 146, 21); + width: 0%; +} + +#progressTxt { + margin: 0; +} +.hud-item p { + margin-top: 0; +} +.time { + margin-top: 0; + text-align: center; + font-size: 2rem; +} +#time-left { + text-align: center; +} +#question { + font-size: 0.62cm; + font-family: Arial, Helvetica, sans-serif; + font-weight: bolder; + padding-left: 1cm; +} +.options { + display: flex; + flex-direction: column; + padding-top: 0; + margin-top: 10px; + height: 350px; + justify-content: flex-start; +} + +@media screen and (min-width: 2400px) { + #game { + max-width: 2000px; + } +} diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/game.html b/public/Projects/Arnav Sharma/Hogwarts/code/game.html new file mode 100644 index 0000000..cf40dd8 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/game.html @@ -0,0 +1,63 @@ + + + + + + Quiz Page + + + + + +
+
+
+
+

+ Question +

+
+
+
+
+
+

+ Score +

+

+ 0 +

+
+
+

+ Time Left +

+

+ 15 +

+
+
+

What is the answer to this question

+
+
+

A

+

Choice

+
+
+

B

+

Choice 2

+
+
+

C

+

Choice 3

+
+
+

D

+

Choice 4

+
+
+
+
+ + + \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/game.js b/public/Projects/Arnav Sharma/Hogwarts/code/game.js new file mode 100644 index 0000000..1fc23fa --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/game.js @@ -0,0 +1,225 @@ +const question = document.querySelector("#question"); +const choices = Array.from(document.querySelectorAll(".choice-text")); +const progressText = document.querySelector("#progressText"); +const scoreText = document.querySelector("#score"); +const progressBarFull = document.querySelector("#progressBarFull"); +const time = document.querySelector("#time-left"); + +let currentQuestion = {}; +let acceptingAnswers = true; +let score = 0; +let questionCounter = 0; +let availableQuestions = []; + +let questions = [ + { + question: + "What was the name of the Pygmy Puff Ginny bought from Weasleys’ Wizard Wheezes?", + choice1: "Hugo", + choice2: "Barry", + choice3: "Arnold", + choice4: "Craig", + answer: 3, + }, + { + question: "Which is the correct Wand core type among the following?", + choice1: "Dragon heartstrings", + choice2: "Unicorn hair", + choice3: "Phoenix feathers", + choice4: "All of the above", + answer: 4, + }, + { + question: "Who saved Buckbeak from being executed?", + choice1: "Harry and Hermione", + choice2: "Harry and Ron", + choice3: "Hermoine and Ron", + choice4: "None of the above", + answer: 1, + }, + { + question: + "What is the name of the plant that Harry uses in order to breathe underwater during the Tri-Wizard tournament?", + choice1: "Alihotsy", + choice2: "Gillyweed", + choice3: "Valerian", + choice4: "None of the above", + answer: 2, + }, + { + question: "Who is Harry's godfather?", + choice1: "Dumbeldore", + choice2: "Snape", + choice3: "Lupin", + choice4: "Sirius", + answer: 4, + }, + { + question: "What is Voldemort's middle name?", + choice1: "Marvalo", + choice2: "Gaunt", + choice3: "Salazar", + choice4: "Riddle", + answer: 1, + }, + { + question: + "What were the middle names Albus Dumbledore had? (Hint- He told it in front of the Minister of Magic in Order of Phoneix)", + choice1: "Percival Wulfric Brian", + choice2: "Percival Brian", + choice3: "Wulfric Brian", + choice4: "None of the above", + answer: 1, + }, + { + question: "Which of these are the ingredients for the Polyjuice Potion?", + choice1: "Lacewing flies(stewed for 10 days), Boomslang skin", + choice2: "Gillyweed, knotgrass", + choice3: "Lacewing flies(stewed for 21 days), shredded Boomslang skin", + choice4: "McNuggets and fries", + answer: 3, + }, + { + question: + "A spell when cast, causes severe haemmorhage, and lacerates the target. What spell am i talking bout?", + choice1: "Crucio", + choice2: "Rictumsempra", + choice3: "Sectumsempra", + choice4: "Alahamora", + answer: 3, + }, + { + question: "What are the names of Severus Snape's parents?", + choice1: "Tobias Snape and Eileen Snape", + choice2: "Tripp snape and Eliana Snape", + choice3: "Not mentioned in the book", + choice4: "Theodore Snape and Eveleen Snape", + answer: 1, + }, + { + question: "How many exceptions are there to Gamp's Elemental Law?", + choice1: "3", + choice2: "6", + choice3: "2", + choice4: "5", + answer: 4, + }, + { + question: "Which of these animals is Harry Potter's patronus?", + choice1: "Cat", + choice2: "Stag", + choice3: "Fox", + choice4: "Phoenix", + answer: 2, + }, + { + question: "Which Hogwarts house is represented by a serpent?", + choice1: "Gryffindor", + choice2: "Hufflepuff", + choice3: "Ravenclaw", + choice4: "Slytherin", + answer: 4, + }, + { + question: "What is Harry Potter's favourite food?", + choice1: "Treacle tart", + choice2: "Chocolate frogs", + choice3: "Pumpkin pasties", + choice4: "Rock cakes", + answer: 1, + }, + { + question: "Who killed Nagini, Voldemort's snake?", + choice1: "Luna Lovegood", + choice2: "Ginny Weasley", + choice3: "Neville Longbottom", + choice4: "Dean Thomas", + answer: 3, + }, + { + question: "What colour fur does Crookshanks have? (Hermiones's cat)", + choice1: "Grey", + choice2: "Black and white", + choice3: "Tabby", + choice4: "Ginger", + answer: 4, + }, +]; + +const SCORE_POINTS = 5; +const MAX_QUESTIONS = 15; + +startGame = () => { + questionCounter = 0; + score = 0; + availableQuestions = [...questions]; + getNewQuestion(); +}; + +getNewQuestion = () => { + questionCounter++; + if (availableQuestions.length === 0 || questionCounter > MAX_QUESTIONS) { + localStorage.setItem("mostRecentScore", score); + return window.location.assign("/end.html"); + } + count = 15; + function timer() { + count = count < 10 ? "0" + count : count; + time.innerHTML = `${count}`; + if (count < 1) { + window.clearInterval(update); + getNewQuestion(); + alert("You're out of time!"); + } + count--; + } + update = setInterval(timer, 1000); + progressText.innerText = `Question ${questionCounter} of ${MAX_QUESTIONS}`; + progressBarFull.style.width = `${(questionCounter / MAX_QUESTIONS) * 100}%`; + + const questionsIndex = Math.floor(Math.random() * availableQuestions.length); + currentQuestion = availableQuestions[questionsIndex]; + question.innerText = currentQuestion.question; + + choices.forEach((choice) => { + const number = choice.dataset["number"]; + choice.innerText = currentQuestion["choice" + number]; + }); + + availableQuestions.splice(questionsIndex, 1); + + acceptingAnswers = true; +}; + +choices.forEach((choice) => { + choice.addEventListener("click", (e) => { + if (!acceptingAnswers) return; + + acceptingAnswers = false; + const selectedChoice = e.target; + const parentToselectedChoice = e.target.parentElement; + const selectedAnswer = selectedChoice.dataset["number"]; + + let classToApply = + selectedAnswer == currentQuestion.answer ? "correct" : "incorrect"; + + if (classToApply === "correct") { + incrementScore(SCORE_POINTS); + } + window.clearInterval(update); + parentToselectedChoice.classList.add(classToApply); + + setTimeout(() => { + parentToselectedChoice.classList.remove(classToApply); + + getNewQuestion(); + }, 1000); + }); +}); + +incrementScore = (num) => { + score += num; + scoreText.innerText = score; +}; + +startGame(); diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/highscores.css b/public/Projects/Arnav Sharma/Hogwarts/code/highscores.css new file mode 100644 index 0000000..9f5264f --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/highscores.css @@ -0,0 +1,13 @@ +body { + color: #fff; +} + +#highScoresList { + list-style: none; + margin-bottom: 4rem; +} + +.high-score { + font-size: 2.8rem; + margin-bottom: 0.5rem; +} diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/highscores.html b/public/Projects/Arnav Sharma/Hogwarts/code/highscores.html new file mode 100644 index 0000000..5a545b1 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/highscores.html @@ -0,0 +1,22 @@ + + + + + + High Scores + + + + + + +
+
+

Leaderboard

+
    + Go Home +
    +
    + + + \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/highscores.js b/public/Projects/Arnav Sharma/Hogwarts/code/highscores.js new file mode 100644 index 0000000..7f17574 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/highscores.js @@ -0,0 +1,7 @@ +const highScoresList = document.querySelector('#highScoresList') +const highScores = JSON.parse(localStorage.getItem("highScores")) || [] + +highScoresList.innerHTML = +highScores.map(score => { + return `
  • ${score.name} - ${score.score}
  • ` +}).join("") \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/hogwarts.css b/public/Projects/Arnav Sharma/Hogwarts/code/hogwarts.css new file mode 100644 index 0000000..e7583e8 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/hogwarts.css @@ -0,0 +1,412 @@ +@import url("https://fonts.googleapis.com/css2?family=Baloo+2:wght@500&display=swap"); +@import url("https://fonts.googleapis.com/css2?family=Crimson+Text&display=swap"); +@import url("http://fonts.cdnfonts.com/css/harry-potter"); +@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@200&display=swap"); +@import url("https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap"); + +@font-face { + font-family: "AuldMagick Bold"; + src: url("https://db.onlinewebfonts.com/t/8da4e7bc1e0eb9534a2ee26db6d521ce.eot"); + src: url("//db.onlinewebfonts.com/t/8da4e7bc1e0eb9534a2ee26db6d521ce.eot?#iefix") + format("embedded-opentype"), + url("//db.onlinewebfonts.com/t/8da4e7bc1e0eb9534a2ee26db6d521ce.woff2") + format("woff2"), + url("//db.onlinewebfonts.com/t/8da4e7bc1e0eb9534a2ee26db6d521ce.woff") + format("woff"), + url("//db.onlinewebfonts.com/t/8da4e7bc1e0eb9534a2ee26db6d521ce.ttf") + format("truetype"), + url("//db.onlinewebfonts.com/t/8da4e7bc1e0eb9534a2ee26db6d521ce.svg#AuldMagick Bold") + format("svg"); +} +@font-face { + font-family: "Magic School One"; + src: url(/house_page_template/magic-school.one.ttf); +} + +@font-face { + font-family: "Lumos"; + src: url("fonts/Lumos.woff2") format("woff2"), + url("fonts/Lumos.woff") format("woff"); + font-weight: normal; + font-style: normal; +} + +body { + margin: 0; + padding: 0; + background-color: rgb(235, 229, 270); + font-family: Arial, Helvetica, sans-serif; +} + +header { + width: 100%; + background-color: black; + background-image: radial-gradient( + white, + rgba(255, 255, 255, 0.2) 2px, + transparent 40px + ), + radial-gradient(white, rgba(255, 255, 255, 0.15) 1px, transparent 30px), + radial-gradient(white, rgba(255, 255, 255, 0.1) 2px, transparent 40px), + radial-gradient( + rgba(255, 255, 255, 0.4), + rgba(255, 255, 255, 0.1) 2px, + transparent 30px + ); + background-size: 550px 550px, 350px 350px, 250px 250px, 150px 150px; + background-position: 0 0, 40px 60px, 130px 270px, 70px 100px; + /* border-bottom: 1px solid #133783; */ + display: flex; + flex-direction: column; + align-items: center; + padding: 0.6rem 0; + color: white; +} + +#hog { + font-family: "Harry Potter", sans-serif; + font-size: 7vw; + letter-spacing: 0.3rem; + margin-bottom: 2rem; +} +#hog1 { + font-family: "Harry Potter", sans-serif; + font-size: 3vw; + letter-spacing: 0.3rem; +} + +#dr { + font-style: italic; + font-size: 2vw; + font-family: sans-serif; + margin-top: 0px; +} +main { + display: flex; +} +.section { + flex-grow: 1; + width: 100%; + display: flex; + flex-direction: column; + align-items: center; + background: url(./images/hall.jpg); + background-size: cover; + background-attachment: fixed; +} + +#heading { + font-size: 2vw; + font-style: italic; + color: rgb(248, 247, 247); + background-color: rgba(0, 0, 0, 0.4); + padding: 5px; + border-radius: 5px; + font-family: "Magic School One"; +} +#img { + width: 20vw; + height: 20vw; + border-radius: 50%; + border: 1vw solid; + border-color: wheat; + box-shadow: 0 20px 20px 20px #0c1445; +} +#home h1 { + font-size: 4.1vw; +} +main { + display: flex; + width: 100; +} +.sec { + flex-grow: 1; + width: 100%; + height: 100vh; + display: flex; + flex-direction: column; + align-items: center; + background-image: url("./images/home2.jpg"); + background-repeat: no-repeat; + background-position: center center; + background-size: cover; + outline: none; +} +.sec h3 { + color: black; + text-align: center; + letter-spacing: 1px; + margin-top: 50px; + text-shadow: 0px 5px 5px rgb(230 241 235); + background: rgb(185 193 186 / 30%); + font-weight: bold; +} + +.sec2 { + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + background-color: rgb(36, 36, 36); + color: white; + width: 100%; + padding: 0px 0px 45px 15vw; +} + +#para { + font-family: "Crimson Text", cursive; + /*font-family:'Baloo 2',cursive;*/ + font-style: italic; + width: 70%; + font-size: 1.5rem; +} + +#h3 { + font-family: "Crimson Text", cursive; + font-style: italic; + border-style: solid; + font-size: 1.5rem; + margin: 0 5%; +} + +#ig1 { + border-color: #d72515; + box-shadow: 0 0 20px 5px #d72515; +} +#ig1:hover { + transform: scale(1.05); + box-shadow: 0 0 30px 20px #ff6842ea; + border-color: #ff6842ea; + transition: all 400ms ease-out; +} +#ig2 { + border-color: #3e85ff; + box-shadow: 0 0 20px 5px #3e85ff; +} +#ig2:hover { + transform: scale(1.05); + box-shadow: 0 0 30px 20px #72a6ff; + border-color: #72a6ff; + transition: all 400ms ease-out; +} +#ig3 { + border-color: #f5f523; + box-shadow: 0 0 20px 5px #f5f523; +} +#ig3:hover { + transform: scale(1.05); + box-shadow: 0 0 30px 20px #f8f863; + border-color: #f8f863; + transition: all 400ms ease-out; +} +#ig4 { + border-color: #2e7151; + box-shadow: 0 0 20px 5px #2e7151; +} +#ig4:hover { + transform: scale(1.05); + box-shadow: 0 0 30px 20px #3ab378; + border-color: #3ab378; + transition: all 400ms ease-out; +} + +.ig { + width: 20vw; + height: 20vw; + border-radius: 50%; + border: 1vw solid; + margin: 2.5rem; +} + +h1 { + font-size: 5.4rem; + color: #fff; + box-shadow: 0px 2px 15px 2px var(#fffdfd); + background-color: rgba(0, 0, 0, 0.5); + background: none; + border-radius: 6px; + margin-bottom: 5rem; + padding: 5px; + opacity: 1; +} + +.container { + width: 100vw; + height: 100vh; + display: flex; + justify-content: center; + align-items: center; + max-width: 80rem; + margin: 0 auto; + padding: 2rem; +} + +.flex-column { + display: flex; + flex-direction: column; +} + +.flex-center { + justify-content: center; + align-items: center; +} + +.justify-center { + justify-content: center; +} + +.text-center { + text-align: center; +} + +.hidden { + display: none; +} + +.btn { + font-size: 2.5vw; + padding: 5% 0; + width: 30vw; + text-align: center; + margin-bottom: 1rem; + text-decoration: none; + color: rgb(196, 185, 43); + background-image: url("images/play-background.png"); + background-size: contain; + font-family: "Lumos" !important; + border-radius: 4px; +} +.fas { + font-size: 2vw; +} + +.btn:hover { + cursor: pointer; + box-shadow: 0 0.4rem 1.4rem 0 rgba(233, 233, 0, 0.5); + transition: transform 150ms; + transform: scale(1.03); +} + +.btn[disabled]:hover { + cursor: not-allowed; + box-shadow: none; + transform: none; +} + +.fa-crown { + font-size: 2vw; + margin-left: 1rem; +} + +footer { + background-color: #172269; + padding: 5%; + text-align: center; +} + +footer p { + margin: -21px 0px; + font-weight: bold; + font-size: 25px; +} + +footer p a { + color: #fff; +} + +footer p a:hover { + color: #1e7352; +} + +.fact { + font-family: "Baloo 2", cursive; + color: white; + font-size: 2vw; + text-align: center; + font-weight: 500; + margin-top: 70px; + margin-bottom: 0px; + background: rgba(0, 0, 0, 0.6); + width: fit-content; + cursor: pointer; +} + +.fact:hover { + color: rgba(255, 255, 255, 0.9); +} + +@media (max-width: 620px) { + #hog, + #home h1 { + font-size: 5vw; + } + #hog1 { + font-size: 2vw; + } + #dr, + #heading, + .fact { + font-size: 3vw; + } + .btn { + width: 30vw; + padding: 5% 20%; + } + #para, + #h3 { + font-size: 1rem; + } + footer { + padding: 10%; + } +} +#myBtn { + position: fixed; + bottom: 20px; + right: 30px; + z-index: 99; + border: none; + outline: none; + background-color: rgb(134, 34, 34); + color: white; + cursor: pointer; + padding: 15px; + border-radius: 10px; + font-size: 20px; + border-radius: 30px; +} + +#myBtn:hover { + background-color: rgb(61, 2, 2); +} + +.menu { + font-family: "Harry Potter", sans-serif; + position: absolute; + color: white; + font-size: 3vw; + letter-spacing: 0.3rem; + top: 1rem; + left: 1rem; +} + +.menu:hover { + color: rgb(196, 185, 43); +} + +.menu:hover .sub-menu { + opacity: 100%; + transition: 0.6s; +} + +.sub-menu { + opacity: 0%; + list-style-type: none; + transition: 0.5s; + background-color: rgba(39, 34, 34, 0.603); +} + +.sub-menu__links { + font-size: 2vw; + color: white; +} diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/1.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/images/1.jpg new file mode 100644 index 0000000..7b005de Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/1.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/Founders_gryffindor1.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/images/Founders_gryffindor1.jpg new file mode 100644 index 0000000..19d2810 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/Founders_gryffindor1.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/Gryffindor.png b/public/Projects/Arnav Sharma/Hogwarts/code/images/Gryffindor.png new file mode 100644 index 0000000..32224af Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/Gryffindor.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/PM_RowenaRavenclaw_Founders.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/images/PM_RowenaRavenclaw_Founders.jpg new file mode 100644 index 0000000..44c8df4 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/PM_RowenaRavenclaw_Founders.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/favicon-32x32.png b/public/Projects/Arnav Sharma/Hogwarts/code/images/favicon-32x32.png new file mode 100644 index 0000000..0b7acc8 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/favicon-32x32.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/hall.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/images/hall.jpg new file mode 100644 index 0000000..d7b5321 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/hall.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/home2.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/images/home2.jpg new file mode 100644 index 0000000..38e5200 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/home2.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/lib.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/images/lib.jpg new file mode 100644 index 0000000..67e773f Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/lib.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/play-background.png b/public/Projects/Arnav Sharma/Hogwarts/code/images/play-background.png new file mode 100644 index 0000000..600b965 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/play-background.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/quidditch.png b/public/Projects/Arnav Sharma/Hogwarts/code/images/quidditch.png new file mode 100644 index 0000000..38d5fa6 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/quidditch.png differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/ravenclaw b/public/Projects/Arnav Sharma/Hogwarts/code/images/ravenclaw new file mode 100644 index 0000000..dcfd6e3 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/ravenclaw differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/salaxar_slytherin.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/images/salaxar_slytherin.jpg new file mode 100644 index 0000000..8585da0 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/salaxar_slytherin.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/images/slytherin.jpg b/public/Projects/Arnav Sharma/Hogwarts/code/images/slytherin.jpg new file mode 100644 index 0000000..26951b9 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/code/images/slytherin.jpg differ diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/index.html b/public/Projects/Arnav Sharma/Hogwarts/code/index.html new file mode 100644 index 0000000..ab47ce5 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/index.html @@ -0,0 +1,124 @@ + + + + + + + + + + Hogwarts + + + + + + + + + + + +
    +

    Hogwarts

    +

    School of Witchcraft and Wizardry

    +

    ~Draco-Dormiens-Nunquam-Titillandus~

    +
    + +
    +
    + +

    + + +

    I solemnly swear that I am upto no good!

    + + hogwarts + +
    + +
    +
    +

    Harry Potter Quiz!🧙‍♂️

    + Play + Highscore + +
    +
    + +

    +

    + +
    + + +
    +
    +
    +

    + At some point in the tenth century, four of the greatest witches and wizards that ever lived founded + Hogwarts School of Witchcraft and Wizardry. + Their names were Godric Gryffindor, Rowena Ravenclaw, Helga Hufflepuff and Salazar Slytherin. + As The Sorting Hat told us, their reason for doing so was because they had the ‘selfsame yearning, + to make the world’s best magic school’, and once they did, each created their own house to represent + a personality and skill that they wanted to nurture. +
    +
    + Hogwarts School, located somewhere in the Highlands of Scotland, consisted of the large Hogwarts Castle + and extensive school grounds surrounding it, which included sloping lawns, flowerbeds, vegetable + patches, as well as a loch (called the Black Lake), a large dense forest (called the Forbidden Forest), + several greenhouses and other outbuildings, and a full-size Quidditch Pitch. +
    + .....Gryffindor students embodied bravery and chivalry..... +
    + .....Ravenclaw, intelligence and wit..... +
    + .....Hufflepuff, loyalty and fair play..... +
    + .....Slytherin, the values of being sly and cunning..... +

    +

    “It does not do to dwell on dreams and forget to live” - Albus Dumbeldore

    +
    +
    +
    +
    +
    +
    + + Gryffindor +
    + + Ravenclaw +
    +
    + + Hufflepuff +
    + + Slytherin +
    +
    +
    +
    + + + + + \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/code/index.js b/public/Projects/Arnav Sharma/Hogwarts/code/index.js new file mode 100644 index 0000000..2d8e8bc --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/code/index.js @@ -0,0 +1,47 @@ + +let fact_content = ['', + "\" Hogwarts has a LOT of staircases – 142, in fact \"", + "\" The portraits of Hogwarts all have their own life stories \"", + "\" Peeves the poltergeist has haunted Hogwarts for many centuries \"", + "\" Muggles cannot see Hogwarts \" - unknown", + "\" An enchanted quill and book decide if you’re ready to go to Hogwarts \" ", + "\" Rowling gave her characters names that reflect their roles in the series. ... \" ", + "\" Not even the Hogwarts headmaster knows about everything that happens at Hogwarts \" ", + "\" Each Hogwarts house common room has a different way of getting inside it \" ", + "\" The Great Hall ceiling is bewitched to look like the sky \" ", + "\" No matter what day of the week it falls on, the school year in Hogwarts always begins on September 1 \" ", +] + +//I have use localStorage for storing value of i , When page will be reload we will see next consecutive fact. +let i = 0; +i = JSON.parse(localStorage.getItem('i')); + +window.addEventListener('load', () => { + i = i + 1; + if (i == fact_content.length) { + i = 0; + } + else { + document.querySelector(".fact").innerHTML = `${fact_content[i]}`; + } + localStorage.setItem('i', i); +}); +mybutton = document.getElementById("myBtn"); +window.onscroll = function() {scrollFunction()}; + +function scrollFunction() { + if (document.body.scrollTop > 30 || document.documentElement.scrollTop > 30) { + mybutton.style.display = "block"; + } else { + mybutton.style.display = "none"; + } +} +function topFunction() { + // document.documentElement.scrollTop = 0; + window.scrollTo({ + top:0, + left:0, + behavior:"smooth" + }) + +} \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/deployedLink.txt b/public/Projects/Arnav Sharma/Hogwarts/deployedLink.txt new file mode 100644 index 0000000..3ac3d95 --- /dev/null +++ b/public/Projects/Arnav Sharma/Hogwarts/deployedLink.txt @@ -0,0 +1 @@ +https://hogwarts-web-app.herokuapp.com/ \ No newline at end of file diff --git a/public/Projects/Arnav Sharma/Hogwarts/thumbnail.png b/public/Projects/Arnav Sharma/Hogwarts/thumbnail.png new file mode 100644 index 0000000..92ec114 Binary files /dev/null and b/public/Projects/Arnav Sharma/Hogwarts/thumbnail.png differ