From 76ecc0491b88ffa8bd4773bc9dbb8f6e7c152964 Mon Sep 17 00:00:00 2001
From: Jannik Stehle <j.stehle@opencloud.eu>
Date: Thu, 18 Sep 2025 09:15:09 +0200
Subject: [PATCH 1/4] fix: missing or invalid config page design

---
 .../src/pages/missingOrInvalidConfig.vue      | 30 +++++++------------
 1 file changed, 11 insertions(+), 19 deletions(-)

diff --git a/packages/web-runtime/src/pages/missingOrInvalidConfig.vue b/packages/web-runtime/src/pages/missingOrInvalidConfig.vue
index 568d14d4c4..a6c08fbc1b 100644
--- a/packages/web-runtime/src/pages/missingOrInvalidConfig.vue
+++ b/packages/web-runtime/src/pages/missingOrInvalidConfig.vue
@@ -6,39 +6,31 @@
     <oc-card
       :logo-url="logoImg"
       :title="$gettext('Missing or invalid config')"
-      body-class="w-sm text-center"
+      body-class="text-center"
       class="bg-role-surface-container rounded-lg"
     >
       <p v-text="$gettext('Please check if the file config.json exists and is correct.')" />
       <p v-text="$gettext('Also, make sure to check the browser console for more information.')" />
       <template #footer>
-        <p v-text="footerSlogan" />
+        <p v-if="footerSlogan" v-text="footerSlogan" />
       </template>
     </oc-card>
   </div>
 </template>
 
-<script lang="ts">
-import { computed, defineComponent, unref } from 'vue'
+<script setup lang="ts">
+import { computed, unref } from 'vue'
 import { useThemeStore } from '@opencloud-eu/web-pkg'
 import { useHead } from '../composables/head'
 import { storeToRefs } from 'pinia'
+// import ods component because ods is not initialized in case of a missing or invalid config
+import { OcCard } from '@opencloud-eu/design-system/components'
 
-export default defineComponent({
-  name: 'MissingConfigPage',
-  setup() {
-    const themeStore = useThemeStore()
-    const { currentTheme } = storeToRefs(themeStore)
+const themeStore = useThemeStore()
+const { currentTheme } = storeToRefs(themeStore)
 
-    const logoImg = computed(() => unref(currentTheme)?.logo)
-    const footerSlogan = computed(() => unref(currentTheme)?.slogan)
+const logoImg = computed(() => unref(currentTheme)?.logo)
+const footerSlogan = computed(() => unref(currentTheme)?.slogan)
 
-    useHead()
-
-    return {
-      logoImg,
-      footerSlogan
-    }
-  }
-})
+useHead()
 </script>

From a763ce34a5288d90ece82932b488e9af6b4b6977 Mon Sep 17 00:00:00 2001
From: Jannik Stehle <j.stehle@opencloud.eu>
Date: Thu, 18 Sep 2025 09:25:04 +0200
Subject: [PATCH 2/4] fix: search bar filter active state

---
 packages/web-pkg/src/components/SearchBarFilter.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/web-pkg/src/components/SearchBarFilter.vue b/packages/web-pkg/src/components/SearchBarFilter.vue
index e60e004924..7b8d29d500 100644
--- a/packages/web-pkg/src/components/SearchBarFilter.vue
+++ b/packages/web-pkg/src/components/SearchBarFilter.vue
@@ -19,10 +19,11 @@
           <oc-list>
             <li v-for="(option, index) in locationOptions" :key="index">
               <oc-button
-                appearance="raw"
+                :appearance="option.id === currentSelection.id ? 'filled' : 'raw-inverse'"
+                :color-role="option.id === currentSelection.id ? 'secondaryContainer' : 'surface'"
+                :no-hover="option.id === currentSelection.id"
                 size="medium"
                 class="flex items-center w-full py-1 px-2"
