Add git to project panel in theme, use different values for dark and light

This commit is contained in:
Nate Butler 2023-05-22 12:09:54 -04:00
parent cb1b64e51b
commit b80cb73745
2 changed files with 23 additions and 5 deletions

View File

@ -3,9 +3,10 @@ import { ColorScheme, Layer, StyleSets } from "../themes/common/colorScheme"
import { background, border, borderColor, foreground, text } from "./components"
import hoverPopover from "./hoverPopover"
import { SyntaxHighlightStyle, buildSyntax } from "../themes/common/syntax"
import { buildSyntax } from "../themes/common/syntax"
export default function editor(colorScheme: ColorScheme) {
const { isLight } = colorScheme
let layer = colorScheme.highest
const autocompleteItem = {
@ -97,9 +98,15 @@ export default function editor(colorScheme: ColorScheme) {
foldBackground: foreground(layer, "variant"),
},
diff: {
deleted: foreground(layer, "negative"),
modified: foreground(layer, "warning"),
inserted: foreground(layer, "positive"),
deleted: isLight
? colorScheme.ramps.red(0.5).hex()
: colorScheme.ramps.red(0.4).hex(),
modified: isLight
? colorScheme.ramps.yellow(0.3).hex()
: colorScheme.ramps.yellow(0.5).hex(),
inserted: isLight
? colorScheme.ramps.green(0.4).hex()
: colorScheme.ramps.green(0.5).hex(),
removedWidthEm: 0.275,
widthEm: 0.22,
cornerRadius: 0.2,

View File

@ -3,6 +3,7 @@ import { withOpacity } from "../utils/color"
import { background, border, foreground, text } from "./components"
export default function projectPanel(colorScheme: ColorScheme) {
const { isLight } = colorScheme
let layer = colorScheme.middle
let baseEntry = {
@ -28,6 +29,16 @@ export default function projectPanel(colorScheme: ColorScheme) {
background: background(layer, "active"),
text: text(layer, "mono", "active", { size: "sm" }),
},
status: {
git: {
modified: isLight
? colorScheme.ramps.yellow(0.6).hex()
: colorScheme.ramps.yellow(0.5).hex(),
inserted: isLight
? colorScheme.ramps.green(0.4).hex()
: colorScheme.ramps.green(0.5).hex(),
}
}
}
return {
@ -79,6 +90,6 @@ export default function projectPanel(colorScheme: ColorScheme) {
background: background(layer, "on"),
text: text(layer, "mono", "on", { size: "sm" }),
selection: colorScheme.players[0],
},
}
}
}