modify display table format

mercyoseni · Mar 25, 2017 · bbd3494 · bbd3494
1 parent 8edd970
commit bbd3494
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 4 deletions.
diff --git a/src/index.html b/src/index.html
@@ -83,14 +83,14 @@ <h3 id="display" class="help-block" id="selectFile"> Select a file to upload &nb
     </div>
     <!--inverted-index table -->
     <div ng-repeat="(name, index) in indexed">
-      <table class="table table-striped" ng-show="showTable">
+      <table class="table table-striped table-responsive table-hover" ng-show="showTable">
         <div class="row" ng-show="tableTitle">
           <div class="col-md-12">
             <h2><span class="glyphicon glyphicon-th-large"></span>&nbsp;Inverted Index Table for {{ name }}</h2><br>
           </div>
         </div>
         <thead>
-          <tr>
+          <tr class="success">
             <th>Tokens</th>
             <th ng-repeat="fileTitle in fileTitles[name]">{{ fileTitle }}</th>
           </tr>
@@ -106,14 +106,14 @@ <h2><span class="glyphicon glyphicon-th-large"></span>&nbsp;Inverted Index Table
     </div>
     <!--search result table-->
     <div class="row" ng-show="showResultTable" ng-repeat="(name, index) in mySearch">
-      <table class="table table-striped">
+      <table class="table table-striped table-responsive table-hover">
         <div class="row">
           <div class="col-md-12">
             <h2><span class="glyphicon glyphicon-th-large"></span>&nbsp;Search result for "{{ query }}" in {{ name }}</h2><br>
           </div>
         </div>
         <thead>
-          <tr>
+          <tr class="success">
             <th>Tokens</th>
             <th ng-repeat="fileTitle in fileTitles[name]">{{ fileTitle }}</th>
           </tr>

diff --git a/src/public/css/style.css b/src/public/css/style.css
@@ -99,3 +99,16 @@ footer {
   bottom: 0;
   padding-top: 10px;
 }
+
+table {
+  border-spacing: 0;
+  border-collapse: separate;
+  /*float: right;*/
+  margin: 0 auto;
+}
+
+.table {
+  width: 70%;
+  max-width: 70%;
+  /*float: right;*/
+}