diff --git a/src/frontend/app/app.module.ts b/src/frontend/app/app.module.ts
index 9ec6ccd0..b979cc28 100644
--- a/src/frontend/app/app.module.ts
+++ b/src/frontend/app/app.module.ts
@@ -105,6 +105,7 @@ import {SettingsEntryComponent} from './ui/settings/template/settings-entry/sett
 import {UsersComponent} from './ui/settings/users/users.component';
 import {SharingsListComponent} from './ui/settings/sharings-list/sharings-list.component';
 import {ThemeService} from './model/theme.service';
+import {StringifyConfigPriority} from './pipes/StringifyConfigPriority';
 
 @Injectable()
 export class MyHammerConfig extends HammerGestureConfig {
@@ -235,6 +236,7 @@ Marker.prototype.options.icon = iconDefault;
     GPXFilesFilterPipe,
     MDFilesFilterPipe,
     StringifySearchQuery,
+    StringifyConfigPriority,
     FileDTOToPathPipe,
     PhotoFilterPipe,
     UsersComponent,
diff --git a/src/frontend/app/pipes/StringifyConfigPriority.ts b/src/frontend/app/pipes/StringifyConfigPriority.ts
new file mode 100644
index 00000000..44f7d92c
--- /dev/null
+++ b/src/frontend/app/pipes/StringifyConfigPriority.ts
@@ -0,0 +1,13 @@
+import { Pipe, PipeTransform } from '@angular/core';
+import { ConfigPriority } from '../../../common/config/public/ClientConfig';
+import { SortingMethods } from '../../../common/entities/SortingMethods';
+import {EnumTranslations} from '../ui/EnumTranslations';
+
+@Pipe({ name: 'stringifyConfigPriority' })
+export class StringifyConfigPriority implements PipeTransform {
+
+  transform(method: ConfigPriority): string {
+    return EnumTranslations[ConfigPriority[method]];
+  }
+}
+
diff --git a/src/frontend/app/ui/admin/admin.component.html b/src/frontend/app/ui/admin/admin.component.html
index fc376309..d8906932 100644
--- a/src/frontend/app/ui/admin/admin.component.html
+++ b/src/frontend/app/ui/admin/admin.component.html
@@ -48,18 +48,24 @@
         </div>
         <div class="mb-1">
           <label class="control-label align-self-end me-2" for="config-priority" i18n>Mode</label>
-          <select class="form-select d-inline-block w-auto"
-                  aria-label="Configuration priority"
-                  [(ngModel)]="settingsService.configPriority"
-                  (ngModelChange)="settingsService.configPriorityChanged()"
-                  [class.bg-warning]="settingsService.configPriority === ConfigPriority.advanced"
-                  [class.bg-danger]="settingsService.configPriority === ConfigPriority.underTheHood"
-                  id="config-priority">
-            <option class="bg-white"
-                    *ngFor="let cp of configPriorities"
-                    [ngValue]="cp.key">{{cp.value}}
-            </option>
-          </select>
+          <div class="btn-group" dropdown #dropdown="bs-dropdown" placement="bottom right">
+            <button type="button"
+                    dropdownToggle
+                    id="config-priority"
+                    class="btn btn-danger dropdown-toggle"
+                    [class.btn-secondary]="settingsService.configPriority === ConfigPriority.basic"
+                    [class.btn-warning]="settingsService.configPriority === ConfigPriority.advanced"
+                    [class.btn-danger]="settingsService.configPriority === ConfigPriority.underTheHood"
+                    data-bs-toggle="dropdown" aria-expanded="false">
+              {{settingsService.configPriority | stringifyConfigPriority}}
+            </button>
+            <ul class="dropdown-menu dropdown-menu-right" *dropdownMenu>
+              <li *ngFor="let cp of configPriorities">
+                <button class="dropdown-item"
+                        (click)="settingsService.configPriority = cp.key; settingsService.configPriorityChanged()">{{cp.value}}</button>
+              </li>
+            </ul>
+          </div>
         </div>
       </div>
     </div>
diff --git a/src/frontend/app/ui/albums/saved-search-popup/saved-search-popup.component.html b/src/frontend/app/ui/albums/saved-search-popup/saved-search-popup.component.html
index d813f894..b29a8f99 100644
--- a/src/frontend/app/ui/albums/saved-search-popup/saved-search-popup.component.html
+++ b/src/frontend/app/ui/albums/saved-search-popup/saved-search-popup.component.html
@@ -14,7 +14,7 @@
   </div>
   <div class="modal-body">
     <span i18n>Add this json to a '.saved_searches.pg2conf' file in your gallery:</span>
-    <pre class="bg-light mt-2"><code>{{[savedSearchDTO] | json}}</code></pre>
+    <pre class="bg-body-tertiary mt-2"><code>{{[savedSearchDTO] | json}}</code></pre>
     <span class="mt-2" i18n>This saved search will be loaded from file during gallery indexing and it will survive a database reset.</span>
   </div>
 </ng-template>
diff --git a/src/frontend/app/ui/gallery/filter/filter.gallery.component.html b/src/frontend/app/ui/gallery/filter/filter.gallery.component.html
index 97e5109e..4c0f0a80 100644
--- a/src/frontend/app/ui/gallery/filter/filter.gallery.component.html
+++ b/src/frontend/app/ui/gallery/filter/filter.gallery.component.html
@@ -1,4 +1,4 @@
-<div class="card bg-light filter-container">
+<div class="card bg-body-tertiary filter-container">
 
   <div class="card-body">
     <div class="row">
diff --git a/src/frontend/app/ui/gallery/navigator/navigator.gallery.component.css b/src/frontend/app/ui/gallery/navigator/navigator.gallery.component.css
index 8d79a07a..df7fa141 100644
--- a/src/frontend/app/ui/gallery/navigator/navigator.gallery.component.css
+++ b/src/frontend/app/ui/gallery/navigator/navigator.gallery.component.css
@@ -1,6 +1,3 @@
-.container-fluid {
-  background-color: #e9ecef;
-}
 
 .photos-count {
   display: inline-block;
diff --git a/src/frontend/app/ui/gallery/navigator/navigator.gallery.component.html b/src/frontend/app/ui/gallery/navigator/navigator.gallery.component.html
index c5a3a3d4..8e70870c 100644
--- a/src/frontend/app/ui/gallery/navigator/navigator.gallery.component.html
+++ b/src/frontend/app/ui/gallery/navigator/navigator.gallery.component.html
@@ -1,4 +1,4 @@
-<div #navigator class="container-fluid pt-1 pb-1 pe-0 ps-0">
+<div #navigator class="container-fluid pt-1 pb-1 pe-0 ps-0 bg-body-secondary">
   <nav class="d-md-flex row" aria-label="breadcrumb">
     <div class="col-12 col-md-auto">
       <ol *ngIf="isDirectory" id="directory-path" class="mb-0 mt-1 breadcrumb">
diff --git a/src/frontend/app/ui/settings/sharings-list/sharing-list.service.ts b/src/frontend/app/ui/settings/sharings-list/sharing-list.service.ts
index 9add6089..a7ca0938 100644
--- a/src/frontend/app/ui/settings/sharings-list/sharing-list.service.ts
+++ b/src/frontend/app/ui/settings/sharings-list/sharing-list.service.ts
@@ -2,19 +2,19 @@ import {Injectable} from '@angular/core';
 import {SharingDTO} from '../../../../../common/entities/SharingDTO';
 import {NetworkService} from '../../../model/network/network.service';
 import {SettingsService} from '../settings.service';
+import {Config} from '../../../../../common/config/public/Config';
 
 @Injectable({
   providedIn: 'root'
 })
 export class SharingListService {
 
-  constructor(private networkService: NetworkService,
-              private settingsService: SettingsService) {
+  constructor(private networkService: NetworkService) {
   }
 
 
   public getSharingList(): Promise<SharingDTO[]> {
-    if (!this.settingsService.settings.value.Sharing.enabled) {
+    if (!Config.Sharing.enabled) {
       return Promise.resolve([]);
     }
     return this.networkService.getJson('/share/list');
diff --git a/src/frontend/app/ui/settings/sharings-list/sharings-list.component.ts b/src/frontend/app/ui/settings/sharings-list/sharings-list.component.ts
index b6d211ad..699b91b5 100644
--- a/src/frontend/app/ui/settings/sharings-list/sharings-list.component.ts
+++ b/src/frontend/app/ui/settings/sharings-list/sharings-list.component.ts
@@ -13,7 +13,7 @@ import {Utils} from '../../../../../common/Utils';
 export class SharingsListComponent implements OnInit {
 
   public shares: SharingDTO[] = [];
-  public sharingUrl =  Utils.concatUrls(Config.Server.publicUrl, '/share') + '/';
+  public sharingUrl = Utils.concatUrls(Config.Server.publicUrl, '/share') + '/';
 
   constructor(public sharingList: SharingListService,
               private settingsService: SettingsService) {
diff --git a/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.html b/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.html
index 595e5792..d79c0fe3 100644
--- a/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.html
+++ b/src/frontend/app/ui/settings/template/settings-entry/settings-entry.component.html
@@ -117,7 +117,7 @@
 
         <ng-container *ngSwitchCase="'NavigationLinkConfig'">
           <div class="container">
-            <div class="row  mt-1 mb-1 bg-light" *ngFor="let link of state.value; let i = index">
+            <div class="row  mt-1 mb-1 bg-body-tertiary" *ngFor="let link of state.value; let i = index">
               <div class="col ps-0">
                 <select
                   [name]="'link_t_'+idName+i"
@@ -180,7 +180,7 @@
 
         <ng-container *ngSwitchCase="'UserConfig'">
           <div class="container ps-0 pe-0">
-            <div class="row ms-0 me-0 mt-1 mb-1 bg-light" *ngFor="let item of state.value; let i = index">
+            <div class="row ms-0 me-0 mt-1 mb-1 bg-body-tertiary" *ngFor="let item of state.value; let i = index">
 
               <div class="col ps-0">
                 <input type="text" class="form-control"
diff --git a/src/frontend/app/ui/settings/template/template.component.html b/src/frontend/app/ui/settings/template/template.component.html
index 248da171..b4a5e0c6 100644
--- a/src/frontend/app/ui/settings/template/template.component.html
+++ b/src/frontend/app/ui/settings/template/template.component.html
@@ -1,7 +1,9 @@
 <form #settingsForm="ngForm" class="form-horizontal" [id]="ConfigPath">
   <div class="card mb-4">
-    <h5 class="card-header">
-      <span class="oi oi-{{icon}}"></span> {{Name}}
+    <div class="card-header">
+      <h5 class="d-inline-block mb-0">
+        <span class="oi oi-{{icon}}"></span> {{Name}}
+      </h5>
       <div *ngIf="states.value.enabled !== undefined" class="float-end p-0">
 
         <div
@@ -17,7 +19,7 @@
                  [(ngModel)]="states.value.enabled">
         </div>
       </div>
-    </h5>
+    </div>
     <div class="card-body">
       <div [hidden]="!error" class="alert alert-danger" role="alert"><strong>Error: </strong>{{error}}</div>
       <ng-container *ngIf="states.value.enabled !== false">
diff --git a/src/frontend/app/ui/settings/workflow/progress/job-progress.settings.component.html b/src/frontend/app/ui/settings/workflow/progress/job-progress.settings.component.html
index f4d49421..af112ece 100644
--- a/src/frontend/app/ui/settings/workflow/progress/job-progress.settings.component.html
+++ b/src/frontend/app/ui/settings/workflow/progress/job-progress.settings.component.html
@@ -114,7 +114,7 @@
         </div>
       </div>
     </div>
-    <div class="card bg-light">
+    <div class="card bg-body-tertiary">
       <div class="card-header" i18n>
         Logs
       </div>
diff --git a/src/frontend/app/ui/settings/workflow/workflow.component.html b/src/frontend/app/ui/settings/workflow/workflow.component.html
index 957594a4..be043e5b 100644
--- a/src/frontend/app/ui/settings/workflow/workflow.component.html
+++ b/src/frontend/app/ui/settings/workflow/workflow.component.html
@@ -1,6 +1,6 @@
 <div [hidden]="!error" class="alert alert-danger" role="alert"><strong>Error: </strong>{{error}}</div>
 <div *ngFor="let schedule of sortedSchedules() as sortedSchedules; let i= index">
-  <div class="card bg-light mt-2 mb-2  no-changed-settings {{shouldIdent(schedule,sortedSchedules[i-1])? 'ms-4' : ''}}">
+  <div class="card bg-body-tertiary mt-2 mb-2  no-changed-settings {{shouldIdent(schedule,sortedSchedules[i-1])? 'ms-4' : ''}}">
     <div class="card-header">
       <div class="d-flex justify-content-between">
         <div (click)="showDetails[schedule.name]=!showDetails[schedule.name]">