implemented style of help screen content div

5 years ago · fbb8d174f1
parent 4dbed3b19f
commit fbb8d174f1
2 changed files with 11 additions and 1 deletions
--- a/src/assets/pages/styles/theme-base.scss
+++ b/src/assets/pages/styles/theme-base.scss
@ -167,3 +167,13 @@ body {
  z-index: 2000; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
 }
+
+.overlay-content{
+  position: fixed; /* Sit on top of the page content */
+  width: 50%; /* Full width (cover the whole page) */
+  height: 50%; /* Full height (cover the whole page) */
+  top: 25%;
+  left: 25%;
+  background-color: map-get($theme-colors, secondary); /* Black background with opacity */
+  cursor: pointer; /* Add a pointer on hover */
+}
--- a/src/assets/views/help-overlay.mustache
+++ b/src/assets/views/help-overlay.mustache
@ -1,6 +1,6 @@
 <html lang="en">
 <div id="help-overlay" onclick="help.closeOverlay()" class="overlay-custom">
-    <div>
+    <div class="overlay-content">
        {{{content}}}
    </div>
 </div>