diff --git a/src/components/Nvim/NvimEditor.tsx b/src/components/Nvim/NvimEditor.tsx index 592780e..75defb8 100644 --- a/src/components/Nvim/NvimEditor.tsx +++ b/src/components/Nvim/NvimEditor.tsx @@ -1,12 +1,11 @@ import axios from "axios"; -import { useEffect, useRef, useState } from "react"; -import { CHAR_WIDTH } from "../Kitty"; +import { useEffect, useState } from "react"; export const NvimEditor = (props: { source: string | undefined }) => { const [data, setData] = useState(); const [loading, setLoading] = useState(false); - const textRef = useRef(null); + const [selectedLine, setSelectedLine] = useState(0); useEffect(() => { if (!props.source) return; @@ -18,14 +17,21 @@ export const NvimEditor = (props: { source: string | undefined }) => { }); }, [props.source]); - const rows = data?.split("\n") ?? []; + let rows = data?.split("\n") ?? []; + // trim end empty lines for (let i = rows.length - 1; i >= 0; i--) { if (rows[i].trim().length === 0) { - delete rows[i]; + rows = rows.slice(0, rows.length - 1); } else { break; } } + // add spaces in empty lines + for (let i = 0; i < rows.length; i++) { + if (rows[i].trim().length === 0) { + rows[i] = " "; + } + } return loading ? (

Loading...

@@ -33,10 +39,19 @@ export const NvimEditor = (props: { source: string | undefined }) => { {rows.map((row, i) => ( - + setSelectedLine(i)} + onMouseMove={(e) => { + if (e.buttons === 1) setSelectedLine(i); + }} + > diff --git a/src/components/Nvim/NvimInput.tsx b/src/components/Nvim/NvimInput.tsx index 53a62f0..b932db1 100644 --- a/src/components/Nvim/NvimInput.tsx +++ b/src/components/Nvim/NvimInput.tsx @@ -1 +1,3 @@ -export const NvimInput = () =>
Welcome to my website!!
; +export const NvimInput = () => ( +
Welcome to my website!!
+); diff --git a/src/index.scss b/src/index.scss index a9e8bb2..6688138 100644 --- a/src/index.scss +++ b/src/index.scss @@ -18,6 +18,10 @@ body { font-family: "JetBrainsMono"; } +*::selection { + background-color: #584e5a; +} + @font-face { font-family: "JetBrainsMono"; src:
{i + 1}