ZS Theme
Publisher: zhang-saiThemes in package: 2
A pretty vscode theme for JSer/TSer
A pretty vscode theme for JSer/TSer
Full workbench mockup using this variant's colors and tokenColors.
Loading...
TextMate scopes and font styles (syntax highlighting rules).
| scope | foreground | fontStyle |
|---|---|---|
| — | #4F5A5C | — |
| comment, entity.name.type.instance.jsdoc | #98A6B5 | |
| string.quoted.double.block.python | #798188 | — |
| entity.name.tag, support.class.component.tsx | #f47171 | bold |
| meta.jsx.js, text.html.basic, meta.jsx.children | #4F5A5C | |
| entity.other.attribute-name.jsx | #25A8CC | |
| entity.other.attribute-name.id.html | #FFB454 | — |
| entity.other.attribute-name.html, entity.other.attribute-name.ts, entity.other.attribute-name.tsx | #25A8CC | — |
| punctuation.definition.tag.end, punctuation.definition.tag.begin, punctuation.definition.tag | #525044 | — |
| declaration.tag, declaration.tag entity, meta.tag | #E6B440 | — |
| constant.character.entity.html | #F1E94B | — |
| meta.selector.css entity.name.tag | #f5f080 | — |
| meta.selector.css entity.other.attribute-name.id | #FFB454 | — |
| meta.selector.css entity.other.attribute-name.class | #8AAB50 | — |
| support.type.property-name.css | #72AACA | — |
| meta.property-group support.constant.property-value.css, meta.property-value support.constant.property-value.css | #9FA32A | — |
| meta.preprocessor.at-rule keyword.control.at-rule | #F6AA11 | — |
| meta.property-value support.constant.named-color.css, meta.property-value constant | #9FA32A | — |
| meta.constructor.argument.css | #EB939A | — |
| keyword.control.at-rule.import.css | #f7f09d | — |
| variable.other.less | #b6d877 | — |
| entity.other.less.mixin | #b6d877 | — |
| source.css.less keyword.unit.css | #EB939A | — |
| meta.at-rule.media.scss | #EBA12A | — |
| keyword.other | #ffa631 | underline bold |
| keyword, storage | #E6B440 | bold |
| constant | #87B335 | — |
| keyword.control, storage.type, keyword.operator.module.js, keyword.other.substitution, storage.modifier.tsx, switch-statement.expr.ts variable.other.readwrite.ts, switch-statement.expr.tsx variable.other.readwrite.tsx, switch-statement.expr.ts entity.name.function.ts, switch-statement.expr.tsx entity.name.function.tsx, keyword.control.loop.ts, keyword.control.loop.tsx, storage.modifier.async.ts, storage.modifier.async.tsx | #EBA12A | bold |
| entity.name.function, meta.definition.function, meta.method.declaration, meta.class meta.function-call variable.function, meta.class meta.method.declaration storage.type, support.function.builtin.js | #25A8CC | — |
| entity.name.class.js, entity.name.type.class, variable.other.class.js, entity.name.type.module.tsx, entity.other.inherited-class | #25A8CC | bold |
| meta.function-call variable.function, meta.function-call entity.name.function, meta.class meta.group.braces.curly meta.function-call variable.function | #EB8661 | — |
| support.function, variable.function.constructor.js, new.expr entity.name.type | #EB8661 | bold |
| variable.language.super | #EB8661 | bold italic |
| entity.name.type, support.type.builtin, support.type.primitive | #B1A5DEC7 | — |
| support.type.property-name.json | #37BD71 | normal |
| meta.definition.property | #25A8CC | — |
| entity.other | #72AACA | — |
| string, keyword.other.template, punctuation.definition.string, punctuation.definition.string.quoted | #37BD71 | — |
| support, support.constant | #72AACA | — |
| support.class, support.type.object.dom.js, support.type.object.console.js, support.variable | #72AACA | bold |
| meta.function, punctuation.definition.group, meta.brackets, meta.property.object.js, punctuation.definition.group.js, punctuation.definition.parameters, meta.group.braces.square.js, meta.brace.round, meta.group.braces.round, punctuation.definition.block.js, punctuation.definition.block.ts, punctuation.definition.block.tsx, meta.brace.square, punctuation.section.embedded, meta.brace.curly.begin.js, meta.brace.curly.end.js, meta.embedded.expression.jsx, punctuation.definition.brackets.js, punctuation.terminator.statement.js, punctuation.accessor.js, meta.block.ts punctuation.terminator.statement.ts, meta.block.tsx punctuation.terminator.statement.tsx, meta.var.expr.ts support.variable.property.ts, meta.var.expr.tsx support.variable.property.tsx | #4F5A5C | normal |
| meta.object-literal, variable.object.property, punctuation.separator.key-value.js, string.unquoted.label.js, meta.brackets.js, meta.property.object.js, source.tsx variable.other.object.property, source.tsx variable.other.property, source.ts variable.other.object.property, source.ts variable.other.property | #4F5A5C | — |
| variable.other, meta.class meta.group.braces.curly meta.group.braces.round variable.other.readwrite | #32453D | — |
| variable.parameter, meta.class meta.group.braces.round variable.other.readwrite | #32453D | underline italic |
| variable.language, support.variable.property.ts, support.variable.property.tsx | #32453D | bold italic |
| support.type | #32453D | bold |
| invalid | #F8F8F8 | — |
| text source | — | — |
| text.html.ruby source | — | — |
| string.quoted source | #B7D877 | — |
| string constant | #B7D877 | — |
| string.regexp | #37BD71 | — |
| keyword.control.anchor.regexp | — | |
| punctuation.definition.group.assertion.regexp | #37BD71 | — |
| punctuation.definition.group.regexp | #25A8CC | — |
| other.preprocessor.c | #8996A8 | — |
| other.preprocessor.c entity | #AFC4DB | — |
| entity.other.attribute-name.angular.html, source.angular.embedded.html | #FF3A83 | — |
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}!`;
}