fix(playground): removes conflicting overflow settings creating multi…

…ple scrollbars (#21168) fix: conflicting overflow settings creating multiple scrollbars
vectordotdev · Aug 28, 2024 · 012a18d · 012a18d
1 parent c3cd232
commit 012a18d
Show file tree

Hide file tree

Showing 2 changed files with 3 additions and 15 deletions.
diff --git a/lib/vector-vrl/web-playground/public/index.css b/lib/vector-vrl/web-playground/public/index.css
@@ -18,7 +18,6 @@ body {
     Cantarell, "Helvetica Neue", sans-serif;
   background-color: var(--datadog-background);
   color: var(--datadog-gray);
-  overflow-x: hidden;
 }
 
 .top-bar-wrapper {
@@ -115,7 +114,7 @@ div#App {
   display: grid;
   width: calc(100% - 40px);
   max-width: 1600px;
-  height: calc(100vh - 180px);
+  height: calc(100vh - 240px);
   grid-template-columns: minmax(45%, 1fr) minmax(0, 1fr);
   grid-template-rows: auto 1fr;
   grid-gap: 1rem;
@@ -142,7 +141,6 @@ div#toolbar-section {
 
 div#input-section,
 div#output-section {
-  background-color: white;
   border: 1px solid var(--datadog-gray-lighter);
   border-radius: 4px;
 }
@@ -151,7 +149,6 @@ div#input-section {
   display: grid;
   grid-column: 1;
   grid-row: 2;
-  overflow: hidden;
 }
 
 div#output-section {
@@ -160,15 +157,13 @@ div#output-section {
   grid-row: 2;
   grid-template-rows: 1fr 1fr;
   gap: 1rem;
-  overflow: hidden;
 }
 
 #input-section #cell,
 #output-section #event-cell,
 #output-section #output-cell {
   display: grid;
   grid-template-rows: auto 1fr;
-  overflow: hidden;
 }
 
 .cell-title {
@@ -181,12 +176,6 @@ div#output-section {
   border-bottom: 1px solid var(--datadog-gray-light);
 }
 
-#container-program,
-#container-event,
-#container-output {
-  overflow: auto;
-  padding: 10px;
-}
 /*  BUTTONS */
 .btn {
   display: inline-block;
@@ -372,8 +361,8 @@ div#output-section {
   .headers-grid,
   div#App {
     width: calc(100% - 10px);
-    padding-left: 5px;
-    padding-right: 5px;
+    padding-left: 12px;
+    padding-right: 12px;
   }
 
   .headers-grid-item h2 {

diff --git a/lib/vector-vrl/web-playground/public/index.html b/lib/vector-vrl/web-playground/public/index.html
@@ -60,7 +60,6 @@ <h2>VRL Playground</h2>
           <div id="input-cell-title">
             <p class="cell-title">Program</p>
           </div>
-
           <div id="container-program"></div>
         </div>
       </div>