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

better design edit page

Browse Source
This commit is contained in:
Tomas Mirchev 2025-06-30 17:06:21 +00:00
parent 4e0df6c740
commit 2e4549ebd7
1 changed files with 23 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
reader/src/ResourcePage.jsx
View File

@ -33,7 +33,7 @@ function SelectResource({ topics, selectedTopic, selectedResource, onChange, dis
return ( return (
<div> <div>
{/* File Selector */} {/* File Selector */}
<div className="bg-white border-b border-gray-200 p-2 flex space-x-6"> <div className="bg-white border-b border-b-2 border-gray-200 p-2 flex space-x-6">
<div className="flex items-center"> <div className="flex items-center">
<label htmlFor="topicSelect" className="block mr-2 text-sm font-medium text-gray-700 "> <label htmlFor="topicSelect" className="block mr-2 text-sm font-medium text-gray-700 ">
Избери тема: Избери тема:
@ -262,7 +262,7 @@ const ResourcePage = ({ topics }) => {
// Main content screen // Main content screen
return ( return (
<div className="min-h-screen bg-gray-50 flex flex-col"> <div className="h-dvh flex flex-col">
<SelectResource <SelectResource
topics={topics} topics={topics}
selectedTopic={selectedTopic} selectedTopic={selectedTopic}
@ -275,37 +275,36 @@ const ResourcePage = ({ topics }) => {
/> />
{message.status === "error" && ( {message.status === "error" && (
<div className="text-lg p-12 text-red-600 bg-gray-200"> <div className="text-lg p-12 text-red-600 bg-gray-200 border-b border-gray-200 ">
<pre>{message.text}</pre> <pre>{message.text}</pre>
</div> </div>
)} )}
{/* Content Editor */} {/* Content Editor */}
<div className="flex-1 bg-white p-2 flex flex-col"> <div className="flex-1 overflow-scroll">
<div className="flex-1 h-full flex space-x-2"> <div className="min-h-full flex">
<div className="flex-1 flex flex-col"> <div
<textarea contentEditable={!isLoading && !isSavingLoading}
id="content" suppressContentEditableWarning={true}
disabled={isLoading || isSavingLoading} onInput={(e) => setContent(e.currentTarget.textContent || "")}
value={content || ""} className="flex-1 min-h-full px-3 py-2 bg-gray-100 border-r border-gray-300 outline-none font-mono text-sm whitespace-pre-wrap"
onChange={(e) => setContent(e.target.value)} ref={(el) => {
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" if (el && el.textContent !== content) {
placeholder="Въведете вашето Markdown съдържание тук..." el.textContent = content || "";
}
}}
/> />
</div>
<div className="flex-1 w-full min-h-full overflow-hidden px-3 py-2 border border-gray-300 rounded-md">
<iframe <iframe
srcDoc={htmlContent} srcDoc={htmlContent}
title="MD Content" title="MD Content"
className="w-full h-full border-0" className="flex-1 min-h-full"
allow="fullscreen" allow="fullscreen"
/> />
</div> </div>
</div> </div>
</div>
{/* Bottom Actions */} {/* Bottom Actions */}
<div className="bg-white border-t border-gray-200 p-2 flex justify-between"> <div className="border-t border-t-2 border-gray-200 p-2 flex justify-between">
<div className="flex flex-wrap gap-3"> <div className="flex flex-wrap gap-3">
<button <button
onClick={handleCopyContent} onClick={handleCopyContent}