fix(desktop): add legacy webview fallbacks for snapshots and dialogs

apps/desktop/src/components/codeSnapshot/CodeSnapshotDialog.vue

@@ -158,7 +158,7 @@ const previewVisible = computed(() => open.value && !!props.source);
   <Dialog v-model:open="open">
     <!-- 对话框整体限高：高度上限跟随 --dbx-viewport-height（兼容旧版 WebView 中 vh 不准的情况）；
          内部采用纵向 flex 布局，header/footer 固定，只有中间预览区滚动，保证底部按钮始终可见 -->
-    <DialogContent class="flex max-h-[calc(var(--dbx-viewport-height)-2rem)] flex-col overflow-hidden border border-border !bg-background text-foreground shadow-2xl !backdrop-blur-none sm:max-w-[860px]">
+    <DialogContent class="dbx-code-snapshot-dialog flex max-h-[calc(var(--dbx-viewport-height)-2rem)] flex-col overflow-hidden border border-border !bg-background text-foreground shadow-2xl !backdrop-blur-none sm:max-w-[860px]">
       <DialogHeader>
         <DialogTitle class="flex items-center gap-2">
           <Camera class="h-5 w-5 text-primary" />
@@ -209,7 +209,7 @@ const previewVisible = computed(() => open.value && !!props.source);
         </div>
       </div>
 
-      <DialogFooter>
+      <DialogFooter class="dbx-code-snapshot-dialog__footer">
         <Button variant="outline" @click="open = false">{{ t("codeSnapshot.close") }}</Button>
         <Button variant="outline" :disabled="exporting" @click="exportSnapshot('clipboard')">
           <Check v-if="copied" class="mr-1.5 h-4 w-4 text-green-500" />
@@ -224,3 +224,21 @@ const previewVisible = computed(() => open.value && !!props.source);
     </DialogContent>
   </Dialog>
 </template>
+
+<style>
+html.dbx-legacy-webview [data-slot="dialog-content"].dbx-code-snapshot-dialog {
+  display: flex !important;
+  flex-direction: column !important;
+  width: calc(100vw - 2rem) !important;
+  max-width: 860px !important;
+  min-width: 0 !important;
+}
+
+html.dbx-legacy-webview .dbx-code-snapshot-dialog__footer {
+  display: flex !important;
+  flex-direction: row !important;
+  align-items: center !important;
+  justify-content: flex-end !important;
+  flex-wrap: nowrap !important;
+}
+</style>

apps/desktop/src/components/grid/DataGridColumnHeader.vue

@@ -86,7 +86,7 @@ const emit = defineEmits<{
             <span class="text-background/70">{{ columnNameLabel }}</span>
             <span class="flex min-w-0 items-center gap-2">
               <span class="min-w-0 flex-1 truncate font-mono">{{ name }}</span>
-              <button type="button" class="flex h-5 w-5 shrink-0 items-center justify-center rounded hover:bg-background/10" :title="copyColumnNameLabel" @click.stop="emit('copyName')">
+              <button data-column-header-copy-name type="button" class="flex h-5 w-5 shrink-0 items-center justify-center rounded hover:bg-background/10" :title="copyColumnNameLabel" @click.stop="emit('copyName')">
                 <Copy class="h-3 w-3" />
               </button>
             </span>
@@ -157,3 +157,13 @@ const emit = defineEmits<{
   border-right: 2px solid rgb(100, 116, 139) !important;
 }
 </style>
+
+<style>
+html.dbx-legacy-webview [data-column-header-copy-name]:hover {
+  background-color: rgba(255, 255, 255, 0.1);
+}
+
+html.dbx-legacy-webview.dark [data-column-header-copy-name]:hover {
+  background-color: rgba(0, 0, 0, 0.1);
+}
+</style>

apps/desktop/src/components/layout/UpdateDialog.vue

@@ -90,7 +90,7 @@ watch(
 <template>
   <Dialog :open="open" @update:open="handleOpenChange">
     <DialogContent
-      class="sm:max-w-[520px]"
+      class="dbx-update-dialog sm:max-w-[520px]"
       :show-close-button="!isCloseBlocked"
       @interact-outside="
         (e: Event) => {
@@ -167,3 +167,14 @@ watch(
     </DialogContent>
   </Dialog>
 </template>
+
+<style>
+html.dbx-legacy-webview [data-slot="dialog-content"].dbx-update-dialog[class~="max-w-sm"] {
+  max-width: 520px !important;
+}
+
+html.dbx-legacy-webview [data-slot="dialog-content"].dbx-update-dialog [data-slot="dialog-footer"] {
+  flex-direction: row !important;
+  justify-content: flex-end !important;
+}
+</style>

apps/desktop/src/components/objects/DdlViewDialog.vue

@@ -224,7 +224,7 @@ function onClose() {
 
 <template>
   <Dialog :open="props.open" @update:open="onClose">
-    <DialogContent class="sm:max-w-190" @close-auto-focus="onDdlDialogCloseAutoFocus">
+    <DialogContent class="dbx-ddl-view-dialog sm:max-w-190" @close-auto-focus="onDdlDialogCloseAutoFocus">
       <DialogHeader>
         <DialogTitle>DDL - {{ props.tableName }}</DialogTitle>
       </DialogHeader>
@@ -276,4 +276,13 @@ function onClose() {
 .ddl-view-editor :deep(.cm-content ::selection) {
   background: var(--dbx-editor-selection-background, rgba(59, 130, 246, 0.35)) !important;
 }
+
+html.dbx-legacy-webview [data-slot="dialog-content"].dbx-ddl-view-dialog[class~="max-w-sm"] {
+  max-width: 47.5rem !important;
+}
+
+html.dbx-legacy-webview [data-slot="dialog-content"].dbx-ddl-view-dialog [data-slot="dialog-footer"] {
+  flex-direction: row !important;
+  justify-content: flex-end !important;
+}
 </style>

apps/desktop/src/components/transfer/DataTransferDialog.vue

@@ -1353,10 +1353,8 @@ async function saveConfigTask() {
 </template>
 
 <style>
-@media (min-width: 640px) {
-  html.dbx-legacy-webview [data-slot="dialog-content"].dbx-transfer-dialog[class~="max-w-sm"] {
-    /* Override the legacy default cap without pinning width, so native resize remains effective. */
-    max-width: calc(100vw - 2rem) !important;
-  }
+html.dbx-legacy-webview [data-slot="dialog-content"].dbx-transfer-dialog[class~="max-w-sm"] {
+  /* Override the legacy default cap without pinning width, so native resize remains effective. */
+  max-width: calc(100vw - 2rem) !important;
 }
 </style>