mirror of
https://github.com/artegoser/AnoPaper.git
synced 2024-11-21 19:36:22 +03:00
feat: description
This commit is contained in:
parent
df877c6aa5
commit
eb3fcec357
10 changed files with 53 additions and 41 deletions
20
src/App.jsx
20
src/App.jsx
|
|
@ -9,6 +9,7 @@ import Notes from "./pages/notes";
|
|||
import PubNote from "./pages/pubNote";
|
||||
import PubError from "./pages/pubError";
|
||||
import PubNoteSafe from "./pages/pubNoteSafe";
|
||||
import ReactMarkdown from "react-markdown";
|
||||
|
||||
function App() {
|
||||
Storage.prototype.setObj = function (key, obj) {
|
||||
|
|
@ -33,11 +34,20 @@ function App() {
|
|||
<Route
|
||||
path="/about"
|
||||
element={
|
||||
<div className="col-span-4">
|
||||
AnoPaper позволяет анонимно сохранять и опубликовывать заметки.
|
||||
Заметки поддерживают формат markdown. Публичные заметки доступны
|
||||
только по ссылке. Записки которые не публичны записываются
|
||||
только локально и не отправляются на сервер.
|
||||
<div className="col-span-4 md">
|
||||
<ReactMarkdown>
|
||||
{`## Anopaper - сервис анонимных записок
|
||||
\rAnoPaper позволяет анонимно сохранять и публиковать заметки.
|
||||
\r-----
|
||||
\r### Функционал:
|
||||
|
||||
\r* Заметки поддерживают формат markdown. Например запись: \`### Заголовок 3-го уровня\` будет выглядеть так:
|
||||
\r> ### Заголовок 3-го уровня
|
||||
|
||||
\r* Публичные заметки доступны только по ссылке.
|
||||
\r* При переходе по ссылке заметка исчезает, прочесть ее можно только один раз.
|
||||
\r* Не публичные заметки сохраняются локально и не отправляются на сервер.`}
|
||||
</ReactMarkdown>
|
||||
</div>
|
||||
}
|
||||
/>
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@ function Button(props) {
|
|||
);
|
||||
}
|
||||
|
||||
function IconWithButton(props) {
|
||||
function IconWithText(props) {
|
||||
if (props.reverse) {
|
||||
return (
|
||||
<div className="grid place-content-end grid-cols-2">
|
||||
|
|
@ -30,4 +30,4 @@ function IconWithButton(props) {
|
|||
);
|
||||
}
|
||||
|
||||
export { Button, IconWithButton };
|
||||
export { Button, IconWithText };
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { Button, IconWithButton } from "./button";
|
||||
import { Button, IconWithText } from "./button";
|
||||
import {
|
||||
MagnifyingGlassCircleIcon,
|
||||
PencilIcon,
|
||||
|
|
@ -10,29 +10,29 @@ function Menu() {
|
|||
return (
|
||||
<div className="grid grid-cols-1 col-span-4 lg:col-span-1 gap-2 m-4 place-content-start justify-self-center justify-center">
|
||||
<Button href="/notes">
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
icon={
|
||||
<MagnifyingGlassCircleIcon className="transform translate-z-0 h-7 w-7" />
|
||||
}
|
||||
>
|
||||
Заметки
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
<Button href="/">
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
icon={<PencilIcon className="transform translate-z-0 h-7 w-7" />}
|
||||
>
|
||||
Написать
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
<Button href="/about">
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
icon={
|
||||
<ExclamationCircleIcon className="transform translate-z-0 h-7 w-7" />
|
||||
}
|
||||
>
|
||||
Подробнее
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
</div>
|
||||
);
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
}
|
||||
|
||||
.md blockquote{
|
||||
@apply border-l-4 pl-2 rounded-lg;
|
||||
@apply border-l-4 pl-2 rounded-lg ml-4 mt-2 mb-2;
|
||||
@apply bg-zinc-200 border-zinc-400;
|
||||
@apply dark:bg-zinc-800 dark:border-zinc-600;
|
||||
}
|
||||
|
|
@ -35,19 +35,19 @@
|
|||
}
|
||||
|
||||
.md ul{
|
||||
@apply list-disc list-inside;
|
||||
@apply list-disc list-inside ml-4;
|
||||
}
|
||||
|
||||
.md li ul {
|
||||
@apply list-disc list-inside ml-2;
|
||||
@apply list-disc list-inside;
|
||||
}
|
||||
|
||||
.md ol{
|
||||
@apply list-decimal list-inside;
|
||||
@apply list-decimal list-inside ml-4;
|
||||
}
|
||||
|
||||
.md li ol{
|
||||
@apply list-decimal list-inside ml-2;
|
||||
@apply list-decimal list-inside ml-4;
|
||||
}
|
||||
|
||||
.md code {
|
||||
|
|
@ -64,4 +64,6 @@
|
|||
.md img {
|
||||
@apply w-96 ease-[cubic-bezier(.69,.58,.32,1.69)] hover:scale-105 rounded-2xl hover:drop-shadow-2xl transition duration-500 lg:ml-5;
|
||||
}
|
||||
|
||||
.md p { display: inline; }
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
import { Button, IconWithButton } from "../components/button";
|
||||
import { Button, IconWithText } from "../components/button";
|
||||
import { ChevronDoubleRightIcon } from "@heroicons/react/24/outline";
|
||||
import { CheckBox } from "../components/checkbox";
|
||||
import { useState } from "react";
|
||||
|
|
@ -74,14 +74,14 @@ function CreateNote() {
|
|||
className="m-5"
|
||||
href={publicState ? "/notes/save-local" : "/notes/publish"}
|
||||
>
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
reverse={true}
|
||||
icon={
|
||||
<ChevronDoubleRightIcon className="transform translate-z-0 h-7 w-7" />
|
||||
}
|
||||
>
|
||||
Отправить
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import ReactMarkdown from "react-markdown";
|
|||
import { useParams } from "react-router-dom";
|
||||
import printDate from "../components/utils";
|
||||
import { ChevronDoubleLeftIcon, TrashIcon } from "@heroicons/react/24/outline";
|
||||
import { Button, IconWithButton } from "../components/button";
|
||||
import { Button, IconWithText } from "../components/button";
|
||||
|
||||
function Note() {
|
||||
let params = useParams();
|
||||
|
|
@ -13,13 +13,13 @@ function Note() {
|
|||
return (
|
||||
<div className="">
|
||||
<Button className="mb-4" href="/notes">
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
icon={
|
||||
<ChevronDoubleLeftIcon className="transform translate-z-0 h-7 w-7" />
|
||||
}
|
||||
>
|
||||
Заметки
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
|
||||
<div className="border border-blue-300 rounded-lg p-4">
|
||||
|
|
@ -48,11 +48,11 @@ function Note() {
|
|||
localStorage.setObj("Notes", notesObj);
|
||||
}}
|
||||
>
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
icon={<TrashIcon className="transform translate-z-0 h-7 w-7" />}
|
||||
>
|
||||
Удалить
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -62,13 +62,13 @@ function Note() {
|
|||
return (
|
||||
<div>
|
||||
<Button className="mb-4" href="/notes">
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
icon={
|
||||
<ChevronDoubleLeftIcon className="transform translate-z-0 h-7 w-7" />
|
||||
}
|
||||
>
|
||||
Заметки
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
<div>Заметки не существует.</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
import { Button, IconWithButton } from "../components/button";
|
||||
import { Button, IconWithText } from "../components/button";
|
||||
import { ChevronDoubleRightIcon } from "@heroicons/react/24/outline";
|
||||
import printDate from "../components/utils";
|
||||
|
||||
|
|
@ -22,14 +22,14 @@ function Notes() {
|
|||
<div className="text-center">{printDate(val[1].time)}</div>
|
||||
<div className="">
|
||||
<Button className="" href={`/notes/${val[0]}`}>
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
reverse={true}
|
||||
icon={
|
||||
<ChevronDoubleRightIcon className="transform translate-z-0 h-7 w-7" />
|
||||
}
|
||||
>
|
||||
Перейти
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,18 +1,18 @@
|
|||
import printDate from "../components/utils";
|
||||
import { ChevronDoubleLeftIcon } from "@heroicons/react/24/outline";
|
||||
import { Button, IconWithButton } from "../components/button";
|
||||
import { Button, IconWithText } from "../components/button";
|
||||
|
||||
function PubError() {
|
||||
return (
|
||||
<div className="">
|
||||
<Button className="mb-4" href="/">
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
icon={
|
||||
<ChevronDoubleLeftIcon className="transform translate-z-0 h-7 w-7" />
|
||||
}
|
||||
>
|
||||
Вернуться
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
<div className="border border-blue-300 rounded-lg p-4">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2">
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { useState } from "react";
|
|||
import { useParams } from "react-router-dom";
|
||||
import printDate from "../components/utils";
|
||||
import { ChevronDoubleLeftIcon } from "@heroicons/react/24/outline";
|
||||
import { Button, IconWithButton } from "../components/button";
|
||||
import { Button, IconWithText } from "../components/button";
|
||||
|
||||
function PubNote() {
|
||||
let params = useParams();
|
||||
|
|
@ -37,13 +37,13 @@ function PubNote() {
|
|||
return (
|
||||
<div className="">
|
||||
<Button className="mb-4" href="/">
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
icon={
|
||||
<ChevronDoubleLeftIcon className="transform translate-z-0 h-7 w-7" />
|
||||
}
|
||||
>
|
||||
Писать
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
<div className="border border-blue-300 rounded-lg p-4">
|
||||
<div className="grid grid-cols-1 lg:grid-cols-2">
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@ import { useState } from "react";
|
|||
import { useParams } from "react-router-dom";
|
||||
import printDate from "../components/utils";
|
||||
import { ChevronDoubleLeftIcon } from "@heroicons/react/24/outline";
|
||||
import { Button, IconWithButton } from "../components/button";
|
||||
import { Button, IconWithText } from "../components/button";
|
||||
import { CopyToClipboard } from "../components/copytocb";
|
||||
|
||||
function PubNoteSafe() {
|
||||
|
|
@ -41,13 +41,13 @@ function PubNoteSafe() {
|
|||
return (
|
||||
<div className="">
|
||||
<Button className="mb-4" href="/">
|
||||
<IconWithButton
|
||||
<IconWithText
|
||||
icon={
|
||||
<ChevronDoubleLeftIcon className="transform translate-z-0 h-7 w-7" />
|
||||
}
|
||||
>
|
||||
Писать
|
||||
</IconWithButton>
|
||||
</IconWithText>
|
||||
</Button>
|
||||
|
||||
{note?.code === 1 && (
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue