artegoser/AnoPaper
1
2
Fork 0
mirror of https://github.com/artegoser/AnoPaper.git synced 2025-02-23 12:43:14 +03:00
Code Issues Projects Releases Packages Wiki Activity

feat: server and fix inline code

Browse source
This commit is contained in:
Artemy 2023-04-02 10:53:32 +03:00
parent 8bdc53f45d
commit bff9c3875c
9 changed files with 1391 additions and 59 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/copytocb.jsx
View file

@ -33,7 +33,7 @@ function CopyToClipboard(props) {
);
}
function CodeCopyBtn(props) {
function CodeCopyBtn({ text }) {
let [copied, setCopied] = useState(false);
useEffect(() => {
@ -48,7 +48,7 @@ function CodeCopyBtn(props) {
<div
className="code-copy-btn"
onClick={() => {
navigator.clipboard.writeText(props.children[0].props.children[0]);
navigator.clipboard.writeText(text);
setCopied(true);
}}
>

28
src/components/markdown.jsx
View file

@ -12,14 +12,19 @@ let theme = window.matchMedia("(prefers-color-scheme: dark)").matches
: "light";
function CodeBlock(props) {
return (
<SyntaxHighlighter
className={`md-code ${props.className}`}
style={theme == "light" ? github : darcula}
>
{props.children[0]}
</SyntaxHighlighter>
);
let text = props.children[0];
let oneline = text.indexOf("\n") <= 1;
if (oneline) {
return <code className="md-code">{text}</code>;
} else
return (
<SyntaxHighlighter
className={`md-code ${props.className}`}
style={theme == "light" ? github : darcula}
>
{text}
</SyntaxHighlighter>
);
}
function RenderMarkdown(props) {
@ -37,9 +42,12 @@ function RenderMarkdown(props) {
}
function Pre({ children }) {
let text = children[0].props.children[0];
let oneline = text.indexOf("\n") <= 1;
console.log(oneline);
return (
<pre className="blog-pre">
<CodeCopyBtn>{children}</CodeCopyBtn>
<pre className={oneline ? "" : "blog-pre"}>
{!oneline && <CodeCopyBtn text={text} />}
{children}
</pre>
);

72
src/pages/notes.jsx
View file

@ -3,41 +3,45 @@ import { ChevronDoubleRightIcon } from "@heroicons/react/24/outline";
import printDate from "../components/utils";
function Notes() {
return (
<div>
{Object.entries(localStorage.getObj("Notes"))
.sort((a, b) => {
return b[1].time - a[1].time;
})
.map((val) => {
return (
<div
className="grid grid-cols-1 lg:grid-cols-2 border border-blue-300 rounded-lg m-2 p-2 justify-items-start"
key={val[0]}
>
<div className="font-medium leading-tight text-4xl mt-0 mb-2">
{val[1].name}
</div>
<div className="grid grid-cols-1 lg:grid-cols-2 justify-self-center lg:justify-self-end">
<div className="text-center">{printDate(val[1].time)}</div>
<div className="">
<Button className="" href={`/notes/${val[0]}`}>
<IconWithText
reverse={true}
icon={
<ChevronDoubleRightIcon className="transform translate-z-0 h-7 w-7" />
}
>
Перейти
</IconWithText>
</Button>
</div>
</div>
let notes = Object.entries(localStorage.getObj("Notes"))
.sort((a, b) => {
return b[1].time - a[1].time;
})
.map((val) => {
return (
<div
className="grid grid-cols-1 lg:grid-cols-2 border border-blue-300 rounded-lg m-2 p-2 justify-items-start"
key={val[0]}
>
<div className="font-medium leading-tight text-4xl mt-0 mb-2">
{val[1].name}
</div>
<div className="grid grid-cols-1 lg:grid-cols-2 justify-self-center lg:justify-self-end">
<div className="text-center">{printDate(val[1].time)}</div>
<div className="">
<Button className="" href={`/notes/${val[0]}`}>
<IconWithText
reverse={true}
icon={
<ChevronDoubleRightIcon className="transform translate-z-0 h-7 w-7" />
}
>
Перейти
</IconWithText>
</Button>
</div>
);
})}
</div>
);
</div>
</div>
);
});
if (notes.length === 0)
return (
<div className="md">
<h3>Заметок пока нет</h3>
</div>
);
return notes;
}
export default Notes;