Results summary component 【 React & TypeScript 】

Community feedback

• 

  Tomazi•300

  @tomazi15Posted over 1 year ago

  Hi @Kure-ru

  The problem you are having is is z-index: -1 I think what this does it puts your summary section behind everything thing even including the body and even dough it is visible on the page because its is not covered by any other element. In short the the whole summary section sits behind and the whole section is not clickable including your button hence why you cannot see the hover effect.

  Even if you inspect the element you will see you cant pick any elements on your summary sections but you can on your result section.

  To fix this

  add z-index: 10 to your summary class and z-index: 20 to your results class. This way you will not be sending anything behind the page body but you will simply put result on top of summary.

  If you still struggling i can make a PR to your repo :)

  Hope this helps keep coding 👌

  Marked as helpful

  0

  ---

  

  Kure-ru•120

  @Kure-ruPosted over 1 year ago

  Hi @tomazi15 ,

  Thank you so much for your help, I just couldn't figure it out. 😂

  Have a great week-end!

  0
• 

  kasey•320

  @kaseyveePosted over 1 year ago

  Hello! Your z-index in .summary is set to -1.

  Instead, you can remove that z-index and add z-index: 1; to .result.

  Marked as helpful

  0

  ---

  

  Kure-ru•120

  @Kure-ruPosted over 1 year ago

  Hi @kaseyvee Thank you for finding the error! This helps a lot. 🙏

  1