styles adjusted on the different pages

- use same colors
- add bordered shadow to all cards and tables

app/src/web/templates/page_index.html.j2

@@ -7,6 +7,7 @@
 {% block content %}
   <div class="w3-row-padding w3-margin-bottom">
     <div class="w3-quarter">
+      <div class="w3-card-4">
       <div class="w3-container w3-indigo w3-padding-16">
         <div class="w3-left"><i class="fa fa-upload w3-xxxlarge fa-rotate-180"></i></div>
         <div id = "server-cnt" class="w3-right">
@@ -16,8 +17,10 @@
         <h4>{{_('Server Mode')}}</h4>
         <div class="w3-hide-small w3-hide-medium" style="min-height:50px">{{_('Established from device to proxy')}}</div>
       </div>
+      </div>
     </div>
     <div class="w3-quarter">
+      <div class="w3-card-4">
       <div class="w3-container w3-purple w3-padding-16">
         <div class="w3-left"><i class="fa fa-download w3-xxxlarge fa-rotate-180"></i></div>
         <div id = "client-cnt" class="w3-right">
@@ -27,8 +30,10 @@
         <h4>{{_('Client Mode')}}</h4>
         <div class="w3-hide-small w3-hide-medium" style="min-height:50px">{{_('Established from proxy to device')}}</div>
       </div>
+      </div>
     </div>
     <div class="w3-quarter">
+      <div class="w3-card-4">
       <div class="w3-container w3-orange w3-text-white w3-padding-16">
         <div class="w3-left"><i class="fa fa-cloud w3-xxxlarge"></i></div>
         <div id = "proxy-cnt" class="w3-right">
@@ -38,8 +43,10 @@
         <h4>{{_('Proxy Mode')}}</h4>
         <div class="w3-hide-small w3-hide-medium" style="min-height:50px">{{_('Forwarding data to cloud')}}</div>
       </div>
+      </div>
     </div>
     <div class="w3-quarter">
+      <div class="w3-card-4">
       <div class="w3-container w3-teal w3-padding-16">
         <div class="w3-left"><i class="fa fa-cloud-arrow-up-alt w3-xxxlarge"></i></div>
         <div id = "emulation-cnt" class="w3-right">
@@ -49,9 +56,10 @@
         <h4>{{_('Emu Mode')}}</h4>
         <div class="w3-hide-small w3-hide-medium" style="min-height:50px">{{_('Emulation sends data to cloud')}}</div>
       </div>
+      </div>
     </div>
   </div>
 
-  <div class="w3-container" id="notes-list"></div>
-  <div class="w3-container" id="conn-table"></div>
+  <div id="notes-list"></div>
+  <div id="conn-table"></div>
 {% endblock content%}

app/src/web/templates/page_logging.html.j2

@@ -1,6 +1,6 @@
 {% extends 'base.html.j2' %}
 
-{% block title %} TSUN Proxy - Downloads {% endblock title%}
+{% block title %} TSUN Proxy - Log Files {% endblock title%}
 {% block menu3_class %}w3-blue{% endblock %}
 {% block headline %}<i class="fa fa-file-export fa-fw"></i>  {{_('Log Files')}}{% endblock headline %}
 {% block content %}
@@ -16,7 +16,7 @@
     </div>
   </div>
 
-  <div class="w3-container" id="file-list"></div>
+  <div id="file-list"></div>
 
   <script>
     function deleteFile() {

app/src/web/templates/templ_conn_table.html.j2

@@ -12,7 +12,10 @@
     {% endif %}
 {%- endmacro%}
 
+<div class="w3-container w3-margin-bottom">
 <h5>{{_('Connections')}}</h5>
+<div class="w3-card-4">
+
 <table class="w3-table w3-striped w3-bordered w3-border w3-hoverable w3-white">
   {% if table.thead is defined%}
   <thead>
@@ -35,3 +38,5 @@
   {% endfor %}
   </tbody>
 </table>
+</div>
+</div>

app/src/web/templates/templ_log_files_list.html.j2

@@ -3,7 +3,7 @@
   <div class="w3-quarter w3-margin-bottom">
 
      <div class="w3-card-4">
-      <header class="w3-container w3-blue" style="min-height:80px">
+      <header class="w3-container w3-teal" style="min-height:80px">
         <h4>{{file.name}}</h4>
       </header>
   
@@ -16,9 +16,9 @@
         {% endfor %}
       </table>
   
-      <footer class="w3-blue">
-        <a href="{{ url_for('.send',file=file.name)}}" class="w3-button w3-hover-blue w3-hover-text-black"><i class="fa fa-file-download"></i>  {{_('Download File')}}</a>
-        <a class="w3-button w3-right w3-hover-blue w3-hover-text-black" 
+      <footer class="w3-teal">
+        <a href="{{ url_for('.send',file=file.name)}}" class="w3-button w3-hover-teal w3-hover-text-black"><i class="fa fa-file-download"></i>  {{_('Download File')}}</a>
+        <a class="w3-button w3-right w3-hover-teal w3-hover-text-black" 
         onclick="document.getElementById('id03').innerHTML='{{file.name}}'; document.getElementById('id02').href='{{ url_for('.delete',file=file.name)}}'; document.getElementById('id01').style.display='block';"><i class="fa fa-trash"></i></a>
       </footer>
     </div>