fix(kimi-desktop): clear traffic lights and make the top draggable (#1237)

- Increase the sidebar header's left padding (100px) on macOS so the floating
  traffic lights no longer overlap the Kimi Code brand.
- Make the conversation header a window-drag region on macOS (interactive
  controls opt out with no-drag), so the whole top of the window can be dragged
  without adding a separate titlebar strip.
This commit is contained in:
qer 2026-06-30 23:28:34 +08:00 committed by GitHub
parent bfe8e6ace3
commit f12c83cfb9
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 12 additions and 2 deletions

View file

@ -682,7 +682,7 @@ function blinkOnce(): void {
and turn the empty header area into the window-drag region; interactive
controls opt out with no-drag. */
.side.macos-desktop .ch {
padding-left: 80px;
padding-left: 100px;
-webkit-app-region: drag;
}
.side.macos-desktop .ch-logo,

View file

@ -6,6 +6,7 @@
import { computed, nextTick, onUnmounted, ref } from 'vue';
import { useI18n } from 'vue-i18n';
import { copyTextToClipboard } from '../../lib/clipboard';
import { isMacosDesktop } from '../../lib/desktopFlag';
const { t } = useI18n();
@ -202,7 +203,7 @@ function startArchive(): void {
</script>
<template>
<header class="chat-header">
<header class="chat-header" :class="{ 'macos-desktop': isMacosDesktop }">
<!-- Workspace / session breadcrumb -->
<div class="ch-id">
<span v-if="workspaceName" class="ch-ws">{{ workspaceName }}</span>
@ -335,6 +336,15 @@ function startArchive(): void {
font-family: var(--sans);
min-width: 0;
}
/* macOS desktop: the window has a hidden title bar, so the conversation header
doubles as a window-drag region. Interactive controls opt out with no-drag. */
.chat-header.macos-desktop {
-webkit-app-region: drag;
}
.chat-header.macos-desktop button,
.chat-header.macos-desktop input {
-webkit-app-region: no-drag;
}
.ch-id { display: flex; align-items: center; gap: 6px; min-width: 0; flex: none; max-width: 46%; }
.ch-ws { color: var(--muted); font-size: var(--ui-font-size-sm); flex: none; }
.ch-sep { color: var(--faint); flex: none; }