diff --git a/package.json b/package.json
index 216d9b1474..143c0431a3 100644
--- a/package.json
+++ b/package.json
@@ -408,7 +408,6 @@
"typed-emitter": "^1.4.0",
"typedoc": "0.22.17",
"typedoc-plugin-markdown": "^3.11.12",
- "typeface-roboto": "^1.1.13",
"typescript": "^4.5.5",
"typescript-plugin-css-modules": "^3.4.0",
"webpack": "^5.72.0",
diff --git a/src/behaviours/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap b/src/behaviours/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap
index 729309888e..e0187e504b 100644
--- a/src/behaviours/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap
+++ b/src/behaviours/preferences/__snapshots__/navigation-to-terminal-preferences.test.ts.snap
@@ -771,6 +771,7 @@ exports[`preferences - navigation to terminal preferences given in preferences,
>
diff --git a/src/renderer/components/+helm-releases/release-details/release-details.scss b/src/renderer/components/+helm-releases/release-details/release-details.scss
index 0a4acfcca3..780d3df401 100644
--- a/src/renderer/components/+helm-releases/release-details/release-details.scss
+++ b/src/renderer/components/+helm-releases/release-details/release-details.scss
@@ -66,7 +66,7 @@
.notes {
white-space: pre-line;
- font-family: "RobotoMono", monospace;
+ font-family: var(--font-monospace);
font-size: small;
}
diff --git a/src/renderer/components/+preferences/terminal.tsx b/src/renderer/components/+preferences/terminal.tsx
index 995b82e32d..57c3ad6394 100644
--- a/src/renderer/components/+preferences/terminal.tsx
+++ b/src/renderer/components/+preferences/terminal.tsx
@@ -4,18 +4,20 @@
*/
import React from "react";
+import { action } from "mobx";
import { observer } from "mobx-react";
import type { UserStore } from "../../../common/user-store";
import { SubTitle } from "../layout/sub-title";
-import { Input, InputValidators } from "../input";
+import { Input } from "../input";
import { Switch } from "../switch";
-import { Select } from "../select";
+import { Select, type SelectOption } from "../select";
import type { ThemeStore } from "../../themes/store";
import { Preferences } from "./preferences";
import { withInjectables } from "@ogre-tools/injectable-react";
import userStoreInjectable from "../../../common/user-store/user-store.injectable";
import themeStoreInjectable from "../../themes/store.injectable";
import defaultShellInjectable from "./default-shell.injectable";
+import logger from "../../../common/logger";
interface Dependencies {
userStore: UserStore;
@@ -23,11 +25,12 @@ interface Dependencies {
defaultShell: string;
}
-const NonInjectedTerminal = observer(({
- userStore,
- themeStore,
- defaultShell,
-}: Dependencies) => {
+const NonInjectedTerminal = observer((
+ {
+ userStore,
+ themeStore,
+ defaultShell,
+ }: Dependencies) => {
const themeOptions = [
{
value: "", // TODO: replace with a sentinal value that isn't string (and serialize it differently)
@@ -39,6 +42,26 @@ const NonInjectedTerminal = observer(({
})),
];
+ // fonts must be declared in `fonts.scss` and at `template.html` (if early-preloading required)
+ const supportedCustomFonts: SelectOption[] = [
+ "RobotoMono", "Anonymous Pro", "IBM Plex Mono", "JetBrains Mono", "Red Hat Mono",
+ "Source Code Pro", "Space Mono", "Ubuntu Mono",
+ ].map(customFont => {
+ const { fontFamily, fontSize } = userStore.terminalConfig;
+
+ return {
+ label: {customFont},
+ value: customFont,
+ isSelected: fontFamily === customFont,
+ };
+ });
+
+ const onFontFamilyChange = action(({ value: fontFamily }: SelectOption) => {
+ logger.info(`setting terminal font to ${fontFamily}`);
+
+ userStore.terminalConfig.fontFamily = fontFamily; // save to external storage
+ });
+
return (
@@ -81,18 +104,19 @@ const NonInjectedTerminal = observer(({
theme="round-black"
type="number"
min={10}
- validators={InputValidators.isNumber}
- value={userStore.terminalConfig.fontSize.toString()}
+ max={50}
+ defaultValue={userStore.terminalConfig.fontSize.toString()}
onChange={(value) => userStore.terminalConfig.fontSize = Number(value)}
/>
diff --git a/src/renderer/components/app.scss b/src/renderer/components/app.scss
index 97a2057ed2..80317acb59 100755
--- a/src/renderer/components/app.scss
+++ b/src/renderer/components/app.scss
@@ -12,12 +12,14 @@
@import "./fonts";
:root {
+ --flex-gap: #{$padding};
--unit: 8px;
--padding: var(--unit);
--margin: var(--unit);
--border-radius: 3px;
--font-main: 'Roboto', 'Helvetica', 'Arial', sans-serif;
- --font-monospace: Lucida Console, Monaco, Consolas, monospace;
+ --font-monospace: Lucida Console, Monaco, Consolas, monospace; // some defaults
+ --font-terminal: var(--font-monospace); // overridden in terminal.ts, managed by common/user-store.ts
--font-size-small: calc(1.5 * var(--unit));
--font-size: calc(1.75 * var(--unit));
--font-size-big: calc(2 * var(--unit));
@@ -63,16 +65,13 @@
color: var(--textColorAccent);
}
-html {
- font-size: 62.5%; // 1 rem == 10px
- color: var(--textColorPrimary);
- background-color: var(--mainBackground);
- --flex-gap: #{$padding};
-}
-
html, body {
height: 100%;
overflow: hidden;
+ color: var(--textColorPrimary);
+ background-color: var(--mainBackground);
+ font-size: var(--font-size);
+ font-family: var(--font-main);
}
#terminal-init {
@@ -93,10 +92,6 @@ html, body {
}
}
-body {
- font: $font-size $font-main;
-}
-
fieldset {
border: 0;
padding: 0;
@@ -227,6 +222,22 @@ a {
}
}
+#fonts-preloading {
+ > span {
+ position: absolute;
+ visibility: hidden;
+ height: 0;
+
+ &:before {
+ width: 0;
+ display: block;
+ overflow: hidden;
+ content: "text-example"; // some text required to start applying/rendering font in document
+ font-family: inherit; // font-family must be specified via style="" (see: template.html)
+ }
+ }
+}
+
// app's common loading indicator, displaying on the route transitions
#loading {
position: absolute;
diff --git a/src/renderer/components/cluster-manager/cluster-frame-handler.ts b/src/renderer/components/cluster-manager/cluster-frame-handler.ts
index 9601317140..cf579cdc09 100644
--- a/src/renderer/components/cluster-manager/cluster-frame-handler.ts
+++ b/src/renderer/components/cluster-manager/cluster-frame-handler.ts
@@ -45,7 +45,6 @@ export class ClusterFrameHandler {
iframe.id = `cluster-frame-${cluster.id}`;
iframe.name = cluster.contextName;
- iframe.style.display = "none";
iframe.setAttribute("src", getClusterFrameUrl(clusterId));
iframe.addEventListener("load", action(() => {
logger.info(`[LENS-VIEW]: frame for clusterId=${clusterId} has loaded`);
@@ -95,7 +94,7 @@ export class ClusterFrameHandler {
ipcRenderer.send(clusterVisibilityHandler);
for (const { frame: view } of this.views.values()) {
- view.style.display = "none";
+ view.classList.add("hidden");
}
const cluster = clusterId
@@ -113,9 +112,9 @@ export class ClusterFrameHandler {
return undefined;
},
- (view) => {
+ (view: LensView) => {
logger.info(`[LENS-VIEW]: cluster id=${clusterId} should now be visible`);
- view.frame.style.display = "flex";
+ view.frame.classList.remove("hidden");
ipcRenderer.send(clusterVisibilityHandler, clusterId);
},
);
diff --git a/src/renderer/components/cluster-manager/cluster-manager.scss b/src/renderer/components/cluster-manager/cluster-manager.scss
index e6f5bb43e2..dec5a069a2 100644
--- a/src/renderer/components/cluster-manager/cluster-manager.scss
+++ b/src/renderer/components/cluster-manager/cluster-manager.scss
@@ -35,7 +35,20 @@
background-color: var(--mainBackground);
iframe {
+ position: absolute;
+ left: 0;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ display: flex;
flex: 1;
+
+ // when updating font settings in the "Preferences -> Terminal" cluster's iframe
+ // must be accessible in DOM (e.g. elem.getBoundingClientRect() must work)
+ &.hidden {
+ opacity: 0;
+ pointer-events: none;
+ }
}
}
}
diff --git a/src/renderer/components/dock/terminal/terminal.ts b/src/renderer/components/dock/terminal/terminal.ts
index f4819f332b..7ea9518437 100644
--- a/src/renderer/components/dock/terminal/terminal.ts
+++ b/src/renderer/components/dock/terminal/terminal.ts
@@ -64,16 +64,30 @@ export class Terminal {
}
}
- constructor(protected readonly dependencies: TerminalDependencies, { tabId, api }: TerminalArguments) {
+ get fontFamily() {
+ return this.dependencies.terminalConfig.get().fontFamily;
+ }
+
+ get fontSize() {
+ return this.dependencies.terminalConfig.get().fontSize;
+ }
+
+ get theme(): Record {
+ return this.dependencies.themeStore.xtermColors;
+ }
+
+ constructor(protected readonly dependencies: TerminalDependencies, {
+ tabId,
+ api,
+ }: TerminalArguments) {
this.tabId = tabId;
this.api = api;
- const { fontSize, fontFamily } = this.dependencies.terminalConfig.get();
this.xterm = new XTerm({
cursorBlink: true,
cursorStyle: "bar",
- fontSize,
- fontFamily,
+ fontSize: this.fontSize,
+ fontFamily: this.fontFamily,
});
// enable terminal addons
this.xterm.loadAddon(this.fitAddon);
@@ -95,17 +109,11 @@ export class Terminal {
window.addEventListener("resize", this.onResize);
this.disposer.push(
- reaction(() => this.dependencies.themeStore.xtermColors, colors => {
- this.xterm?.setOption("theme", colors);
- }, {
- fireImmediately: true,
- }),
- reaction(() => this.dependencies.terminalConfig.get().fontSize, this.setFontSize, {
- fireImmediately: true,
- }),
- reaction(() => this.dependencies.terminalConfig.get().fontFamily, this.setFontFamily, {
+ reaction(() => this.theme, colors => this.xterm.setOption("theme", colors), {
fireImmediately: true,
}),
+ reaction(() => this.fontSize, this.setFontSize, { fireImmediately: true }),
+ reaction(() => this.fontFamily, this.setFontFamily, { fireImmediately: true }),
() => onDataHandler.dispose(),
() => this.fitAddon.dispose(),
() => this.api.removeAllListeners(),
@@ -120,15 +128,14 @@ export class Terminal {
}
fit = () => {
- // Since this function is debounced we need to read this value as late as possible
- if (!this.xterm) {
- return;
- }
-
try {
- this.fitAddon.fit();
- const { cols, rows } = this.xterm;
+ const { cols, rows } = this.fitAddon.proposeDimensions();
+ // attempt to resize/fit terminal when it's not visible in DOM will crash with exception
+ // see: https://github.com/xtermjs/xterm.js/issues/3118
+ if (isNaN(cols) || isNaN(rows)) return;
+
+ this.fitAddon.fit();
this.api.sendTerminalSize(cols, rows);
} catch (error) {
// see https://github.com/lensapp/lens/issues/1891
@@ -197,12 +204,21 @@ export class Terminal {
}
};
- setFontSize = (size: number) => {
- this.xterm.options.fontSize = size;
+ setFontSize = (fontSize: number) => {
+ logger.info(`[TERMINAL]: set fontSize to ${fontSize}`);
+
+ this.xterm.options.fontSize = fontSize;
+ this.fit();
};
- setFontFamily = (family: string) => {
- this.xterm.options.fontFamily = family;
+ setFontFamily = (fontFamily: string) => {
+ logger.info(`[TERMINAL]: set fontFamily to ${fontFamily}`);
+
+ this.xterm.options.fontFamily = fontFamily;
+ this.fit();
+
+ // provide css-variable within `:root {}`
+ document.documentElement.style.setProperty("--font-terminal", fontFamily);
};
keyHandler = (evt: KeyboardEvent): boolean => {
diff --git a/src/renderer/components/fonts.scss b/src/renderer/components/fonts.scss
index fc594561d8..40f9e9625b 100644
--- a/src/renderer/components/fonts.scss
+++ b/src/renderer/components/fonts.scss
@@ -3,34 +3,99 @@
* Licensed under MIT License. See LICENSE in root directory for more information.
*/
-// Custom fonts
-@import "~typeface-roboto/index.css";
+// App's main font
+// Downloaded from: https://fonts.google.com/specimen/Roboto
+@font-face {
+ font-family: "Roboto";
+ src: url("../fonts/Roboto-Light.ttf") format("truetype");
+ font-display: swap;
+ font-weight: 300; // "light"
+}
-// Material Design Icons, used primarily in icon.tsx
-// Latest: https://github.com/google/material-design-icons/tree/master/font
+@font-face {
+ font-family: "Roboto";
+ src: url("../fonts/Roboto-LightItalic.ttf") format("truetype");
+ font-display: swap;
+ font-weight: 300; // "light" + italic
+ font-style: italic;
+}
+
+@font-face {
+ font-family: "Roboto";
+ src: url("../fonts/Roboto-Regular.ttf") format("truetype");
+ font-display: swap;
+ font-weight: 400; // "normal"
+}
+
+@font-face {
+ font-family: "Roboto";
+ src: url("../fonts/Roboto-Bold.ttf") format("truetype");
+ font-display: swap;
+ font-weight: 700; // "bold"
+}
+
+
+// Icon fonts, see: `icon.tsx`
+// Latest version for manual update: https://github.com/google/material-design-icons/tree/master/font
@font-face {
font-family: "Material Icons";
font-style: normal;
font-weight: 400;
font-display: block;
- src: url("./fonts/MaterialIcons-Regular.ttf") format("truetype");
+ src: url("../fonts/MaterialIcons-Regular.ttf") format("truetype");
+}
+
+
+// Terminal fonts (monospaced)
+// Source: https://fonts.google.com/?category=Monospace
+@font-face {
+ font-family: "Anonymous Pro";
+ src: local("Anonymous Pro"), url("../fonts/AnonymousPro-Regular.ttf") format("truetype");
+ font-display: block;
+}
+
+@font-face {
+ font-family: "IBM Plex Mono";
+ src: local("IBM Plex Mono"), url("../fonts/IBMPlexMono-Regular.ttf") format("truetype");
+ font-display: block;
+}
+
+@font-face {
+ font-family: "JetBrains Mono";
+ src: local("JetBrains Mono"), url("../fonts/JetBrainsMono-Regular.ttf") format("truetype");
+ font-display: block;
+}
+
+@font-face {
+ font-family: "Red Hat Mono";
+ src: local("Red Hat Mono"), url("../fonts/RedHatMono-Regular.ttf") format("truetype");
+ font-display: block;
+}
+
+
+@font-face {
+ font-family: "Source Code Pro";
+ src: local("Source Code Pro"), url("../fonts/SourceCodePro-Regular.ttf") format("truetype");
+ font-display: block;
+}
+
+@font-face {
+ font-family: "Space Mono";
+ src: local("Space Mono"), url("../fonts/SpaceMono-Regular.ttf") format("truetype");
+ font-display: block;
+}
+
+@font-face {
+ font-family: "Ubuntu Mono";
+ src: local("Ubuntu Mono"), url("../fonts/UbuntuMono-Regular.ttf") format("truetype");
+ font-display: block;
}
// Patched RobotoMono font with icons
// RobotoMono Windows Compatible for using in terminal
// https://github.com/ryanoasis/nerd-fonts/tree/master/patched-fonts/RobotoMono
@font-face {
- font-family: 'RobotoMono';
+ font-family: "RobotoMono";
+ src: local("RobotoMono"), url("../fonts/Roboto-Mono-nerd.ttf") format("truetype");
font-display: block;
- src: local('RobotoMono'), url('./fonts/roboto-mono-nerd.ttf') format('truetype');
-}
-
-#fonts-preloading {
- > .icons {
- @include font-preload("Material Icons");
- }
-
- > .terminal {
- @include font-preload("RobotoMono");
- }
}
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-100.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-100.woff2
deleted file mode 100644
index f662e6cd2a..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-100.woff2 and /dev/null differ
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-100italic.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-100italic.woff2
deleted file mode 100644
index b1b4f9ada7..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-100italic.woff2 and /dev/null differ
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-300.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-300.woff2
deleted file mode 100644
index 3a052ac03c..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-300.woff2 and /dev/null differ
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-300italic.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-300italic.woff2
deleted file mode 100644
index 93756538fe..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-300italic.woff2 and /dev/null differ
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-500.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-500.woff2
deleted file mode 100644
index fd707809c2..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-500.woff2 and /dev/null differ
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-500italic.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-500italic.woff2
deleted file mode 100644
index 10215999d5..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-500italic.woff2 and /dev/null differ
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-700.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-700.woff2
deleted file mode 100644
index 6c1e8dd09a..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-700.woff2 and /dev/null differ
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-700italic.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-700italic.woff2
deleted file mode 100644
index 27b02021ba..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-700italic.woff2 and /dev/null differ
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-italic.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-italic.woff2
deleted file mode 100644
index 23a1f71b4e..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-italic.woff2 and /dev/null differ
diff --git a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-regular.woff2 b/src/renderer/components/fonts/roboto-v20-cyrillic_latin-regular.woff2
deleted file mode 100644
index 6b85564019..0000000000
Binary files a/src/renderer/components/fonts/roboto-v20-cyrillic_latin-regular.woff2 and /dev/null differ
diff --git a/src/renderer/components/input/input.tsx b/src/renderer/components/input/input.tsx
index ffb5fab9ca..9514e796e3 100644
--- a/src/renderer/components/input/input.tsx
+++ b/src/renderer/components/input/input.tsx
@@ -14,7 +14,6 @@ import { Tooltip } from "../tooltip";
import * as Validators from "./input_validators";
import type { InputValidator } from "./input_validators";
import isFunction from "lodash/isFunction";
-import isBoolean from "lodash/isBoolean";
import uniqueId from "lodash/uniqueId";
import { debounce } from "lodash";
@@ -24,7 +23,10 @@ export { InputValidators };
export type { InputValidator };
type InputElement = HTMLInputElement | HTMLTextAreaElement;
-type InputElementProps = InputHTMLAttributes & TextareaHTMLAttributes & DOMAttributes;
+type InputElementProps =
+ InputHTMLAttributes
+ & TextareaHTMLAttributes
+ & DOMAttributes;
export interface IconDataFnArg {
isDirty: boolean;
@@ -173,22 +175,18 @@ export class Input extends React.Component {
error => this.getValidatorError(value, validator) || error,
),
);
- } else {
- if (!validator.validate(value, this.props)) {
- errors.push(this.getValidatorError(value, validator));
- }
}
- const result = validator.validate(value, this.props);
+ const isValid = validator.validate(value, this.props);
- if (isBoolean(result) && !result) {
+ if (isValid === false) {
errors.push(this.getValidatorError(value, validator));
- } else if (result instanceof Promise) {
+ } else if (isValid instanceof Promise) {
if (!validationId) {
this.validationId = validationId = uniqueId("validation_id_");
}
asyncValidators.push(
- result.then(
+ isValid.then(
() => null, // don't consider any valid result from promise since we interested in errors only
error => this.getValidatorError(value, validator) || error,
),
@@ -266,17 +264,25 @@ export class Input extends React.Component {
setDirtyOnChange = debounce(() => this.setDirty(), 500);
- onChange(evt: React.ChangeEvent) {
- this.props.onChange?.(evt.currentTarget.value, evt);
- this.validate();
+ async onChange(evt: React.ChangeEvent) {
+ const newValue = evt.currentTarget.value;
+ const eventCopy = { ...evt };
+
this.autoFitHeight();
this.setDirtyOnChange();
- // re-render component when used as uncontrolled input
- // when used @defaultValue instead of @value changing real input.value doesn't call render()
- if (this.isUncontrolled && this.showMaxLenIndicator) {
- this.forceUpdate();
+ // Handle uncontrolled components (`props.defaultValue` must be used instead `value`)
+ if (this.isUncontrolled) {
+ // update DOM since render() is not called on input's changes with uncontrolled inputs
+ if (this.showMaxLenIndicator) this.forceUpdate();
+
+ // don't propagate changes for invalid values
+ await this.validate();
+ if (!this.state.valid) return; // skip
}
+
+ // emit new value update
+ this.props.onChange?.(newValue, eventCopy);
}
onKeyDown(evt: React.KeyboardEvent) {
@@ -299,7 +305,7 @@ export class Input extends React.Component {
this.setDirty();
}
- if(this.props.blurOnEnter){
+ if (this.props.blurOnEnter) {
//pressing enter indicates that the edit is complete, we can unfocus now
this.blur();
}
@@ -379,7 +385,6 @@ export class Input extends React.Component {
multiLine, showValidationLine, validators, theme, maxRows, children, showErrorsAsTooltip,
maxLength, rows, disabled, autoSelectOnFocus, iconLeft, iconRight, contentRight, id,
dirty: _dirty, // excluded from passing to input-element
- defaultValue,
trim,
blurOnEnter,
...inputProps
diff --git a/src/renderer/components/input/input_validators.ts b/src/renderer/components/input/input_validators.ts
index 4c0befbd29..a9844bfcd8 100644
--- a/src/renderer/components/input/input_validators.ts
+++ b/src/renderer/components/input/input_validators.ts
@@ -8,7 +8,8 @@ import type { ReactNode } from "react";
import fse from "fs-extra";
import { TypedRegEx } from "typed-regex";
-export class AsyncInputValidationError extends Error {}
+export class AsyncInputValidationError extends Error {
+}
export type InputValidator = {
/**
@@ -32,7 +33,7 @@ export type InputValidator = {
message?: undefined;
debounce: number;
}
-);
+ );
export function inputValidator(validator: InputValidator): InputValidator {
return validator;
@@ -52,7 +53,14 @@ export const isEmail = inputValidator({
export const isNumber = inputValidator({
condition: ({ type }) => type === "number",
- message: () => `Invalid number`,
+ message(value, { min, max }) {
+ const minMax: string = [
+ typeof min === "number" ? `min: ${min}` : undefined,
+ typeof max === "number" ? `max: ${max}` : undefined,
+ ].filter(Boolean).join(", ");
+
+ return `Invalid number${minMax ? ` (${minMax})` : ""}`;
+ },
validate: (value, { min, max }) => {
const numVal = +value;
diff --git a/src/renderer/components/mixins.scss b/src/renderer/components/mixins.scss
index dd62568219..4581f0437b 100755
--- a/src/renderer/components/mixins.scss
+++ b/src/renderer/components/mixins.scss
@@ -59,20 +59,3 @@
@content; // css-modules (*.module.scss)
}
}
-
-// Makes custom @font-family available at earlier stages.
-// Element must exist in DOM as soon as possible to initiate preloading.
-@mixin font-preload($fontFamily) {
- position: absolute;
- visibility: hidden;
- height: 0;
-
- &:before {
- width: 0;
- display: block;
- overflow: hidden;
- content: "x"; // some text required to start applying font in document
- font-family: $fontFamily; // imported name in @font-face declaration
- @content;
- }
-}
diff --git a/src/renderer/components/select/select.tsx b/src/renderer/components/select/select.tsx
index 62513645d9..cd599e6683 100644
--- a/src/renderer/components/select/select.tsx
+++ b/src/renderer/components/select/select.tsx
@@ -22,7 +22,7 @@ const { Menu } = components;
export interface SelectOption {
value: Value;
- label: string;
+ label: React.ReactNode;
isDisabled?: boolean;
isSelected?: boolean;
}
diff --git a/src/renderer/fonts/AnonymousPro-Regular.ttf b/src/renderer/fonts/AnonymousPro-Regular.ttf
new file mode 100644
index 0000000000..a98da85573
Binary files /dev/null and b/src/renderer/fonts/AnonymousPro-Regular.ttf differ
diff --git a/src/renderer/fonts/IBMPlexMono-Regular.ttf b/src/renderer/fonts/IBMPlexMono-Regular.ttf
new file mode 100644
index 0000000000..93331e2678
Binary files /dev/null and b/src/renderer/fonts/IBMPlexMono-Regular.ttf differ
diff --git a/src/renderer/fonts/JetBrainsMono-Regular.ttf b/src/renderer/fonts/JetBrainsMono-Regular.ttf
new file mode 100644
index 0000000000..9a5202eb14
Binary files /dev/null and b/src/renderer/fonts/JetBrainsMono-Regular.ttf differ
diff --git a/src/renderer/components/fonts/MaterialIcons-Regular.ttf b/src/renderer/fonts/MaterialIcons-Regular.ttf
similarity index 100%
rename from src/renderer/components/fonts/MaterialIcons-Regular.ttf
rename to src/renderer/fonts/MaterialIcons-Regular.ttf
diff --git a/src/renderer/fonts/RedHatMono-Regular.ttf b/src/renderer/fonts/RedHatMono-Regular.ttf
new file mode 100644
index 0000000000..27b4f2baac
Binary files /dev/null and b/src/renderer/fonts/RedHatMono-Regular.ttf differ
diff --git a/src/renderer/fonts/Roboto-Bold.ttf b/src/renderer/fonts/Roboto-Bold.ttf
new file mode 100644
index 0000000000..43da14d84e
Binary files /dev/null and b/src/renderer/fonts/Roboto-Bold.ttf differ
diff --git a/src/renderer/fonts/Roboto-Light.ttf b/src/renderer/fonts/Roboto-Light.ttf
new file mode 100644
index 0000000000..e7307e72c5
Binary files /dev/null and b/src/renderer/fonts/Roboto-Light.ttf differ
diff --git a/src/renderer/fonts/Roboto-LightItalic.ttf b/src/renderer/fonts/Roboto-LightItalic.ttf
new file mode 100644
index 0000000000..2d277afb23
Binary files /dev/null and b/src/renderer/fonts/Roboto-LightItalic.ttf differ
diff --git a/src/renderer/components/fonts/roboto-mono-nerd.ttf b/src/renderer/fonts/Roboto-Mono-nerd.ttf
similarity index 100%
rename from src/renderer/components/fonts/roboto-mono-nerd.ttf
rename to src/renderer/fonts/Roboto-Mono-nerd.ttf
diff --git a/src/renderer/fonts/Roboto-Regular.ttf b/src/renderer/fonts/Roboto-Regular.ttf
new file mode 100644
index 0000000000..ddf4bfacb3
Binary files /dev/null and b/src/renderer/fonts/Roboto-Regular.ttf differ
diff --git a/src/renderer/fonts/SourceCodePro-Regular.ttf b/src/renderer/fonts/SourceCodePro-Regular.ttf
new file mode 100644
index 0000000000..09c7d9fb66
Binary files /dev/null and b/src/renderer/fonts/SourceCodePro-Regular.ttf differ
diff --git a/src/renderer/fonts/SpaceMono-Regular.ttf b/src/renderer/fonts/SpaceMono-Regular.ttf
new file mode 100644
index 0000000000..d713495180
Binary files /dev/null and b/src/renderer/fonts/SpaceMono-Regular.ttf differ
diff --git a/src/renderer/fonts/UbuntuMono-Regular.ttf b/src/renderer/fonts/UbuntuMono-Regular.ttf
new file mode 100644
index 0000000000..4977028d13
Binary files /dev/null and b/src/renderer/fonts/UbuntuMono-Regular.ttf differ
diff --git a/src/renderer/template.html b/src/renderer/template.html
index 79014c6009..5860854d9a 100755
--- a/src/renderer/template.html
+++ b/src/renderer/template.html
@@ -1,17 +1,21 @@
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/yarn.lock b/yarn.lock
index a345135f53..fc3c74b964 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -13012,11 +13012,6 @@ typedoc@0.22.17:
minimatch "^5.1.0"
shiki "^0.10.1"
-typeface-roboto@^1.1.13:
- version "1.1.13"
- resolved "https://registry.yarnpkg.com/typeface-roboto/-/typeface-roboto-1.1.13.tgz#9c4517cb91e311706c74823e857b4bac9a764ae5"
- integrity sha512-YXvbd3a1QTREoD+FJoEkl0VQNJoEjewR2H11IjVv4bp6ahuIcw0yyw/3udC4vJkHw3T3cUh85FTg8eWef3pSaw==
-
typescript-plugin-css-modules@^3.4.0:
version "3.4.0"
resolved "https://registry.yarnpkg.com/typescript-plugin-css-modules/-/typescript-plugin-css-modules-3.4.0.tgz#4ff6905d88028684d1608c05c62cb6346e5548cc"