-                :class="{ 'oc-role-secondary-container': option.id === currentSelection.id }"
                 justify-content="space-between"
                 :disabled="!option.enabled"
                 :data-test-id="option.id"

From 1e27356eb06ad703153c57560b734cbca651c0a8 Mon Sep 17 00:00:00 2001
From: Jannik Stehle <j.stehle@opencloud.eu>
Date: Thu, 18 Sep 2025 09:54:12 +0200
Subject: [PATCH 3/4] fix: text editor font family

---
 packages/web-pkg/src/components/TextEditor/TextEditor.vue | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/packages/web-pkg/src/components/TextEditor/TextEditor.vue b/packages/web-pkg/src/components/TextEditor/TextEditor.vue
index c49d5a2ba5..7d11a11b78 100644
--- a/packages/web-pkg/src/components/TextEditor/TextEditor.vue
+++ b/packages/web-pkg/src/components/TextEditor/TextEditor.vue
@@ -1,5 +1,8 @@
 <template>
-  <div id="text-editor-container" class="h-full">
+  <div
+    id="text-editor-container"
+    class="h-full [&_.md-editor-preview]:!font-(family-name:--oc-font-family)"
+  >
     <md-preview
       v-if="isReadOnly"
       id="text-editor-preview-component"
@@ -18,6 +21,7 @@
     <md-editor
       v-else
       id="text-editor-component"
+      class="[&_.cm-content]:!font-(family-name:--oc-font-family)"
       :model-value="currentContent"
       no-katex
       no-mermaid

From 429a32efb18f7b86b0fa3e71ab4bf8a641dd39eb Mon Sep 17 00:00:00 2001
From: Jannik Stehle <j.stehle@opencloud.eu>
Date: Thu, 18 Sep 2025 09:56:41 +0200
Subject: [PATCH 4/4] feat: increase OcModal rounded corners

---
 packages/design-system/src/components/OcModal/OcModal.vue | 2 +-
 .../components/OcModal/__snapshots__/OcModal.spec.ts.snap | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/packages/design-system/src/components/OcModal/OcModal.vue b/packages/design-system/src/components/OcModal/OcModal.vue
index f35371a368..83f2f411bb 100644
--- a/packages/design-system/src/components/OcModal/OcModal.vue
+++ b/packages/design-system/src/components/OcModal/OcModal.vue
@@ -7,7 +7,7 @@
         :id="elementId"
         ref="ocModal"
         :class="classes"
-        class="border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-sm focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl"
+        class="border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-lg focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl"
         tabindex="0"
         role="dialog"
         aria-modal="true"
