修改换行逻辑和段落查看方式

src/modules/ui/itemPaneSection.ts

@@ -2,6 +2,7 @@
 
 import { config } from "../../../package.json";
 import { getLocaleID, getString } from "../../utils/locale";
+import type { FluentMessageId } from "../../../typings/i10n";
 import { getPref, setPref } from "../../utils/prefs";
 import { openChatPaneWindow, openLecturePaneWindow } from "./itemPaneWindow";
 
@@ -37,36 +38,71 @@ export function isAdaptiveHeight(kind: ItemPaneKind): boolean {
   return val !== false;
 }
 
-function setSectionButtonIcons(btn: HTMLElement, icon: string): void {
+function sectionButtonTooltip(messageId: FluentMessageId): string {
+  const fromBranch = getString(messageId, { branch: "tooltiptext" });
+  const l10nId = getLocaleID(messageId);
+  if (fromBranch && fromBranch !== l10nId) return fromBranch;
+  return getString(messageId);
+}
+
+function applySectionButtonTooltip(
+  btn: HTMLElement,
+  messageId: FluentMessageId,
+): void {
+  const l10nId = getLocaleID(messageId);
+  const tooltip = sectionButtonTooltip(messageId);
+  btn.setAttribute("data-l10n-id", l10nId);
+  btn.setAttribute("title", tooltip);
+  btn.setAttribute("tooltiptext", tooltip);
+  try {
+    btn.ownerDocument?.l10n?.setAttributes?.(btn, l10nId);
+  } catch {
+    // ignore if Fluent is not ready on this document yet
+  }
+}
+
+function styleSectionButtonIcon(btn: HTMLElement, icon: string): void {
   const url = `url('${icon}')`;
   btn.style.setProperty("--custom-button-icon-light", url);
   btn.style.setProperty("--custom-button-icon-dark", url);
+  btn.style.setProperty("list-style-image", url);
+  btn.style.setProperty("-moz-context-properties", "fill, fill-opacity");
+  btn.style.setProperty("fill", "currentColor");
 }
 
-function applyOpenInWindowButtonIcon(body: HTMLElement): void {
+function findSectionButton(
+  section: HTMLElement | null,
+  type: string,
+): HTMLElement | null {
+  if (!section) return null;
+  return (section.querySelector(`.${type}.section-custom-button`) ??
+    section.querySelector(`.${type}`)) as HTMLElement | null;
+}
+
+function applyOpenInWindowButtonIcon(body: HTMLElement): boolean {
   const section = resolveCollapsibleSection(body);
-  const btn = section?.querySelector(
-    ".open-in-window.section-custom-button",
-  ) as HTMLElement | null;
-  if (!btn) return;
-  setSectionButtonIcons(btn, OPEN_WINDOW_ICON);
+  const btn = findSectionButton(section, "open-in-window");
+  if (!btn) return false;
+  styleSectionButtonIcon(btn, OPEN_WINDOW_ICON);
+  applySectionButtonTooltip(btn, "item-pane-open-window");
+  return true;
 }
 
 export function updateAdaptiveButtonState(
   body: HTMLElement,
   adaptive: boolean,
-): void {
+): boolean {
   const section = resolveCollapsibleSection(body);
-  const btn = section?.querySelector(
-    ".adaptive-height.section-custom-button",
-  ) as HTMLElement | null;
-  if (!btn) return;
+  const btn = findSectionButton(section, "adaptive-height");
+  if (!btn) return false;
   btn.setAttribute("aria-pressed", adaptive ? "true" : "false");
   btn.classList.toggle("chatpapers-adaptive-active", adaptive);
-  setSectionButtonIcons(btn, adaptive ? ADAPTIVE_ICON : ADAPTIVE_ICON_OFF);
-  btn.title = getString(
+  styleSectionButtonIcon(btn, adaptive ? ADAPTIVE_ICON : ADAPTIVE_ICON_OFF);
+  applySectionButtonTooltip(
+    btn,
     adaptive ? "item-pane-adaptive-height-on" : "item-pane-adaptive-height-off",
   );
+  return true;
 }
 
 export function applyItemPaneSectionButtonIcons(
@@ -74,9 +110,17 @@ export function applyItemPaneSectionButtonIcons(
   adaptive = isAdaptiveHeight(
     (body.dataset.chatpapersPaneKind || "chat") as ItemPaneKind,
   ),
+  attempt = 0,
 ): void {
-  applyOpenInWindowButtonIcon(body);
-  updateAdaptiveButtonState(body, adaptive);
+  const openReady = applyOpenInWindowButtonIcon(body);
+  const adaptiveReady = updateAdaptiveButtonState(body, adaptive);
+  if ((openReady && adaptiveReady) || attempt >= 8) return;
+
+  const win = body.ownerDocument?.defaultView;
+  if (!win) return;
+  win.requestAnimationFrame(() => {
+    applyItemPaneSectionButtonIcons(body, adaptive, attempt + 1);
+  });
 }
 
 export function applyAdaptiveHeight(