Skip to content
This repository has been archived by the owner on Oct 27, 2024. It is now read-only.

Looking for someone to enhance the background colors for the questions and answers, and redesign the question box with a Harry Potter-themed shape. #55

Open
d-coder111 opened this issue Oct 7, 2024 · 3 comments
Labels
css design enhancement New feature or request hacktoberfest-accepted help wanted Extra attention is needed

Comments

@d-coder111
Copy link
Owner

d-coder111 commented Oct 7, 2024

Enhancement: Background Colors and Question Box Redesign

We are looking to enhance the user interface by improving the background colors for the questions and answers, as well as redesigning the question box to align with a Harry Potter theme.

Background Color Enhancements

  1. House Colors:✅

    • Gryffindor: Use a deep crimson background for questions and a soft gold background for answers.
    • Slytherin: Implement a dark emerald green for questions with a light silver background for answers.
    • Ravenclaw: Apply a rich navy blue for questions, transitioning into bronze or a lighter blue for answers.
    • Hufflepuff: Bright yellow for questions and a muted black or dark gray for answers.
  2. Magical Effects:

    • Introduce a starry night background with twinkling stars or subtle glowing effects for a mystical ambiance.
    • Use a light parchment texture for both questions and answers to create an ancient scroll feel.

Question Box Redesign Ideas

  1. Parchment Scroll:

    • Shape the question box like a rolled-up parchment scroll with ragged edges. Use a light beige color with a texture to simulate aged paper, and add text effects to mimic ink writing.
  2. Marauder’s Map:

    • Design the question box like the Marauder’s Map with doodles or small sketches like footprints or Hogwarts landmarks along the borders. Use a light brown color with subtle line drawings for enhancement.
  3. Quidditch Theme:

    • Create a rectangular box resembling a Quidditch scoreboard, utilizing wooden textures for the borders and incorporating details like the golden snitch or house banners.
  4. Potion Bottles:

    • Frame the question box with images of potion bottles at the corners, filled with colorful liquids resembling various potions.

Additional Design Elements

  • Fonts: Utilize Harry Potter-themed fonts like "Lumos" or "Magic School."
  • Icons and Illustrations: Add small icons like wands, cauldrons, or magical creatures near questions or answers for a whimsical feel.
  • Hover Effects: Implement hover effects that change the background color or add a glow effect for user interaction.
@d-coder111 d-coder111 added enhancement New feature or request help wanted Extra attention is needed hacktoberfest-accepted design css labels Oct 7, 2024
@w0wayush
Copy link

w0wayush commented Oct 7, 2024

Can you atleast deploy and add link in the repo for reference.

@d-coder111
Copy link
Owner Author

These are some ideas which are yet to be implemented and if you can come up with better ideas you are welcome to contribute.

This was referenced Oct 8, 2024
@preranah7
Copy link

Hey @d-coder111 , I am interested to do this.

@preranah7 preranah7 removed their assignment Oct 28, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
css design enhancement New feature or request hacktoberfest-accepted help wanted Extra attention is needed
Projects
None yet
Development

No branches or pull requests

3 participants