diff --git a/dashboard/src/components/DockerRegistries.vue b/dashboard/src/components/DockerRegistries.vue
index 7fb02c936..a04d3762f 100644
--- a/dashboard/src/components/DockerRegistries.vue
+++ b/dashboard/src/components/DockerRegistries.vue
@@ -98,7 +98,8 @@ onMounted(async () => {
       <Button icon="fa-solid fa-plus" @click="onEditOrAdd()">{{ $t('main.action.add') }}</Button>
     </template>
 
-    <p v-html="$t('dockerRegistries.description', { customAppsLink: 'https://docs.cloudron.io/custom-apps/tutorial/' })"></p>
+    <div v-html="$t('dockerRegistries.description', { customAppsLink: 'https://docs.cloudron.io/custom-apps/tutorial/' })"></div>
+    <br/>
 
     <TableView :columns="columns" :model="registries">
       <template #actions="registry">
diff --git a/dashboard/src/components/ExternalLdap.vue b/dashboard/src/components/ExternalLdap.vue
index eea707a3c..182a13e9a 100644
--- a/dashboard/src/components/ExternalLdap.vue
+++ b/dashboard/src/components/ExternalLdap.vue
@@ -310,7 +310,8 @@ onMounted(async () => {
         <Button tool :menu="taskLogsMenu" :disabled="!taskLogsMenu.length">{{ $t('main.action.logs') }}</Button>
       </template>
 
-      <p>{{ $t('users.externalLdap.description') }}</p>
+      <div>{{ $t('users.externalLdap.description') }}</div>
+      <br/>
 
       <div v-if="features.externalLdap">
         <div v-show="config.provider === 'noop'">
diff --git a/dashboard/src/components/Ipv4Config.vue b/dashboard/src/components/Ipv4Config.vue
index f3011860e..1fbb5d846 100644
--- a/dashboard/src/components/Ipv4Config.vue
+++ b/dashboard/src/components/Ipv4Config.vue
@@ -140,7 +140,12 @@ onMounted(async () => {
     </Dialog>
 
     <Section :title="$t('network.ip.title')">
-      <p>{{ $t('network.ip.description') }}</p>
+      <template #header-buttons>
+        <Button @click="onConfigure()">{{ $t('network.ip.configure') }}</Button>
+      </template>
+
+      <div>{{ $t('network.ip.description') }}</div>
+      <br/>
 
       <div class="info-row">
         <div class="info-label">{{ $t('network.ip.provider') }}</div>
@@ -154,8 +159,6 @@ onMounted(async () => {
         <div class="info-label">{{ $t('network.ip.interface') }}</div>
         <div class="info-value">{{ interfaceName }}</div>
       </div>
-
-      <Button @click="onConfigure()">{{ $t('network.ip.configure') }}</Button>
     </Section>
   </div>
 </template>
diff --git a/dashboard/src/components/Ipv6Config.vue b/dashboard/src/components/Ipv6Config.vue
index a85334b68..bbf78ca07 100644
--- a/dashboard/src/components/Ipv6Config.vue
+++ b/dashboard/src/components/Ipv6Config.vue
@@ -116,9 +116,9 @@ onMounted(async () => {
               <div class="error-label" v-show="editError.generic">{{ editError.generic }}</div>
             </FormGroup>
 
-            <p v-show="editProvider === 'generic'">
+            <div v-show="editProvider === 'generic'">
               {{ $t('network.configureIp.providerGenericDescription') }} <sup><a href="https://ipv4.api.cloudron.io/api/v1/helper/public_ip" class="help" target="_blank"><i class="fa fa-question-circle"></i></a></sup>
-            </p>
+            </div>
 
             <!-- Fixed -->
             <FormGroup v-show="editProvider === 'fixed'">
@@ -140,7 +140,12 @@ onMounted(async () => {
     </Dialog>
 
     <Section :title="$t('network.ipv6.title')">
-      <p>{{ $t('network.ipv6.description') }}</p>
+      <template #header-buttons>
+        <Button @click="onConfigure()">{{ $t('network.ip.configure') }}</Button>
+      </template>
+
+      <div>{{ $t('network.ipv6.description') }}</div>
+      <br/>
 
       <div class="info-row">
         <div class="info-label">{{ $t('network.ip.provider') }}</div>
@@ -154,8 +159,6 @@ onMounted(async () => {
         <div class="info-label">{{ $t('network.ip.interface') }}</div>
         <div class="info-value">{{ interfaceName }}</div>
       </div>
-
-      <Button @click="onConfigure()">{{ $t('network.ip.configure') }}</Button>
     </Section>
   </div>
 </template>
diff --git a/dashboard/src/components/Section.vue b/dashboard/src/components/Section.vue
index fdbed13ce..1fb1941e4 100644
--- a/dashboard/src/components/Section.vue
+++ b/dashboard/src/components/Section.vue
@@ -42,7 +42,7 @@ function onTitleBadge() {
 <style>
 
 .section {
-  margin-bottom: 30px;
+  margin-bottom: 20px;
   position: relative;
 }
 
@@ -54,7 +54,7 @@ function onTitleBadge() {
   gap: 5px;
   padding-left: 15px;
   padding-right: 15px;
-  padding-top: 25px;
+  padding-top: 5px;
   margin-top: 0;
   margin-bottom: 0px;
 }
@@ -70,7 +70,7 @@ function onTitleBadge() {
   border-color: #d8dee4;
   border-width: 1px;
   margin-top: 10px;
-  margin-bottom: 10px;
+  margin-bottom: 5px;
 }
 
 @media (prefers-color-scheme: dark) {
diff --git a/dashboard/src/components/SettingsItem.vue b/dashboard/src/components/SettingsItem.vue
index e9b457644..51f173622 100644
--- a/dashboard/src/components/SettingsItem.vue
+++ b/dashboard/src/components/SettingsItem.vue
@@ -16,8 +16,9 @@
 
 .settings-item {
   border-radius: var(--pankow-border-radius);
-  padding: 10px;
-  margin-bottom: 10px;
+  /*padding: 0 10px 10px 10px;*/
+  padding: 0;
+  margin-bottom: 20px;
 }
 
 .settings-item-body {
diff --git a/dashboard/src/components/SystemUpdate.vue b/dashboard/src/components/SystemUpdate.vue
index d9c542c80..eacd3c030 100644
--- a/dashboard/src/components/SystemUpdate.vue
+++ b/dashboard/src/components/SystemUpdate.vue
@@ -335,7 +335,8 @@ onMounted(async () => {
         <Button tool :menu="taskLogsMenu" :disabled="taskLogsMenu.length === 0">{{ $t('main.action.logs') }}</Button>
       </template>
 
-      <p v-html="$t('settings.updates.description')"></p>
+      <div v-html="$t('settings.updates.description')"></div>
+      <br/>
 
       <SettingsItem>
         <div>
diff --git a/dashboard/src/style.css b/dashboard/src/style.css
index 3872d2b77..bff5727d3 100644
--- a/dashboard/src/style.css
+++ b/dashboard/src/style.css
@@ -80,6 +80,12 @@ hr {
 }
 
 .content {
+  max-width: 600px;
+  width: 100%;
+  position: absolute;
+}
+
+.content-large {
   max-width: 1280px;
   width: 100%;
   position: absolute;
diff --git a/dashboard/src/utils.js b/dashboard/src/utils.js
index 6942cc609..dcbf05c88 100644
--- a/dashboard/src/utils.js
+++ b/dashboard/src/utils.js
@@ -253,7 +253,7 @@ function eventlogDetails(eventLog, app = null, appIdContext = '') {
     case ACTION_APP_BACKUP_FINISH:
       if (!data.app) return '';
       if (data.errorMessage) return 'Backup ' + appName('of', data.app) + ' failed: ' + data.errorMessage;
-      else return 'Backup ' + appName('of', data.app) + ' succeeded with backup id ' + data.backupId + ' at ' + data.remotePath;
+      else return 'Backup ' + appName('of', data.app) + ' succeeded';
 
     case ACTION_APP_CLONE:
       if (appIdContext === data.oldAppId) return 'App was cloned to ' + data.newApp.fqdn + ' using backup at ' + data.remotePath;
diff --git a/dashboard/src/views/AppsView.vue b/dashboard/src/views/AppsView.vue
index 1db61e6af..ea200227f 100644
--- a/dashboard/src/views/AppsView.vue
+++ b/dashboard/src/views/AppsView.vue
@@ -259,7 +259,7 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <div class="content">
+  <div class="content-large">
     <Menu ref="actionMenuElement" :model="actionMenuModel" />
     <ApplinkDialog ref="applinkDialog" @success="refreshApps"/>
     <PostInstallDialog ref="postInstallDialog"/>
diff --git a/dashboard/src/views/AppstoreView.vue b/dashboard/src/views/AppstoreView.vue
index facab294a..ddacf2e0d 100644
--- a/dashboard/src/views/AppstoreView.vue
+++ b/dashboard/src/views/AppstoreView.vue
@@ -182,7 +182,7 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <div class="content" style="width: 100%; height: 100%;">
+  <div class="content-large" style="width: 100%; height: 100%;">
     <InputDialog ref="inputDialog"/>
     <AppInstallDialog ref="appInstallDialog" @close="onAppInstallDialogClose"/>
 
diff --git a/dashboard/src/views/CloudronAccountView.vue b/dashboard/src/views/CloudronAccountView.vue
index f48bf7182..b7b2df4dd 100644
--- a/dashboard/src/views/CloudronAccountView.vue
+++ b/dashboard/src/views/CloudronAccountView.vue
@@ -102,7 +102,8 @@ onUnmounted(() => {
 
       <div v-if="!busy">
         <div v-if="hasSubscription">
-          <p>{{ $t('settings.appstoreAccount.description') }}</p>
+          <div>{{ $t('settings.appstoreAccount.description') }}</div>
+          <br/>
 
           <div class="info-row" v-if="email">
             <div class="info-label">{{ $t('settings.appstoreAccount.email') }}</div>
diff --git a/dashboard/src/views/DomainsView.vue b/dashboard/src/views/DomainsView.vue
index 0c258ccf6..a47c854ee 100644
--- a/dashboard/src/views/DomainsView.vue
+++ b/dashboard/src/views/DomainsView.vue
@@ -140,7 +140,9 @@ onMounted(async () => {
         <Button @click="onAdd()" icon="fa-solid fa-plus"> {{ $t('domains.addDomain') }}</Button>
       </template>
 
-      <p>{{ $t('domains.domainDialog.addDescription') }}</p>
+      <div>{{ $t('domains.domainDialog.addDescription') }}</div>
+
+      <br/>
 
       <TableView :model="filteredDomains" :columns="columns" :busy="busy" style="max-height: 200px;">
         <template #provider="domain">
diff --git a/dashboard/src/views/EventlogView.vue b/dashboard/src/views/EventlogView.vue
index 95ac00317..1492265ed 100644
--- a/dashboard/src/views/EventlogView.vue
+++ b/dashboard/src/views/EventlogView.vue
@@ -157,7 +157,7 @@ onUnmounted(() => {
 </script>
 
 <template>
-  <div class="content" style="height: 100%; overflow: hidden; display: flex; flex-direction: column;">
+  <div class="content-large" style="height: 100%; overflow: hidden; display: flex; flex-direction: column;">
     <!-- cant use Section component as we need control over vertical scrolling -->
     <div class="section" style="overflow: hidden; display: flex; flex-direction: column;">
       <h1 class="section-header">
@@ -168,7 +168,7 @@ onUnmounted(() => {
           <Button tool secondary @click="onRefresh()" :loading="refreshBusy" icon="fa-solid fa-sync-alt" />
         </div>
       </h1>
-      <div class="section-body" style="overflow: auto; padding-top: 0" @scroll="onScroll">
+      <div class="section-body" style="overflow: auto; padding-top: 10px" @scroll="onScroll">
         <table class="eventlog-table">
           <thead>
             <tr>
diff --git a/dashboard/src/views/GroupsView.vue b/dashboard/src/views/GroupsView.vue
index 7aaecaf9d..bb6f447dc 100644
--- a/dashboard/src/views/GroupsView.vue
+++ b/dashboard/src/views/GroupsView.vue
@@ -134,7 +134,7 @@ onMounted(async () => {
 </script>
 
 <template>
-  <div class="content">
+  <div class="content-large">
     <Menu ref="actionMenuElement" :model="actionMenuModel" />
     <InputDialog ref="inputDialog" />
     <GroupDialog ref="groupDialog" @success="refreshGroups()"/>
diff --git a/dashboard/src/views/NetworkView.vue b/dashboard/src/views/NetworkView.vue
index 258bb5516..766171c0c 100644
--- a/dashboard/src/views/NetworkView.vue
+++ b/dashboard/src/views/NetworkView.vue
@@ -47,7 +47,7 @@ onMounted(async () => {
 
     <Section :title="$t('network.dyndns.title')" :padding="false">
       <SettingsItem>
-        <p>{{ $t('network.dyndns.description') }}</p>
+        <div>{{ $t('network.dyndns.description') }}</div>
         <Switch v-model="dynDnsIsEnabled" @change="onToggleDynDns" :busy="busy"/>
       </SettingsItem>
     </Section>
diff --git a/dashboard/src/views/ServicesView.vue b/dashboard/src/views/ServicesView.vue
index 048226d82..7598056a3 100644
--- a/dashboard/src/views/ServicesView.vue
+++ b/dashboard/src/views/ServicesView.vue
@@ -235,7 +235,8 @@ onMounted(async () => {
         <Button @click="refreshAll()" :loading="refreshBusy" :disabled="refreshBusy">{{ $t('services.refresh') }}</Button>
       </template>
 
-      <p>{{ $t('services.description') }}</p>
+      <div>{{ $t('services.description') }}</div>
+      <br/>
 
       <TableView :columns="columns" :model="servicesArray">
         <template #status="service">
diff --git a/dashboard/src/views/UserDirectoryLdapServerView.vue b/dashboard/src/views/UserDirectoryLdapServerView.vue
index 3e450a85c..2b3ef126f 100644
--- a/dashboard/src/views/UserDirectoryLdapServerView.vue
+++ b/dashboard/src/views/UserDirectoryLdapServerView.vue
@@ -78,7 +78,8 @@ onMounted(async () => {
 <template>
   <div class="content">
     <Section :title="$t('users.exposedLdap.title')">
-      <p>{{ $t('users.exposedLdap.description') }}</p>
+      <div>{{ $t('users.exposedLdap.description') }}</div>
+      <br/>
 
       <form @submit.prevent="onSubmit()" autocomplete="off">
         <fieldset :disabled="busy">
diff --git a/dashboard/src/views/UserDirectoryOpenIdProviderView.vue b/dashboard/src/views/UserDirectoryOpenIdProviderView.vue
index d7a92c876..c19810a34 100644
--- a/dashboard/src/views/UserDirectoryOpenIdProviderView.vue
+++ b/dashboard/src/views/UserDirectoryOpenIdProviderView.vue
@@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n';
 const i18n = useI18n();
 const t = i18n.t;
 
-import { ref, onMounted, useTemplateRef, computed } from 'vue';
+import { ref, nextTick, onMounted, useTemplateRef, computed } from 'vue';
 import { Button, ClipboardButton, Menu, Dialog, TableView, FormGroup, TextInput, InputGroup, InputDialog } from '@cloudron/pankow';
 import Section from '../components/Section.vue';
 import DashboardModel from '../models/DashboardModel.js';
@@ -48,6 +48,8 @@ const submitBusy = ref(false);
 const submitError = ref('');
 const clientId = ref('');
 const clientSecret = ref('');
+const newClientId = ref('');
+const newClientSecret = ref('');
 const clientName = ref('');
 const clientLoginRedirectUri = ref('');
 const clientTokenSignatureAlgorithm = ref('RS256');
@@ -106,8 +108,8 @@ async function onSubmit() {
 
   // reopen to show the new client credentials
   if (client) {
-    clientId.value = client.id;
-    clientSecret.value = client.secret;
+    newClientId.value = client.id;
+    newClientSecret.value = client.secret;
     newSetDialog.value.open();
   }
 }
@@ -158,16 +160,16 @@ onMounted(async () => {
         <FormGroup>
           <label for="clientIdInput">{{ $t('oidc.client.id') }}</label>
           <InputGroup>
-            <TextInput id="clientIdInput" v-model="clientId" readonly style="flex-grow: 1;"/>
-            <ClipboardButton :value="clientId" />
+            <TextInput id="clientIdInput" v-model="newClientId" readonly style="flex-grow: 1;"/>
+            <ClipboardButton :value="newClientId" />
           </InputGroup>
         </FormGroup>
 
         <FormGroup>
           <label for="clientSecretInput">{{ $t('oidc.client.secret') }}</label>
           <InputGroup>
-            <TextInput id="clientSecretInput" v-model="clientSecret" readonly style="flex-grow: 1;"/>
-            <ClipboardButton :value="clientSecret" />
+            <TextInput id="clientSecretInput" v-model="newClientSecret" readonly style="flex-grow: 1;"/>
+            <ClipboardButton :value="newClientSecret" />
           </InputGroup>
         </FormGroup>
       </div>
@@ -224,7 +226,8 @@ onMounted(async () => {
     </Dialog>
 
     <Section :title="$t('oidc.title')">
-      <p>{{ $t('oidc.description') }}</p>
+      <div>{{ $t('oidc.description') }}</div>
+      <br/>
 
       <FormGroup>
         <label for="discoverUrlInput">{{ $t('oidc.env.discoveryUrl') }} <sup><a href="https://docs.cloudron.io/user-directory/#endpoints" target="_blank"><i class="fa fa-question-circle"></i></a></sup></label>
diff --git a/dashboard/src/views/UsersView.vue b/dashboard/src/views/UsersView.vue
index 28e853567..fd30ab02f 100644
--- a/dashboard/src/views/UsersView.vue
+++ b/dashboard/src/views/UsersView.vue
@@ -218,7 +218,7 @@ onMounted(async () => {
 </script>
 
 <template>
-  <div class="content">
+  <div class="content-large">
     <Menu ref="actionMenuElement" :model="actionMenuModel" />
     <InputDialog ref="inputDialog" />
     <UserDialog ref="userDialog" @success="refreshUsers()"/>