diff --git a/packages/design-system/src/components/OcModal/__snapshots__/OcModal.spec.ts.snap b/packages/design-system/src/components/OcModal/__snapshots__/OcModal.spec.ts.snap
index 3b3fc62235..be86e8aa33 100644
--- a/packages/design-system/src/components/OcModal/__snapshots__/OcModal.spec.ts.snap
+++ b/packages/design-system/src/components/OcModal/__snapshots__/OcModal.spec.ts.snap
@@ -3,7 +3,7 @@
 exports[`OcModal > displays input 1`] = `
 "<div class="oc-modal-background fixed left-0 top-0 z-[var(--z-index-modal)] bg-black/40 flex items-center justify-center flex-row flex-wrap size-full">
   <focus-trap-stub tabbableoptions="[object Object]" active="true" escapedeactivates="true" returnfocusondeactivate="true" allowoutsideclick="true" clickoutsidedeactivates="false" initialfocus="[Function]" delayinitialfocus="true" preventscroll="false" setreturnfocus="false">
-    <div class="oc-modal bg-role-surface border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-sm focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl" tabindex="0" role="dialog" aria-modal="true" aria-labelledby="oc-modal-title">
+    <div class="oc-modal bg-role-surface border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-lg focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl" tabindex="0" role="dialog" aria-modal="true" aria-labelledby="oc-modal-title">
       <div class="oc-modal-title bg-role-surface-container flex items-center flex-row flex-wrap py-3 px-4 rounded-t-sm">
         <h2 id="oc-modal-title" class="truncate m-0 text-base">Create new folder</h2>
       </div>
@@ -26,7 +26,7 @@ exports[`OcModal > displays input 1`] = `
 exports[`OcModal > displays loading state 1`] = `
 "<div class="oc-modal-background fixed left-0 top-0 z-[var(--z-index-modal)] bg-black/40 flex items-center justify-center flex-row flex-wrap size-full">
   <focus-trap-stub tabbableoptions="[object Object]" active="true" escapedeactivates="true" returnfocusondeactivate="true" allowoutsideclick="true" clickoutsidedeactivates="false" initialfocus="[Function]" delayinitialfocus="true" preventscroll="false" setreturnfocus="false">
-    <div class="oc-modal bg-role-surface border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-sm focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl" tabindex="0" role="dialog" aria-modal="true" aria-labelledby="oc-modal-title">
+    <div class="oc-modal bg-role-surface border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-lg focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl" tabindex="0" role="dialog" aria-modal="true" aria-labelledby="oc-modal-title">
       <div class="oc-modal-title bg-role-surface-container flex items-center flex-row flex-wrap py-3 px-4 rounded-t-sm">
         <h2 id="oc-modal-title" class="truncate m-0 text-base">Example title</h2>
       </div>
@@ -49,7 +49,7 @@ exports[`OcModal > displays loading state 1`] = `
 exports[`OcModal > matches snapshot 1`] = `
 "<div class="oc-modal-background fixed left-0 top-0 z-[var(--z-index-modal)] bg-black/40 flex items-center justify-center flex-row flex-wrap size-full">
   <focus-trap-stub tabbableoptions="[object Object]" active="true" escapedeactivates="true" returnfocusondeactivate="true" allowoutsideclick="true" clickoutsidedeactivates="false" initialfocus="[Function]" delayinitialfocus="true" preventscroll="false" setreturnfocus="false">
-    <div class="oc-modal bg-role-surface border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-sm focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl" tabindex="0" role="dialog" aria-modal="true" aria-labelledby="oc-modal-title">
+    <div class="oc-modal bg-role-surface border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-lg focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl" tabindex="0" role="dialog" aria-modal="true" aria-labelledby="oc-modal-title">
       <div class="oc-modal-title bg-role-surface-container flex items-center flex-row flex-wrap py-3 px-4 rounded-t-sm">
         <h2 id="oc-modal-title" class="truncate m-0 text-base">Example title</h2>
       </div>
@@ -72,7 +72,7 @@ exports[`OcModal > matches snapshot 1`] = `
 exports[`OcModal > overrides props message with slot 1`] = `
 "<div class="oc-modal-background fixed left-0 top-0 z-[var(--z-index-modal)] bg-black/40 flex items-center justify-center flex-row flex-wrap size-full">
   <focus-trap-stub tabbableoptions="[object Object]" active="true" escapedeactivates="true" returnfocusondeactivate="true" allowoutsideclick="true" clickoutsidedeactivates="false" initialfocus="[Function]" delayinitialfocus="true" preventscroll="false" setreturnfocus="false">
-    <div class="oc-modal bg-role-surface border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-sm focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl" tabindex="0" role="dialog" aria-modal="true" aria-labelledby="oc-modal-title">
+    <div class="oc-modal bg-role-surface border z-[calc(var(--z-index-modal)+1)] border-role-outline rounded-lg focus:outline-0 w-full max-w-xl max-h-[90vh] overflow-auto shadow-2xl" tabindex="0" role="dialog" aria-modal="true" aria-labelledby="oc-modal-title">
       <div class="oc-modal-title bg-role-surface-container flex items-center flex-row flex-wrap py-3 px-4 rounded-t-sm">
         <h2 id="oc-modal-title" class="truncate m-0 text-base">Example title</h2>
       </div>