Push Console

WEB/src/CSS/enigme.css

@@ -82,6 +82,10 @@ body{
 
 .compiler_class{
     width: 30%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: flex-end;
 }
 
 textarea {
@@ -92,10 +96,10 @@ textarea {
     padding: 10px;
     margin: 10px;
     max-width: 95%;
-    max-height: 50%;
+    max-height: 100%;
     line-height: 1.5;
     border-radius: 5px;
-    border: 1px solid #ccc;
+    resize: none;
 }
 
 
@@ -112,7 +116,7 @@ textarea {
   display: flex;
 }
 
-.buttons button{
+.buttons .btn{
   position: relative;
     width: 120px;
     height: 60px;
@@ -121,37 +125,38 @@ textarea {
     margin: 20px;
   }
 
-.buttons button:before, .buttons button:after
+  .buttons .btn:before, .buttons .btn:after
-{
+  {
-  content:'';
+    content:'';
-    position: absolute;
+      position: absolute;
-    inset: 0;
+      inset: 0;
-    transition: 0.5s;
+      transition: 0.5s;
-    background: #f00
+      background: #f00
-  }
+    }
+
 
-.buttons button:nth-child(1):before, .buttons button:nth-child(1):after
+  .buttons .btn:nth-child(1):before, .buttons .btn:nth-child(1):after
   {
    background: linear-gradient(45deg, #00ccff, #0e1538, #d400d4)
   }
 
-.buttons button:nth-child(2):before, .buttons button:nth-child(2):after
+.buttons .btn:nth-child(2):before, .buttons .btn:nth-child(2):after
   {
     background: linear-gradient(45deg, #f0075b, #0e1538, #1aff22);
   }
 
-.buttons button:hover:before
+.buttons .btn:hover:before
   {
     inset: -3px;  
   }
 
-.buttons button:hover:after
+.buttons .btn:hover:after
   {
     inset: -3px;  
     filter: blur(10px);
   }
 
-.buttons button span{
+.buttons .btn span{
     position: absolute;
     top: 0;
     left: 0;
@@ -171,7 +176,7 @@ textarea {
     overflow: hidden;
   }
 
-.buttons button span::before{
+.buttons .btn span::before{
   content:'';
     position: absolute;
     top: 0;
@@ -180,4 +185,12 @@ textarea {
     height: 100%;
     background: rgba(255,255,255,0.075);
       transform: skew(25deg)
+}
+
+#hide{
+  display: none;
+}
+
+#console{
+  display: none;
 }

WEB/src/JS/base.js

@@ -36,9 +36,21 @@ function run_init() {
   if (document.getElementById("console") != '') {
     document.getElementById("console").innerHTML = '';
   }
+  hide();
   run();
 }
 
+function hide() {
+  if (document.getElementById("console").style.display == 'block'){
+    document.getElementById("console").style = ('display: none');
+    document.getElementById("hide").style =('display: none');
+  }
+  else {
+    document.getElementById("console").style = ('display: block');
+    document.getElementById("hide").style =('display: block');
+  }
+}
+
 var editor = ace.edit("editor");
 editor.setTheme("ace/theme/vibrant_ink");
 editor.getSession().setMode("ace/mode/python");

WEB/src/pages/Enigme/palindrome.html

@@ -40,15 +40,17 @@
     return True
   else:
     return False
-	</div>
+
+print(estPalindrome("abba"))</div>
   <div class='compiler_class'>
+    <button id="hide" class="btn" onclick="hide()">X</button>
     <textarea id='console' readonly rows="30" cols="100"></textarea>
     <div class="buttons">
       <div>
-        <button onclick="run_init()">
+        <button onclick="run_init()" class="btn">
           <span>Run</span>
         </button>
-        <button onclick="submit()">
+        <button onclick="submit()" class="btn">
           <span>Submit</span>
         </button>
       </div>

WEB/src/pages/Home.html

@@ -19,7 +19,7 @@
         </div>
         <div class="align-items-center">
             <div>
-                <a class="enigme" href="./Palindrome.html" />
+                <a class="enigme" href="./Enigme/palindrome.html" />
                     <span></span>
                     <span></span>
                     <span></span>
@@ -37,7 +37,7 @@
                 </a>
             </div>
             <div>
-                <a class="log" href="./LogSign/LogIn.html">
+                <a class="log" href="./LogSign/Login.html">
                     Login
                 </a>
             </div>