Format styles
directory with prettier.
This commit is contained in:
parent
45ea412d2c
commit
668af83cd6
30 changed files with 527 additions and 496 deletions
|
@ -1,18 +1,18 @@
|
|||
import * as fs from "fs";
|
||||
import * as path from "path";
|
||||
import { tmpdir } from 'os';
|
||||
import { tmpdir } from "os";
|
||||
import app from "./styleTree/app";
|
||||
import themes from "./themes";
|
||||
import snakeCase from "./utils/snakeCase";
|
||||
|
||||
const themeDirectory = `${__dirname}/../../assets/themes/`;
|
||||
const tempDirectory = fs.mkdtempSync(path.join(tmpdir(), 'build-themes'));
|
||||
const tempDirectory = fs.mkdtempSync(path.join(tmpdir(), "build-themes"));
|
||||
|
||||
// Clear existing themes
|
||||
for (const file of fs.readdirSync(themeDirectory)) {
|
||||
if (file.endsWith('.json')) {
|
||||
const name = file.replace(/\.json$/, '');
|
||||
if (!themes.find(theme => theme.name === name)) {
|
||||
if (file.endsWith(".json")) {
|
||||
const name = file.replace(/\.json$/, "");
|
||||
if (!themes.find((theme) => theme.name === name)) {
|
||||
fs.unlinkSync(path.join(themeDirectory, file));
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
export const fontFamilies = {
|
||||
sans: "Zed Sans",
|
||||
mono: "Zed Mono",
|
||||
}
|
||||
};
|
||||
|
||||
export const fontSizes = {
|
||||
"3xs": 8,
|
||||
|
@ -13,7 +13,8 @@ export const fontSizes = {
|
|||
xl: 20,
|
||||
};
|
||||
|
||||
export type FontWeight = "thin"
|
||||
export type FontWeight =
|
||||
| "thin"
|
||||
| "extra_light"
|
||||
| "light"
|
||||
| "normal"
|
||||
|
@ -31,7 +32,7 @@ export const fontWeights: { [key: string]: FontWeight } = {
|
|||
semibold: "semibold",
|
||||
bold: "bold",
|
||||
extra_bold: "extra_bold",
|
||||
black: "black"
|
||||
black: "black",
|
||||
};
|
||||
|
||||
export const sizes = {
|
||||
|
|
|
@ -17,7 +17,7 @@ import tooltip from "./tooltip";
|
|||
import terminal from "./terminal";
|
||||
|
||||
export const panel = {
|
||||
padding: { top: 12, bottom: 12 }
|
||||
padding: { top: 12, bottom: 12 },
|
||||
};
|
||||
|
||||
export default function app(theme: Theme): Object {
|
||||
|
|
|
@ -6,7 +6,7 @@ import {
|
|||
player,
|
||||
text,
|
||||
TextColor,
|
||||
popoverShadow
|
||||
popoverShadow,
|
||||
} from "./components";
|
||||
|
||||
export default function chatPanel(theme: Theme) {
|
||||
|
|
|
@ -16,11 +16,11 @@ export default function commandPalette(theme: Theme) {
|
|||
right: 8,
|
||||
},
|
||||
margin: {
|
||||
left: 2
|
||||
left: 2,
|
||||
},
|
||||
active: {
|
||||
text: text(theme, "mono", "active", { size: "xs" }),
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
@ -60,10 +60,7 @@ export interface Player {
|
|||
selection: string;
|
||||
};
|
||||
}
|
||||
export function player(
|
||||
theme: Theme,
|
||||
playerNumber: PlayerIndex,
|
||||
): Player {
|
||||
export function player(theme: Theme, playerNumber: PlayerIndex): Player {
|
||||
return {
|
||||
selection: {
|
||||
cursor: theme.player[playerNumber].cursorColor,
|
||||
|
@ -77,7 +74,7 @@ export type BackgroundState = keyof BackgroundColorSet;
|
|||
export function backgroundColor(
|
||||
theme: Theme,
|
||||
name: BackgroundColor,
|
||||
state?: BackgroundState,
|
||||
state?: BackgroundState
|
||||
): string {
|
||||
return theme.backgroundColor[name][state || "base"];
|
||||
}
|
||||
|
|
|
@ -26,13 +26,13 @@ export default function contactFinder(theme: Theme) {
|
|||
contactButton: {
|
||||
...contactButton,
|
||||
hover: {
|
||||
background: backgroundColor(theme, 100, "hovered")
|
||||
}
|
||||
background: backgroundColor(theme, 100, "hovered"),
|
||||
},
|
||||
},
|
||||
disabledContactButton: {
|
||||
...contactButton,
|
||||
background: backgroundColor(theme, 100),
|
||||
color: iconColor(theme, "muted"),
|
||||
},
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
@ -13,7 +13,7 @@ export default function contactNotification(theme: Theme): Object {
|
|||
},
|
||||
headerMessage: {
|
||||
...text(theme, "sans", "primary", { size: "xs" }),
|
||||
margin: { left: headerPadding, right: headerPadding }
|
||||
margin: { left: headerPadding, right: headerPadding },
|
||||
},
|
||||
headerHeight: 18,
|
||||
bodyMessage: {
|
||||
|
@ -27,8 +27,8 @@ export default function contactNotification(theme: Theme): Object {
|
|||
cornerRadius: 6,
|
||||
margin: { left: 6 },
|
||||
hover: {
|
||||
background: backgroundColor(theme, "on300", "hovered")
|
||||
}
|
||||
background: backgroundColor(theme, "on300", "hovered"),
|
||||
},
|
||||
},
|
||||
dismissButton: {
|
||||
color: iconColor(theme, "secondary"),
|
||||
|
@ -37,8 +37,8 @@ export default function contactNotification(theme: Theme): Object {
|
|||
buttonWidth: 8,
|
||||
buttonHeight: 8,
|
||||
hover: {
|
||||
color: iconColor(theme, "primary")
|
||||
}
|
||||
}
|
||||
}
|
||||
color: iconColor(theme, "primary"),
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
|
@ -1,6 +1,13 @@
|
|||
import Theme from "../themes/common/theme";
|
||||
import { panel } from "./app";
|
||||
import { backgroundColor, border, borderColor, iconColor, player, text } from "./components";
|
||||
import {
|
||||
backgroundColor,
|
||||
border,
|
||||
borderColor,
|
||||
iconColor,
|
||||
player,
|
||||
text,
|
||||
} from "./components";
|
||||
|
||||
export default function contactsPanel(theme: Theme) {
|
||||
const nameMargin = 8;
|
||||
|
@ -24,7 +31,7 @@ export default function contactsPanel(theme: Theme) {
|
|||
margin: {
|
||||
left: nameMargin,
|
||||
right: nameMargin,
|
||||
}
|
||||
},
|
||||
},
|
||||
padding: {
|
||||
left: sidePadding,
|
||||
|
@ -59,7 +66,7 @@ export default function contactsPanel(theme: Theme) {
|
|||
margin: {
|
||||
left: sidePadding,
|
||||
right: sidePadding,
|
||||
}
|
||||
},
|
||||
},
|
||||
userQueryEditorHeight: 32,
|
||||
addContactButton: {
|
||||
|
@ -86,16 +93,16 @@ export default function contactsPanel(theme: Theme) {
|
|||
active: {
|
||||
...text(theme, "mono", "primary", { size: "sm" }),
|
||||
background: backgroundColor(theme, 100, "active"),
|
||||
}
|
||||
},
|
||||
},
|
||||
contactRow: {
|
||||
padding: {
|
||||
left: sidePadding,
|
||||
right: sidePadding
|
||||
right: sidePadding,
|
||||
},
|
||||
active: {
|
||||
background: backgroundColor(theme, 100, "active"),
|
||||
}
|
||||
},
|
||||
},
|
||||
treeBranch: {
|
||||
color: borderColor(theme, "active"),
|
||||
|
@ -105,7 +112,7 @@ export default function contactsPanel(theme: Theme) {
|
|||
},
|
||||
active: {
|
||||
color: borderColor(theme, "active"),
|
||||
}
|
||||
},
|
||||
},
|
||||
contactAvatar: {
|
||||
cornerRadius: 10,
|
||||
|
@ -141,18 +148,18 @@ export default function contactsPanel(theme: Theme) {
|
|||
},
|
||||
active: {
|
||||
background: backgroundColor(theme, 300, "active"),
|
||||
}
|
||||
},
|
||||
},
|
||||
inviteRow: {
|
||||
padding: {
|
||||
left: sidePadding,
|
||||
right: sidePadding
|
||||
right: sidePadding,
|
||||
},
|
||||
border: { top: true, width: 1, color: borderColor(theme, "primary") },
|
||||
text: text(theme, "sans", "primary", { size: "sm" }),
|
||||
hover: {
|
||||
text: text(theme, "sans", "primary", { size: "sm", underline: true })
|
||||
}
|
||||
}
|
||||
}
|
||||
text: text(theme, "sans", "primary", { size: "sm", underline: true }),
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
@ -1,5 +1,11 @@
|
|||
import Theme from "../themes/common/theme";
|
||||
import { backgroundColor, border, borderColor, popoverShadow, text } from "./components";
|
||||
import {
|
||||
backgroundColor,
|
||||
border,
|
||||
borderColor,
|
||||
popoverShadow,
|
||||
text,
|
||||
} from "./components";
|
||||
|
||||
export default function contextMenu(theme: Theme) {
|
||||
return {
|
||||
|
@ -15,7 +21,7 @@ export default function contextMenu(theme: Theme) {
|
|||
label: text(theme, "sans", "secondary", { size: "sm" }),
|
||||
keystroke: {
|
||||
...text(theme, "sans", "muted", { size: "sm", weight: "bold" }),
|
||||
padding: { left: 3, right: 3 }
|
||||
padding: { left: 3, right: 3 },
|
||||
},
|
||||
hover: {
|
||||
background: backgroundColor(theme, 300, "hovered"),
|
||||
|
@ -28,11 +34,11 @@ export default function contextMenu(theme: Theme) {
|
|||
activeHover: {
|
||||
background: backgroundColor(theme, 300, "hovered"),
|
||||
text: text(theme, "sans", "active", { size: "sm" }),
|
||||
}
|
||||
},
|
||||
},
|
||||
separator: {
|
||||
background: borderColor(theme, "primary"),
|
||||
margin: { top: 2, bottom: 2 }
|
||||
margin: { top: 2, bottom: 2 },
|
||||
},
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@ import {
|
|||
player,
|
||||
popoverShadow,
|
||||
text,
|
||||
TextColor
|
||||
TextColor,
|
||||
} from "./components";
|
||||
import hoverPopover from "./hoverPopover";
|
||||
|
||||
|
@ -157,7 +157,7 @@ export default function editor(theme: Theme) {
|
|||
hover: {
|
||||
color: iconColor(theme, "active"),
|
||||
background: backgroundColor(theme, "on500", "base"),
|
||||
}
|
||||
},
|
||||
},
|
||||
syntax,
|
||||
};
|
||||
|
|
|
@ -10,7 +10,7 @@ export default function HoverPopover(theme: Theme) {
|
|||
left: 8,
|
||||
right: 8,
|
||||
top: 4,
|
||||
bottom: 4
|
||||
bottom: 4,
|
||||
},
|
||||
shadow: popoverShadow(theme),
|
||||
border: border(theme, "primary"),
|
||||
|
@ -21,7 +21,7 @@ export default function HoverPopover(theme: Theme) {
|
|||
block_style: {
|
||||
padding: { top: 4 },
|
||||
},
|
||||
prose: text(theme, "sans", "primary", { "size": "sm" }),
|
||||
prose: text(theme, "sans", "primary", { size: "sm" }),
|
||||
highlight: theme.editor.highlight.occurrence,
|
||||
}
|
||||
};
|
||||
}
|
|
@ -1,5 +1,11 @@
|
|||
import Theme from "../themes/common/theme";
|
||||
import { backgroundColor, border, player, modalShadow, text } from "./components";
|
||||
import {
|
||||
backgroundColor,
|
||||
border,
|
||||
player,
|
||||
modalShadow,
|
||||
text,
|
||||
} from "./components";
|
||||
|
||||
export default function picker(theme: Theme) {
|
||||
return {
|
||||
|
@ -22,7 +28,7 @@ export default function picker(theme: Theme) {
|
|||
},
|
||||
hover: {
|
||||
background: backgroundColor(theme, 300, "hovered"),
|
||||
}
|
||||
},
|
||||
},
|
||||
border: border(theme, "primary"),
|
||||
empty: {
|
||||
|
|
|
@ -1,8 +1,5 @@
|
|||
import Theme from "../themes/common/theme";
|
||||
import {
|
||||
backgroundColor,
|
||||
text,
|
||||
} from "./components";
|
||||
import { backgroundColor, text } from "./components";
|
||||
|
||||
export default function projectDiagnostics(theme: Theme) {
|
||||
return {
|
||||
|
@ -11,5 +8,5 @@ export default function projectDiagnostics(theme: Theme) {
|
|||
tabIconWidth: 13,
|
||||
tabSummarySpacing: 10,
|
||||
emptyMessage: text(theme, "sans", "secondary", { size: "md" }),
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
@ -24,7 +24,7 @@ export default function projectPanel(theme: Theme) {
|
|||
activeHover: {
|
||||
background: backgroundColor(theme, 300, "hovered"),
|
||||
text: text(theme, "mono", "active", { size: "sm" }),
|
||||
}
|
||||
},
|
||||
},
|
||||
cutEntryFade: 0.4,
|
||||
ignoredEntryFade: 0.6,
|
||||
|
|
|
@ -2,7 +2,6 @@ import Theme from "../themes/common/theme";
|
|||
import { backgroundColor, border, player, text } from "./components";
|
||||
|
||||
export default function search(theme: Theme) {
|
||||
|
||||
// Search input
|
||||
const editor = {
|
||||
background: backgroundColor(theme, 500),
|
||||
|
@ -51,7 +50,7 @@ export default function search(theme: Theme) {
|
|||
...text(theme, "mono", "active"),
|
||||
background: backgroundColor(theme, "on500", "hovered"),
|
||||
border: border(theme, "muted"),
|
||||
}
|
||||
},
|
||||
},
|
||||
editor,
|
||||
invalidEditor: {
|
||||
|
|
|
@ -5,13 +5,13 @@ import { workspaceBackground } from "./workspace";
|
|||
export default function statusBar(theme: Theme) {
|
||||
const statusContainer = {
|
||||
cornerRadius: 6,
|
||||
padding: { top: 3, bottom: 3, left: 6, right: 6 }
|
||||
}
|
||||
padding: { top: 3, bottom: 3, left: 6, right: 6 },
|
||||
};
|
||||
|
||||
const diagnosticStatusContainer = {
|
||||
cornerRadius: 6,
|
||||
padding: { top: 1, bottom: 1, left: 6, right: 6 }
|
||||
}
|
||||
padding: { top: 1, bottom: 1, left: 6, right: 6 },
|
||||
};
|
||||
|
||||
return {
|
||||
height: 30,
|
||||
|
@ -37,7 +37,7 @@ export default function statusBar(theme: Theme) {
|
|||
message: text(theme, "sans", "primary"),
|
||||
iconColor: iconColor(theme, "active"),
|
||||
background: backgroundColor(theme, 300, "hovered"),
|
||||
}
|
||||
},
|
||||
},
|
||||
diagnosticMessage: {
|
||||
...text(theme, "sans", "muted"),
|
||||
|
@ -86,7 +86,7 @@ export default function statusBar(theme: Theme) {
|
|||
...diagnosticStatusContainer,
|
||||
background: backgroundColor(theme, "error", "hovered"),
|
||||
border: border(theme, "error"),
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
sidebarButtons: {
|
||||
|
@ -103,7 +103,7 @@ export default function statusBar(theme: Theme) {
|
|||
active: {
|
||||
iconColor: iconColor(theme, "active"),
|
||||
background: backgroundColor(theme, 300, "active"),
|
||||
}
|
||||
},
|
||||
},
|
||||
badge: {
|
||||
cornerRadius: 3,
|
||||
|
@ -111,7 +111,7 @@ export default function statusBar(theme: Theme) {
|
|||
margin: { bottom: -1, right: -1 },
|
||||
border: { width: 1, color: workspaceBackground(theme) },
|
||||
background: iconColor(theme, "feature"),
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
@ -44,6 +44,6 @@ export default function terminal(theme: Theme) {
|
|||
margin: 25,
|
||||
border: border(theme, "primary"),
|
||||
shadow: modalShadow(theme),
|
||||
}
|
||||
},
|
||||
};
|
||||
}
|
|
@ -15,8 +15,8 @@ export default function tooltip(theme: Theme) {
|
|||
cornerRadius: 4,
|
||||
margin: { left: 6 },
|
||||
padding: { left: 4, right: 4 },
|
||||
...text(theme, "mono", "muted", { size: "xs", weight: "bold" })
|
||||
...text(theme, "mono", "muted", { size: "xs", weight: "bold" }),
|
||||
},
|
||||
maxTextWidth: 200,
|
||||
}
|
||||
};
|
||||
}
|
|
@ -7,14 +7,14 @@ export default function updateNotification(theme: Theme): Object {
|
|||
return {
|
||||
message: {
|
||||
...text(theme, "sans", "primary", { size: "xs" }),
|
||||
margin: { left: headerPadding, right: headerPadding }
|
||||
margin: { left: headerPadding, right: headerPadding },
|
||||
},
|
||||
actionMessage: {
|
||||
...text(theme, "sans", "secondary", { size: "xs" }),
|
||||
margin: { left: headerPadding, top: 6, bottom: 6 },
|
||||
hover: {
|
||||
color: theme.textColor["active"]
|
||||
}
|
||||
color: theme.textColor["active"],
|
||||
},
|
||||
},
|
||||
dismissButton: {
|
||||
color: iconColor(theme, "secondary"),
|
||||
|
@ -23,8 +23,8 @@ export default function updateNotification(theme: Theme): Object {
|
|||
buttonWidth: 8,
|
||||
buttonHeight: 8,
|
||||
hover: {
|
||||
color: iconColor(theme, "primary")
|
||||
}
|
||||
}
|
||||
}
|
||||
color: iconColor(theme, "primary"),
|
||||
},
|
||||
},
|
||||
};
|
||||
}
|
|
@ -1,10 +1,16 @@
|
|||
import Theme from "../themes/common/theme";
|
||||
import { withOpacity } from "../utils/color";
|
||||
import { backgroundColor, border, iconColor, modalShadow, text } from "./components";
|
||||
import {
|
||||
backgroundColor,
|
||||
border,
|
||||
iconColor,
|
||||
modalShadow,
|
||||
text,
|
||||
} from "./components";
|
||||
import statusBar from "./statusBar";
|
||||
|
||||
export function workspaceBackground(theme: Theme) {
|
||||
return backgroundColor(theme, 300)
|
||||
return backgroundColor(theme, 300);
|
||||
}
|
||||
|
||||
export default function workspace(theme: Theme) {
|
||||
|
@ -49,7 +55,7 @@ export default function workspace(theme: Theme) {
|
|||
},
|
||||
joiningProjectMessage: {
|
||||
padding: 12,
|
||||
...text(theme, "sans", "primary", { size: "lg" })
|
||||
...text(theme, "sans", "primary", { size: "lg" }),
|
||||
},
|
||||
leaderBorderOpacity: 0.7,
|
||||
leaderBorderWidth: 2.0,
|
||||
|
@ -58,21 +64,21 @@ export default function workspace(theme: Theme) {
|
|||
paneButton: {
|
||||
color: iconColor(theme, "secondary"),
|
||||
border: {
|
||||
...tab.border
|
||||
...tab.border,
|
||||
},
|
||||
iconWidth: 12,
|
||||
buttonWidth: tab.height,
|
||||
hover: {
|
||||
color: iconColor(theme, "active"),
|
||||
background: backgroundColor(theme, 300),
|
||||
}
|
||||
},
|
||||
},
|
||||
modal: {
|
||||
margin: {
|
||||
bottom: 52,
|
||||
top: 52,
|
||||
},
|
||||
cursor: "Arrow"
|
||||
cursor: "Arrow",
|
||||
},
|
||||
sidebarResizeHandle: {
|
||||
background: border(theme, "primary").color,
|
||||
|
@ -127,7 +133,7 @@ export default function workspace(theme: Theme) {
|
|||
...text(theme, "sans", "active", { size: "xs" }),
|
||||
background: backgroundColor(theme, "on300", "hovered"),
|
||||
border: border(theme, "primary"),
|
||||
}
|
||||
},
|
||||
},
|
||||
offlineIcon: {
|
||||
color: iconColor(theme, "secondary"),
|
||||
|
@ -192,6 +198,6 @@ export default function workspace(theme: Theme) {
|
|||
notifications: {
|
||||
width: 400,
|
||||
margin: { right: 10, bottom: 10 },
|
||||
}
|
||||
},
|
||||
};
|
||||
}
|
||||
|
|
|
@ -1,5 +1,5 @@
|
|||
import chroma, { Color, Scale } from "chroma-js";
|
||||
import { fontWeights, } from "../../common";
|
||||
import { fontWeights } from "../../common";
|
||||
import { withOpacity } from "../../utils/color";
|
||||
import Theme, { buildPlayer, Syntax } from "./theme";
|
||||
|
||||
|
@ -13,7 +13,7 @@ export function colorRamp(color: Color): Scale {
|
|||
export function createTheme(
|
||||
name: string,
|
||||
isLight: boolean,
|
||||
color_ramps: { [rampName: string]: Scale },
|
||||
color_ramps: { [rampName: string]: Scale }
|
||||
): Theme {
|
||||
let ramps: typeof color_ramps = {};
|
||||
// Chromajs mutates the underlying ramp when you call domain. This causes problems because
|
||||
|
@ -24,14 +24,22 @@ export function createTheme(
|
|||
// function to any in order to get the colors back out from the original ramps.
|
||||
if (isLight) {
|
||||
for (var rampName in color_ramps) {
|
||||
ramps[rampName] = chroma.scale((color_ramps[rampName].colors as any)()).domain([1, 0]);
|
||||
ramps[rampName] = chroma
|
||||
.scale((color_ramps[rampName].colors as any)())
|
||||
.domain([1, 0]);
|
||||
}
|
||||
ramps.neutral = chroma.scale((color_ramps.neutral.colors as any)()).domain([7, 0]);
|
||||
ramps.neutral = chroma
|
||||
.scale((color_ramps.neutral.colors as any)())
|
||||
.domain([7, 0]);
|
||||
} else {
|
||||
for (var rampName in color_ramps) {
|
||||
ramps[rampName] = chroma.scale((color_ramps[rampName].colors as any)()).domain([0, 1]);
|
||||
ramps[rampName] = chroma
|
||||
.scale((color_ramps[rampName].colors as any)())
|
||||
.domain([0, 1]);
|
||||
}
|
||||
ramps.neutral = chroma.scale((color_ramps.neutral.colors as any)()).domain([0, 7]);
|
||||
ramps.neutral = chroma
|
||||
.scale((color_ramps.neutral.colors as any)())
|
||||
.domain([0, 7]);
|
||||
}
|
||||
|
||||
let blend = isLight ? 0.12 : 0.24;
|
||||
|
@ -242,8 +250,12 @@ export function createTheme(
|
|||
};
|
||||
|
||||
const shadow = withOpacity(
|
||||
ramps.neutral(isLight ? 7 : 0).darken().hex(),
|
||||
blend);
|
||||
ramps
|
||||
.neutral(isLight ? 7 : 0)
|
||||
.darken()
|
||||
.hex(),
|
||||
blend
|
||||
);
|
||||
|
||||
return {
|
||||
name,
|
||||
|
|
|
@ -61,7 +61,7 @@ export interface Syntax {
|
|||
|
||||
export default interface Theme {
|
||||
name: string;
|
||||
isLight: boolean,
|
||||
isLight: boolean;
|
||||
backgroundColor: {
|
||||
// Basically just Title Bar
|
||||
// Lowest background level
|
||||
|
@ -155,7 +155,7 @@ export default interface Theme {
|
|||
6: Player;
|
||||
7: Player;
|
||||
8: Player;
|
||||
},
|
||||
};
|
||||
shadow: string;
|
||||
ramps: { [rampName: string]: Scale };
|
||||
}
|
||||
|
|
|
@ -2,25 +2,26 @@ import chroma from "chroma-js";
|
|||
import { colorRamp, createTheme } from "./common/base16";
|
||||
|
||||
const name = "one";
|
||||
const author = "Chris Kempson (http://chriskempson.com)"
|
||||
const url = "https://github.com/chriskempson/base16-vim/blob/master/colors/base16-onedark.vim"
|
||||
const author = "Chris Kempson (http://chriskempson.com)";
|
||||
const url =
|
||||
"https://github.com/chriskempson/base16-vim/blob/master/colors/base16-onedark.vim";
|
||||
|
||||
const base00 = "#282c34"
|
||||
const base01 = "#353b45"
|
||||
const base02 = "#3e4451"
|
||||
const base03 = "#545862"
|
||||
const base04 = "#565c64"
|
||||
const base05 = "#abb2bf"
|
||||
const base06 = "#b6bdca"
|
||||
const base07 = "#c8ccd4"
|
||||
const base08 = "#e06c75"
|
||||
const base09 = "#d19a66"
|
||||
const base0A = "#e5c07b"
|
||||
const base0B = "#98c379"
|
||||
const base0C = "#56b6c2"
|
||||
const base0D = "#61afef"
|
||||
const base0E = "#c678dd"
|
||||
const base0F = "#be5046"
|
||||
const base00 = "#282c34";
|
||||
const base01 = "#353b45";
|
||||
const base02 = "#3e4451";
|
||||
const base03 = "#545862";
|
||||
const base04 = "#565c64";
|
||||
const base05 = "#abb2bf";
|
||||
const base06 = "#b6bdca";
|
||||
const base07 = "#c8ccd4";
|
||||
const base08 = "#e06c75";
|
||||
const base09 = "#d19a66";
|
||||
const base0A = "#e5c07b";
|
||||
const base0B = "#98c379";
|
||||
const base0C = "#56b6c2";
|
||||
const base0D = "#61afef";
|
||||
const base0E = "#c678dd";
|
||||
const base0F = "#be5046";
|
||||
|
||||
const ramps = {
|
||||
neutral: chroma.scale([
|
||||
|
@ -31,7 +32,7 @@ const ramps = {
|
|||
base04,
|
||||
base05,
|
||||
base06,
|
||||
base07
|
||||
base07,
|
||||
]),
|
||||
red: colorRamp(chroma(base08)),
|
||||
orange: colorRamp(chroma(base09)),
|
||||
|
|
|
@ -2,25 +2,26 @@ import chroma from "chroma-js";
|
|||
import { colorRamp, createTheme } from "./common/base16";
|
||||
|
||||
const name = "one";
|
||||
const author = "Daniel Pfeifer (http://github.com/purpleKarrot)"
|
||||
const url = "https://github.com/purpleKarrot/base16-one-light-scheme/blob/master/one-light.yaml"
|
||||
const author = "Daniel Pfeifer (http://github.com/purpleKarrot)";
|
||||
const url =
|
||||
"https://github.com/purpleKarrot/base16-one-light-scheme/blob/master/one-light.yaml";
|
||||
|
||||
const base00 = "#090a0b"
|
||||
const base01 = "#202227"
|
||||
const base02 = "#383a42"
|
||||
const base03 = "#a0a1a7"
|
||||
const base04 = "#696c77"
|
||||
const base05 = "#a0a1a7"
|
||||
const base06 = "#e5e5e6"
|
||||
const base07 = "#f0f0f1"
|
||||
const base08 = "#fafafa"
|
||||
const base09 = "#d75f00"
|
||||
const base0A = "#c18401"
|
||||
const base0B = "#50a14f"
|
||||
const base0C = "#0184bc"
|
||||
const base0D = "#4078f2"
|
||||
const base0E = "#a626a4"
|
||||
const base0F = "#986801"
|
||||
const base00 = "#090a0b";
|
||||
const base01 = "#202227";
|
||||
const base02 = "#383a42";
|
||||
const base03 = "#a0a1a7";
|
||||
const base04 = "#696c77";
|
||||
const base05 = "#a0a1a7";
|
||||
const base06 = "#e5e5e6";
|
||||
const base07 = "#f0f0f1";
|
||||
const base08 = "#fafafa";
|
||||
const base09 = "#d75f00";
|
||||
const base0A = "#c18401";
|
||||
const base0B = "#50a14f";
|
||||
const base0C = "#0184bc";
|
||||
const base0D = "#4078f2";
|
||||
const base0E = "#a626a4";
|
||||
const base0F = "#986801";
|
||||
|
||||
const ramps = {
|
||||
neutral: chroma.scale([
|
||||
|
@ -31,7 +32,7 @@ const ramps = {
|
|||
base04,
|
||||
base05,
|
||||
base06,
|
||||
base07
|
||||
base07,
|
||||
]),
|
||||
red: colorRamp(chroma(base08)),
|
||||
orange: colorRamp(chroma(base09)),
|
||||
|
|
|
@ -3,21 +3,21 @@ import { snakeCase } from "case-anything";
|
|||
// https://stackoverflow.com/questions/60269936/typescript-convert-generic-object-from-snake-to-camel-case
|
||||
|
||||
// Typescript magic to convert any string from camelCase to snake_case at compile time
|
||||
type SnakeCase<S> =
|
||||
S extends string ?
|
||||
S extends `${infer T}${infer U}` ?
|
||||
`${T extends Capitalize<T> ? "_" : ""}${Lowercase<T>}${SnakeCase<U>}` :
|
||||
S :
|
||||
S;
|
||||
type SnakeCase<S> = S extends string
|
||||
? S extends `${infer T}${infer U}`
|
||||
? `${T extends Capitalize<T> ? "_" : ""}${Lowercase<T>}${SnakeCase<U>}`
|
||||
: S
|
||||
: S;
|
||||
|
||||
type SnakeCased<Type> = {
|
||||
[Property in keyof Type as SnakeCase<Property>]: SnakeCased<Type[Property]>
|
||||
}
|
||||
[Property in keyof Type as SnakeCase<Property>]: SnakeCased<Type[Property]>;
|
||||
};
|
||||
|
||||
export default function snakeCaseTree<T>(object: T): SnakeCased<T> {
|
||||
const snakeObject: any = {};
|
||||
for (const key in object) {
|
||||
snakeObject[snakeCase(key, { keepSpecialCharacters: true })] = snakeCaseValue(object[key]);
|
||||
snakeObject[snakeCase(key, { keepSpecialCharacters: true })] =
|
||||
snakeCaseValue(object[key]);
|
||||
}
|
||||
return snakeObject;
|
||||
}
|
||||
|
|
|
@ -8,7 +8,5 @@
|
|||
"preserveConstEnums": true,
|
||||
"sourceMap": true
|
||||
},
|
||||
"exclude": [
|
||||
"node_modules"
|
||||
]
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue