mirror of
https://github.com/zed-industries/zed.git
synced 2024-12-28 20:01:33 +00:00
WIP convert to snake_case
This commit is contained in:
parent
bfdd0824e2
commit
2e162f8af7
49 changed files with 221 additions and 180 deletions
42
styles/mod.py
Normal file
42
styles/mod.py
Normal file
|
@ -0,0 +1,42 @@
|
|||
import os, sys, re
|
||||
|
||||
|
||||
def camel_to_snake(inputstring):
|
||||
REG = r'(?<!^)(?=[A-Z])'
|
||||
return re.sub(REG, '_', inputstring).lower()
|
||||
|
||||
|
||||
def change_case(mypath):
|
||||
if os.path.isabs(mypath):
|
||||
raise ValueError
|
||||
else:
|
||||
abs_path_to_dir = os.path.normpath(os.path.join(os.path.dirname(__file__), mypath))
|
||||
with os.scandir(abs_path_to_dir) as iter:
|
||||
dirs = []
|
||||
typescriptfiles = []
|
||||
for entry in iter:
|
||||
if (entry.is_dir() and entry.name not in ["node_modules", "target"]):
|
||||
dirs.append(entry.name)
|
||||
if (entry.is_file() and entry.name.endswith('.ts')):
|
||||
typescriptfiles.append(entry.name)
|
||||
if len(dirs) != 0:
|
||||
for dir in dirs:
|
||||
change_case(os.path.normpath(os.path.join(mypath,dir)))
|
||||
for entry in typescriptfiles:
|
||||
relative_path = os.path.normpath(os.path.join(mypath,entry))
|
||||
dst = camel_to_snake(relative_path)
|
||||
abs_path = os.path.normpath(os.path.join(os.path.dirname(__file__), relative_path))
|
||||
abs_dst = os.path.normpath(os.path.join(os.path.dirname(__file__), dst))
|
||||
(head, tail) = os.path.split(abs_dst)
|
||||
if not os.path.exists(head):
|
||||
os.makedirs(head)
|
||||
os.rename(abs_path, abs_dst)
|
||||
|
||||
def main():
|
||||
dir = os.path.dirname(__file__)
|
||||
path = sys.argv[1]
|
||||
change_case(path)
|
||||
|
||||
|
||||
if __name__ == '__main__':
|
||||
main()
|
|
@ -4,10 +4,10 @@
|
|||
"description": "",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"build": "ts-node ./src/buildThemes.ts",
|
||||
"build-licenses": "ts-node ./src/buildLicenses.ts",
|
||||
"build-tokens": "ts-node ./src/buildTokens.ts",
|
||||
"build-types": "ts-node ./src/buildTypes.ts",
|
||||
"build": "ts-node ./src/build_themes.ts",
|
||||
"build-licenses": "ts-node ./src/build_licenses.ts",
|
||||
"build-tokens": "ts-node ./src/build_tokens.ts",
|
||||
"build-types": "ts-node ./src/build_types.ts",
|
||||
"test": "vitest"
|
||||
},
|
||||
"author": "",
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
import * as fs from "fs"
|
||||
import { tmpdir } from "os"
|
||||
import * as path from "path"
|
||||
import app from "./styleTree/app"
|
||||
import { ColorScheme, createColorScheme } from "./theme/colorScheme"
|
||||
import snakeCase from "./utils/snakeCase"
|
||||
import app from "./style_tree/app"
|
||||
import { ColorScheme, createColorScheme } from "./theme/color_scheme"
|
||||
import snakeCase from "./utils/snake_case"
|
||||
import { themes } from "./themes"
|
||||
|
||||
const assetsDirectory = `${__dirname}/../../assets`
|
|
@ -3,7 +3,7 @@ import * as path from "path"
|
|||
import { ColorScheme, createColorScheme } from "./common"
|
||||
import { themes } from "./themes"
|
||||
import { slugify } from "./utils/slugify"
|
||||
import { colorSchemeTokens } from "./theme/tokens/colorScheme"
|
||||
import { colorSchemeTokens } from "./theme/tokens/color_scheme"
|
||||
|
||||
const TOKENS_DIRECTORY = path.join(__dirname, "..", "target", "tokens")
|
||||
const TOKENS_FILE = path.join(TOKENS_DIRECTORY, "$themes.json")
|
||||
|
@ -38,7 +38,7 @@ function buildTokenSetOrder(colorSchemes: ColorScheme[]): {
|
|||
|
||||
function buildThemesIndex(colorSchemes: ColorScheme[]): TokenSet[] {
|
||||
const themesIndex: TokenSet[] = colorSchemes.map((scheme, index) => {
|
||||
const id = `${scheme.isLight ? "light" : "dark"}_${scheme.name
|
||||
const id = `${scheme.is_light ? "light" : "dark"}_${scheme.name
|
||||
.toLowerCase()
|
||||
.replace(/\s+/g, "_")}_${index}`
|
||||
const selectedTokenSets: { [key: string]: "enabled" } = {}
|
||||
|
@ -47,7 +47,7 @@ function buildThemesIndex(colorSchemes: ColorScheme[]): TokenSet[] {
|
|||
|
||||
return {
|
||||
id,
|
||||
name: `${scheme.name} - ${scheme.isLight ? "Light" : "Dark"}`,
|
||||
name: `${scheme.name} - ${scheme.is_light ? "Light" : "Dark"}`,
|
||||
selectedTokenSets,
|
||||
}
|
||||
})
|
|
@ -43,7 +43,6 @@ async function main() {
|
|||
return
|
||||
}
|
||||
} catch (e) {
|
||||
// @ts-expect-error - It's fine if there's no output from a previous run.
|
||||
if (e.code !== "ENOENT") {
|
||||
throw e
|
||||
}
|
|
@ -1,6 +1,6 @@
|
|||
import { ColorScheme } from "../common"
|
||||
import { interactive, toggleable } from "../element"
|
||||
import { background, foreground } from "../styleTree/components"
|
||||
import { background, foreground } from "../style_tree/components"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
|
||||
export type Margin = {
|
||||
top: number
|
||||
|
@ -11,9 +11,9 @@ export type Margin = {
|
|||
|
||||
interface IconButtonOptions {
|
||||
layer?:
|
||||
| ColorScheme["lowest"]
|
||||
| ColorScheme["middle"]
|
||||
| ColorScheme["highest"]
|
||||
| ColorScheme["lowest"]
|
||||
| ColorScheme["middle"]
|
||||
| ColorScheme["highest"]
|
||||
color?: keyof ColorScheme["lowest"]
|
||||
margin?: Partial<Margin>
|
||||
}
|
||||
|
|
|
@ -1,18 +1,18 @@
|
|||
import { ColorScheme } from "../common"
|
||||
import { interactive, toggleable } from "../element"
|
||||
import {
|
||||
TextProperties,
|
||||
background,
|
||||
foreground,
|
||||
text,
|
||||
} from "../styleTree/components"
|
||||
} from "../style_tree/components"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { Margin } from "./icon_button"
|
||||
|
||||
interface TextButtonOptions {
|
||||
layer?:
|
||||
| ColorScheme["lowest"]
|
||||
| ColorScheme["middle"]
|
||||
| ColorScheme["highest"]
|
||||
| ColorScheme["lowest"]
|
||||
| ColorScheme["middle"]
|
||||
| ColorScheme["highest"]
|
||||
color?: keyof ColorScheme["lowest"]
|
||||
margin?: Partial<Margin>
|
||||
text_properties?: TextProperties
|
||||
|
|
|
@ -1,75 +0,0 @@
|
|||
import contactFinder from "./contactFinder"
|
||||
import contactsPopover from "./contactsPopover"
|
||||
import commandPalette from "./commandPalette"
|
||||
import editor from "./editor"
|
||||
import projectPanel from "./projectPanel"
|
||||
import search from "./search"
|
||||
import picker from "./picker"
|
||||
import workspace from "./workspace"
|
||||
import contextMenu from "./contextMenu"
|
||||
import sharedScreen from "./sharedScreen"
|
||||
import projectDiagnostics from "./projectDiagnostics"
|
||||
import contactNotification from "./contactNotification"
|
||||
import updateNotification from "./updateNotification"
|
||||
import simpleMessageNotification from "./simpleMessageNotification"
|
||||
import projectSharedNotification from "./projectSharedNotification"
|
||||
import tooltip from "./tooltip"
|
||||
import terminal from "./terminal"
|
||||
import contactList from "./contactList"
|
||||
import toolbarDropdownMenu from "./toolbarDropdownMenu"
|
||||
import incomingCallNotification from "./incomingCallNotification"
|
||||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import feedback from "./feedback"
|
||||
import welcome from "./welcome"
|
||||
import copilot from "./copilot"
|
||||
import assistant from "./assistant"
|
||||
import { titlebar } from "./titlebar"
|
||||
|
||||
export default function app(colorScheme: ColorScheme): any {
|
||||
return {
|
||||
meta: {
|
||||
name: colorScheme.name,
|
||||
isLight: colorScheme.isLight,
|
||||
},
|
||||
commandPalette: commandPalette(colorScheme),
|
||||
contactNotification: contactNotification(colorScheme),
|
||||
projectSharedNotification: projectSharedNotification(colorScheme),
|
||||
incomingCallNotification: incomingCallNotification(colorScheme),
|
||||
picker: picker(colorScheme),
|
||||
workspace: workspace(colorScheme),
|
||||
titlebar: titlebar(colorScheme),
|
||||
copilot: copilot(colorScheme),
|
||||
welcome: welcome(colorScheme),
|
||||
contextMenu: contextMenu(colorScheme),
|
||||
editor: editor(colorScheme),
|
||||
projectDiagnostics: projectDiagnostics(colorScheme),
|
||||
projectPanel: projectPanel(colorScheme),
|
||||
contactsPopover: contactsPopover(colorScheme),
|
||||
contactFinder: contactFinder(colorScheme),
|
||||
contactList: contactList(colorScheme),
|
||||
toolbarDropdownMenu: toolbarDropdownMenu(colorScheme),
|
||||
search: search(colorScheme),
|
||||
sharedScreen: sharedScreen(colorScheme),
|
||||
updateNotification: updateNotification(colorScheme),
|
||||
simpleMessageNotification: simpleMessageNotification(colorScheme),
|
||||
tooltip: tooltip(colorScheme),
|
||||
terminal: terminal(colorScheme),
|
||||
assistant: assistant(colorScheme),
|
||||
feedback: feedback(colorScheme),
|
||||
colorScheme: {
|
||||
...colorScheme,
|
||||
players: Object.values(colorScheme.players),
|
||||
ramps: {
|
||||
neutral: colorScheme.ramps.neutral.colors(100, "hex"),
|
||||
red: colorScheme.ramps.red.colors(100, "hex"),
|
||||
orange: colorScheme.ramps.orange.colors(100, "hex"),
|
||||
yellow: colorScheme.ramps.yellow.colors(100, "hex"),
|
||||
green: colorScheme.ramps.green.colors(100, "hex"),
|
||||
cyan: colorScheme.ramps.cyan.colors(100, "hex"),
|
||||
blue: colorScheme.ramps.blue.colors(100, "hex"),
|
||||
violet: colorScheme.ramps.violet.colors(100, "hex"),
|
||||
magenta: colorScheme.ramps.magenta.colors(100, "hex"),
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
75
styles/src/style_tree/app.ts
Normal file
75
styles/src/style_tree/app.ts
Normal file
|
@ -0,0 +1,75 @@
|
|||
import contact_finder from "./contact_finder"
|
||||
import contacts_popover from "./contacts_popover"
|
||||
import command_palette from "./command_palette"
|
||||
import project_panel from "./project_panel"
|
||||
import search from "./search"
|
||||
import picker from "./picker"
|
||||
import workspace from "./workspace"
|
||||
import context_menu from "./context_menu"
|
||||
import shared_screen from "./shared_screen"
|
||||
import project_diagnostics from "./project_diagnostics"
|
||||
import contact_notification from "./contact_notification"
|
||||
import update_notification from "./update_notification"
|
||||
import simple_message_notification from "./simple_message_notification"
|
||||
import project_shared_notification from "./project_shared_notification"
|
||||
import tooltip from "./tooltip"
|
||||
import terminal from "./terminal"
|
||||
import contact_list from "./contact_list"
|
||||
import toolbar_dropdown_menu from "./toolbar_dropdown_menu"
|
||||
import incoming_call_notification from "./incoming_call_notification"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import welcome from "./welcome"
|
||||
import copilot from "./copilot"
|
||||
import assistant from "./assistant"
|
||||
import { titlebar } from "./titlebar"
|
||||
import editor from "./editor"
|
||||
import feedback from "./feedback"
|
||||
|
||||
export default function app(theme: ColorScheme): any {
|
||||
return {
|
||||
meta: {
|
||||
name: theme.name,
|
||||
is_light: theme.is_light,
|
||||
},
|
||||
command_palette: command_palette(theme),
|
||||
contact_notification: contact_notification(theme),
|
||||
project_shared_notification: project_shared_notification(theme),
|
||||
incoming_call_notification: incoming_call_notification(theme),
|
||||
picker: picker(theme),
|
||||
workspace: workspace(theme),
|
||||
titlebar: titlebar(theme),
|
||||
copilot: copilot(theme),
|
||||
welcome: welcome(theme),
|
||||
context_menu: context_menu(theme),
|
||||
editor: editor(theme),
|
||||
project_diagnostics: project_diagnostics(theme),
|
||||
project_panel: project_panel(theme),
|
||||
contacts_popover: contacts_popover(theme),
|
||||
contact_finder: contact_finder(theme),
|
||||
contact_list: contact_list(theme),
|
||||
toolbar_dropdown_menu: toolbar_dropdown_menu(theme),
|
||||
search: search(theme),
|
||||
shared_screen: shared_screen(theme),
|
||||
update_notification: update_notification(theme),
|
||||
simple_message_notification: simple_message_notification(theme),
|
||||
tooltip: tooltip(theme),
|
||||
terminal: terminal(theme),
|
||||
assistant: assistant(theme),
|
||||
feedback: feedback(theme),
|
||||
color_scheme: {
|
||||
...theme,
|
||||
players: Object.values(theme.players),
|
||||
ramps: {
|
||||
neutral: theme.ramps.neutral.colors(100, "hex"),
|
||||
red: theme.ramps.red.colors(100, "hex"),
|
||||
orange: theme.ramps.orange.colors(100, "hex"),
|
||||
yellow: theme.ramps.yellow.colors(100, "hex"),
|
||||
green: theme.ramps.green.colors(100, "hex"),
|
||||
cyan: theme.ramps.cyan.colors(100, "hex"),
|
||||
blue: theme.ramps.blue.colors(100, "hex"),
|
||||
violet: theme.ramps.violet.colors(100, "hex"),
|
||||
magenta: theme.ramps.magenta.colors(100, "hex"),
|
||||
},
|
||||
},
|
||||
}
|
||||
}
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { text, border, background, foreground } from "./components"
|
||||
import editor from "./editor"
|
||||
import { interactive } from "../element"
|
|
@ -1,9 +1,9 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { withOpacity } from "../theme/color"
|
||||
import { text, background } from "./components"
|
||||
import { toggleable } from "../element"
|
||||
|
||||
export default function commandPalette(colorScheme: ColorScheme): any {
|
||||
export default function command_palette(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.highest
|
||||
|
||||
const key = toggleable({
|
|
@ -1,5 +1,5 @@
|
|||
import { fontFamilies, fontSizes, FontWeight } from "../common"
|
||||
import { Layer, Styles, StyleSets, Style } from "../theme/colorScheme"
|
||||
import { Layer, Styles, StyleSets, Style } from "../theme/color_scheme"
|
||||
|
||||
function isStyleSet(key: any): key is StyleSets {
|
||||
return [
|
|
@ -1,8 +1,8 @@
|
|||
import picker from "./picker"
|
||||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, foreground, text } from "./components"
|
||||
|
||||
export default function contactFinder(colorScheme: ColorScheme): any {
|
||||
export default function contact_finder(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.middle
|
||||
|
||||
const sideMargin = 6
|
|
@ -1,7 +1,7 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, borderColor, foreground, text } from "./components"
|
||||
import { interactive, toggleable } from "../element"
|
||||
export default function contactsPanel(colorScheme: ColorScheme): any {
|
||||
export default function contacts_panel(colorScheme: ColorScheme): any {
|
||||
const nameMargin = 8
|
||||
const sidePadding = 12
|
||||
|
|
@ -1,10 +1,10 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, foreground, text } from "./components"
|
||||
import { interactive } from "../element"
|
||||
const avatarSize = 12
|
||||
const headerPadding = 8
|
||||
|
||||
export default function contactNotification(colorScheme: ColorScheme): any {
|
||||
export default function contact_notification(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.lowest
|
||||
return {
|
||||
headerAvatar: {
|
|
@ -1,7 +1,7 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border } from "./components"
|
||||
|
||||
export default function contactsPopover(colorScheme: ColorScheme): any {
|
||||
export default function contacts_popover(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.middle
|
||||
return {
|
||||
background: background(layer),
|
|
@ -1,8 +1,8 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, borderColor, text } from "./components"
|
||||
import { interactive, toggleable } from "../element"
|
||||
|
||||
export default function contextMenu(colorScheme: ColorScheme): any {
|
||||
export default function context_menu(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.middle
|
||||
return {
|
||||
background: background(layer),
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, foreground, svg, text } from "./components"
|
||||
import { interactive } from "../element"
|
||||
export default function copilot(colorScheme: ColorScheme): any {
|
|
@ -1,13 +1,13 @@
|
|||
import { withOpacity } from "../theme/color"
|
||||
import { ColorScheme, Layer, StyleSets } from "../theme/colorScheme"
|
||||
import { ColorScheme, Layer, StyleSets } from "../theme/color_scheme"
|
||||
import { background, border, borderColor, foreground, text } from "./components"
|
||||
import hoverPopover from "./hoverPopover"
|
||||
import hoverPopover from "./hover_popover"
|
||||
|
||||
import { buildSyntax } from "../theme/syntax"
|
||||
import { interactive, toggleable } from "../element"
|
||||
|
||||
export default function editor(colorScheme: ColorScheme): any {
|
||||
const { isLight } = colorScheme
|
||||
const { is_light } = colorScheme
|
||||
|
||||
const layer = colorScheme.highest
|
||||
|
||||
|
@ -130,13 +130,13 @@ export default function editor(colorScheme: ColorScheme): any {
|
|||
foldBackground: foreground(layer, "variant"),
|
||||
},
|
||||
diff: {
|
||||
deleted: isLight
|
||||
deleted: is_light
|
||||
? colorScheme.ramps.red(0.5).hex()
|
||||
: colorScheme.ramps.red(0.4).hex(),
|
||||
modified: isLight
|
||||
modified: is_light
|
||||
? colorScheme.ramps.yellow(0.5).hex()
|
||||
: colorScheme.ramps.yellow(0.5).hex(),
|
||||
inserted: isLight
|
||||
inserted: is_light
|
||||
? colorScheme.ramps.green(0.4).hex()
|
||||
: colorScheme.ramps.green(0.5).hex(),
|
||||
removedWidthEm: 0.275,
|
||||
|
@ -292,13 +292,13 @@ export default function editor(colorScheme: ColorScheme): any {
|
|||
},
|
||||
},
|
||||
git: {
|
||||
deleted: isLight
|
||||
deleted: is_light
|
||||
? withOpacity(colorScheme.ramps.red(0.5).hex(), 0.8)
|
||||
: withOpacity(colorScheme.ramps.red(0.4).hex(), 0.8),
|
||||
modified: isLight
|
||||
modified: is_light
|
||||
? withOpacity(colorScheme.ramps.yellow(0.5).hex(), 0.8)
|
||||
: withOpacity(colorScheme.ramps.yellow(0.4).hex(), 0.8),
|
||||
inserted: isLight
|
||||
inserted: is_light
|
||||
? withOpacity(colorScheme.ramps.green(0.5).hex(), 0.8)
|
||||
: withOpacity(colorScheme.ramps.green(0.4).hex(), 0.8),
|
||||
},
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, text } from "./components"
|
||||
import { interactive } from "../element"
|
||||
|
|
@ -1,7 +1,7 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, foreground, text } from "./components"
|
||||
|
||||
export default function HoverPopover(colorScheme: ColorScheme): any {
|
||||
export default function hover_popover(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.middle
|
||||
const baseContainer = {
|
||||
background: background(layer),
|
|
@ -1,7 +1,7 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, text } from "./components"
|
||||
|
||||
export default function incomingCallNotification(
|
||||
export default function incoming_call_notification(
|
||||
colorScheme: ColorScheme
|
||||
): unknown {
|
||||
const layer = colorScheme.middle
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { withOpacity } from "../theme/color"
|
||||
import { background, border, text } from "./components"
|
||||
import { interactive, toggleable } from "../element"
|
|
@ -1,7 +1,7 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, text } from "./components"
|
||||
|
||||
export default function projectDiagnostics(colorScheme: ColorScheme): any {
|
||||
export default function project_diagnostics(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.highest
|
||||
return {
|
||||
background: background(layer),
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { withOpacity } from "../theme/color"
|
||||
import {
|
||||
Border,
|
||||
|
@ -10,10 +10,10 @@ import {
|
|||
} from "./components"
|
||||
import { interactive, toggleable } from "../element"
|
||||
import merge from "ts-deepmerge"
|
||||
export default function projectPanel(colorScheme: ColorScheme): any {
|
||||
const { isLight } = colorScheme
|
||||
export default function project_panel(theme: ColorScheme): any {
|
||||
const { is_light } = theme
|
||||
|
||||
const layer = colorScheme.middle
|
||||
const layer = theme.middle
|
||||
|
||||
type EntryStateProps = {
|
||||
background?: string
|
||||
|
@ -31,15 +31,15 @@ export default function projectPanel(colorScheme: ColorScheme): any {
|
|||
const entry = (unselected?: EntryState, selected?: EntryState) => {
|
||||
const git_status = {
|
||||
git: {
|
||||
modified: isLight
|
||||
? colorScheme.ramps.yellow(0.6).hex()
|
||||
: colorScheme.ramps.yellow(0.5).hex(),
|
||||
inserted: isLight
|
||||
? colorScheme.ramps.green(0.45).hex()
|
||||
: colorScheme.ramps.green(0.5).hex(),
|
||||
conflict: isLight
|
||||
? colorScheme.ramps.red(0.6).hex()
|
||||
: colorScheme.ramps.red(0.5).hex(),
|
||||
modified: is_light
|
||||
? theme.ramps.yellow(0.6).hex()
|
||||
: theme.ramps.yellow(0.5).hex(),
|
||||
inserted: is_light
|
||||
? theme.ramps.green(0.45).hex()
|
||||
: theme.ramps.green(0.5).hex(),
|
||||
conflict: is_light
|
||||
? theme.ramps.red(0.6).hex()
|
||||
: theme.ramps.red(0.5).hex(),
|
||||
},
|
||||
}
|
||||
|
||||
|
@ -182,7 +182,7 @@ export default function projectPanel(colorScheme: ColorScheme): any {
|
|||
filenameEditor: {
|
||||
background: background(layer, "on"),
|
||||
text: text(layer, "mono", "on", { size: "sm" }),
|
||||
selection: colorScheme.players[0],
|
||||
selection: theme.players[0],
|
||||
},
|
||||
}
|
||||
}
|
|
@ -1,7 +1,7 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, text } from "./components"
|
||||
|
||||
export default function projectSharedNotification(
|
||||
export default function project_shared_notification(
|
||||
colorScheme: ColorScheme
|
||||
): unknown {
|
||||
const layer = colorScheme.middle
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { withOpacity } from "../theme/color"
|
||||
import { background, border, foreground, text } from "./components"
|
||||
import { interactive, toggleable } from "../element"
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { StyleTree } from "../types"
|
||||
import { background } from "./components"
|
||||
|
|
@ -1,10 +1,10 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, foreground, text } from "./components"
|
||||
import { interactive } from "../element"
|
||||
|
||||
const headerPadding = 8
|
||||
|
||||
export default function simpleMessageNotification(
|
||||
export default function simple_message_notification(
|
||||
colorScheme: ColorScheme
|
||||
): unknown {
|
||||
const layer = colorScheme.middle
|
|
@ -1,7 +1,7 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, foreground, text } from "./components"
|
||||
import { interactive, toggleable } from "../element"
|
||||
export default function statusBar(colorScheme: ColorScheme): any {
|
||||
export default function status_bar(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.lowest
|
||||
|
||||
const statusContainer = {
|
|
@ -1,9 +1,9 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { withOpacity } from "../theme/color"
|
||||
import { text, border, background, foreground } from "./components"
|
||||
import { interactive, toggleable } from "../element"
|
||||
|
||||
export default function tabBar(colorScheme: ColorScheme): any {
|
||||
export default function tab_bar(colorScheme: ColorScheme): any {
|
||||
const height = 32
|
||||
|
||||
const activeLayer = colorScheme.highest
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { StyleTree } from "../types"
|
||||
|
||||
export default function terminal(theme: ColorScheme): StyleTree.TerminalStyle {
|
|
@ -1,7 +1,7 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, text } from "./components"
|
||||
import { interactive, toggleable } from "../element"
|
||||
export default function dropdownMenu(colorScheme: ColorScheme): any {
|
||||
export default function dropdown_menu(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.middle
|
||||
|
||||
return {
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { background, border, text } from "./components"
|
||||
|
||||
export default function tooltip(colorScheme: ColorScheme): any {
|
|
@ -1,10 +1,10 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { foreground, text } from "./components"
|
||||
import { interactive } from "../element"
|
||||
|
||||
const headerPadding = 8
|
||||
|
||||
export default function updateNotification(colorScheme: ColorScheme): any {
|
||||
export default function update_notification(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.middle
|
||||
return {
|
||||
message: {
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { withOpacity } from "../theme/color"
|
||||
import {
|
||||
border,
|
|
@ -1,4 +1,4 @@
|
|||
import { ColorScheme } from "../theme/colorScheme"
|
||||
import { ColorScheme } from "../theme/color_scheme"
|
||||
import { withOpacity } from "../theme/color"
|
||||
import {
|
||||
background,
|
||||
|
@ -8,14 +8,14 @@ import {
|
|||
svg,
|
||||
text,
|
||||
} from "./components"
|
||||
import statusBar from "./statusBar"
|
||||
import tabBar from "./tabBar"
|
||||
import statusBar from "./status_bar"
|
||||
import tabBar from "./tab_bar"
|
||||
import { interactive } from "../element"
|
||||
|
||||
import { titlebar } from "./titlebar"
|
||||
export default function workspace(colorScheme: ColorScheme): any {
|
||||
const layer = colorScheme.lowest
|
||||
const isLight = colorScheme.isLight
|
||||
const is_light = colorScheme.is_light
|
||||
|
||||
return {
|
||||
background: background(colorScheme.lowest),
|
||||
|
@ -25,7 +25,7 @@ export default function workspace(colorScheme: ColorScheme): any {
|
|||
height: 256,
|
||||
},
|
||||
logo: svg(
|
||||
withOpacity("#000000", colorScheme.isLight ? 0.6 : 0.8),
|
||||
withOpacity("#000000", colorScheme.is_light ? 0.6 : 0.8),
|
||||
"icons/logo_96.svg",
|
||||
256,
|
||||
256
|
||||
|
@ -33,10 +33,10 @@ export default function workspace(colorScheme: ColorScheme): any {
|
|||
|
||||
logoShadow: svg(
|
||||
withOpacity(
|
||||
colorScheme.isLight
|
||||
colorScheme.is_light
|
||||
? "#FFFFFF"
|
||||
: colorScheme.lowest.base.default.background,
|
||||
colorScheme.isLight ? 1 : 0.6
|
||||
colorScheme.is_light ? 1 : 0.6
|
||||
),
|
||||
"icons/logo_96.svg",
|
||||
256,
|
||||
|
@ -96,7 +96,7 @@ export default function workspace(colorScheme: ColorScheme): any {
|
|||
},
|
||||
zoomedBackground: {
|
||||
cursor: "Arrow",
|
||||
background: isLight
|
||||
background: is_light
|
||||
? withOpacity(background(colorScheme.lowest), 0.8)
|
||||
: withOpacity(background(colorScheme.highest), 0.6),
|
||||
},
|
|
@ -5,12 +5,12 @@ import {
|
|||
ThemeConfig,
|
||||
ThemeAppearance,
|
||||
ThemeConfigInputColors,
|
||||
} from "./themeConfig"
|
||||
} from "./theme_config"
|
||||
import { getRamps } from "./ramps"
|
||||
|
||||
export interface ColorScheme {
|
||||
name: string
|
||||
isLight: boolean
|
||||
is_light: boolean
|
||||
|
||||
lowest: Layer
|
||||
middle: Layer
|
||||
|
@ -155,7 +155,7 @@ export function createColorScheme(theme: ThemeConfig): ColorScheme {
|
|||
|
||||
return {
|
||||
name,
|
||||
isLight,
|
||||
is_light: isLight,
|
||||
|
||||
ramps,
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
export * from "./colorScheme"
|
||||
export * from "./color_scheme"
|
||||
export * from "./ramps"
|
||||
export * from "./syntax"
|
||||
export * from "./themeConfig"
|
||||
export * from "./theme_config"
|
||||
|
|
|
@ -1,9 +1,9 @@
|
|||
import chroma, { Color, Scale } from "chroma-js"
|
||||
import { RampSet } from "./colorScheme"
|
||||
import { RampSet } from "./color_scheme"
|
||||
import {
|
||||
ThemeConfigInputColors,
|
||||
ThemeConfigInputColorsKeys,
|
||||
} from "./themeConfig"
|
||||
} from "./theme_config"
|
||||
|
||||
export function colorRamp(color: Color): Scale {
|
||||
const endColor = color.desaturate(1).brighten(5)
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import deepmerge from "deepmerge"
|
||||
import { FontWeight, fontWeights } from "../common"
|
||||
import { ColorScheme } from "./colorScheme"
|
||||
import { ColorScheme } from "./color_scheme"
|
||||
import chroma from "chroma-js"
|
||||
|
||||
export interface SyntaxHighlightStyle {
|
||||
|
|
|
@ -9,12 +9,12 @@ import {
|
|||
Shadow,
|
||||
SyntaxHighlightStyle,
|
||||
ThemeSyntax,
|
||||
} from "../colorScheme"
|
||||
} from "../color_scheme"
|
||||
import { LayerToken, layerToken } from "./layer"
|
||||
import { PlayersToken, playersToken } from "./players"
|
||||
import { colorToken } from "./token"
|
||||
import { Syntax } from "../syntax"
|
||||
import editor from "../../styleTree/editor"
|
||||
import editor from "../../style_tree/editor"
|
||||
|
||||
interface ColorSchemeTokens {
|
||||
name: SingleOtherToken
|
||||
|
@ -85,7 +85,7 @@ export function colorSchemeTokens(colorScheme: ColorScheme): ColorSchemeTokens {
|
|||
},
|
||||
appearance: {
|
||||
name: "themeAppearance",
|
||||
value: colorScheme.isLight ? "light" : "dark",
|
||||
value: colorScheme.is_light ? "light" : "dark",
|
||||
type: TokenTypes.OTHER,
|
||||
},
|
||||
lowest: layerToken(colorScheme.lowest, "lowest"),
|
|
@ -1,5 +1,5 @@
|
|||
import { SingleColorToken } from "@tokens-studio/types"
|
||||
import { Layer, Style, StyleSet } from "../colorScheme"
|
||||
import { Layer, Style, StyleSet } from "../color_scheme"
|
||||
import { colorToken } from "./token"
|
||||
|
||||
interface StyleToken {
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import { SingleColorToken } from "@tokens-studio/types"
|
||||
import { ColorScheme, Players } from "../../common"
|
||||
import { colorToken } from "./token"
|
||||
import { ColorScheme, Players } from "../color_scheme"
|
||||
|
||||
export type PlayerToken = Record<"selection" | "cursor", SingleColorToken>
|
||||
|
||||
|
|
Loading…
Reference in a new issue