diff --git a/src/pages/settings/panes/Appearance.tsx b/src/pages/settings/panes/Appearance.tsx
index e8647a80..ccc8a13b 100644
--- a/src/pages/settings/panes/Appearance.tsx
+++ b/src/pages/settings/panes/Appearance.tsx
@@ -38,6 +38,7 @@ import notoSVG from "../assets/noto_emoji.svg";
import openmojiSVG from "../assets/openmoji_emoji.svg";
import twemojiSVG from "../assets/twemoji_emoji.svg";
import { Reset, Import } from "@styled-icons/boxicons-regular";
+import Tooltip from "../../../components/common/Tooltip";
interface Props {
settings: Settings;
@@ -246,28 +247,41 @@ export function Component(props: Props) {
-
-
Text
-
+
}>
+
+
+
writeClipboard(JSON.stringify(theme))}>
+ }>
+ {JSON.stringify(theme)}
+
+
+
}>
+
+
{(
diff --git a/src/pages/settings/panes/Panes.module.scss b/src/pages/settings/panes/Panes.module.scss
index dd3b64a3..85f3855c 100644
--- a/src/pages/settings/panes/Panes.module.scss
+++ b/src/pages/settings/panes/Panes.module.scss
@@ -252,17 +252,24 @@
.actions {
gap: 8px;
display: flex;
- flex-wrap: wrap;
margin-bottom: 8px;
.code {
- display: flex;
+ cursor: pointer;
+
+ min-width: 0;
flex-grow: 1;
- border-radius: 4px;
padding: 8px;
- background: var(--secondary-background);
- align-items: center;
+ border-radius: 4px;
font-family: var(--codeblock-font);
+ background: var(--secondary-background);
+
+ > div {
+ width: 100%;
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ }
}
}
@@ -272,8 +279,9 @@
.entry {
gap: 8px;
- padding: 2px;
+ padding: 12px;
margin-top: 8px;
+ border-radius: 6px;
.override {
display: flex;