solved the position bug of help button

src/App.css

@@ -149,8 +149,9 @@ h2 {
   cursor: pointer;
   box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.151);
   position: absolute;
-  top: 950px;
-  left: 210px;
+  bottom: 10px;
+  right: 10px;
+  z-index: 2;
 }
 .faq-button svg {
   height: 1.5em;
@@ -247,6 +248,11 @@ h2 {
   content: attr("Sidebar");
 } */
 
+.sidebar {
+  position: relative;
+  z-index: 0;
+}
+
 .sidebar-button {
   width: 50px;
   height: 50px;
@@ -322,9 +328,10 @@ h2 {
   margin: 0;
   padding: 0;
   display: flex;
+  position: relative;
   flex-direction: column;
   justify-content: center;
-  z-index: 0;
+  z-index: 1;
 }
 
 .sidebar-list .row {
@@ -1871,7 +1878,7 @@ redudant. Not putting under calendar chart styles for obvious reasons. */
 .carousel {
   position: relative;
   width: 100%;
-  height: 100%; 
+  height: 100%;
   overflow: hidden;
 }
 
@@ -1882,16 +1889,16 @@ redudant. Not putting under calendar chart styles for obvious reasons. */
   width: 100%;
   height: 100%;
   display: none;
-  transition: opacity 0.5s; 
+  transition: opacity 0.5s;
 }
 
 .carousel-slide.active {
   display: grid;
   opacity: 1;
-  align-items: center; 
+  align-items: center;
   grid-template-columns: 1fr 1fr;
   grid-template-rows: 1fr 2fr;
-  grid-template-areas: 
+  grid-template-areas:
     'img-top title'
     'img-bot content';
 }
@@ -1961,17 +1968,17 @@ redudant. Not putting under calendar chart styles for obvious reasons. */
   transform: translateX(-50%);
   display: flex;
   justify-content: center;
-  z-index: 1; 
+  z-index: 1;
 }
 
 .carousel-indicators button {
   margin: 0 5px;
   border: none;
   background-color: #fff;
   cursor: pointer;
-  font-size: 24px; 
+  font-size: 24px;
   padding: 5px;
-  border-radius: 50%; 
+  border-radius: 50%;
 }
 
 .carousel-indicators button.active {
@@ -1987,11 +1994,11 @@ redudant. Not putting under calendar chart styles for obvious reasons. */
   border-radius: 12px;
   border: none;
   cursor: pointer;
-  font-size: 36px; 
+  font-size: 36px;
   padding: 10px;
   padding-bottom: 15px;
   z-index: 1;
-   
+
 }
 
 .carousel-prev {
@@ -2004,9 +2011,9 @@ redudant. Not putting under calendar chart styles for obvious reasons. */
 
 .carousel-prev:hover, .carousel-next:hover {
   background-color: #ccc;
-  filter: brightness(120%); 
+  filter: brightness(120%);
 }
 
 .carousel-prev:active, .carousel-next:active {
-  background-color: #aaa; 
+  background-color: #aaa;
 }