Extracted app icon text, fixed issues

Tweaked sizes and meta tags based unpon ipad testing.
Fixed reduced sizes not being cleaned up.

app/Settings/AppSettingsStore.php

@@ -25,7 +25,7 @@ class AppSettingsStore
 
     protected function updateAppIcon(Request $request): void
     {
-        $sizes = [128, 64, 32];
+        $sizes = [180, 128, 64, 32];
 
         // Update icon image if set
         if ($request->hasFile('app_icon')) {
@@ -35,6 +35,7 @@ class AppSettingsStore
             setting()->put('app-icon', $image->url);
 
             foreach ($sizes as $size) {
+                $this->destroyExistingSettingImage('app-icon-' . $size);
                 $icon = $this->imageRepo->saveNew($iconFile, 'system', 0, $size, $size);
                 setting()->put('app-icon-' . $size, $icon->url);
             }

app/Uploads/ImageRepo.php

@@ -123,7 +123,10 @@ class ImageRepo
     public function saveNew(UploadedFile $uploadFile, string $type, int $uploadedTo = 0, int $resizeWidth = null, int $resizeHeight = null, bool $keepRatio = true): Image
     {
         $image = $this->imageService->saveNewFromUpload($uploadFile, $type, $uploadedTo, $resizeWidth, $resizeHeight, $keepRatio);
-        $this->loadThumbs($image);
+
+        if ($type !== 'system') {
+            $this->loadThumbs($image);
+        }
 
         return $image;
     }

resources/lang/en/settings.php

@@ -34,6 +34,8 @@ return [
     'app_custom_html_disabled_notice' => 'Custom HTML head content is disabled on this settings page to ensure any breaking changes can be reverted.',
     'app_logo' => 'Application Logo',
     'app_logo_desc' => 'This is used in the application header bar, among other areas. This image should be 86px in height. Large images will be scaled down.',
+    'app_icon' => 'Application Icon',
+    'app_icon_desc' => 'This icon is used for browser tabs and shortcut icons. This should be a 256px square PNG image.',
     'app_primary_color' => 'Application Primary Color',
     'app_primary_color_desc' => 'Sets the primary color for the application including the banner, buttons, and links.',
     'app_homepage' => 'Application Homepage',

resources/views/layouts/base.blade.php

@@ -6,10 +6,11 @@
     <title>{{ isset($pageTitle) ? $pageTitle . ' | ' : '' }}{{ setting('app-name') }}</title>
 
     <!-- Meta -->
+    <meta charset="utf-8">
     <meta name="viewport" content="width=device-width">
     <meta name="token" content="{{ csrf_token() }}">
     <meta name="base-url" content="{{ url('/') }}">
-    <meta charset="utf-8">
+    <meta name="theme-color" content="{{ setting('app-color') }}"/>
 
     <!-- Social Cards Meta -->
     <meta property="og:title" content="{{ isset($pageTitle) ? $pageTitle . ' | ' : '' }}{{ setting('app-name') }}">
@@ -21,10 +22,12 @@
     <link rel="stylesheet" media="print" href="{{ versioned_asset('dist/print-styles.css') }}">
 
     <!-- Icons -->
-    <link rel="icon" type="image/png" sizes="256x256" href="{{ setting('app-icon') ?? url('/icon.png') }}">
+    <link rel="icon" type="image/png" sizes="256x256" href="{{ setting('app-icon') ?: url('/icon.png') }}">
-    <link rel="icon" type="image/png" sizes="128x128" href="{{ setting('app-icon-128') ?? url('/icon-128.png') }}">
+    <link rel="icon" type="image/png" sizes="180x180" href="{{ setting('app-icon-180') ?: url('/icon-180.png') }}">
-    <link rel="icon" type="image/png" sizes="64x64" href="{{ setting('app-icon-64') ?? url('/icon-64.png') }}">
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ setting('app-icon-180') ?: url('/icon-180.png') }}">
-    <link rel="icon" type="image/png" sizes="32x32" href="{{ setting('app-icon-32') ?? url('/icon-32.png') }}">
+    <link rel="icon" type="image/png" sizes="128x128" href="{{ setting('app-icon-128') ?: url('/icon-128.png') }}">
+    <link rel="icon" type="image/png" sizes="64x64" href="{{ setting('app-icon-64') ?: url('/icon-64.png') }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ setting('app-icon-32') ?: url('/icon-32.png') }}">
 
     @yield('head')
 

resources/views/settings/customization.blade.php

@@ -55,11 +55,8 @@
 
             <div class="grid half gap-xl">
                 <div>
-                    <label class="setting-list-label">{{ 'Application Icon' }}</label>
+                    <label class="setting-list-label">{{ trans('settings.app_icon') }}</label>
-                    <p class="small">
+                    <p class="small">{{ trans('settings.app_icon_desc') }}</p>
-                        This icon is used for browser tabs and shortcut icons.
-                        This should be a 256px square PNG image.
-                    </p>
                 </div>
                 <div class="pt-xs">
                     @include('form.image-picker', [