From b005e6d16504d0a967db69ffe734b283a0af9d26 Mon Sep 17 00:00:00 2001
From: Patrick Walton <pcwalton@mimiga.net>
Date: Fri, 17 Nov 2017 17:29:18 -0800
Subject: [PATCH] Improve the layout of the integration test a bit

---
 demo/client/html/integration-test.html.hbs | 23 +++++++++++++---------
 1 file changed, 14 insertions(+), 9 deletions(-)

diff --git a/demo/client/html/integration-test.html.hbs b/demo/client/html/integration-test.html.hbs
index 04fff0fe..fa11604a 100644
--- a/demo/client/html/integration-test.html.hbs
+++ b/demo/client/html/integration-test.html.hbs
@@ -13,7 +13,7 @@
             </div>
             <div id="pf-inner-container" class="container-fluid">
                 <div class="row">
-                    <div id="pf-integration-test-sidebar" class="col">
+                    <div id="pf-integration-test-sidebar" class="col p-3">
                         <ul class="nav nav-tabs" role="tablist">
                             <li class="nav-item">
                                 <a class="nav-link" id="pf-test-suite-tab" data-toggle="tab"
@@ -28,7 +28,7 @@
                             </li>
                         </ul>
                         <div class="tab-content">
-                            <div class="tab-pane p-3" id="pf-test-suite" role="tabpanel"
+                            <div class="tab-pane pt-3" id="pf-test-suite" role="tabpanel"
                             aria-labelledby="pf-test-suite-tab">
                                 <button id="pf-run-tests-button" class="btn btn-primary m-2">
                                     Run Tests
@@ -106,16 +106,21 @@
                             </div>
                         </div>
                     </div>
-                    <div class="col">
+                    <div class="col-auto d-flex flex-column">
                         <div class="row">
-                            <canvas id="pf-reference-canvas" class="pf-draggable border"
-                             width="300" height="400"></canvas>
-                            <canvas id="pf-canvas" class="pf-draggable pf-no-autoresize border"
-                            width="300" height="400"></canvas>
+                            <canvas id="pf-reference-canvas"
+                             class="pf-draggable border border-top-0 border-right-0"
+                             width="250" height="200"></canvas>
                         </div>
                         <div class="row">
-                            <canvas id="pf-difference-canvas" class="pf-draggable border"
-                             width="300" height="400"></canvas>
+                            <canvas id="pf-canvas"
+                             class="pf-draggable pf-no-autoresize border border-top-0 border-right-0"
+                             width="250" height="200"></canvas>
+                        </div>
+                        <div class="row">
+                            <canvas id="pf-difference-canvas"
+                             class="pf-draggable border border-top-0 border-right-0"
+                             width="250" height="200"></canvas>
                         </div>
                     </div>
                 </div>