Claude Dark Pro

Modifies Claude.ai dark theme to provide an even darker experience
安裝腳本 ?
Wrap lines
// ==UserScript==
// @name         Claude Dark Pro
// @version      1.2
// @description  Modifies Claude.ai dark theme to provide an even darker experience
// @author       oMaN-Rod
// @match        https://claude.ai/*
// @grant        GM_addStyle
// @namespace https://gf.qytechs.cn/users/1407958
// ==/UserScript==

(function () {
    'use strict';

    const colors = {
      // Base theme colors
      mainBg: '#121212',
      secondaryBg: '#1e1e1e',
      accent: '#4a90e2',
      border: 'rgba(255, 255, 255, 0.1)',

      // Code syntax colors (One Dark Pro)
      codeBg: 'rgb(18, 18, 18)',
      codeText: 'rgb(171, 178, 191)'
    };

    const customCSS = `
          /* Base theme styles */
          body.from-bg-200.to-bg-100 {
              background: ${colors.mainBg} !important;
          }

          html.bg-bg-200 {
              background-color: ${colors.mainBg} !important;
          }

          .bg-bg-100,
          .bg-bg-200 {
              background-color: ${colors.mainBg} !important;
          }

          .bg-bg-000,
          .bg-bg-300,
          .bg-bg-400,
          .bg-bg-500 {
              background-color: ${colors.secondaryBg} !important;
          }

          .text-accent-main-000 {
              color: ${colors.accent} !important;
          }

          .border-border-300 {
              border-color: ${colors.border} !important;
          }

          [class*="from-bg-"],
          [class*="to-bg-"],
          [class*="via-bg-"],
          .bg-gradient-to-b,
          .bg-gradient-to-r {
              background: ${colors.mainBg} !important;
              background-image: none !important;
          }

          /* Claude message bubble background */
          .bg-\\[linear-gradient\\(to_bottom\\,_hsla\\(var\\(--bg-000\\)\\/0\\.75\\)_0\\%\\,_hsla\\(var\\(--bg-000\\)_\\/_0\\)_90\\%\\)\\] {
              background: ${colors.mainBg} !important;
              background-image: none !important;
          }

          /* File thumbnails */
          [data-testid="file-thumbnail"] .bg-white {
              background-color: white !important;
          }

          [data-testid="file-thumbnail"] .from-white {
              --tw-gradient-from: white !important;
          }

          [data-testid="file-thumbnail"] .fill-white {
              fill: white !important;
          }

          /* Code block and artifact styling */
          pre, code, .antArtifact {
              background-color: ${colors.codeBg} !important;
              border: none !important;
              border-radius: 4px !important;
              color: ${colors.codeText} !important;
              text-shadow: rgba(0, 0, 0, 0.3) 0px 1px !important;
              font-family: "Fira Code", "Fira Mono", Menlo, Consolas, "DejaVu Sans Mono", monospace !important;
          }

          .code-block__code {
              background: ${colors.codeBg} !important;
              border: 1px solid ${colors.border} !important;
              border-radius: 8px 8px 0 0 !important;
          }

          pre > div {
              background-color: #000000 !important;
              border-radius: 0 !important;
          }
      `;

    const styleSheet = document.createElement('style');
    styleSheet.textContent = customCSS;
    document.head.appendChild(styleSheet);
  })();
欢迎访问Greasy Fork镜像
