{name}
-
{subtitle}
+
{resolvedSubtitle}
- {isCurrent || !isDefault ? (
+ {appliedTargets.length || deletable ? (
- {isCurrent ? (
- Current
- ) : null}
- {!isDefault ? (
+ {appliedTargets.map((target) => (
+
+ {targetLabels[target]}
+
+ ))}
+ {deletable ? (
{
const $target = e.target;
const action = $target.dataset.action;
- if (action === "delete" && !isDefault) {
+ if (action === "delete" && deletable) {
e.stopPropagation();
onDelete();
} else if (
diff --git a/src/pages/fontManager/style.scss b/src/pages/fontManager/style.scss
index 2228ced44..d67e1b0ab 100644
--- a/src/pages/fontManager/style.scss
+++ b/src/pages/fontManager/style.scss
@@ -119,12 +119,31 @@ wc-page.font-manager-page {
}
}
- .font-manager-current {
+ .font-manager-badge {
display: inline-flex;
align-items: center;
+ justify-content: center;
+ padding: 0.16rem 0.48rem;
+ border-radius: 999px;
font-size: 0.82rem;
font-weight: 600;
line-height: 1.2;
+ background: color-mix(in srgb, var(--secondary-color), var(--active-color) 10%);
+ color: color-mix(in srgb, var(--active-color), transparent 12%);
+ }
+
+ .font-manager-badge-editor {
+ background: color-mix(in srgb, var(--secondary-color), #4ca3ff 14%);
+ color: color-mix(in srgb, #4ca3ff, white 4%);
+ }
+
+ .font-manager-badge-terminal {
+ background: color-mix(in srgb, var(--secondary-color), #21b36b 14%);
+ color: color-mix(in srgb, #21b36b, white 4%);
+ }
+
+ .font-manager-badge-app {
+ background: color-mix(in srgb, var(--secondary-color), var(--active-color) 12%);
color: color-mix(in srgb, var(--active-color), transparent 14%);
}
diff --git a/src/settings/appSettings.js b/src/settings/appSettings.js
index 102ad025e..9734dee3b 100644
--- a/src/settings/appSettings.js
+++ b/src/settings/appSettings.js
@@ -7,6 +7,7 @@ import select from "dialogs/select";
import actions from "handlers/quickTools";
import actionStack from "lib/actionStack";
import constants from "lib/constants";
+import fonts from "lib/fonts";
import lang from "lib/lang";
import openFile from "lib/openFile";
import appSettings from "lib/settings";
@@ -19,6 +20,11 @@ import Url from "utils/Url";
export default function otherSettings() {
const values = appSettings.value;
const title = strings["app settings"].capitalize();
+ const appFontText = strings["app font"] || "App font";
+ const appFontInfo =
+ strings["settings-info-app-font-family"] ||
+ "Choose the font used across the app interface.";
+ const defaultFontLabel = strings.default || "Default";
const categories = {
interface: strings["settings-category-interface"],
fonts: strings["settings-category-fonts"],
@@ -153,6 +159,17 @@ export default function otherSettings() {
info: strings["settings-info-app-touch-move-threshold"],
category: categories.interface,
},
+ {
+ key: "appFont",
+ text: appFontText,
+ value: values.appFont || "",
+ valueText: (value) => value || defaultFontLabel,
+ get select() {
+ return [["", defaultFontLabel], ...fonts.getNames()];
+ },
+ info: appFontInfo,
+ category: categories.fonts,
+ },
{
key: "fontManager",
text: strings["fonts"],
@@ -299,6 +316,10 @@ export default function otherSettings() {
FontManager();
return;
+ case "appFont":
+ await fonts.setAppFont(value);
+ break;
+
case "console": {
if (value !== "eruda") {
break;
diff --git a/src/settings/terminalSettings.js b/src/settings/terminalSettings.js
index ca435600e..515c2ae0c 100644
--- a/src/settings/terminalSettings.js
+++ b/src/settings/terminalSettings.js
@@ -367,7 +367,7 @@ export default function terminalSettings() {
* @param {string} key
* @param {any} value
*/
-async function updateActiveTerminals(key, value) {
+export async function updateActiveTerminals(key, value) {
// Find all terminal tabs and update their settings
const terminalTabs = editorManager.files.filter(
(file) => file.type === "terminal",
diff --git a/src/styles/console.m.scss b/src/styles/console.m.scss
index dba6fed98..8ff4d63b1 100644
--- a/src/styles/console.m.scss
+++ b/src/styles/console.m.scss
@@ -40,7 +40,7 @@ c-console {
background-color: #313131;
z-index: 99998;
color: #eeeeee;
- font-family: "Roboto", sans-serif;
+ font-family: var(--app-font-family);
}
c-console[title] {
@@ -318,4 +318,4 @@ c-table c-cell:not(:last-child) {
opacity: 1;
transform: translate3d(0, 0, 0)
}
-}
\ No newline at end of file
+}
diff --git a/src/styles/list.scss b/src/styles/list.scss
index 3de6ea01e..1f35b615b 100644
--- a/src/styles/list.scss
+++ b/src/styles/list.scss
@@ -74,7 +74,7 @@
.icon.lang {
padding-right: 5px;
- font-family: "Roboto", sans-serif;
+ font-family: var(--app-font-family);
font-weight: bolder;
color: rgb(37, 37, 37);
color: var(--secondary-text-color);
@@ -277,4 +277,4 @@ ul {
&:focus {
background-color: rgba($color: #000000, $alpha: 0.2);
}
-}
\ No newline at end of file
+}