From 8cc9c613b1e3da4f267155281090ca4028fae26e Mon Sep 17 00:00:00 2001
From: Ivan Tsenov <ivan.tsenov@outlook.com>
Date: Thu, 21 Jul 2016 14:13:56 +0300
Subject: [PATCH] Make "Top Dom/Advert/Clients" tables 'responsive'

This makes these 3 tables scroll horizontally if content is wide, but screen is narrow.
---
 index.php | 56 ++++++++++++++++++++++++++++++++-----------------------
 1 file changed, 33 insertions(+), 23 deletions(-)

diff --git a/index.php b/index.php
index b388a6a7..a4e3f110 100644
--- a/index.php
+++ b/index.php
@@ -119,13 +119,17 @@
         </div>
         <!-- /.box-header -->
         <div class="box-body">
-          <table class="table table-bordered">
-            <tbody><tr>
-              <th>Domain</th>
-              <th>Hits</th>
-              <th>Frequency</th>
-            </tr>
-          </tbody></table>
+            <div class="table-responsive">
+                <table class="table table-bordered">
+                  <tbody>
+                    <tr>
+                    <th>Domain</th>
+                    <th>Hits</th>
+                    <th>Frequency</th>
+                    </tr>
+                  </tbody>
+                </table>
+            </div>
         </div>
         <div class="overlay">
           <i class="fa fa-refresh fa-spin"></i>
@@ -142,15 +146,17 @@
         </div>
         <!-- /.box-header -->
         <div class="box-body">
-          <table class="table table-bordered">
-            <tbody>
-              <tr>
-              <th>Domain</th>
-              <th>Hits</th>
-              <th>Frequency</th>
-              </tr>
-            </tbody>
-          </table>
+            <div class="table-responsive">
+                <table class="table table-bordered">
+                  <tbody>
+                    <tr>
+                    <th>Domain</th>
+                    <th>Hits</th>
+                    <th>Frequency</th>
+                    </tr>
+                  </tbody>
+                </table>
+            </div>
         </div>
         <div class="overlay">
           <i class="fa fa-refresh fa-spin"></i>
@@ -167,13 +173,17 @@
         </div>
         <!-- /.box-header -->
         <div class="box-body">
-          <table class="table table-bordered">
-            <tbody><tr>
-              <th>Client</th>
-              <th>Requests</th>
-              <th>Frequency</th>
-            </tr>
-          </tbody></table>
+            <div class="table-responsive">
+                <table class="table table-bordered">
+                  <tbody>
+                    <tr>
+                    <th>Client</th>
+                    <th>Requests</th>
+                    <th>Frequency</th>
+                    </tr>
+                  </tbody>
+                </table>
+            </div>
         </div>
         <div class="overlay">
           <i class="fa fa-refresh fa-spin"></i>