tomas.mirchev/med-notes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update

Browse Source
This commit is contained in:
Tomas Mirchev 2025-06-29 15:19:17 +00:00
parent 37995ede5c
commit 48e278b1c9
2 changed files with 52 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
reader/src/App.jsx
View File

@ -1,4 +1,4 @@
import { StrictMode, useLayoutEffect, useRef, useState, useEffect, useMemo } from "react";
import { StrictMode, Fragment, useLayoutEffect, useRef, useState, useEffect, useMemo } from "react";
import { Navigate, BrowserRouter, Link, Outlet, Route, Routes } from "react-router";
import { marked } from "marked";
import { resourcesInstance } from "./api.js";
@ -187,12 +187,11 @@ export function TopicListView() {
className={`flex-1 overflow-y-scroll ${selectedTopic === null ? "pb-[92px]" : "pb-[156px]"}`}
>
{selectedSubject.topics.map((topic, topicIdx) => (
<>
<Fragment key={topic.id}>
{topicIdx === DIVIDER_AT && (
<hr className="my-4 border-t border-dotted border-gray-400" />
)}
<Link
key={topic.id}
ref={(node) => {
itemRefs.current[topicIdx] = node;
}}
@ -211,7 +210,7 @@ export function TopicListView() {
{topic.title}
</span>
</Link>
</>
</Fragment>
))}
</div>
<div className="absolute bottom-0 sm:p-4 px-2 py-0 w-full flex flex-col">

58
reader/src/ResourcePage.jsx
View File

@ -1,4 +1,5 @@
import React, { useState, useEffect } from "react";
import React, { useState, useEffect, useMemo } from "react";
import { marked } from "marked";
import { useStore } from "./store.js";
import { resourcesInstance, apiInstance } from "./api.js";
@ -148,6 +149,35 @@ const Content = () => {
const [isSavingLoading, setIsSavingLoading] = useState(false);
const [message, setMessage] = useState(null);
const htmlContent = useMemo(() => {
let fileContent = content || "**No Data!**";
fileContent = marked.parse(fileContent);
fileContent = `
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
line-height: 1.5;
color: #333;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin: 0;
padding: 0 12px 40px;
}
</style>
</head>
<body>
${fileContent}
</body>
</html>
`;
return fileContent;
}, [content]);
const [prevContent, setPrevContent] = useState(initialContent);
if (prevContent !== initialContent) {
setPrevContent(initialContent);
@ -315,14 +345,24 @@ const Content = () => {
<label htmlFor="content" className="block text-sm font-medium text-gray-700 mb-2">
Markdown съдържание:
</label>
<div className="flex-1 flex flex-col">
<textarea
id="content"
value={content}
onChange={(e) => setContent(e.target.value)}
className="w-full h-full min-h-full flex-1 items-stretch resize-none px-3 py-2 bg-gray-100 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent font-mono text-sm"
placeholder="Въведете вашето Markdown съдържание тук..."
/>
<div className="flex-1 h-full flex space-x-2">
<div className="flex-1 flex flex-col">
<textarea
id="content"
value={content}
onChange={(e) => setContent(e.target.value)}
className="w-full h-full min-h-full flex-1 items-stretch resize-none px-3 py-2 bg-gray-100 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent font-mono text-sm"
placeholder="Въведете вашето Markdown съдържание тук..."
/>
</div>
<div className="flex-1 w-full min-h-full overflow-hidden px-3 py-2 border border-gray-300 rounded-md">
<iframe
srcDoc={htmlContent}
title="MD Content"
className="w-full h-full border-0"
allow="fullscreen"
/>
</div>
</div>
</div>