feat: full window sized terminal (runatlantis#3781)

Co-authored-by: PePe Amengual <jose.amengual@gmail.com>
gocardless · Feb 13, 2024 · e06729d · e06729d
1 parent 4731b43
commit e06729d
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 9 deletions.
diff --git a/server/controllers/templates/web_templates.go b/server/controllers/templates/web_templates.go
@@ -400,32 +400,41 @@ var ProjectJobsTemplate = template.Must(template.New("blank.html.tmpl").Parse(`
     <style>
       #terminal {
         position: fixed;
-        top: 200px;
+        top: 0px;
         left: 0px;
         bottom: 0px;
         right: 0px;
         border: 5px solid white;
+        z-index: 10;
         }
 
       .terminal.xterm {
         padding: 10px;
       }
+      #watermark {
+        opacity: 0.5;
+        color: BLACK;
+        position: absolute;
+        bottom: 0;
+        padding-right: 30px;
+        padding-bottom: 15px;
+        right: 0;
+        z-index: 15;
+      }
     </style>
   </head>
 
   <body>
-    <section class="header">
+    <section id="watermark">
     <a title="atlantis" href="{{ .CleanedBasePath }}/"><img class="hero" src="{{ .CleanedBasePath }}/static/images/atlantis-icon_512.png"/></a>
-    <p class="title-heading">atlantis</p>
+    <p class="terminal-heading-white">atlantis</p>
     <p class="title-heading"><strong></strong></p>
     </section>
-    <div class="spacer"></div>
-    <br>
     <section>
       <div id="terminal"></div>
     </section>
   </div>
-  <footer>Initializing...
+  <footer class="footer-white">Initializing...
   </footer>
 
     <script src="{{ .CleanedBasePath }}/static/js/jquery-3.5.1.min.js"></script>
@@ -524,7 +533,7 @@ var ProjectJobsErrorTemplate = template.Must(template.New("blank.html.tmpl").Par
     <script>
       var term = new Terminal();
       var socket = new WebSocket(
-        (document.location.protocol === "http:" ? "ws://" : "wss://") + 
+        (document.location.protocol === "http:" ? "ws://" : "wss://") +
         document.location.host +
         document.location.pathname +
         "/ws");

diff --git a/server/static/css/custom.css b/server/static/css/custom.css
@@ -350,7 +350,7 @@ tbody {
 
 /* Add Animation */
 @-webkit-keyframes animatetop {
-    from {top: -300px; opacity: 0} 
+    from {top: -300px; opacity: 0}
     to {top: 0; opacity: 1}
 }
 
@@ -369,7 +369,11 @@ tbody {
 
 .title-heading {
   font-family: monospace, monospace; font-size: 1.1em; text-align: center;
- } 
+ }
+
+.terminal-heading-white {
+  font-family: monospace, monospace; font-size: 1.1em; text-align: center; color: white;
+ }
 
 .small {
   font-size: 1.0em;
@@ -384,3 +388,13 @@ footer {
   color: grey;
   padding-right: 10px;
 }
+
+.footer-white {
+  font-family: monospace, monospace; font-size: 1.2rem;
+  position: fixed;
+  bottom: 0;
+  right: 0;
+  color: grey;
+  padding-right: 10px;
+  color: white;
+}