Add logo and favicon

README.md

@@ -1,4 +1,4 @@
-# AQIMON
+# ![AQIMON](header.png) 
 
 A simple Air Quality Index monitor, designed to work on the Raspberry Pi with the SDS011 Nova PM Sensor.
 

aqimon/static/index.html

@@ -4,6 +4,7 @@
     <!-- Required meta tags -->
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+    <link rel="icon" href="/static/favicon.ico" sizes="32x32">
 
     <!-- Bootstrap CSS -->
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">

elm/src/Main.elm

@@ -6,16 +6,15 @@ import Bootstrap.Form.Select as Select
 import Bootstrap.Grid as Grid
 import Bootstrap.Grid.Col as Col
 import Bootstrap.Grid.Row as Row
-import Bootstrap.Text as Text
 import Browser
 import Chart.Item as CI
 import CurrentReads as CR exposing (..)
 import DeviceStatus as DS exposing (..)
 import EpaCommon as EC exposing (..)
 import EpaLevel as EL exposing (..)
 import Graph as G exposing (..)
-import Html exposing (Attribute, Html, div, h1, h2, h5, text)
-import Html.Attributes exposing (class, style, value)
+import Html exposing (Attribute, Html, div, h1, h2, h5, img, text)
+import Html.Attributes exposing (class, height, src, style, value, width)
 import Http
 import Json.Decode exposing (Decoder, andThen, fail, field, float, int, list, map2, map3, map4, maybe, string, succeed)
 import Task
@@ -312,8 +311,10 @@ view model =
             [ Grid.row [ Row.attrs [ style "padding" "1em" ] ]
                 [ Grid.col []
                     [ h1
-                        []
-                        [ text "AQI Monitor" ]
+                        [ class "d-flex", class "align-items-center" ]
+                        [ img [ src "/static/images/aqimon.png", style "margin-right" "0.5em", width 75, height 75, class "d-inline-block", class "align-text-top" ] []
+                        , text "AQI Monitor"
+                        ]
                     ]
                 ]
             , Grid.row [ Row.attrs [ style "padding" "1em" ] ]