| 221 | * @returns A new Theme instance. |
| 222 | */ |
| 223 | export function createCustomTheme(customTheme: CustomTheme): Theme { |
| 224 | const colors: ColorsTheme = { |
| 225 | type: 'custom', |
| 226 | Background: customTheme.background?.primary ?? customTheme.Background ?? '', |
| 227 | Foreground: customTheme.text?.primary ?? customTheme.Foreground ?? '', |
| 228 | LightBlue: customTheme.text?.link ?? customTheme.LightBlue ?? '', |
| 229 | AccentBlue: customTheme.text?.link ?? customTheme.AccentBlue ?? '', |
| 230 | AccentPurple: customTheme.text?.accent ?? customTheme.AccentPurple ?? '', |
| 231 | AccentCyan: customTheme.text?.link ?? customTheme.AccentCyan ?? '', |
| 232 | AccentGreen: customTheme.status?.success ?? customTheme.AccentGreen ?? '', |
| 233 | AccentYellow: customTheme.status?.warning ?? customTheme.AccentYellow ?? '', |
| 234 | AccentRed: customTheme.status?.error ?? customTheme.AccentRed ?? '', |
| 235 | DiffAdded: |
| 236 | customTheme.background?.diff?.added ?? customTheme.DiffAdded ?? '', |
| 237 | DiffRemoved: |
| 238 | customTheme.background?.diff?.removed ?? customTheme.DiffRemoved ?? '', |
| 239 | Comment: customTheme.ui?.comment ?? customTheme.Comment ?? '', |
| 240 | Gray: customTheme.text?.secondary ?? customTheme.Gray ?? '', |
| 241 | GradientColors: customTheme.ui?.gradient ?? customTheme.GradientColors, |
| 242 | }; |
| 243 | |
| 244 | // Generate CSS properties mappings based on the custom theme colors |
| 245 | const rawMappings: Record<string, CSSProperties> = { |
| 246 | hljs: { |
| 247 | display: 'block', |
| 248 | overflowX: 'auto', |
| 249 | padding: '0.5em', |
| 250 | background: colors.Background, |
| 251 | color: colors.Foreground, |
| 252 | }, |
| 253 | 'hljs-keyword': { |
| 254 | color: colors.AccentBlue, |
| 255 | }, |
| 256 | 'hljs-literal': { |
| 257 | color: colors.AccentBlue, |
| 258 | }, |
| 259 | 'hljs-symbol': { |
| 260 | color: colors.AccentBlue, |
| 261 | }, |
| 262 | 'hljs-name': { |
| 263 | color: colors.AccentBlue, |
| 264 | }, |
| 265 | 'hljs-link': { |
| 266 | color: colors.AccentBlue, |
| 267 | textDecoration: 'underline', |
| 268 | }, |
| 269 | 'hljs-built_in': { |
| 270 | color: colors.AccentCyan, |
| 271 | }, |
| 272 | 'hljs-type': { |
| 273 | color: colors.AccentCyan, |
| 274 | }, |
| 275 | 'hljs-number': { |
| 276 | color: colors.AccentGreen, |
| 277 | }, |
| 278 | 'hljs-class': { |
| 279 | color: colors.AccentGreen, |
| 280 | }, |