Minor styling

demo/main.css

@@ -17,7 +17,7 @@ side-menu {
   height: 100%;
   overflow-y: auto;
   overflow-x: hidden;;
-  background-color: #E9E9F9;
+  background-color: #f2f2f2;
 }
 
 redoc {

lib/components/Method/method.css

@@ -13,6 +13,10 @@ h3 > span {
   vertical-align: middle;
 }
 
+.method-description {
+  padding: 30px 0;
+}
+
 .http-method {
   font-size: 13px;
   color: white;

lib/components/Method/method.html

@@ -3,7 +3,7 @@
   <span class="http-method" [ng-class]="data.method">{{data.method}}</span>
   <span class="path">{{data.path}}</span>
 </h3>
-<p class="method-summary">
+<p *ng-if="data.methodInfo.description" class="method-description">
   {{data.methodInfo.description}}
 </p>
 <params-list pointer="{{pointer}}/parameters"> </params-list>

lib/components/ParamsList/params-list.css

@@ -5,7 +5,25 @@ h4 {
 }
 
 table {
-  border-collapse: collapse;
+  border-spacing: 0;
+  border: 2px solid #1976D3;
+}
+
+thead tr:first-child {
+  background: #1976D3;
+  color: #fff;
+  border: none;
+}
+
+thead tr:last-child th {
+  border-bottom: 3px solid #ddd;
+}
+
+tbody tr:last-child td {
+  border: none;
+}
+tbody td {
+  border-bottom: 1px solid #ddd;
 }
 
 td, th {
@@ -15,19 +33,7 @@ td, th {
 }
 
 th {
-  background-color: #DCDCDC;
-  color: black;
-  padding: 5px 15px;
   text-align: left;
-  border-bottom: 2px solid #afafaf;
-}
-
-td {
-  border-bottom: 1px solid #afafaf;
-}
-
-.param-name {
-  font-weight: bold;
 }
 
 .param-type {

lib/components/ParamsList/params-list.html

@@ -1,30 +1,34 @@
-<h4> Parameters </h4>
 <small class="no-params" *ng-if="data.noParams"> No parameters </small>
 <!-- General parameters -->
 <table *ng-if="!data.noParams">
   <thead>
+    <tr>
+      <th colspan="3"> Parameters </th>
+    </tr>
     <tr>
       <th> Name </th>
       <th> Type </th>
       <th> Description </th>
     </tr>
   </thead>
-  <tr *ng-for="#param of data.params">
+  <tbody>
-    <!--<div class="param">-->
+    <tr *ng-for="#param of data.params">
-      <td class="param-name">{{param.name}}</td>
+      <!--<div class="param">-->
+        <td class="param-name">{{param.name}}</td>
+        <td>
+          <span class="param-type" [ng-class]="param.type">{{param.type}}</span>
+        </td>
+        <td class="param-description">{{param.description}}</td>
+      <!--</div>-->
+    </tr>
+    <!-- in-body parameter -->
+    <tr class="param body-param" *ng-if="data.bodyParam">
+      <td class="param-name">{{data.bodyParam.name}}</td>
       <td>
-        <span class="param-type" [ng-class]="param.type">{{param.type}}</span>
+        <schema class="body-schema param-type" pointer="{{data.bodyParam.pointer}}/schema">
+        </schema>
       </td>
-      <td class="param-description">{{param.description}}</td>
+      <td class="param-description">{{data.bodyParam.description}}</td>
-    <!--</div>-->
+    </tr>
-  </tr>
+  </tbody>
-  <!-- in-body parameter -->
-  <tr class="param body-param" *ng-if="data.bodyParam">
-    <td class="param-name">{{data.bodyParam.name}}</td>
-    <td>
-      <schema class="body-schema param-type" pointer="{{data.bodyParam.pointer}}/schema">
-      </schema>
-    </td>
-    <td class="param-description">{{data.bodyParam.description}}</td>
-  </tr>
 </table>