🚚 Adds devcontainer

.devcontainer/devcontainer.json

@@ -0,0 +1,13 @@
+{
+  "image": "ghcr.io/benc-uk/devcontainers/python:latest",
+  "remoteUser": "vscode",
+  "forwardPorts": [5000],
+  "extensions": [
+    "ms-python.python",
+    "mikestead.dotenv",
+    "esbenp.prettier-vscode",
+    "ms-azuretools.vscode-bicep",
+    "cschleiden.vscode-github-actions",
+    "github.vscode-pull-request-github"
+  ]  
+}

.prettierrc.yaml

@@ -0,0 +1,7 @@
+semi: false
+singleQuote: true
+printWidth: 120
+tabWidth: 2
+arrowParens: always
+bracketSpacing: true
+useTabs: false

.vscode/settings.json

@@ -1,5 +1,9 @@
 {
-    "python.linting.pylintEnabled": false,
-    "python.pythonPath": ".venv/bin/python",
-    "editor.semanticHighlighting.enabled": true
-}
+  "python.pythonPath": "src/.venv/bin/python",
+  "editor.semanticHighlighting.enabled": true,
+  "editor.formatOnSave": true,
+  "[python]": {
+    "editor.defaultFormatter": "ms-python.python"
+  },
+  "python.formatting.provider": "black"
+}

src/app/templates/base.html

@@ -63,8 +63,6 @@
     ></script>
 
     <div class="container body-content">{% block content %}{% endblock %}</div>
-    <span style="float: right"
-      >v1.4.1 [Ben Coleman, 2018-2021] &nbsp;&nbsp;&nbsp;</span
-    >
+    <span style="float: right">v1.4.1 [Ben Coleman, 2018-2021] &nbsp;&nbsp;&nbsp;</span>
   </body>
 </html>

src/app/templates/index.html

@@ -1,44 +1,30 @@
 {% extends "base.html" %} {% block content %}
 <br />
 <div class="jumbotron">
-  <h1>
-    <img src="/static/img/flask.png" height="80px" /> Python & Flask Demo App
-  </h1>
+  <h1><img src="/static/img/flask.png" height="80px" /> Python & Flask Demo App</h1>
 
   <div class="lead">
-    This is a simple web application written in Python and using Flask. It has
-    been designed with cloud demos &amp; containers in mind. Demonstrating
-    capabilities such as auto scaling, deployment to Azure or Kubernetes, or
-    anytime you want something quick and lightweight to run & deploy.
+    This is a simple web application written in Python and using Flask. It has been designed with cloud demos &amp;
+    containers in mind. Demonstrating capabilities such as auto scaling, deployment to Azure or Kubernetes, or anytime
+    you want something quick and lightweight to run & deploy.
   </div>
   <br />
 
   <div class="dimmed-box">
     <p>
       <img src="static/img/github-2.svg" class="icon" />
-      <a
-        href="https://github.com/benc-uk/python-demoapp"
-        class="btn btn-info btn px-4"
-      >
-        GitHub Project
-      </a>
+      <a href="https://github.com/benc-uk/python-demoapp" class="btn btn-info btn px-4"> GitHub Project </a>
 
       &nbsp;&nbsp;&nbsp;
       <img src="static/img/docker-whale.svg" class="icon" />
-      <a
-        href="https://github.com/users/benc-uk/packages/container/package/python-demoapp"
-        class="btn btn-info btn"
-      >
+      <a href="https://github.com/users/benc-uk/packages/container/package/python-demoapp" class="btn btn-info btn">
         Docker Images
       </a>
     </p>
     <hr />
     <p>
       <img src="static/img/python.svg" class="icon" />
-      <a
-        class="btn btn-info btn"
-        href="https://azure.microsoft.com/en-gb/develop/python/"
-      >
+      <a class="btn btn-info btn" href="https://azure.microsoft.com/en-gb/develop/python/">
         Get started with Azure &amp; Python
       </a>
     </p>

src/app/templates/info.html

@@ -30,16 +30,12 @@
       </tr>
       <tr>
         <td><b>System Memory</b></td>
-        <td>
-          {{ (info.mem.total / (1024*1024*1024)) | round(0,'ceil') |int }}GB
-          ({{info.mem.percent}}% used)
-        </td>
+        <td>{{ (info.mem.total / (1024*1024*1024)) | round(0,'ceil') |int }}GB ({{info.mem.percent}}% used)</td>
       </tr>
       <tr>
         <td><b>Network Interfaces</b></td>
         <td>
-          {% for iface, snics in info.net.items() %} {% for snic in snics if
-          (snic.family == 2) %}
+          {% for iface, snics in info.net.items() %} {% for snic in snics if (snic.family == 2) %}
           <li>{{ iface }} - <b>{{ snic.address }}</b></li>
           {% endfor %} {% endfor %}
         </td>

src/app/templates/monitor.html

@@ -1,24 +1,16 @@
 {% extends "base.html" %} {% block content %}
 
 <script src="/static/js/sorttable.js"></script>
-<script
-  type="text/javascript"
-  src="https://www.gstatic.com/charts/loader.js"
-></script>
+<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
 <script src="/static/js/monitor.js"></script>
 <script type="text/javascript">
-  google.charts.load("current", { packages: ["gauge"] });
-  google.charts.setOnLoadCallback(initCharts);
+  google.charts.load('current', { packages: ['gauge'] })
+  google.charts.setOnLoadCallback(initCharts)
 </script>
 
 <body>
   <span style="float: right">
-    Refresh Rate: <span id="refrate"></span> secs<input
-      id="refslider"
-      type="range"
-      min="2"
-      max="15"
-    />
+    Refresh Rate: <span id="refrate"></span> secs<input id="refslider" type="range" min="2" max="15" />
   </span>
   <br />
   <h2>👓 Running Processes (<span id="proc_count"></span>)</h2>