starred/yaak-mountain-loop
1
0
Fork 0
mirror of https://github.com/mountain-loop/yaak.git synced 2026-03-23 01:49:13 +01:00
Code Issues 8 Packages Projects Releases 10 Wiki Activity

Update editor styles

Browse Source
This commit is contained in:
Gregory Schier
2023-02-18 21:12:25 -08:00
parent bfa3418ee5
commit d5649b0925
6 changed files with 45 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src-web/components/Editor/Editor.css
View File

@@ -6,15 +6,25 @@
}
.cm-editor .cm-scroller {
padding-top: 0.5em;
padding-bottom: 0.5em;
border-radius: var(--border-radius-lg);
background-color: hsl(var(--color-gray-50));
background-color: hsl(var(--color-gray-50) / 0.5);
}
.cm-editor .cm-line {
padding-left: 1.5em;
padding-right: 1.5em;
color: hsl(var(--color-gray-900));
}
.cm-editor .cm-gutters {
background-color: transparent;
border-right: 1px solid hsl(var(--color-gray-100));
color: hsl(var(--color-gray-300));
}
.cm-editor .cm-activeLineGutter,
.cm-editor .cm-activeLine {
background-color: hsl(var(--color-gray-100) / 0.5);
}
.cm-editor * {

5
src-web/components/Editor/Editor.tsx
View File

@@ -1,11 +1,12 @@
import useCodeMirror from '../../hooks/useCodemirror';
import useCodeMirror, { EditorLanguage } from '../../hooks/useCodemirror';
import './Editor.css';
interface Props {
language: EditorLanguage;
value: string;
}
export default function Editor(props: Props) {
const { ref } = useCodeMirror({ value: props.value });
const { ref } = useCodeMirror({ value: props.value, language: props.language });
return <div ref={ref} className="m-0 text-sm overflow-hidden" />;
}