@setoelkahfi / svara / commits / e8026d1

style: styling for embedded terminal colors

Signed-off-by: mellobacon <mellodev@outlook.com>

mellobacon committed Jan 31, 2024 at 22:32 UTC e8026d1c765cb5b2ceed52b58d020f306e2cfb52
4 files changed +89 -2
src/config/extensions/default_themes/themes/default_dark.json
+21 -1
@@ -108,6 +108,26 @@
108 "modal.buttonBackground": "#2276b2",
109 "modal.buttonForeground": "#f9f9f9",
110 "modal.buttonHoverBackground": "#1c88d4",
111 - "modal.buttonHoverForeground": "#f9f9f9"
111 + "modal.buttonHoverForeground": "#f9f9f9",
112 +
113 + "terminal.background": "#171717",
114 + "terminal.foreground": "#ffffff",
115 +
116 + "terminal.black": "#363b54",
117 + "terminal.red": "#f7768e",
118 + "terminal.green": "#73daca",
119 + "terminal.yellow": "#e0af68",
120 + "terminal.blue": "#7aa2f7",
121 + "terminal.magenta": "#bb9af7",
122 + "terminal.cyan": "#7dcfff",
123 + "terminal.white": "#787c99",
124 + "terminal.brightBlack": "#363b54",
125 + "terminal.brightRed": "#f7768e",
126 + "terminal.brightGreen": "#41a6b5",
127 + "terminal.brightYellow": "#e0af68",
128 + "terminal.brightBlue": "#7aa2f7",
129 + "terminal.brightMagenta": "#bb9af7",
130 + "terminal.brightCyan": "#7dcfff",
131 + "terminal.brightWhite": "#acb0d0"
132 }
133 }
src/config/extensions/default_themes/themes/default_light.json
+21 -1
@@ -108,6 +108,26 @@
108 "modal.buttonBackground": "#2276b2",
109 "modal.buttonForeground": "#f9f9f9",
110 "modal.buttonHoverBackground": "#1c88d4",
111 - "modal.buttonHoverForeground": "#f9f9f9"
111 + "modal.buttonHoverForeground": "#f9f9f9",
112 +
113 + "terminal.background": "#fafafa",
114 + "terminal.foreground": "#000000",
115 +
116 + "terminal.Black": "#0f0f14",
117 + "terminal.Red": "#8c4351",
118 + "terminal.Green": "#33635c",
119 + "terminal.Yellow": "#8f5e15",
120 + "terminal.Blue": "#34548a",
121 + "terminal.Magenta": "#5a4a78",
122 + "terminal.Cyan": "#0f4b6e",
123 + "terminal.White": "#828594",
124 + "terminal.brightBlack": "#0f0f14",
125 + "terminal.brightRed": "#8c4351",
126 + "terminal.brightGreen": "#33635c",
127 + "terminal.brightYellow": "#8f5e15",
128 + "terminal.brightBlue": "#34548a",
129 + "terminal.brightMagenta": "#5a4a78",
130 + "terminal.brightCyan": "#0f4b6e",
131 + "terminal.brightWhite": "#828594"
132 }
133 }
src/config/themehandler.ts
+23
@@ -3,6 +3,7 @@ import { themes } from "./extensionhandler";
3 import { info } from "tauri-plugin-log-api";
4 import { exists, readDir } from "@tauri-apps/api/fs";
5 import { get } from "svelte/store";
6 +import { termTheme, updateTermTheme } from "../lib/Terminal.svelte";
7
8 export function getThemes() {
9 return get(themes);
@@ -23,6 +24,27 @@ export async function loadTheme(name: string) {
24 //const custom_themes = await readDir(path);
25 //}
26
27 + termTheme.set({
28 + "black": getThemeProperty("terminal-black"),
29 + "red": getThemeProperty("terminal-red"),
30 + "green": getThemeProperty("terminal-green"),
31 + "yellow": getThemeProperty("terminal-yellow"),
32 + "blue": getThemeProperty("terminal-blue"),
33 + "magenta": getThemeProperty("terminal-magenta"),
34 + "cyan": getThemeProperty("terminal-cyan"),
35 + "white": getThemeProperty("terminal-white"),
36 + "brightBlack": getThemeProperty("terminal-brightBlack"),
37 + "brightRed": getThemeProperty("terminal-brightRed"),
38 + "brightGreen": getThemeProperty("terminal-brightGreen"),
39 + "brightYellow": getThemeProperty("terminal-brightYellow"),
40 + "brightBlue": getThemeProperty("terminal-brightBlue"),
41 + "brightMagenta": getThemeProperty("terminal-brightMagenta"),
42 + "brightCyan": getThemeProperty("terminal-brightCyan"),
43 + "brightWhite": getThemeProperty("terminal-brightWhite"),
44 + })
45 +
46 + updateTermTheme();
47 +
48 info("Theme loaded sucessfully.", {file: "themehandler.ts", line: 35});
49 }
50 function processStyles(json) {
@@ -40,4 +62,5 @@ export function getThemeProperty(styleName: string) {
62 return stylesheet.style.getPropertyValue(style);
63 }
64 }
65 + return "purple";
66 }
src/theme.scss
+24
@@ -310,3 +310,27 @@ button:focus {
310 }
311 }
312 }
313 +
314 +#toolview {
315 + .header {
316 + border-bottom: solid 1px var(--window-borderColor);
317 + .close {
318 + color: var(--statusbar-foreground);
319 + &:hover {
320 + background-color: var(--statusbar-buttonBackgroundHover);
321 + color: var(--statusbar-buttonForegroundHover);
322 + }
323 + }
324 + }
325 +}
326 +
327 +#terminal {
328 + background-color: var(--terminal-background);
329 + color: var(--terminal-foreground);
330 + .xterm-viewport {
331 + background-color: var(--terminal-background) !important;
332 + }
333 + .xterm-rows {
334 + color: var(--terminal-foreground);
335 + }
336 +}
\ No newline at end of file