diff --git a/src/app/globals.css b/src/app/globals.css index 4221efe..ebd4f7f 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -217,94 +217,13 @@ animation-delay: 4s; } -/* List styles */ -ul, -ol { - list-style: none; - margin: 0; - - li p { - display: inline; - } -} -ol { - list-style-type: none; - counter-reset: list-0 list-1 list-2 list-3 list-4; - margin: 0; -} -h1, -h2, -h3, -h4, -h5, -h6 { -} - -h1, -h2 { -} - -h1 { - font-size: 1.4rem; -} - -h2 { - font-size: 1.2rem; -} - -h3 { - font-size: 1.1rem; -} - -h4, -h5, -h6 { - font-size: 1rem; -} - -code { - background-color: rgba(27, 31, 35, 0.05); - border-radius: 0.4rem; - color: black; - font-size: 0.85rem; - padding: 0.25em 0.3em; -} - -pre { - background: black; - border-radius: 0.5rem; - color: white; - font-family: "JetBrainsMono", monospace; - margin: 1.5rem 0; - padding: 0.75rem 1rem; - - code { - background: none; - color: inherit; - font-size: 0.8rem; - padding: 0; - } -} - -blockquote { - border-left: 3px solid gray; - margin: 1.5rem 0; - padding-left: 1rem; -} - -hr { - border: none; - border-top: 1px solid gray; - margin: 2rem 0; -} - * { margin: 0; padding: 0; box-sizing: border-box; } -.custom-list, +/* .custom-list, .custom-list-ordered { list-style-type: none; } @@ -312,22 +231,36 @@ hr { .custom-list li::marker, .custom-list-ordered li::marker { display: none; -} +} */ -.custom-list li::before { +/* .custom-list li::before { content: "•"; - /* width: 4px; - height: 4px; - border-radius: 50%; - background: #000; - vertical-align: middle; */ display: inline-block; margin-right: 10px; -} +} */ -.custom-list-ordered li::before { +/* .custom-list-ordered li::before { content: counter(list-0, decimal) ". "; counter-increment: list-0; display: inline-block; margin-right: 5px; +} */ + +.custom-list { + list-style-type: disc; + padding: 0 1rem; +} + +.custom-list li p { + margin-top: 0.25em; + margin-bottom: 0.25em; +} + +.custom-list-ordered { + list-style-type: decimal; + padding: 0 1rem; +} + +.custom-list-ordered li p { + margin-top: 0.25em; } diff --git a/src/app/layout.tsx b/src/app/layout.tsx index 9bb1b46..6c0928d 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -17,9 +17,9 @@ export const metadata: Metadata = { follow: true, "max-video-preview": -1, "max-image-preview": "large", - "max-snippet": -1 - } - } + "max-snippet": -1, + }, + }, }; export default function RootLayout({ children }: Props) { diff --git a/src/components/shared/rich-editor/RichEditor.tsx b/src/components/shared/rich-editor/RichEditor.tsx index fc75e5d..7868349 100644 --- a/src/components/shared/rich-editor/RichEditor.tsx +++ b/src/components/shared/rich-editor/RichEditor.tsx @@ -37,6 +37,9 @@ import { cn } from "@/lib/utils"; import ListItem from "@tiptap/extension-list-item"; import BulletList from "@tiptap/extension-bullet-list"; import OrderedList from "@tiptap/extension-ordered-list"; + +import "@/styles/tiptap.scss"; + interface RichTextEditorProps { content?: string; onChange: (content: string) => void; diff --git a/src/styles/tiptap.scss b/src/styles/tiptap.scss index 22fd079..922d858 100644 --- a/src/styles/tiptap.scss +++ b/src/styles/tiptap.scss @@ -1,19 +1,10 @@ -/* Basic editor styles */ .tiptap { min-height: 300px; - border: 1px solid #d1d5db; - padding: 2px; border-radius: 0 0 4px 4px; - :first-child { - margin-top: 0; - } - - /* List styles */ ul, ol { list-style-type: disc; padding: 0 1rem; - margin: 1.25rem 1rem 1.25rem 0.4rem; li p { margin-top: 0.25em; @@ -22,8 +13,7 @@ } ol { list-style-type: decimal; - padding: 0 1rem; - margin: 1.25rem 1rem 1.25rem 0.4rem; + padding: 1rem; li p { margin-top: 0.25em; @@ -66,7 +56,6 @@ font-size: 1rem; } - /* Code and preformatted text styles */ code { background-color: rgba(27, 31, 35, 0.05); border-radius: 0.4rem;