ydy0615
838eec30a8
- Implemented a new composable `useTheme` for managing theme state. - Added functions to read and write theme preference to local storage. - Applied theme styles to the DOM based on user preference. - Introduced a toggle function to switch between light and dark themes. refactor: enhance copilot plugin functionality - Improved request handling with sequence and document versioning. - Refactored ghost text handling to improve clarity and efficiency. - Updated markdown insertion logic to handle parsed content more robustly. - Enhanced error handling and logging for better debugging. style: update global styles for light and dark themes - Defined CSS variables for light and dark themes to streamline styling. - Improved overall styling consistency and responsiveness. - Added transitions for smoother theme changes and interactions.
2 lines
6.1 KiB
CSS
2 lines
6.1 KiB
CSS
.app-shell[data-v-93f063e6]{position:relative;width:100%;height:100%;background:var(--app-bg);color:var(--app-text)}.theme-toggle[data-v-93f063e6]{position:fixed;top:16px;right:20px;z-index:11000;border:none;padding:0;background:none;cursor:pointer}.theme-toggle__track[data-v-93f063e6]{position:relative;width:78px;height:40px;display:block;border-radius:999px;border:1px solid var(--panel-border);background:linear-gradient(135deg,var(--toggle-bg-start),var(--toggle-bg-end));box-shadow:var(--panel-shadow)}.theme-toggle__thumb[data-v-93f063e6]{position:absolute;top:3px;left:3px;width:32px;height:32px;border-radius:50%;background:var(--toggle-thumb-bg);box-shadow:0 5px 14px #0003;transition:transform .22s ease}.theme-toggle__sun[data-v-93f063e6],.theme-toggle__moon[data-v-93f063e6]{position:absolute;top:50%;width:16px;height:16px;transform:translateY(-50%);transition:opacity .2s ease,transform .22s ease}.theme-toggle__sun[data-v-93f063e6]{left:12px;color:var(--toggle-sun);opacity:1;transform:translateY(-50%) rotate(0)}.theme-toggle__moon[data-v-93f063e6]{right:12px;color:var(--toggle-moon);opacity:.55;transform:translateY(-50%) rotate(-16deg)}.theme-toggle.is-dark .theme-toggle__thumb[data-v-93f063e6]{transform:translate(38px)}.theme-toggle.is-dark .theme-toggle__sun[data-v-93f063e6]{opacity:.55;transform:translateY(-50%) rotate(16deg)}.theme-toggle.is-dark .theme-toggle__moon[data-v-93f063e6]{opacity:1;transform:translateY(-50%) rotate(0)}.theme-toggle[data-v-93f063e6]:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px;border-radius:999px}@media(max-width:640px){.theme-toggle[data-v-93f063e6]{top:12px;right:12px}}@media(prefers-reduced-motion:reduce){.theme-toggle__thumb[data-v-93f063e6],.theme-toggle__sun[data-v-93f063e6],.theme-toggle__moon[data-v-93f063e6]{transition:none}}:root{font-family:Noto Sans,Segoe UI,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root,:root[data-theme=light]{color-scheme:light;--app-bg: #f4f6fb;--app-text: #1f2937;--panel-bg: #ffffff;--panel-border: #d7deea;--panel-shadow: 0 8px 24px rgba(16, 24, 40, .12);--btn-bg: #ffffff;--btn-fg: #5b6470;--btn-hover-bg: #4a90d9;--btn-hover-fg: #ffffff;--btn-disabled-bg: #cfd5df;--btn-disabled-fg: #8a92a0;--overlay-bg: rgba(15, 23, 42, .3);--tooltip-bg: #111827;--tooltip-fg: #f9fafb;--muted-text: #6b7280;--danger-text: #dc2626;--scrollbar-thumb: #d4dae4;--scrollbar-thumb-hover: #bbc4d2;--focus-ring: #3b82f6;--toggle-bg-start: #fff8dd;--toggle-bg-end: #f2f4ff;--toggle-thumb-bg: #ffffff;--toggle-sun: #f59e0b;--toggle-moon: #475569;--ghost-text: #7d8796;--ghost-code-bg: rgba(15, 23, 42, .06);--crepe-color-background: #ffffff;--crepe-color-on-background: #000000;--crepe-color-surface: #f7f7f7;--crepe-color-surface-low: #ededed;--crepe-color-on-surface: #1c1c1c;--crepe-color-on-surface-variant: #4d4d4d;--crepe-color-outline: #a8a8a8;--crepe-color-primary: #333333;--crepe-color-secondary: #cfcfcf;--crepe-color-on-secondary: #000000;--crepe-color-inverse: #f0f0f0;--crepe-color-on-inverse: #1a1a1a;--crepe-color-inline-code: #ba1a1a;--crepe-color-error: #ba1a1a;--crepe-color-hover: #e0e0e0;--crepe-color-selected: #d5d5d5;--crepe-color-inline-area: #cacaca}:root[data-theme=dark]{color-scheme:dark;--app-bg: #0f1117;--app-text: #e5e7eb;--panel-bg: #1a1e27;--panel-border: #2f3644;--panel-shadow: 0 10px 26px rgba(0, 0, 0, .5);--btn-bg: #222834;--btn-fg: #d2d8e4;--btn-hover-bg: #6ea8ff;--btn-hover-fg: #0d1117;--btn-disabled-bg: #2e3441;--btn-disabled-fg: #7a8498;--overlay-bg: rgba(2, 6, 23, .65);--tooltip-bg: #f8fafc;--tooltip-fg: #0f172a;--muted-text: #aeb6c5;--danger-text: #f87171;--scrollbar-thumb: #40485a;--scrollbar-thumb-hover: #5f6980;--focus-ring: #60a5fa;--toggle-bg-start: #2d3140;--toggle-bg-end: #1f2430;--toggle-thumb-bg: #dbe3f2;--toggle-sun: #fbbf24;--toggle-moon: #e2e8f0;--ghost-text: #95a0b4;--ghost-code-bg: rgba(226, 232, 240, .12);--crepe-color-background: #1a1a1a;--crepe-color-on-background: #e6e6e6;--crepe-color-surface: #121212;--crepe-color-surface-low: #1c1c1c;--crepe-color-on-surface: #d1d1d1;--crepe-color-on-surface-variant: #a9a9a9;--crepe-color-outline: #757575;--crepe-color-primary: #b5b5b5;--crepe-color-secondary: #4d4d4d;--crepe-color-on-secondary: #d6d6d6;--crepe-color-inverse: #e5e5e5;--crepe-color-on-inverse: #2a2a2a;--crepe-color-inline-code: #ff6666;--crepe-color-error: #ff6666;--crepe-color-hover: #232323;--crepe-color-selected: #2f2f2f;--crepe-color-inline-area: #2b2b2b}:root[data-theme=light] .milkdown{--crepe-color-background: #ffffff;--crepe-color-on-background: #000000;--crepe-color-surface: #f7f7f7;--crepe-color-surface-low: #ededed;--crepe-color-on-surface: #1c1c1c;--crepe-color-on-surface-variant: #4d4d4d;--crepe-color-outline: #a8a8a8;--crepe-color-primary: #333333;--crepe-color-secondary: #cfcfcf;--crepe-color-on-secondary: #000000;--crepe-color-inverse: #f0f0f0;--crepe-color-on-inverse: #1a1a1a;--crepe-color-inline-code: #ba1a1a;--crepe-color-error: #ba1a1a;--crepe-color-hover: #e0e0e0;--crepe-color-selected: #d5d5d5;--crepe-color-inline-area: #cacaca}:root[data-theme=dark] .milkdown{--crepe-color-background: #1a1a1a;--crepe-color-on-background: #e6e6e6;--crepe-color-surface: #121212;--crepe-color-surface-low: #1c1c1c;--crepe-color-on-surface: #d1d1d1;--crepe-color-on-surface-variant: #a9a9a9;--crepe-color-outline: #757575;--crepe-color-primary: #b5b5b5;--crepe-color-secondary: #4d4d4d;--crepe-color-on-secondary: #d6d6d6;--crepe-color-inverse: #e5e5e5;--crepe-color-on-inverse: #2a2a2a;--crepe-color-inline-code: #ff6666;--crepe-color-error: #ff6666;--crepe-color-hover: #232323;--crepe-color-selected: #2f2f2f;--crepe-color-inline-area: #2b2b2b}html,body{margin:0;padding:0;width:100%;height:100%;overflow-x:hidden;overflow-y:auto;background:var(--app-bg);color:var(--app-text)}body{min-width:320px}#app{width:100vw;height:100vh;margin:0;padding:0;max-width:none;background:var(--app-bg);color:var(--app-text)}*,*:before,*:after{box-sizing:border-box;transition:background-color .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease}@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important}}
|