Violet Hour
Publisher: Jeffrey6399Themes in package: 1
A deep violet color theme tuned for JS/TS/JSX/CSS. Cool sky colors for structure, warm low-sun light for literals.
A deep violet color theme tuned for JS/TS/JSX/CSS. Cool sky colors for structure, warm low-sun light for literals.
Full workbench mockup using this variant's colors and tokenColors.
Loading...
Workbench UI color keys from the theme JSON colors map.
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| comment, punctuation.definition.comment, string.comment, comment.block.documentation, comment.line | #806795 | italic |
| keyword, keyword.control, keyword.other, keyword.control.flow, keyword.control.import, keyword.control.export, keyword.control.from, keyword.control.as, keyword.control.default, keyword.control.trycatch, keyword.control.conditional, keyword.control.loop, storage, storage.type, storage.modifier, meta.import keyword, meta.export keyword, variable.language.this, variable.language.super, keyword.other.new, keyword.operator.new, keyword.operator.expression, keyword.operator.of, keyword.operator.in, keyword.operator.instanceof, keyword.operator.typeof, keyword.operator.delete, keyword.operator.void | #E582B1 | italic |
| keyword.operator, keyword.operator.assignment, keyword.operator.arithmetic, keyword.operator.comparison, keyword.operator.logical, keyword.operator.bitwise, keyword.operator.ternary, keyword.operator.arrow, keyword.operator.spread, keyword.operator.optional, keyword.operator.definiteassignment, storage.type.function.arrow | #D696BF | — |
| string, string.quoted, string.quoted.single, string.quoted.double, string.template, string.other.link, punctuation.definition.string, meta.attribute-selector string | #DEB052 | — |
| punctuation.definition.template-expression, punctuation.section.embedded, meta.template.expression punctuation.definition, meta.embedded.line | #5ECA9B | — |
| constant.numeric, constant.language, constant.language.boolean, constant.language.null, constant.language.undefined, constant.language.nan, constant.language.infinity, constant.character, constant.character.escape, constant.other, support.constant, variable.other.constant, entity.name.constant | #E99177 | — |
| entity.name.function, support.function, meta.function-call entity.name.function, meta.function-call.generic, variable.function, entity.name.function.member, support.function.dom, meta.definition.method entity.name.function | #B694EF | — |
| entity.name.type, entity.name.class, entity.name.interface, entity.name.type.class, entity.name.type.interface, entity.name.type.enum, entity.name.type.alias, entity.name.type.module, entity.name.namespace, support.type, support.class, support.type.primitive, entity.other.inherited-class, meta.type.annotation entity.name.type, entity.name.type.parameter, storage.type.class | #5DD1C2 | — |
| variable, variable.other, variable.other.readwrite, meta.definition.variable variable.other, variable.other.object, support.variable | #DCCFE7 | — |
| variable.parameter, meta.parameters variable.other, meta.function.parameters variable, variable.parameter.function | #DBC8BC | italic |
| variable.other.property, variable.other.object.property, meta.object-literal.key, support.type.property-name, variable.object.property, meta.property-name, entity.name.variable.field, variable.other.enummember | #7DB5E1 | — |
| punctuation, punctuation.separator, punctuation.terminator, punctuation.accessor, punctuation.definition.block, punctuation.definition.parameters, punctuation.definition.array, punctuation.definition.binding-pattern, meta.brace, punctuation.section.block, punctuation.definition.entity.css | #A295BE | — |
| meta.decorator, entity.name.function.decorator, punctuation.decorator, meta.decorator variable.other, meta.decorator punctuation.decorator | #E582B1 | italic |
| string.regexp, constant.other.character-class.regexp, keyword.operator.quantifier.regexp, punctuation.definition.group.regexp, constant.character.escape.backslash.regexp | #6BC683 | — |
| entity.name.tag, entity.name.tag.html, entity.name.tag.js.jsx, support.class.component.jsx.intrinsic, punctuation.definition.tag, punctuation.definition.tag.begin, punctuation.definition.tag.end, meta.tag punctuation.definition.tag | #5DD1C2 | — |
| support.class.component, entity.name.tag.jsx-component, meta.tag.attributes support.class.component, entity.name.tag.namespace | #DCC16A | — |
| entity.other.attribute-name, entity.other.attribute-name.html, entity.other.attribute-name.jsx, meta.tag entity.other.attribute-name, meta.directive.vue entity.other.attribute-name | #8FD5A1 | — |
| entity.name.tag.css, entity.other.attribute-name.class.css, entity.other.attribute-name.id.css, entity.other.attribute-name.pseudo-class.css, entity.other.attribute-name.pseudo-element.css, meta.selector, entity.other.attribute-name.parent-selector.css | #DCC16A | — |
| support.type.property-name.css, meta.property-name.css, support.type.vendored.property-name.css, support.type.property-name.scss | #7DB5E1 | — |
| support.constant.property-value.css, meta.property-value.css, support.constant.font-name.css, support.constant.color.w3c-standard-color-name.css | #5ECA9B | — |
| constant.numeric.css, keyword.other.unit.css, constant.other.color.rgb-value.css, constant.other.unicode-range.css | #E99177 | — |
| markup.heading, entity.name.section.markdown, punctuation.definition.heading.markdown | #B694EF | bold |
| markup.bold | #5DD1C2 | bold |
| markup.italic | #E582B1 | italic |
| markup.inline.raw, markup.fenced_code | #DEB052 | — |
| markup.underline.link, string.other.link.title.markdown | #B694EF | — |
| punctuation.definition.list.begin.markdown, beginning.punctuation.definition.list.markdown | #A295BE | — |
| markup.inserted | #60CD76 | — |
| markup.deleted | #E25A68 | — |
| markup.changed | #4A9BDA | — |
| support.type.property-name.json, string.json support.type.property-name | #7DB5E1 | — |
| entity.name.tag.yaml, string.unquoted.plain.out.yaml | #7DB5E1 | — |
| invalid, invalid.illegal | #E77883 | — |
| invalid.deprecated | #A295BE | italic underline |
export interface User {
id: string;
name: string;
role: "admin" | "member";
tags: string[];
}
/**
* Fetch user data by ID
* @param id
* @returns User object or null if ID is invalid
*/
export async function fetchUser(id: string): Promise<User | null> {
if (!id) {
return null;
}
const response = await fetch(`/api/users/${id}`, {
method: "GET",
headers: { Accept: "application/json" },
});
if (!response.ok) {
throw new Error(`HTTP ${response.status}`);
}
return (await response.json()) as User;
}
function greet(user: User): string {
// Simple greeting function that uses the user's name
return `Hello, ${user.name}!`;
}