mirror of
https://github.com/zed-industries/zed.git
synced 2024-12-25 01:34:02 +00:00
Remove old theme template
This commit is contained in:
parent
fbfe8a2311
commit
5d87a04dc3
1 changed files with 0 additions and 69 deletions
|
@ -1,69 +0,0 @@
|
|||
/**
|
||||
* To create a new theme duplicate this file and move into templates
|
||||
**/
|
||||
|
||||
import chroma from "chroma-js";
|
||||
import { colorRamp, createColorScheme } from "./common/ramps";
|
||||
|
||||
/**
|
||||
* Theme Name
|
||||
*
|
||||
* What the theme will be called in the UI
|
||||
* Also used to generate filenames, etc
|
||||
**/
|
||||
|
||||
const name = "themeName";
|
||||
|
||||
/**
|
||||
* Theme Colors
|
||||
*
|
||||
* Zed themes are based on [base16](https://github.com/chriskempson/base16)
|
||||
* The first 8 colors ("Neutrals") are used to construct the UI background, panels, etc.
|
||||
* The latter 8 colors ("Accents") are used for syntax themes, semantic colors, and UI states.
|
||||
**/
|
||||
|
||||
/**
|
||||
* Color Ramps
|
||||
*
|
||||
* We use (chroma-js)[https://gka.github.io/chroma.js/] to minipulate color in themes and to build color ramps.
|
||||
*
|
||||
* You can use chroma-js operations on the ramps here.
|
||||
* For example, you could use chroma.scale(...).correctLightness if your color ramps seem washed out near the ends.
|
||||
**/
|
||||
|
||||
// TODO: Express accents without refering to them directly by color name.
|
||||
// See common/base16.ts for where color tokens are used.
|
||||
|
||||
const ramps = {
|
||||
neutral: chroma.scale([
|
||||
"#19171c", // Dark: darkest backgrounds, inputs | Light: Lightest text, active states
|
||||
"#26232a",
|
||||
"#585260",
|
||||
"#655f6d",
|
||||
"#7e7887",
|
||||
"#8b8792",
|
||||
"#e2dfe7",
|
||||
"#efecf4", // Light: darkest backgrounds, inputs | Dark: Lightest text, active states
|
||||
]),
|
||||
red: colorRamp(chroma("#be4678")), // Errors
|
||||
orange: colorRamp(chroma("#aa573c")),
|
||||
yellow: colorRamp(chroma("#a06e3b")), // Warnings
|
||||
green: colorRamp(chroma("#2a9292")), // Positive
|
||||
cyan: colorRamp(chroma("#398bc6")), // Player 1 (Host)
|
||||
blue: colorRamp(chroma("#576ddb")), // Info
|
||||
violet: colorRamp(chroma("#955ae7")),
|
||||
magenta: colorRamp(chroma("#bf40bf")),
|
||||
};
|
||||
|
||||
/**
|
||||
* Color Scheme Variants
|
||||
*
|
||||
* Currently we only support (and require) dark and light themes
|
||||
* Eventually you will be able to have only a light or dark theme,
|
||||
* and define other variants here.
|
||||
*
|
||||
* createColorScheme([name], [isLight], [arrayOfRamps])
|
||||
**/
|
||||
|
||||
export const dark = createColorScheme(`${name}-dark`, false, ramps);
|
||||
export const light = createColorScheme(`${name}-light`, true, ramps);
|
Loading…
Reference in a new issue