137 lines
2.5 KiB
TypeScript
137 lines
2.5 KiB
TypeScript
import { msg } from "@lingui/core/macro";
|
|
import type { ThemeManifest } from "../types";
|
|
|
|
/* Viewport gizmo ramps, declared in JS (not theme.css) so Mantine regenerates
|
|
every derived variant var (-filled, -light rgba, autoContrast picks) from
|
|
the retuned shades. Shade 6 is the fill in BOTH schemes (primaryShade
|
|
below) — each shade-6 hand-checked against its autoContrast on-color
|
|
(white or the custom ink black) for 4.5:1+. */
|
|
const gizmoColors = {
|
|
// Z-axis blue
|
|
blue: [
|
|
"#eaf2ff",
|
|
"#d2e4fe",
|
|
"#a8cbfd",
|
|
"#7aaffa",
|
|
"#4f92f5",
|
|
"#2f7cf0",
|
|
"#1c64d6",
|
|
"#154fb0",
|
|
"#103e8a",
|
|
"#0a2c62",
|
|
],
|
|
// X-axis red
|
|
red: [
|
|
"#ffecec",
|
|
"#ffd2d2",
|
|
"#ffa8a8",
|
|
"#fd7c7c",
|
|
"#f85454",
|
|
"#ef3535",
|
|
"#d0231f",
|
|
"#a91b19",
|
|
"#821513",
|
|
"#5c0f0e",
|
|
],
|
|
// Y-axis green
|
|
green: [
|
|
"#e7fbf0",
|
|
"#c9f5da",
|
|
"#98e8b8",
|
|
"#64d692",
|
|
"#38c072",
|
|
"#1a9e5a",
|
|
"#0e7d3f",
|
|
"#0a6432",
|
|
"#074b26",
|
|
"#05331a",
|
|
],
|
|
// measurement/annotation yellow
|
|
yellow: [
|
|
"#fff8dc",
|
|
"#ffedad",
|
|
"#ffdf76",
|
|
"#ffce46",
|
|
"#f9bc24",
|
|
"#daa00e",
|
|
"#bd870a",
|
|
"#946909",
|
|
"#6c4c07",
|
|
"#463005",
|
|
],
|
|
// rotate-gizmo violet
|
|
grape: [
|
|
"#f3edff",
|
|
"#e2d3fd",
|
|
"#c8adfa",
|
|
"#ac85f5",
|
|
"#9163ec",
|
|
"#7a47df",
|
|
"#6535c0",
|
|
"#522a9c",
|
|
"#3f2077",
|
|
"#2c1653",
|
|
],
|
|
// classic viewport selection orange
|
|
orange: [
|
|
"#fff1e3",
|
|
"#ffddb8",
|
|
"#ffc182",
|
|
"#ffa350",
|
|
"#ee8a2c",
|
|
"#cc6a0f",
|
|
"#b04f06",
|
|
"#8f4005",
|
|
"#6e3104",
|
|
"#4d2203",
|
|
],
|
|
// magenta gizmo tag
|
|
pink: [
|
|
"#ffeef7",
|
|
"#ffd3ea",
|
|
"#ffa8d6",
|
|
"#fd7cc0",
|
|
"#f552a9",
|
|
"#db308f",
|
|
"#c22174",
|
|
"#9a1a5b",
|
|
"#731442",
|
|
"#4d0d2c",
|
|
],
|
|
// chartreuse highlight
|
|
lime: [
|
|
"#f6ffe0",
|
|
"#e8feb0",
|
|
"#d3f47a",
|
|
"#bce34a",
|
|
"#a3ce27",
|
|
"#8db518",
|
|
"#7a9c12",
|
|
"#607b0d",
|
|
"#475c09",
|
|
"#2f3d06",
|
|
],
|
|
} as const;
|
|
|
|
const manifest: ThemeManifest = {
|
|
id: "wireframe",
|
|
label: msg`Viewport`,
|
|
colorSchemes: "both",
|
|
fontLinks: [
|
|
"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&display=swap",
|
|
],
|
|
chromeColors: {
|
|
light: { base: "#f2f3f5", dimmed: "#dcdfe3" },
|
|
dark: { base: "#17191c", dimmed: "#0d0e10" },
|
|
},
|
|
mantine: {
|
|
autoContrast: true,
|
|
luminanceThreshold: 0.25,
|
|
black: "#15181c",
|
|
primaryShade: { light: 6, dark: 6 },
|
|
colors: gizmoColors,
|
|
},
|
|
};
|
|
|
|
export default manifest;
|