Add the image as a logo on the home page as well

Author: carakas

Diff for: public/index.html

@@ -6,6 +6,7 @@
     <meta name="viewport" content="width=device-width,initial-scale=1.0">
     <title><%= htmlWebpackPlugin.options.title %></title>
     <link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
+    <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
     <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
     <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
     <link rel="manifest" href="/site.webmanifest">

Diff for: src/App.vue

@@ -2,7 +2,10 @@
   <div id="app">
     <nav class="navbar navbar-expand-lg bg-primary" data-bs-theme="dark">
       <div class="container-fluid">
-        <h1>MBS</h1>
+        <h1 class="navbar-brand">
+          <img src="/android-chrome-512x512.png" alt="Bootstrap" width="50px" height="50px">
+          MBS
+        </h1>
         <div class="navbar-nav py-1">
           <div class="btn-group">
             <button class="btn btn-light" @click="startOver" title="Empty bucket"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-bucket" viewBox="0 0 16 16">