First commit for new setting to show the vehicle thumbnail in the header of each vehicle page.

Helper/ConfigHelper.cs

@@ -252,7 +252,8 @@ namespace CarCareTracker.Helper
                 ReminderUrgencyConfig = _config.GetSection(nameof(UserConfig.ReminderUrgencyConfig)).Get<ReminderUrgencyConfig>() ?? new ReminderUrgencyConfig(),
                 DefaultTab = (ImportMode)int.Parse(CheckString(nameof(UserConfig.DefaultTab), "8")),
                 DefaultReminderEmail = CheckString(nameof(UserConfig.DefaultReminderEmail)),
-                DisableRegistration = CheckBool(CheckString(nameof(UserConfig.DisableRegistration)))
+                DisableRegistration = CheckBool(CheckString(nameof(UserConfig.DisableRegistration))),
+                ShowVehicleThumbnail = CheckBool(CheckString(nameof(UserConfig.ShowVehicleThumbnail)))
             };
             int userId = 0;
             if (user != null)

Models/UserConfig.cs

@@ -25,6 +25,7 @@
         public string PreferredGasMileageUnit { get; set; } = string.Empty;
         public bool UseUnitForFuelCost { get; set; }
         public bool ShowCalendar { get; set; }
+        public bool ShowVehicleThumbnail { get; set; }
         public List<UserColumnPreference> UserColumnPreferences { get; set; } = new List<UserColumnPreference>();
         public ReminderUrgencyConfig ReminderUrgencyConfig { get; set; } = new ReminderUrgencyConfig();
         public string UserNameHash { get; set; }

Views/Home/_Settings.cshtml

@@ -90,6 +90,10 @@
                 <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="showCalendar" checked="@Model.UserConfig.ShowCalendar">
                 <label class="form-check-label" for="showCalendar">@translator.Translate(userLanguage, "Show Calendar")</label>
             </div>
+            <div class="form-check form-switch form-check-inline">
+                <input class="form-check-input" onChange="updateSettings()" type="checkbox" role="switch" id="showVehicleThumbnail" checked="@Model.UserConfig.ShowVehicleThumbnail">
+                <label class="form-check-label" for="showCalendar">@translator.Translate(userLanguage, "Show Vehicle Thumbnail in Header")</label>
+            </div>
         </div>
         @if (User.IsInRole(nameof(UserData.IsRootUser)))
         {

Views/Vehicle/Index.cshtml

@@ -72,7 +72,16 @@
     <div class="row">
         <div class="d-flex justify-content-between">
             <button onclick="returnToGarage()" class="lubelogger-tab btn btn-secondary btn-md mt-1 mb-1"><i class="bi bi-arrow-left-square"></i></button>
+
+            @if (userConfig.ShowVehicleThumbnail){
+            <img src="@Model.ImageLocation" class="m-1" style="height: calc(2rem + 2.75vw); object-fit:scale-down; pointer-events:none; @(string.IsNullOrWhiteSpace(Model.SoldDate) ? "" : "filter: grayscale(100%);")" />
+            <h1 class="text-truncate display-4 m-1">@($"{Model.Year} {Model.Make} {Model.Model}")<small class="text-body-secondary">@($"(#{StaticHelper.GetVehicleIdentifier(Model)})")</small></h1>
+            }
+            else
+            {
             <h1 class="text-truncate display-4">@($"{Model.Year} {Model.Make} {Model.Model}")<small class="text-body-secondary">@($"(#{StaticHelper.GetVehicleIdentifier(Model)})")</small></h1>
+            }
+
             <button onclick="editVehicle(@Model.Id)" class="lubelogger-tab btn btn-warning btn-md mt-1 mb-1"><i class="bi bi-pencil-square"></i></button>
             <div class="lubelogger-navbar-button">
                 <button type="button" class="btn btn-adaptive" onclick="showMobileNav()"><i class="bi bi-list lubelogger-menu-icon"></i></button>

appsettings.json

@@ -20,6 +20,7 @@
   "EnableAutoOdometerInsert": false,
   "EnableShopSupplies": false,
   "ShowCalendar": true,
+  "ShowVehicleThumbnail": true,
   "EnableExtraFieldColumns": false,
   "UseUKMPG": false,
   "UseThreeDecimalGasCost": true,

wwwroot/js/settings.js

@@ -72,6 +72,7 @@ function updateSettings() {
         enableAutoOdometerInsert: $("#enableAutoOdometerInsert").is(":checked"),
         enableShopSupplies: $("#enableShopSupplies").is(":checked"),
         showCalendar: $("#showCalendar").is(":checked"),
+        showVehicleThumbnail: $("#showVehicleThumbnail").is(":checked"),
         enableExtraFieldColumns: $("#enableExtraFieldColumns").is(":checked"),
         hideSoldVehicles: $("#hideSoldVehicles").is(":checked"),
         preferredGasUnit: $("#preferredGasUnit").val(),